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 { clearSearch, search, updateSearchTerm } from '../state/ducks/search';
import { getConversationsCount } from '../state/selectors/conversations';
import { getOverlayMode } from '../state/selectors/section';
import { getLeftOverlayMode } from '../state/selectors/section';
import { cleanSearchTerm } from '../util/cleanSearchTerm';
import { SessionIconButton } from './icon';
@ -76,7 +76,7 @@ function updateSearch(dispatch: Dispatch<any>, searchTerm: string) {
export const SessionSearchInput = () => {
const [currentSearchTerm, setCurrentSearchTerm] = useState('');
const dispatch = useDispatch();
const isGroupCreationSearch = useSelector(getOverlayMode) === 'closed-group';
const isGroupCreationSearch = useSelector(getLeftOverlayMode) === 'closed-group';
const convoCount = useSelector(getConversationsCount);
// 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 { useDispatch, useSelector } from 'react-redux';
import styled from 'styled-components';
import { resetOverlayMode, setOverlayMode } from '../../state/ducks/section';
import { getOverlayMode } from '../../state/selectors/section';
import { resetLeftOverlayMode, setLeftOverlayMode } from '../../state/ducks/section';
import { getLeftOverlayMode } from '../../state/selectors/section';
import { SessionIcon } from '../icon';
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.
*/
export const MenuButton = () => {
const overlayMode = useSelector(getOverlayMode);
const leftOverlayMode = useSelector(getLeftOverlayMode);
const dispatch = useDispatch();
const isToggled = Boolean(overlayMode);
const isToggled = Boolean(leftOverlayMode);
const onClickFn = () =>
dispatch(isToggled ? resetOverlayMode() : setOverlayMode('choose-action'));
dispatch(isToggled ? resetLeftOverlayMode() : setLeftOverlayMode('choose-action'));
return (
<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 { clearSearch } from '../../state/ducks/search';
import { resetOverlayMode, SectionType, showLeftPaneSection } from '../../state/ducks/section';
import { resetLeftOverlayMode, SectionType, showLeftPaneSection } from '../../state/ducks/section';
import {
getGlobalUnreadMessageCount,
getOurPrimaryConversation,
@ -42,12 +42,12 @@ import {
forceRefreshRandomSnodePool,
getFreshSwarmFor,
} from '../../session/apis/snode_api/snodePool';
import { ConfigurationSync } from '../../session/utils/job_runners/jobs/ConfigurationSyncJob';
import { isDarkTheme } from '../../state/selectors/theme';
import { ensureThemeConsistency } from '../../themes/SessionTheme';
import { getOppositeTheme } from '../../util/theme';
import { switchThemeTo } from '../../themes/switchTheme';
import { ConfigurationSync } from '../../session/utils/job_runners/jobs/ConfigurationSyncJob';
import { ReleasedFeatures } from '../../util/releaseFeature';
import { getOppositeTheme } from '../../util/theme';
const Section = (props: { type: SectionType }) => {
const ourNumber = useSelector(getOurNumber);
@ -79,7 +79,7 @@ const Section = (props: { type: SectionType }) => {
// message section
dispatch(clearSearch());
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 { getLeftPaneConversationIds } from '../../state/selectors/conversations';
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 { SessionToastContainer } from '../SessionToastContainer';
import { CallInFullScreenContainer } from '../calling/CallInFullScreenContainer';
@ -24,13 +24,13 @@ const StyledLeftPane = styled.div`
const InnerLeftPaneMessageSection = () => {
const hasSearchResults = useSelector(getHasSearchResults);
const conversationIds = useSelector(getLeftPaneConversationIds);
const overlayMode = useSelector(getOverlayMode);
const leftOverlayMode = useSelector(getLeftOverlayMode);
return (
<LeftPaneMessageSection
hasSearchResults={hasSearchResults}
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 { MessageRequestsBanner } from './MessageRequestsBanner';
import { OverlayMode, setOverlayMode } from '../../state/ducks/section';
import { getOverlayMode } from '../../state/selectors/section';
import { LeftOverlayMode, setLeftOverlayMode } from '../../state/ducks/section';
import { getLeftOverlayMode } from '../../state/selectors/section';
import { assertUnreachable } from '../../types/sqlSharedTypes';
import { SessionSearchInput } from '../SessionSearchInput';
import { StyledLeftPaneList } from './LeftPaneList';
@ -22,7 +22,7 @@ import { OverlayChooseAction } from './overlay/choose-action/OverlayChooseAction
export interface Props {
conversationIds?: Array<string>;
hasSearchResults: boolean;
overlayMode: OverlayMode | undefined;
leftOverlayMode: LeftOverlayMode | undefined;
}
const StyledLeftPaneContent = styled.div`
@ -42,9 +42,9 @@ const StyledConversationListContent = styled.div`
`;
const ClosableOverlay = () => {
const overlayMode = useSelector(getOverlayMode);
const leftOverlayMode = useSelector(getLeftOverlayMode);
switch (overlayMode) {
switch (leftOverlayMode) {
case 'choose-action':
return <OverlayChooseAction />;
case 'open-group':
@ -59,8 +59,8 @@ const ClosableOverlay = () => {
return null;
default:
return assertUnreachable(
overlayMode,
`ClosableOverlay: overlayMode case not handled "${overlayMode}"`
leftOverlayMode,
`ClosableOverlay: leftOverlayMode case not handled "${leftOverlayMode}"`
);
}
};
@ -121,12 +121,12 @@ export class LeftPaneMessageSection extends React.Component<Props> {
}
public render(): JSX.Element {
const { overlayMode } = this.props;
const { leftOverlayMode } = this.props;
return (
<StyledLeftPaneContent>
<LeftPaneSectionHeader />
{overlayMode ? <ClosableOverlay /> : this.renderConversations()}
{leftOverlayMode ? <ClosableOverlay /> : this.renderConversations()}
</StyledLeftPaneContent>
);
}
@ -137,7 +137,7 @@ export class LeftPaneMessageSection extends React.Component<Props> {
<SessionSearchInput />
<MessageRequestsBanner
handleOnClick={() => {
window.inboxStore?.dispatch(setOverlayMode('message-requests'));
window.inboxStore?.dispatch(setLeftOverlayMode('message-requests'));
}}
/>
{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 {
SectionType,
setOverlayMode,
setLeftOverlayMode,
showLeftPaneSection,
showSettingsSection,
} from '../../state/ducks/section';
@ -105,7 +105,7 @@ const LeftPaneSettingsCategoryRow = (props: {
switch (id) {
case SessionSettingCategory.MessageRequests:
dispatch(showLeftPaneSection(SectionType.Message));
dispatch(setOverlayMode('message-requests'));
dispatch(setLeftOverlayMode('message-requests'));
dispatch(resetConversationExternal());
break;
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 { 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 { VALIDATION } from '../../../session/constants';
import { ToastUtils } from '../../../session/utils';
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`
font-family: var(--font-mono), var(--font-default);
@ -101,7 +101,7 @@ export const OverlayClosedGroup = () => {
const searchResultContactsOnly = useSelector(getSearchResultsContactOnly);
function closeOverlay() {
dispatch(resetOverlayMode());
dispatch(resetLeftOverlayMode());
}
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 */
import React, { useState } from 'react';
import useKey from 'react-use/lib/useKey';
import { useDispatch, useSelector } from 'react-redux';
import useKey from 'react-use/lib/useKey';
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 {
joinOpenGroupV2WithUIEvents,
JoinSogsRoomUICallbackArgs,
} from '../../../session/apis/open_group_api/opengroupV2/JoinOpenGroupV2';
import { openGroupV2CompleteURLRegex } from '../../../session/apis/open_group_api/utils/OpenGroupUtils';
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 {
markConversationInitialLoadingInProgress,
openConversationWithMessages,
} from '../../../state/ducks/conversations';
import { getLeftOverlayMode } from '../../../state/selectors/section';
async function joinOpenGroup(
serverUrl: string,
@ -42,10 +42,10 @@ export const OverlayCommunity = () => {
const [loading, setLoading] = useState(false);
const [groupUrl, setGroupUrl] = useState('');
const overlayModeIsCommunity = useSelector(getOverlayMode) === 'open-group';
const overlayModeIsCommunity = useSelector(getLeftOverlayMode) === 'open-group';
function closeOverlay() {
dispatch(resetOverlayMode());
dispatch(resetLeftOverlayMode());
}
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 { useDispatch } from 'react-redux';
import styled from 'styled-components';
import { setOverlayMode } from '../../../state/ducks/section';
import { setLeftOverlayMode } from '../../../state/ducks/section';
import { Flex } from '../../basic/Flex';
import { SpacerSM } from '../../basic/Text';
import { SessionIconButton } from '../../icon';
@ -45,7 +45,7 @@ const StyledSubTitle = styled.h3`
export const OverlayHeader = ({ subtitle, title }: { title: string; subtitle: string }) => {
const dispatch = useDispatch();
const returnToActionChooser = () => {
dispatch(setOverlayMode('choose-action'));
dispatch(setLeftOverlayMode('choose-action'));
};
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 { ToastUtils, UserUtils } from '../../../session/utils';
import { openConversationWithMessages } from '../../../state/ducks/conversations';
import { resetOverlayMode } from '../../../state/ducks/section';
import { resetLeftOverlayMode } from '../../../state/ducks/section';
import { SessionButton } from '../../basic/SessionButton';
import { SessionIdEditable } from '../../basic/SessionIdEditable';
import { SessionSpinner } from '../../basic/SessionSpinner';
@ -42,7 +42,7 @@ export const OverlayMessage = () => {
const dispatch = useDispatch();
function closeOverlay() {
dispatch(resetOverlayMode());
dispatch(resetLeftOverlayMode());
}
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 { forceSyncConfigurationNowIfNeeded } from '../../../session/utils/sync/syncUtils';
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 { useSelectedConversationKey } from '../../../state/selectors/selectedConversation';
import { SessionButton, SessionButtonColor } from '../../basic/SessionButton';
@ -43,7 +43,7 @@ export const OverlayMessageRequest = () => {
useKey('Escape', closeOverlay);
const dispatch = useDispatch();
function closeOverlay() {
dispatch(resetOverlayMode());
dispatch(resetLeftOverlayMode());
}
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 useKey from 'react-use/lib/useKey';
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 { ContactsListWithBreaks } from './ContactsListWithBreaks';
@ -47,19 +47,19 @@ const IconOnActionRow = (props: { iconType: SessionIconType }) => {
export const OverlayChooseAction = () => {
const dispatch = useDispatch();
function closeOverlay() {
dispatch(resetOverlayMode());
dispatch(resetLeftOverlayMode());
}
const openNewMessage = useCallback(() => {
dispatch(setOverlayMode('message'));
dispatch(setLeftOverlayMode('message'));
}, [dispatch]);
const openCreateGroup = useCallback(() => {
dispatch(setOverlayMode('closed-group'));
dispatch(setLeftOverlayMode('closed-group'));
}, [dispatch]);
const openJoinCommunity = useCallback(() => {
dispatch(setOverlayMode('open-group'));
dispatch(setLeftOverlayMode('open-group'));
}, [dispatch]);
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_SETTINGS_SECTION = 'FOCUS_SETTINGS_SECTION';
export const IS_APP_FOCUSED = 'IS_APP_FOCUSED';
export const OVERLAY_MODE = 'OVERLAY_MODE';
export const RESET_OVERLAY_MODE = 'RESET_OVERLAY_MODE';
export const LEFT_OVERLAY_MODE = 'LEFT_OVERLAY_MODE';
export const RESET_LEFT_OVERLAY_MODE = 'RESET_OVERLAY_MODE';
export const RIGHT_OVERLAY_MODE = 'RIGHT_OVERLAY_MODE';
export const RESET_RIGHT_OVERLAY_MODE = 'RESET_RIGHT_OVERLAY_MODE';
@ -32,12 +32,12 @@ type IsAppFocusedActionType = {
payload: boolean;
};
type OverlayModeActionType = {
type: 'OVERLAY_MODE';
payload: OverlayMode;
type LeftOverlayModeActionType = {
type: 'LEFT_OVERLAY_MODE';
payload: LeftOverlayMode;
};
type ResetOverlayModeActionType = {
type ResetLeftOverlayModeActionType = {
type: 'RESET_OVERLAY_MODE';
};
@ -66,24 +66,23 @@ export function setIsAppFocused(focused: boolean): IsAppFocusedActionType {
};
}
// TODO Should be renamed to LeftOverlayMode
export type OverlayMode =
export type LeftOverlayMode =
| 'choose-action'
| 'message'
| 'open-group'
| 'closed-group'
| 'message-requests';
export function setOverlayMode(overlayMode: OverlayMode): OverlayModeActionType {
export function setLeftOverlayMode(overlayMode: LeftOverlayMode): LeftOverlayModeActionType {
return {
type: OVERLAY_MODE,
type: LEFT_OVERLAY_MODE,
payload: overlayMode,
};
}
export function resetOverlayMode(): ResetOverlayModeActionType {
export function resetLeftOverlayMode(): ResetLeftOverlayModeActionType {
return {
type: RESET_OVERLAY_MODE,
type: RESET_LEFT_OVERLAY_MODE,
};
}
@ -124,8 +123,8 @@ export function showSettingsSection(
export const actions = {
showLeftPaneSection,
showSettingsSection,
setOverlayMode,
resetOverlayMode,
setLeftOverlayMode,
resetLeftOverlayMode,
setRightOverlayMode,
resetRightOverlayMode,
};
@ -134,7 +133,7 @@ export const initialSectionState: SectionStateType = {
focusedSection: SectionType.Message,
focusedSettingsSection: undefined,
isAppFocused: false,
overlayMode: undefined,
leftOverlayMode: undefined,
rightOverlayMode: { type: 'default', params: null },
};
@ -142,7 +141,7 @@ export type SectionStateType = {
focusedSection: SectionType;
focusedSettingsSection?: SessionSettingCategory;
isAppFocused: boolean;
overlayMode: OverlayMode | undefined;
leftOverlayMode: LeftOverlayMode | undefined;
rightOverlayMode: RightOverlayMode | undefined;
};
@ -187,15 +186,15 @@ export const reducer = (
...state,
isAppFocused: payload,
};
case OVERLAY_MODE:
case LEFT_OVERLAY_MODE:
return {
...state,
overlayMode: payload,
leftOverlayMode: payload,
};
case RESET_OVERLAY_MODE:
case RESET_LEFT_OVERLAY_MODE:
return {
...state,
overlayMode: undefined,
leftOverlayMode: undefined,
};
case RIGHT_OVERLAY_MODE:
return {

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

@ -1,7 +1,7 @@
import { createSelector } from '@reduxjs/toolkit';
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';
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.
export const getOverlayMode = createSelector(
export const getLeftOverlayMode = createSelector(
getSection,
(state: SectionStateType): OverlayMode | undefined => state.overlayMode
(state: SectionStateType): LeftOverlayMode | undefined => state.leftOverlayMode
);
export const getRightOverlayMode = (state: StateType): RightOverlayMode | undefined => {
@ -37,7 +37,7 @@ export const getRightOverlayMode = (state: StateType): RightOverlayMode | undefi
export const getIsMessageRequestOverlayShown = (state: StateType) => {
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