diff --git a/src/components/left/settings/Settings.tsx b/src/components/left/settings/Settings.tsx index 81b90f3bb..888d9e982 100644 --- a/src/components/left/settings/Settings.tsx +++ b/src/components/left/settings/Settings.tsx @@ -186,11 +186,6 @@ const Settings: FC = ({ currentScreen, onReset, onScreenSelect, ]); - const handleSaveFilter = useCallback(() => { - foldersDispatch({ type: 'saveFilters' }); - handleReset(); - }, [foldersDispatch, handleReset]); - function renderCurrentSectionContent(isScreenActive: boolean, screen: SettingsScreens) { const privacyAllowScreens: Record = { [SettingsScreens.PrivacyPhoneNumber]: PRIVACY_PHONE_NUMBER_SCREENS.includes(screen), @@ -459,7 +454,6 @@ const Settings: FC = ({ diff --git a/src/components/left/settings/SettingsHeader.tsx b/src/components/left/settings/SettingsHeader.tsx index de597c827..2536c5a00 100644 --- a/src/components/left/settings/SettingsHeader.tsx +++ b/src/components/left/settings/SettingsHeader.tsx @@ -19,7 +19,6 @@ type OwnProps = { currentScreen: SettingsScreens; editedFolderId?: number; onReset: () => void; - onSaveFilter: () => void; onScreenSelect: (screen: SettingsScreens) => void; }; @@ -27,7 +26,6 @@ const SettingsHeader: FC = ({ currentScreen, editedFolderId, onReset, - onSaveFilter, onScreenSelect, }) => { const { @@ -227,27 +225,14 @@ const SettingsHeader: FC = ({ case SettingsScreens.FoldersExcludedChats: case SettingsScreens.FoldersExcludedChatsFromChatList: return ( -
- {(currentScreen === SettingsScreens.FoldersIncludedChats - || currentScreen === SettingsScreens.FoldersIncludedChatsFromChatList) ? ( -

{lang('FilterInclude')}

- ) : ( -

{lang('FilterExclude')}

- )} - - -
+

+ {lang( + currentScreen === SettingsScreens.FoldersIncludedChats + || currentScreen === SettingsScreens.FoldersIncludedChatsFromChatList + ? 'FilterInclude' : 'FilterExclude', + )} +

); - default: return (
diff --git a/src/components/left/settings/folders/SettingsFolders.tsx b/src/components/left/settings/folders/SettingsFolders.tsx index a285f93e7..65e396fc6 100644 --- a/src/components/left/settings/folders/SettingsFolders.tsx +++ b/src/components/left/settings/folders/SettingsFolders.tsx @@ -66,6 +66,11 @@ const SettingsFolders: FC = ({ currentScreen, onReset, onScreenSelect, ]); + const handleSaveFilter = useCallback(() => { + dispatch({ type: 'saveFilters' }); + handleReset(); + }, [dispatch, handleReset]); + const handleCreateFolder = useCallback(() => { dispatch({ type: 'reset' }); onScreenSelect(SettingsScreens.FoldersCreateFolder); @@ -144,6 +149,7 @@ const SettingsFolders: FC = ({ state={state} dispatch={dispatch} onReset={handleReset} + onSaveFilter={handleSaveFilter} isActive={isActive} /> ); @@ -155,6 +161,7 @@ const SettingsFolders: FC = ({ state={state} dispatch={dispatch} onReset={handleReset} + onSaveFilter={handleSaveFilter} isActive={isActive} /> ); diff --git a/src/components/left/settings/folders/SettingsFoldersChatFilters.tsx b/src/components/left/settings/folders/SettingsFoldersChatFilters.tsx index 32ce2ceba..3cf6df8c2 100644 --- a/src/components/left/settings/folders/SettingsFoldersChatFilters.tsx +++ b/src/components/left/settings/folders/SettingsFoldersChatFilters.tsx @@ -25,7 +25,8 @@ type OwnProps = { state: FoldersState; dispatch: FolderEditDispatch; isActive?: boolean; - onReset: () => void; + onReset: VoidFunction; + onSaveFilter: VoidFunction; }; const SettingsFoldersChatFilters: FC = ({ @@ -34,6 +35,7 @@ const SettingsFoldersChatFilters: FC = ({ dispatch, isActive, onReset, + onSaveFilter, }) => { const { chatFilter } = state; const { selectedChatIds, selectedChatTypes } = selectChatFilters(state, mode, true); @@ -122,6 +124,8 @@ const SettingsFoldersChatFilters: FC = ({ onSelectedIdsChange={handleSelectedIdsChange} onSelectedChatTypesChange={handleSelectedChatTypesChange} onFilterChange={handleFilterChange} + onSaveFilter={onSaveFilter} + isActive={isActive} /> ); }; diff --git a/src/components/left/settings/folders/SettingsFoldersChatsPicker.tsx b/src/components/left/settings/folders/SettingsFoldersChatsPicker.tsx index 131a91428..17d6aa997 100644 --- a/src/components/left/settings/folders/SettingsFoldersChatsPicker.tsx +++ b/src/components/left/settings/folders/SettingsFoldersChatsPicker.tsx @@ -1,6 +1,6 @@ import type { FC } from '../../../../lib/teact/teact'; import React, { - useCallback, useRef, useEffect, memo, + useCallback, useRef, useEffect, memo, useState, } from '../../../../lib/teact/teact'; import { requestMutation } from '../../../../lib/fasterdom/fasterdom'; import { getActions, withGlobal } from '../../../../global'; @@ -24,6 +24,7 @@ import GroupChatInfo from '../../../common/GroupChatInfo'; import PickerSelectedItem from '../../../common/PickerSelectedItem'; import InfiniteScroll from '../../../ui/InfiniteScroll'; import Loading from '../../../ui/Loading'; +import FloatingActionButton from '../../../ui/FloatingActionButton'; import '../../../common/Picker.scss'; import './SettingsFoldersChatsPicker.scss'; @@ -38,6 +39,8 @@ type OwnProps = { onSelectedIdsChange: (ids: string[]) => void; onSelectedChatTypesChange: (types: string[]) => void; onFilterChange: (value: string) => void; + onSaveFilter: VoidFunction; + isActive?: boolean; }; // Focus slows down animation, also it breaks transition layout in Chrome @@ -61,12 +64,21 @@ const SettingsFoldersChatsPicker: FC = ({ onSelectedChatTypesChange, onFilterChange, maxChats, + onSaveFilter, + isActive, }) => { const { openLimitReachedModal } = getActions(); // eslint-disable-next-line no-null/no-null const inputRef = useRef(null); const chatTypes = mode === 'included' ? INCLUDED_CHAT_TYPES : EXCLUDED_CHAT_TYPES; const shouldMinimize = selectedIds.length + selectedChatTypes.length > MAX_FULL_ITEMS; + const [isTouched, setIsTouched] = useState(false); + + useEffect(() => { + if (!isActive) { + setIsTouched(false); + } + }, [isActive]); useEffect(() => { setTimeout(() => { @@ -89,6 +101,7 @@ const SettingsFoldersChatsPicker: FC = ({ } newSelectedIds.push(id); } + setIsTouched(true); onSelectedIdsChange(newSelectedIds); }, [selectedIds, onSelectedIdsChange, maxChats, mode, openLimitReachedModal]); @@ -99,6 +112,7 @@ const SettingsFoldersChatsPicker: FC = ({ } else { newSelectedChatTypes.push(key); } + setIsTouched(true); onSelectedChatTypesChange(newSelectedChatTypes); }, [selectedChatTypes, onSelectedChatTypesChange]); @@ -225,6 +239,14 @@ const SettingsFoldersChatsPicker: FC = ({ )} + + + +
); };