-
-
Notifications
You must be signed in to change notification settings - Fork 10.1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- 在 settings 中添加 guide 字段 - 为 Empty 组件添加受控模式 - setting store 添加 guide 状态控制方法
- Loading branch information
Showing
8 changed files
with
177 additions
and
90 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,34 +1,60 @@ | ||
| import { ActionIcon, DivProps } from '@lobehub/ui'; | ||
| import { X } from 'lucide-react'; | ||
| import { memo, useState } from 'react'; | ||
| import Image from 'next/image'; | ||
| import { memo } from 'react'; | ||
| import useMergeState from 'use-merge-value'; | ||
|
|
||
| import { useStyles } from './style'; | ||
|
|
||
| interface EmptyProps extends DivProps { | ||
| alt: string; | ||
| cover: string; | ||
| defaultVisible?: boolean; | ||
| desc: string; | ||
| height?: number; | ||
| onVisibleChange?: (visible: boolean) => void; | ||
| title: string; | ||
| visible?: boolean; | ||
| width?: number; | ||
| } | ||
|
|
||
| const Empty = memo<EmptyProps>(({ cover, title, desc, ...props }) => { | ||
| const [visiable, setVisiable] = useState(true); | ||
| const { styles } = useStyles(); | ||
| if (!visiable) return null; | ||
| return ( | ||
| <div className={styles.container} {...props}> | ||
| <ActionIcon | ||
| className={styles.close} | ||
| icon={X} | ||
| onClick={() => setVisiable(false)} | ||
| size={{ blockSize: 24, fontSize: 16 }} | ||
| /> | ||
| {cover && <img alt="empty" src={cover} width="100%" />} | ||
| <div className={styles.content}> | ||
| {title && <h3>{title}</h3>} | ||
| {desc && <p className={styles.desc}>{desc}</p>} | ||
| const Empty = memo<EmptyProps>( | ||
| ({ | ||
| cover, | ||
| visible, | ||
| defaultVisible, | ||
| onVisibleChange, | ||
| alt, | ||
| title, | ||
| desc, | ||
| width, | ||
| height, | ||
| ...props | ||
| }) => { | ||
| const [value, setValue] = useMergeState(true, { | ||
| defaultValue: defaultVisible, | ||
| onChange: onVisibleChange, | ||
| value: visible, | ||
| }); | ||
|
|
||
| const { styles } = useStyles(); | ||
| if (!value) return null; | ||
| return ( | ||
| <div className={styles.container} {...props}> | ||
| <ActionIcon | ||
| className={styles.close} | ||
| icon={X} | ||
| onClick={() => setValue(false)} | ||
| size={{ blockSize: 24, fontSize: 16 }} | ||
| /> | ||
| {cover && <Image alt={alt} height={height} src={cover} width={width} />} | ||
| <div className={styles.content}> | ||
| {title && <h3>{title}</h3>} | ||
| {desc && <p className={styles.desc}>{desc}</p>} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| }); | ||
| ); | ||
| }, | ||
| ); | ||
|
|
||
| export default Empty; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,96 @@ | ||
| import { ThemeMode } from 'antd-style'; | ||
| import { produce } from 'immer'; | ||
| import { merge } from 'lodash-es'; | ||
| import type { StateCreator } from 'zustand/vanilla'; | ||
|
|
||
| import { DEFAULT_AGENT, DEFAULT_BASE_SETTINGS, DEFAULT_SETTINGS } from '@/const/settings'; | ||
| import type { GlobalSettings } from '@/types/settings'; | ||
| import { setNamespace } from '@/utils/storeDebug'; | ||
|
|
||
| import type { Guide, SidebarTabKey } from '../initialState'; | ||
| import { AppSettingsState } from '../initialState'; | ||
| import type { SettingsStore } from '../store'; | ||
|
|
||
| const t = setNamespace('settings'); | ||
|
|
||
| /** | ||
| * 设置操作 | ||
| */ | ||
| export interface CommonAction { | ||
| importAppSettings: (settings: GlobalSettings) => void; | ||
| resetBaseSettings: () => void; | ||
| /** | ||
| * 重置设置 | ||
| */ | ||
| resetSettings: () => void; | ||
| /** | ||
| * 设置全局设置 | ||
| * @param settings - 全局设置 | ||
| */ | ||
| setAppSettings: (settings: AppSettingsState) => void; | ||
| /** | ||
| * 设置部分配置设置 | ||
| * @param settings - 部分配置设置 | ||
| */ | ||
| setSettings: (settings: Partial<GlobalSettings>) => void; | ||
| /** | ||
| * 设置主题模式 | ||
| * @param themeMode - 主题模式 | ||
| */ | ||
| setThemeMode: (themeMode: ThemeMode) => void; | ||
| /** | ||
| * 切换侧边栏选项 | ||
| * @param key - 选中的侧边栏选项 | ||
| */ | ||
| switchSideBar: (key: SidebarTabKey) => void; | ||
| updateGuideState: (guide: Partial<Guide>) => void; | ||
| } | ||
|
|
||
| export const createCommonSlice: StateCreator< | ||
| SettingsStore, | ||
| [['zustand/devtools', never]], | ||
| [], | ||
| CommonAction | ||
| > = (set, get) => ({ | ||
| importAppSettings: (importAppSettings) => { | ||
| const { setSettings } = get(); | ||
| // eslint-disable-next-line @typescript-eslint/no-unused-vars | ||
| const { OPENAI_API_KEY: _, password: __, ...settings } = importAppSettings; | ||
|
|
||
| setSettings({ | ||
| ...settings, | ||
| // 如果用户存在用户头像，那么不做导入 | ||
| avatar: !get().settings.avatar ? settings.avatar : get().settings.avatar, | ||
| }); | ||
| }, | ||
| resetBaseSettings: () => { | ||
| const settings = get().settings; | ||
|
|
||
| set({ settings: { ...settings, ...DEFAULT_BASE_SETTINGS } }, false, t('resetBaseSettings')); | ||
| }, | ||
| resetDefaultAgent: () => { | ||
| const settings = produce(get().settings, (draft: GlobalSettings) => { | ||
| draft.defaultAgent = DEFAULT_AGENT; | ||
| }); | ||
| set({ settings }, false, t('resetDefaultAgent')); | ||
| }, | ||
| resetSettings: () => { | ||
| set({ settings: DEFAULT_SETTINGS }, false, t('resetSettings')); | ||
| }, | ||
| setAppSettings: (settings) => { | ||
| set({ ...settings }, false, t('setAppSettings', settings)); | ||
| }, | ||
| setSettings: (settings) => { | ||
| const oldSetting = get().settings; | ||
| set({ settings: merge(oldSetting, settings) }, false, t('setSettings', settings)); | ||
| }, | ||
| setThemeMode: (themeMode) => { | ||
| get().setSettings({ themeMode }); | ||
| }, | ||
| switchSideBar: (key) => { | ||
| set({ sidebarKey: key }, false, t('switchSideBar', key)); | ||
| }, | ||
| updateGuideState: (guide) => { | ||
| set({ guide: { ...get().guide, ...guide } }); | ||
| }, | ||
| }); |
Oops, something went wrong.