diff --git a/ts/components/leftpane/LeftPaneMessageSection.tsx b/ts/components/leftpane/LeftPaneMessageSection.tsx index 249dcfb22..8381dd83f 100644 --- a/ts/components/leftpane/LeftPaneMessageSection.tsx +++ b/ts/components/leftpane/LeftPaneMessageSection.tsx @@ -20,6 +20,7 @@ import { OverlayInvite } from './overlay/OverlayInvite'; import { OverlayMessage } from './overlay/OverlayMessage'; import { OverlayMessageRequest } from './overlay/OverlayMessageRequest'; import { OverlayChooseAction } from './overlay/choose-action/OverlayChooseAction'; +import { useAreGroupsCreatedAsNewGroupsYet } from '../../state/selectors/releasedFeatures'; const StyledLeftPaneContent = styled.div` display: flex; @@ -40,17 +41,15 @@ const StyledConversationListContent = styled.div` const ClosableOverlay = () => { const leftOverlayMode = useSelector(getLeftOverlayMode); + const shouldCreateNewGroups = useAreGroupsCreatedAsNewGroupsYet(); + switch (leftOverlayMode) { case 'choose-action': return ; case 'open-group': return ; case 'closed-group': - return window.sessionFeatureFlags.useClosedGroupV2 ? ( - - ) : ( - - ); + return shouldCreateNewGroups ? : ; case 'message': return ; case 'message-requests': diff --git a/ts/components/leftpane/overlay/choose-action/OverlayChooseAction.tsx b/ts/components/leftpane/overlay/choose-action/OverlayChooseAction.tsx index 6b6badd30..b589c4b5a 100644 --- a/ts/components/leftpane/overlay/choose-action/OverlayChooseAction.tsx +++ b/ts/components/leftpane/overlay/choose-action/OverlayChooseAction.tsx @@ -3,15 +3,19 @@ import { useCallback, useEffect } from 'react'; import { isEmpty, isString } from 'lodash'; import { useDispatch } from 'react-redux'; import useKey from 'react-use/lib/useKey'; +import useUpdate from 'react-use/lib/useUpdate'; import { resetLeftOverlayMode, setLeftOverlayMode } from '../../../../state/ducks/section'; import { SpacerSM } from '../../../basic/Text'; import { StyledLeftPaneOverlay } from '../OverlayMessage'; import { ActionRow, StyledActionRowContainer } from './ActionRow'; import { ContactsListWithBreaks } from './ContactsListWithBreaks'; import { groupInfoActions } from '../../../../state/ducks/metaGroups'; +import { SessionToggle } from '../../../basic/SessionToggle'; export const OverlayChooseAction = () => { const dispatch = useDispatch(); + const forceRefresh = useUpdate(); + function closeOverlay() { dispatch(resetLeftOverlayMode()); } @@ -78,6 +82,19 @@ export const OverlayChooseAction = () => { onClick={openNewMessage} dataTestId="chooser-new-conversation-button" /> + {window.sessionFeatureFlags.useClosedGroupV2QAButtons ? ( + + Create group v2?{' '} + { + window.sessionFeatureFlags.useClosedGroupV2 = + !window.sessionFeatureFlags.useClosedGroupV2; + forceRefresh(); + }} + /> + + ) : null} { const theyAreDeprecated = NetworkTime.now() >= LEGACY_GROUP_DEPRECATED_TIMESTAMP_MS; @@ -7,6 +11,16 @@ export const areLegacyGroupsDeprecatedYet = (): boolean => { return window.sessionFeatureFlags.forceLegacyGroupsDeprecated || theyAreDeprecated; }; +const areGroupsCreatedAsNewGroupsYet = (): boolean => { + const shouldCreateNewGroups = NetworkTime.now() >= START_CREATE_NEW_GROUP_TIMESTAMP_MS; + + return window.sessionFeatureFlags.useClosedGroupV2 || shouldCreateNewGroups; +}; + +export function useAreGroupsCreatedAsNewGroupsYet() { + return useSelector(areGroupsCreatedAsNewGroupsYet); +} + export function areLegacyGroupsDeprecatedYetOutsideRedux() { if (!window.inboxStore) { return false;