diff --git a/src/features/settings/Settings.tsx b/src/features/settings/Settings.tsx index 08180dd..7209143 100644 --- a/src/features/settings/Settings.tsx +++ b/src/features/settings/Settings.tsx @@ -1,8 +1,8 @@ import { - chakra, Box, Button, Center, + chakra, Flex, HStack, Icon, @@ -19,9 +19,9 @@ import { TabPanels, Tabs, Text, - VStack, useBreakpointValue, useToast, + VStack, } from '@chakra-ui/react'; import { PanelQMCv2Key } from './panels/PanelQMCv2Key'; import { useState } from 'react'; @@ -145,7 +145,7 @@ export function Settings() { onClick={handleResetSettings} colorScheme="red" variant="ghost" - title="放弃未储存的更改,将设定还原为储存前的状态。" + title="放弃未储存的更改,将设定还原未储存前的状态。" aria-label="放弃未储存的更改" /> diff --git a/src/tabs/MainTab.tsx b/src/tabs/MainTab.tsx index 8027d12..e6dc61d 100644 --- a/src/tabs/MainTab.tsx +++ b/src/tabs/MainTab.tsx @@ -1,12 +1,36 @@ -import { Box, VStack } from '@chakra-ui/react'; +import { Alert, AlertIcon, Box, Button, Flex, Text, VStack } from '@chakra-ui/react'; import { SelectFile } from '../components/SelectFile'; import { FileListing } from '~/features/file-listing/FileListing'; +import { useAppDispatch, useAppSelector } from '~/hooks.ts'; +import { selectIsSettingsNotSaved } from '~/features/settings/settingsSelector.ts'; +import { commitStagingChange } from '~/features/settings/settingsSlice.ts'; export function MainTab() { + const dispatch = useAppDispatch(); + const isSettingsNotSaved = useAppSelector(selectIsSettingsNotSaved); + const onClickSaveSettings = () => { + dispatch(commitStagingChange()); + }; + return ( + {isSettingsNotSaved && ( + + + + + 有尚未储存的设置, +
+ 设定将在保存后生效 +
+ +
+
+ )}