diff --git a/ts/components/basic/SessionRadio.tsx b/ts/components/basic/SessionRadio.tsx index a01d26a88..5fd82a025 100644 --- a/ts/components/basic/SessionRadio.tsx +++ b/ts/components/basic/SessionRadio.tsx @@ -25,6 +25,7 @@ const StyledInput = styled.input<{ `; // tslint:disable: use-simple-attributes +// NOTE (Will): We don't use a transition because it's too slow and creates flickering when changing buttons. const StyledLabel = styled.label<{ disabled: boolean; filledSize: number; @@ -39,7 +40,6 @@ const StyledLabel = styled.label<{ display: inline-block; border-radius: 100%; - transition: var(--default-duration); padding: ${props => props.filledSize}px; border: none; outline: 1px solid currentColor; /* CSS variables don't work here */ diff --git a/ts/components/conversation/right-panel/overlay/disappearing-messages/OverlayDisappearingMessages.tsx b/ts/components/conversation/right-panel/overlay/disappearing-messages/OverlayDisappearingMessages.tsx index bfbd1b158..957fbffa4 100644 --- a/ts/components/conversation/right-panel/overlay/disappearing-messages/OverlayDisappearingMessages.tsx +++ b/ts/components/conversation/right-panel/overlay/disappearing-messages/OverlayDisappearingMessages.tsx @@ -49,10 +49,20 @@ const StyledNonAdminDescription = styled.div` line-height: 15px; `; +// TODO legacy messages support will be removed in a future release +function loadDefaultTimeValue(modeSelected: DisappearingMessageConversationType | undefined) { + return modeSelected !== 'off' + ? modeSelected !== 'legacy' + ? modeSelected === 'deleteAfterSend' + ? DEFAULT_TIMER_OPTION.DELETE_AFTER_SEND + : DEFAULT_TIMER_OPTION.DELETE_AFTER_READ + : DEFAULT_TIMER_OPTION.LEGACY + : 0; +} + export type PropsForExpirationSettings = { expirationType: string | undefined; expireTimer: number | undefined; - isMe: boolean | undefined; isGroup: boolean | undefined; weAreAdmin: boolean | undefined; }; @@ -84,16 +94,10 @@ export const OverlayDisappearingMessages = (props: OverlayDisappearingMessagesPr const { isGroup, weAreAdmin } = convoProps; - const [modeSelected, setModeSelected] = useState(convoProps.expirationType); - const [timeSelected, setTimeSelected] = useState( - convoProps.expireTimer && convoProps.expireTimer > -1 - ? convoProps.expireTimer - : isGroup - ? DEFAULT_TIMER_OPTION.DELETE_AFTER_SEND - : DEFAULT_TIMER_OPTION.DELETE_AFTER_READ + const [modeSelected, setModeSelected] = useState( + convoProps.expirationType ); - - // TODO verify that this if fine compared to updating in the useEffect + const [timeSelected, setTimeSelected] = useState(0); const timerOptions = useTimerOptionsByMode(modeSelected, hasOnlyOneMode); const handleSetMode = async () => { @@ -108,7 +112,7 @@ export const OverlayDisappearingMessages = (props: OverlayDisappearingMessagesPr dispatch(resetRightOverlayMode()); } } else { - if (selectedConversationKey && modeSelected && timeSelected) { + if (selectedConversationKey && modeSelected) { await setDisappearingMessagesByConvoId(selectedConversationKey, modeSelected, timeSelected); dispatch(closeRightPanel()); dispatch(resetRightOverlayMode()); @@ -116,14 +120,20 @@ export const OverlayDisappearingMessages = (props: OverlayDisappearingMessagesPr } }; + const handleSetTime = (value: number) => { + setTimeSelected(value); + }; + useEffect(() => { - if (modeSelected !== convoProps.expirationType) { - setModeSelected(convoProps.expirationType); - } - if (convoProps.expireTimer && timeSelected !== convoProps.expireTimer) { - setTimeSelected(convoProps.expireTimer); - } - }, [convoProps.expirationType, convoProps.expireTimer]); + // NOTE loads a time value from the conversation model or the default + handleSetTime( + modeSelected === convoProps.expirationType && + convoProps.expireTimer && + convoProps.expireTimer > -1 + ? convoProps.expireTimer + : loadDefaultTimeValue(modeSelected) + ); + }, [convoProps.expirationType, convoProps.expireTimer, modeSelected]); // TODO legacy messages support will be removed in a future useEffect(() => { @@ -165,7 +175,7 @@ export const OverlayDisappearingMessages = (props: OverlayDisappearingMessagesPr void; hasOnlyOneMode?: boolean; disabled?: boolean; diff --git a/ts/state/selectors/conversations.ts b/ts/state/selectors/conversations.ts index 58a6ff8a7..09209bc7c 100644 --- a/ts/state/selectors/conversations.ts +++ b/ts/state/selectors/conversations.ts @@ -1262,7 +1262,6 @@ export const getSelectedConversationExpirationSettings = createSelector( (convo: ReduxConversationType | undefined): PropsForExpirationSettings => ({ expirationType: convo?.expirationType, expireTimer: convo?.expireTimer, - isMe: convo?.isMe, isGroup: convo?.isGroup, weAreAdmin: convo?.weAreAdmin, })