vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-05-10 04:30:25 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor ListConfigMenu as modal

Browse Source
This commit is contained in:
jeffvli
2025-11-14 00:39:47 -08:00
parent a369573b85
commit f70aaae35f
1 changed files with 31 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/features/shared/components/list-config-menu.tsx
+31 -31
View File
@@ -1,4 +1,5 @@
import { ReactNode } from 'react'; import { ReactNode } from 'react';
import { useTranslation } from 'react-i18next';
import i18n from '/@/i18n/i18n'; import i18n from '/@/i18n/i18n';
import { GridConfig } from '/@/renderer/features/shared/components/grid-config'; import { GridConfig } from '/@/renderer/features/shared/components/grid-config';
@@ -7,11 +8,11 @@ import { TableConfig } from '/@/renderer/features/shared/components/table-config
import { useSettingsStore, useSettingsStoreActions } from '/@/renderer/store'; import { useSettingsStore, useSettingsStoreActions } from '/@/renderer/store';
import { Group } from '/@/shared/components/group/group'; import { Group } from '/@/shared/components/group/group';
import { Icon } from '/@/shared/components/icon/icon'; import { Icon } from '/@/shared/components/icon/icon';
import { Popover } from '/@/shared/components/popover/popover'; import { Modal } from '/@/shared/components/modal/modal';
import { ScrollArea } from '/@/shared/components/scroll-area/scroll-area';
import { SegmentedControl } from '/@/shared/components/segmented-control/segmented-control'; import { SegmentedControl } from '/@/shared/components/segmented-control/segmented-control';
import { Stack } from '/@/shared/components/stack/stack'; import { Stack } from '/@/shared/components/stack/stack';
import { Table } from '/@/shared/components/table/table'; import { Table } from '/@/shared/components/table/table';
import { useDisclosure } from '/@/shared/hooks/use-disclosure';
import { ItemListKey, ListDisplayType } from '/@/shared/types/types'; import { ItemListKey, ListDisplayType } from '/@/shared/types/types';
const DISPLAY_TYPES = [ const DISPLAY_TYPES = [
@@ -82,41 +83,40 @@ interface ListConfigMenuProps {
} }
export const ListConfigMenu = (props: ListConfigMenuProps) => { export const ListConfigMenu = (props: ListConfigMenuProps) => {
const { t } = useTranslation();
const displayType = useSettingsStore( const displayType = useSettingsStore(
(state) => state.lists[props.listKey]?.display, (state) => state.lists[props.listKey]?.display,
) as ListDisplayType; ) as ListDisplayType;
const { setList } = useSettingsStoreActions(); const { setList } = useSettingsStoreActions();
const [isOpen, handlers] = useDisclosure(false);
return ( return (
<Popover position="bottom-end" trapFocus width={640}> <>
<Popover.Target> <SettingsButton onClick={handlers.toggle} />
<SettingsButton /> <Modal
</Popover.Target> handlers={handlers}
<Popover.Dropdown> opened={isOpen}
<ScrollArea size="lg"
allowDragScroll title={t('common.configure', { postProcess: 'sentenceCase' })}
scrollX >
style={{ height: 'auto', maxHeight: '70dvh', padding: '1rem' }} <Stack>
> <SegmentedControl
<Stack> data={DISPLAY_TYPES.map((type) => ({
<SegmentedControl ...type,
data={DISPLAY_TYPES.map((type) => ({ }))}
...type, fullWidth
}))} onChange={(value) => {
fullWidth setList(props.listKey, {
onChange={(value) => { display: value as ListDisplayType,
setList(props.listKey, { });
display: value as ListDisplayType, }}
}); value={displayType}
}} withItemsBorders={false}
value={displayType} />
withItemsBorders={false} <Config displayType={displayType} {...props} />
/> </Stack>
<Config displayType={displayType} {...props} /> </Modal>
</Stack> </>
</ScrollArea>
</Popover.Dropdown>
</Popover>
); );
}; };