keejef
/
session-desktop
mirror of https://github.com/oxen-io/session-desktop
2
0
Fork 0
Code Issues 8 Projects Releases Wiki Activity

refactor: rename overlaymode to leftoverlaymode

Browse Source
pull/3017/head
William Grant 1 year ago
parent 2db67b2e00
commit 22402a5f73
14 changed files with 77 additions and 78 deletions
Show Stats Download Patch File Download Diff File

4
ts/components/SessionSearchInput.tsx
Unescape Escape View File

@ -4,7 +4,7 @@ import { useDispatch, useSelector } from 'react-redux';
import styled from 'styled-components'; import styled from 'styled-components';
import { clearSearch, search, updateSearchTerm } from '../state/ducks/search'; import { clearSearch, search, updateSearchTerm } from '../state/ducks/search';
import { getConversationsCount } from '../state/selectors/conversations'; import { getConversationsCount } from '../state/selectors/conversations';
import { getOverlayMode } from '../state/selectors/section'; import { getLeftOverlayMode } from '../state/selectors/section';
import { cleanSearchTerm } from '../util/cleanSearchTerm'; import { cleanSearchTerm } from '../util/cleanSearchTerm';
import { SessionIconButton } from './icon'; import { SessionIconButton } from './icon';
@ -76,7 +76,7 @@ function updateSearch(dispatch: Dispatch<any>, searchTerm: string) {
export const SessionSearchInput = () => { export const SessionSearchInput = () => {
const [currentSearchTerm, setCurrentSearchTerm] = useState(''); const [currentSearchTerm, setCurrentSearchTerm] = useState('');
const dispatch = useDispatch(); const dispatch = useDispatch();
const isGroupCreationSearch = useSelector(getOverlayMode) === 'closed-group'; const isGroupCreationSearch = useSelector(getLeftOverlayMode) === 'closed-group';
const convoCount = useSelector(getConversationsCount); const convoCount = useSelector(getConversationsCount);
// just after onboard we only have a conversation with ourself // just after onboard we only have a conversation with ourself

10
ts/components/buttons/MenuButton.tsx
Unescape Escape View File

@ -1,8 +1,8 @@
import React from 'react'; import React from 'react';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import styled from 'styled-components'; import styled from 'styled-components';
import { resetOverlayMode, setOverlayMode } from '../../state/ducks/section'; import { resetLeftOverlayMode, setLeftOverlayMode } from '../../state/ducks/section';
import { getOverlayMode } from '../../state/selectors/section'; import { getLeftOverlayMode } from '../../state/selectors/section';
import { SessionIcon } from '../icon'; import { SessionIcon } from '../icon';
const StyledMenuButton = styled.button` const StyledMenuButton = styled.button`
@ -31,13 +31,13 @@ const StyledMenuButton = styled.button`
* It has two state: selected or not and so we use an checkbox input to keep the state in sync. * It has two state: selected or not and so we use an checkbox input to keep the state in sync.
*/ */
export const MenuButton = () => { export const MenuButton = () => {
const overlayMode = useSelector(getOverlayMode); const leftOverlayMode = useSelector(getLeftOverlayMode);
const dispatch = useDispatch(); const dispatch = useDispatch();
const isToggled = Boolean(overlayMode); const isToggled = Boolean(leftOverlayMode);
const onClickFn = () => const onClickFn = () =>
dispatch(isToggled ? resetOverlayMode() : setOverlayMode('choose-action')); dispatch(isToggled ? resetLeftOverlayMode() : setLeftOverlayMode('choose-action'));
return ( return (
<StyledMenuButton data-testid="new-conversation-button" onClick={onClickFn}> <StyledMenuButton data-testid="new-conversation-button" onClick={onClickFn}>

8
ts/components/leftpane/ActionsPanel.tsx
Unescape Escape View File

@ -12,7 +12,7 @@ import { getMessageQueue } from '../../session/sending';
import { syncConfigurationIfNeeded } from '../../session/utils/sync/syncUtils'; import { syncConfigurationIfNeeded } from '../../session/utils/sync/syncUtils';
import { clearSearch } from '../../state/ducks/search'; import { clearSearch } from '../../state/ducks/search';
import { resetOverlayMode, SectionType, showLeftPaneSection } from '../../state/ducks/section'; import { resetLeftOverlayMode, SectionType, showLeftPaneSection } from '../../state/ducks/section';
import { import {
getGlobalUnreadMessageCount, getGlobalUnreadMessageCount,
getOurPrimaryConversation, getOurPrimaryConversation,
@ -42,12 +42,12 @@ import {
forceRefreshRandomSnodePool, forceRefreshRandomSnodePool,
getFreshSwarmFor, getFreshSwarmFor,
} from '../../session/apis/snode_api/snodePool'; } from '../../session/apis/snode_api/snodePool';
import { ConfigurationSync } from '../../session/utils/job_runners/jobs/ConfigurationSyncJob';
import { isDarkTheme } from '../../state/selectors/theme'; import { isDarkTheme } from '../../state/selectors/theme';
import { ensureThemeConsistency } from '../../themes/SessionTheme'; import { ensureThemeConsistency } from '../../themes/SessionTheme';
import { getOppositeTheme } from '../../util/theme';
import { switchThemeTo } from '../../themes/switchTheme'; import { switchThemeTo } from '../../themes/switchTheme';
import { ConfigurationSync } from '../../session/utils/job_runners/jobs/ConfigurationSyncJob';
import { ReleasedFeatures } from '../../util/releaseFeature'; import { ReleasedFeatures } from '../../util/releaseFeature';
import { getOppositeTheme } from '../../util/theme';
const Section = (props: { type: SectionType }) => { const Section = (props: { type: SectionType }) => {
const ourNumber = useSelector(getOurNumber); const ourNumber = useSelector(getOurNumber);
@ -79,7 +79,7 @@ const Section = (props: { type: SectionType }) => {
// message section // message section
dispatch(clearSearch()); dispatch(clearSearch());
dispatch(showLeftPaneSection(type)); dispatch(showLeftPaneSection(type));
dispatch(resetOverlayMode()); dispatch(resetLeftOverlayMode());
} }
}; };

6
ts/components/leftpane/LeftPane.tsx
Unescape Escape View File

@ -5,7 +5,7 @@ import styled from 'styled-components';
import { SectionType } from '../../state/ducks/section'; import { SectionType } from '../../state/ducks/section';
import { getLeftPaneConversationIds } from '../../state/selectors/conversations'; import { getLeftPaneConversationIds } from '../../state/selectors/conversations';
import { getHasSearchResults } from '../../state/selectors/search'; import { getHasSearchResults } from '../../state/selectors/search';
import { getFocusedSection, getOverlayMode } from '../../state/selectors/section'; import { getFocusedSection, getLeftOverlayMode } from '../../state/selectors/section';
import { SessionTheme } from '../../themes/SessionTheme'; import { SessionTheme } from '../../themes/SessionTheme';
import { SessionToastContainer } from '../SessionToastContainer'; import { SessionToastContainer } from '../SessionToastContainer';
import { CallInFullScreenContainer } from '../calling/CallInFullScreenContainer'; import { CallInFullScreenContainer } from '../calling/CallInFullScreenContainer';
@ -24,13 +24,13 @@ const StyledLeftPane = styled.div`
const InnerLeftPaneMessageSection = () => { const InnerLeftPaneMessageSection = () => {
const hasSearchResults = useSelector(getHasSearchResults); const hasSearchResults = useSelector(getHasSearchResults);
const conversationIds = useSelector(getLeftPaneConversationIds); const conversationIds = useSelector(getLeftPaneConversationIds);
const overlayMode = useSelector(getOverlayMode); const leftOverlayMode = useSelector(getLeftOverlayMode);
return ( return (
<LeftPaneMessageSection <LeftPaneMessageSection
hasSearchResults={hasSearchResults} hasSearchResults={hasSearchResults}
conversationIds={conversationIds} conversationIds={conversationIds}
overlayMode={overlayMode} leftOverlayMode={leftOverlayMode}
/> />
); );
}; };

20
ts/components/leftpane/LeftPaneMessageSection.tsx
Unescape Escape View File

@ -7,8 +7,8 @@ import { SearchResults } from '../search/SearchResults';
import { LeftPaneSectionHeader } from './LeftPaneSectionHeader'; import { LeftPaneSectionHeader } from './LeftPaneSectionHeader';
import { MessageRequestsBanner } from './MessageRequestsBanner'; import { MessageRequestsBanner } from './MessageRequestsBanner';
import { OverlayMode, setOverlayMode } from '../../state/ducks/section'; import { LeftOverlayMode, setLeftOverlayMode } from '../../state/ducks/section';
import { getOverlayMode } from '../../state/selectors/section'; import { getLeftOverlayMode } from '../../state/selectors/section';
import { assertUnreachable } from '../../types/sqlSharedTypes'; import { assertUnreachable } from '../../types/sqlSharedTypes';
import { SessionSearchInput } from '../SessionSearchInput'; import { SessionSearchInput } from '../SessionSearchInput';
import { StyledLeftPaneList } from './LeftPaneList'; import { StyledLeftPaneList } from './LeftPaneList';
@ -22,7 +22,7 @@ import { OverlayChooseAction } from './overlay/choose-action/OverlayChooseAction
export interface Props { export interface Props {
conversationIds?: Array<string>; conversationIds?: Array<string>;
hasSearchResults: boolean; hasSearchResults: boolean;
overlayMode: OverlayMode | undefined; leftOverlayMode: LeftOverlayMode | undefined;
} }
const StyledLeftPaneContent = styled.div` const StyledLeftPaneContent = styled.div`
@ -42,9 +42,9 @@ const StyledConversationListContent = styled.div`
`; `;
const ClosableOverlay = () => { const ClosableOverlay = () => {
const overlayMode = useSelector(getOverlayMode); const leftOverlayMode = useSelector(getLeftOverlayMode);
switch (overlayMode) { switch (leftOverlayMode) {
case 'choose-action': case 'choose-action':
return <OverlayChooseAction />; return <OverlayChooseAction />;
case 'open-group': case 'open-group':
@ -59,8 +59,8 @@ const ClosableOverlay = () => {
return null; return null;
default: default:
return assertUnreachable( return assertUnreachable(
overlayMode, leftOverlayMode,
`ClosableOverlay: overlayMode case not handled "${overlayMode}"` `ClosableOverlay: leftOverlayMode case not handled "${leftOverlayMode}"`
); );
} }
}; };
@ -121,12 +121,12 @@ export class LeftPaneMessageSection extends React.Component<Props> {
} }
public render(): JSX.Element { public render(): JSX.Element {
const { overlayMode } = this.props; const { leftOverlayMode } = this.props;
return ( return (
<StyledLeftPaneContent> <StyledLeftPaneContent>
<LeftPaneSectionHeader /> <LeftPaneSectionHeader />
{overlayMode ? <ClosableOverlay /> : this.renderConversations()} {leftOverlayMode ? <ClosableOverlay /> : this.renderConversations()}
</StyledLeftPaneContent> </StyledLeftPaneContent>
); );
} }
@ -137,7 +137,7 @@ export class LeftPaneMessageSection extends React.Component<Props> {
<SessionSearchInput /> <SessionSearchInput />
<MessageRequestsBanner <MessageRequestsBanner
handleOnClick={() => { handleOnClick={() => {
window.inboxStore?.dispatch(setOverlayMode('message-requests')); window.inboxStore?.dispatch(setLeftOverlayMode('message-requests'));
}} }}
/> />
{this.renderList()} {this.renderList()}

4
ts/components/leftpane/LeftPaneSettingSection.tsx
Unescape Escape View File

@ -6,7 +6,7 @@ import { resetConversationExternal } from '../../state/ducks/conversations';
import { recoveryPhraseModal, updateDeleteAccountModal } from '../../state/ducks/modalDialog'; import { recoveryPhraseModal, updateDeleteAccountModal } from '../../state/ducks/modalDialog';
import { import {
SectionType, SectionType,
setOverlayMode, setLeftOverlayMode,
showLeftPaneSection, showLeftPaneSection,
showSettingsSection, showSettingsSection,
} from '../../state/ducks/section'; } from '../../state/ducks/section';
@ -105,7 +105,7 @@ const LeftPaneSettingsCategoryRow = (props: {
switch (id) { switch (id) {
case SessionSettingCategory.MessageRequests: case SessionSettingCategory.MessageRequests:
dispatch(showLeftPaneSection(SectionType.Message)); dispatch(showLeftPaneSection(SectionType.Message));
dispatch(setOverlayMode('message-requests')); dispatch(setLeftOverlayMode('message-requests'));
dispatch(resetConversationExternal()); dispatch(resetConversationExternal());
break; break;
case SessionSettingCategory.RecoveryPhrase: case SessionSettingCategory.RecoveryPhrase:

14
ts/components/leftpane/overlay/OverlayClosedGroup.tsx
Unescape Escape View File

@ -10,15 +10,15 @@ import { SessionSpinner } from '../../basic/SessionSpinner';
import { MemberListItem } from '../../MemberListItem'; import { MemberListItem } from '../../MemberListItem';
import { OverlayHeader } from './OverlayHeader'; import { OverlayHeader } from './OverlayHeader';
import { resetOverlayMode } from '../../../state/ducks/section';
import { getPrivateContactsPubkeys } from '../../../state/selectors/conversations';
import { SpacerLG } from '../../basic/Text';
import { SessionSearchInput } from '../../SessionSearchInput';
import { getSearchResultsContactOnly, isSearching } from '../../../state/selectors/search';
import { useSet } from '../../../hooks/useSet'; import { useSet } from '../../../hooks/useSet';
import { VALIDATION } from '../../../session/constants'; import { VALIDATION } from '../../../session/constants';
import { ToastUtils } from '../../../session/utils';
import { createClosedGroup } from '../../../session/conversations/createClosedGroup'; import { createClosedGroup } from '../../../session/conversations/createClosedGroup';
import { ToastUtils } from '../../../session/utils';
import { resetLeftOverlayMode } from '../../../state/ducks/section';
import { getPrivateContactsPubkeys } from '../../../state/selectors/conversations';
import { getSearchResultsContactOnly, isSearching } from '../../../state/selectors/search';
import { SpacerLG } from '../../basic/Text';
import { SessionSearchInput } from '../../SessionSearchInput';
const StyledMemberListNoContacts = styled.div` const StyledMemberListNoContacts = styled.div`
font-family: var(--font-mono), var(--font-default); font-family: var(--font-mono), var(--font-default);
@ -101,7 +101,7 @@ export const OverlayClosedGroup = () => {
const searchResultContactsOnly = useSelector(getSearchResultsContactOnly); const searchResultContactsOnly = useSelector(getSearchResultsContactOnly);
function closeOverlay() { function closeOverlay() {
dispatch(resetOverlayMode()); dispatch(resetLeftOverlayMode());
} }
async function onEnterPressed() { async function onEnterPressed() {

18
ts/components/leftpane/overlay/OverlayCommunity.tsx
Unescape Escape View File

@ -1,27 +1,27 @@
/* eslint-disable @typescript-eslint/no-misused-promises */ /* eslint-disable @typescript-eslint/no-misused-promises */
import React, { useState } from 'react'; import React, { useState } from 'react';
import useKey from 'react-use/lib/useKey';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import useKey from 'react-use/lib/useKey';
import { SessionJoinableRooms } from './SessionJoinableDefaultRooms'; import { SessionJoinableRooms } from './SessionJoinableDefaultRooms';
import { SessionButton } from '../../basic/SessionButton';
import { SessionIdEditable } from '../../basic/SessionIdEditable';
import { SessionSpinner } from '../../basic/SessionSpinner';
import { OverlayHeader } from './OverlayHeader';
import { resetOverlayMode } from '../../../state/ducks/section';
import { import {
joinOpenGroupV2WithUIEvents, joinOpenGroupV2WithUIEvents,
JoinSogsRoomUICallbackArgs, JoinSogsRoomUICallbackArgs,
} from '../../../session/apis/open_group_api/opengroupV2/JoinOpenGroupV2'; } from '../../../session/apis/open_group_api/opengroupV2/JoinOpenGroupV2';
import { openGroupV2CompleteURLRegex } from '../../../session/apis/open_group_api/utils/OpenGroupUtils'; import { openGroupV2CompleteURLRegex } from '../../../session/apis/open_group_api/utils/OpenGroupUtils';
import { ToastUtils } from '../../../session/utils'; import { ToastUtils } from '../../../session/utils';
import { resetLeftOverlayMode } from '../../../state/ducks/section';
import { SessionButton } from '../../basic/SessionButton';
import { SessionIdEditable } from '../../basic/SessionIdEditable';
import { SessionSpinner } from '../../basic/SessionSpinner';
import { OverlayHeader } from './OverlayHeader';
import { getOverlayMode } from '../../../state/selectors/section';
import { import {
markConversationInitialLoadingInProgress, markConversationInitialLoadingInProgress,
openConversationWithMessages, openConversationWithMessages,
} from '../../../state/ducks/conversations'; } from '../../../state/ducks/conversations';
import { getLeftOverlayMode } from '../../../state/selectors/section';
async function joinOpenGroup( async function joinOpenGroup(
serverUrl: string, serverUrl: string,
@ -42,10 +42,10 @@ export const OverlayCommunity = () => {
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [groupUrl, setGroupUrl] = useState(''); const [groupUrl, setGroupUrl] = useState('');
const overlayModeIsCommunity = useSelector(getOverlayMode) === 'open-group'; const overlayModeIsCommunity = useSelector(getLeftOverlayMode) === 'open-group';
function closeOverlay() { function closeOverlay() {
dispatch(resetOverlayMode()); dispatch(resetLeftOverlayMode());
} }
async function onTryJoinRoom(completeUrl?: string) { async function onTryJoinRoom(completeUrl?: string) {

4
ts/components/leftpane/overlay/OverlayHeader.tsx
Unescape Escape View File

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { useDispatch } from 'react-redux'; import { useDispatch } from 'react-redux';
import styled from 'styled-components'; import styled from 'styled-components';
import { setOverlayMode } from '../../../state/ducks/section'; import { setLeftOverlayMode } from '../../../state/ducks/section';
import { Flex } from '../../basic/Flex'; import { Flex } from '../../basic/Flex';
import { SpacerSM } from '../../basic/Text'; import { SpacerSM } from '../../basic/Text';
import { SessionIconButton } from '../../icon'; import { SessionIconButton } from '../../icon';
@ -45,7 +45,7 @@ const StyledSubTitle = styled.h3`
export const OverlayHeader = ({ subtitle, title }: { title: string; subtitle: string }) => { export const OverlayHeader = ({ subtitle, title }: { title: string; subtitle: string }) => {
const dispatch = useDispatch(); const dispatch = useDispatch();
const returnToActionChooser = () => { const returnToActionChooser = () => {
dispatch(setOverlayMode('choose-action')); dispatch(setLeftOverlayMode('choose-action'));
}; };
return ( return (

4
ts/components/leftpane/overlay/OverlayMessage.tsx
Unescape Escape View File

@ -8,7 +8,7 @@ import { getConversationController } from '../../../session/conversations';
import { PubKey } from '../../../session/types'; import { PubKey } from '../../../session/types';
import { ToastUtils, UserUtils } from '../../../session/utils'; import { ToastUtils, UserUtils } from '../../../session/utils';
import { openConversationWithMessages } from '../../../state/ducks/conversations'; import { openConversationWithMessages } from '../../../state/ducks/conversations';
import { resetOverlayMode } from '../../../state/ducks/section'; import { resetLeftOverlayMode } from '../../../state/ducks/section';
import { SessionButton } from '../../basic/SessionButton'; import { SessionButton } from '../../basic/SessionButton';
import { SessionIdEditable } from '../../basic/SessionIdEditable'; import { SessionIdEditable } from '../../basic/SessionIdEditable';
import { SessionSpinner } from '../../basic/SessionSpinner'; import { SessionSpinner } from '../../basic/SessionSpinner';
@ -42,7 +42,7 @@ export const OverlayMessage = () => {
const dispatch = useDispatch(); const dispatch = useDispatch();
function closeOverlay() { function closeOverlay() {
dispatch(resetOverlayMode()); dispatch(resetLeftOverlayMode());
} }
useKey('Escape', closeOverlay); useKey('Escape', closeOverlay);

4
ts/components/leftpane/overlay/OverlayMessageRequest.tsx
Unescape Escape View File

@ -6,7 +6,7 @@ import styled from 'styled-components';
import { declineConversationWithoutConfirm } from '../../../interactions/conversationInteractions'; import { declineConversationWithoutConfirm } from '../../../interactions/conversationInteractions';
import { forceSyncConfigurationNowIfNeeded } from '../../../session/utils/sync/syncUtils'; import { forceSyncConfigurationNowIfNeeded } from '../../../session/utils/sync/syncUtils';
import { updateConfirmModal } from '../../../state/ducks/modalDialog'; import { updateConfirmModal } from '../../../state/ducks/modalDialog';
import { resetOverlayMode } from '../../../state/ducks/section'; import { resetLeftOverlayMode } from '../../../state/ducks/section';
import { getConversationRequestsIds } from '../../../state/selectors/conversations'; import { getConversationRequestsIds } from '../../../state/selectors/conversations';
import { useSelectedConversationKey } from '../../../state/selectors/selectedConversation'; import { useSelectedConversationKey } from '../../../state/selectors/selectedConversation';
import { SessionButton, SessionButtonColor } from '../../basic/SessionButton'; import { SessionButton, SessionButtonColor } from '../../basic/SessionButton';
@ -43,7 +43,7 @@ export const OverlayMessageRequest = () => {
useKey('Escape', closeOverlay); useKey('Escape', closeOverlay);
const dispatch = useDispatch(); const dispatch = useDispatch();
function closeOverlay() { function closeOverlay() {
dispatch(resetOverlayMode()); dispatch(resetLeftOverlayMode());
} }
const currentlySelectedConvo = useSelectedConversationKey(); const currentlySelectedConvo = useSelectedConversationKey();

10
ts/components/leftpane/overlay/choose-action/OverlayChooseAction.tsx
Unescape Escape View File

@ -4,7 +4,7 @@ import { isEmpty, isString } from 'lodash';
import { useDispatch } from 'react-redux'; import { useDispatch } from 'react-redux';
import useKey from 'react-use/lib/useKey'; import useKey from 'react-use/lib/useKey';
import styled from 'styled-components'; import styled from 'styled-components';
import { resetOverlayMode, setOverlayMode } from '../../../../state/ducks/section'; import { resetLeftOverlayMode, setLeftOverlayMode } from '../../../../state/ducks/section';
import { SessionIcon, SessionIconType } from '../../../icon'; import { SessionIcon, SessionIconType } from '../../../icon';
import { ContactsListWithBreaks } from './ContactsListWithBreaks'; import { ContactsListWithBreaks } from './ContactsListWithBreaks';
@ -47,19 +47,19 @@ const IconOnActionRow = (props: { iconType: SessionIconType }) => {
export const OverlayChooseAction = () => { export const OverlayChooseAction = () => {
const dispatch = useDispatch(); const dispatch = useDispatch();
function closeOverlay() { function closeOverlay() {
dispatch(resetOverlayMode()); dispatch(resetLeftOverlayMode());
} }
const openNewMessage = useCallback(() => { const openNewMessage = useCallback(() => {
dispatch(setOverlayMode('message')); dispatch(setLeftOverlayMode('message'));
}, [dispatch]); }, [dispatch]);
const openCreateGroup = useCallback(() => { const openCreateGroup = useCallback(() => {
dispatch(setOverlayMode('closed-group')); dispatch(setLeftOverlayMode('closed-group'));
}, [dispatch]); }, [dispatch]);
const openJoinCommunity = useCallback(() => { const openJoinCommunity = useCallback(() => {
dispatch(setOverlayMode('open-group')); dispatch(setLeftOverlayMode('open-group'));
}, [dispatch]); }, [dispatch]);
useKey('Escape', closeOverlay); useKey('Escape', closeOverlay);

39
ts/state/ducks/section.tsx
Unescape Escape View File

@ -4,8 +4,8 @@ import { SessionSettingCategory } from '../../components/settings/SessionSetting
export const FOCUS_SECTION = 'FOCUS_SECTION'; export const FOCUS_SECTION = 'FOCUS_SECTION';
export const FOCUS_SETTINGS_SECTION = 'FOCUS_SETTINGS_SECTION'; export const FOCUS_SETTINGS_SECTION = 'FOCUS_SETTINGS_SECTION';
export const IS_APP_FOCUSED = 'IS_APP_FOCUSED'; export const IS_APP_FOCUSED = 'IS_APP_FOCUSED';
export const OVERLAY_MODE = 'OVERLAY_MODE'; export const LEFT_OVERLAY_MODE = 'LEFT_OVERLAY_MODE';
export const RESET_OVERLAY_MODE = 'RESET_OVERLAY_MODE'; export const RESET_LEFT_OVERLAY_MODE = 'RESET_OVERLAY_MODE';
export const RIGHT_OVERLAY_MODE = 'RIGHT_OVERLAY_MODE'; export const RIGHT_OVERLAY_MODE = 'RIGHT_OVERLAY_MODE';
export const RESET_RIGHT_OVERLAY_MODE = 'RESET_RIGHT_OVERLAY_MODE'; export const RESET_RIGHT_OVERLAY_MODE = 'RESET_RIGHT_OVERLAY_MODE';
@ -32,12 +32,12 @@ type IsAppFocusedActionType = {
payload: boolean; payload: boolean;
}; };
type OverlayModeActionType = { type LeftOverlayModeActionType = {
type: 'OVERLAY_MODE'; type: 'LEFT_OVERLAY_MODE';
payload: OverlayMode; payload: LeftOverlayMode;
}; };
type ResetOverlayModeActionType = { type ResetLeftOverlayModeActionType = {
type: 'RESET_OVERLAY_MODE'; type: 'RESET_OVERLAY_MODE';
}; };
@ -66,24 +66,23 @@ export function setIsAppFocused(focused: boolean): IsAppFocusedActionType {
}; };
} }
// TODO Should be renamed to LeftOverlayMode export type LeftOverlayMode =
export type OverlayMode =
| 'choose-action' | 'choose-action'
| 'message' | 'message'
| 'open-group' | 'open-group'
| 'closed-group' | 'closed-group'
| 'message-requests'; | 'message-requests';
export function setOverlayMode(overlayMode: OverlayMode): OverlayModeActionType { export function setLeftOverlayMode(overlayMode: LeftOverlayMode): LeftOverlayModeActionType {
return { return {
type: OVERLAY_MODE, type: LEFT_OVERLAY_MODE,
payload: overlayMode, payload: overlayMode,
}; };
} }
export function resetOverlayMode(): ResetOverlayModeActionType { export function resetLeftOverlayMode(): ResetLeftOverlayModeActionType {
return { return {
type: RESET_OVERLAY_MODE, type: RESET_LEFT_OVERLAY_MODE,
}; };
} }
@ -124,8 +123,8 @@ export function showSettingsSection(
export const actions = { export const actions = {
showLeftPaneSection, showLeftPaneSection,
showSettingsSection, showSettingsSection,
setOverlayMode, setLeftOverlayMode,
resetOverlayMode, resetLeftOverlayMode,
setRightOverlayMode, setRightOverlayMode,
resetRightOverlayMode, resetRightOverlayMode,
}; };
@ -134,7 +133,7 @@ export const initialSectionState: SectionStateType = {
focusedSection: SectionType.Message, focusedSection: SectionType.Message,
focusedSettingsSection: undefined, focusedSettingsSection: undefined,
isAppFocused: false, isAppFocused: false,
overlayMode: undefined, leftOverlayMode: undefined,
rightOverlayMode: { type: 'default', params: null }, rightOverlayMode: { type: 'default', params: null },
}; };
@ -142,7 +141,7 @@ export type SectionStateType = {
focusedSection: SectionType; focusedSection: SectionType;
focusedSettingsSection?: SessionSettingCategory; focusedSettingsSection?: SessionSettingCategory;
isAppFocused: boolean; isAppFocused: boolean;
overlayMode: OverlayMode | undefined; leftOverlayMode: LeftOverlayMode | undefined;
rightOverlayMode: RightOverlayMode | undefined; rightOverlayMode: RightOverlayMode | undefined;
}; };
@ -187,15 +186,15 @@ export const reducer = (
...state, ...state,
isAppFocused: payload, isAppFocused: payload,
}; };
case OVERLAY_MODE: case LEFT_OVERLAY_MODE:
return { return {
...state, ...state,
overlayMode: payload, leftOverlayMode: payload,
}; };
case RESET_OVERLAY_MODE: case RESET_LEFT_OVERLAY_MODE:
return { return {
...state, ...state,
overlayMode: undefined, leftOverlayMode: undefined,
}; };
case RIGHT_OVERLAY_MODE: case RIGHT_OVERLAY_MODE:
return { return {

10
ts/state/selectors/section.ts
Unescape Escape View File

@ -1,7 +1,7 @@
import { createSelector } from '@reduxjs/toolkit'; import { createSelector } from '@reduxjs/toolkit';
import { SessionSettingCategory } from '../../components/settings/SessionSettings'; import { SessionSettingCategory } from '../../components/settings/SessionSettings';
import { OverlayMode, RightOverlayMode, SectionStateType, SectionType } from '../ducks/section'; import { LeftOverlayMode, RightOverlayMode, SectionStateType, SectionType } from '../ducks/section';
import { StateType } from '../reducer'; import { StateType } from '../reducer';
export const getSection = (state: StateType): SectionStateType => state.section; export const getSection = (state: StateType): SectionStateType => state.section;
@ -26,9 +26,9 @@ export const getIsAppFocused = createSelector(
); );
// TODO This should probably be renamed to getLeftOverlayMode and the props should be updated. // TODO This should probably be renamed to getLeftOverlayMode and the props should be updated.
export const getOverlayMode = createSelector( export const getLeftOverlayMode = createSelector(
getSection, getSection,
(state: SectionStateType): OverlayMode | undefined => state.overlayMode (state: SectionStateType): LeftOverlayMode | undefined => state.leftOverlayMode
); );
export const getRightOverlayMode = (state: StateType): RightOverlayMode | undefined => { export const getRightOverlayMode = (state: StateType): RightOverlayMode | undefined => {
@ -37,7 +37,7 @@ export const getRightOverlayMode = (state: StateType): RightOverlayMode | undefi
export const getIsMessageRequestOverlayShown = (state: StateType) => { export const getIsMessageRequestOverlayShown = (state: StateType) => {
const focusedSection = getFocusedSection(state); const focusedSection = getFocusedSection(state);
const overlayMode = getOverlayMode(state); const leftOverlayMode = getLeftOverlayMode(state);
return focusedSection === SectionType.Message && overlayMode === 'message-requests'; return focusedSection === SectionType.Message && leftOverlayMode === 'message-requests';
}; };

Write Preview
Loading…
Cancel
Save