ruiling/tachybase_todo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: improve plugin settings code (#3028)

Browse Source
This commit is contained in:
jack zhang 2023-11-13 17:10:01 +08:00 committed by GitHub
parent 34d1406ede
commit 647c8ccdaa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
packages/core/client/src/application/PluginSettingsManager.ts
View File

@ -34,7 +34,9 @@ export interface PluginSettingsPageType {
path: string; path: string;
sort?: number; sort?: number;
name?: string; name?: string;
pluginName?: string; isAllow?: boolean;
topLevelName?: string;
aclSnippet: string;
children?: PluginSettingsPageType[]; children?: PluginSettingsPageType[];
[index: string]: any; [index: string]: any;
} }
@ -66,8 +68,8 @@ export class PluginSettingsManager {
add(name: string, options: PluginSettingsManagerSettingOptionsType) { add(name: string, options: PluginSettingsManagerSettingOptionsType) {
const nameArr = name.split('.'); const nameArr = name.split('.');
const pluginName = nameArr[0]; const topLevelName = nameArr[0];
this.settings[name] = { Component: Outlet, ...options, name, pluginName }; this.settings[name] = { Component: Outlet, ...options, name, topLevelName };
// add children // add children
if (nameArr.length > 1) { if (nameArr.length > 1) {
@ -129,8 +131,7 @@ export class PluginSettingsManager {
} }
getList(filterAuth = true): PluginSettingsPageType[] { getList(filterAuth = true): PluginSettingsPageType[] {
return Object.keys(this.settings) return Array.from(new Set(Object.values(this.settings).map((item) => item.topLevelName)))
.filter((item) => !item.includes('.')) // top level
.sort((a, b) => a.localeCompare(b)) // sort by name .sort((a, b) => a.localeCompare(b)) // sort by name
.map((name) => this.get(name, filterAuth)) .map((name) => this.get(name, filterAuth))
.filter(Boolean) .filter(Boolean)

3
packages/core/client/src/pm/PluginManagerLink.tsx
View File

@ -35,7 +35,6 @@ export const SettingsCenterDropdown = () => {
const app = useApp(); const app = useApp();
const settings = app.pluginSettingsManager.getList(); const settings = app.pluginSettingsManager.getList();
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
return ( return (
<ActionContextProvider value={{ visible, setVisible }}> <ActionContextProvider value={{ visible, setVisible }}>
<Popover <Popover
@ -64,7 +63,7 @@ export const SettingsCenterDropdown = () => {
background: rgba(0, 0, 0, 0.045); background: rgba(0, 0, 0, 0.045);
} }
`} `}
key={setting.pluginName} key={setting.name}
> >
<a <a
role="button" role="button"

20
packages/core/client/src/pm/PluginSetting.tsx
View File

@ -69,22 +69,20 @@ export const SettingsCenterComponent = () => {
}, [settings]); }, [settings]);
const currentSetting = useMemo(() => settingsMapByPath[location.pathname], [location.pathname, settingsMapByPath]); const currentSetting = useMemo(() => settingsMapByPath[location.pathname], [location.pathname, settingsMapByPath]);
const currentPlugin = useMemo(() => { const currentTopLevelSetting = useMemo(() => {
if (!currentSetting) { if (!currentSetting) {
return null; return null;
} }
return settings.find((item) => item.name === currentSetting.pluginName); return settings.find((item) => item.name === currentSetting.topLevelName);
}, [currentSetting, settings]); }, [currentSetting, settings]);
const sidebarMenus = useMemo(() => { const sidebarMenus = useMemo(() => {
return getMenuItems(settings.map((item) => ({ ...item, children: null }))); return getMenuItems(settings.map((item) => ({ ...item, children: null })));
}, [settings]); }, [settings]);
if (!currentSetting || location.pathname === ADMIN_SETTINGS_PATH || location.pathname === ADMIN_SETTINGS_PATH + '/') { if (!currentSetting || location.pathname === ADMIN_SETTINGS_PATH || location.pathname === ADMIN_SETTINGS_PATH + '/') {
return <Navigate replace to={getFirstDeepChildPath(settings)} />; return <Navigate replace to={getFirstDeepChildPath(settings)} />;
} }
if (location.pathname === currentPlugin.path && currentPlugin.children?.length > 0) { if (location.pathname === currentTopLevelSetting.path && currentTopLevelSetting.children?.length > 0) {
return <Navigate replace to={getFirstDeepChildPath(currentPlugin.children)} />; return <Navigate replace to={getFirstDeepChildPath(currentTopLevelSetting.children)} />;
} }
return ( return (
<div> <div>
@ -106,7 +104,7 @@ export const SettingsCenterComponent = () => {
theme={'light'} theme={'light'}
> >
<Menu <Menu
selectedKeys={[currentSetting?.pluginName]} selectedKeys={[currentSetting?.topLevelName]}
style={{ height: 'calc(100vh - 46px)', overflowY: 'auto', overflowX: 'hidden' }} style={{ height: 'calc(100vh - 46px)', overflowY: 'auto', overflowX: 'hidden' }}
onClick={({ key }) => { onClick={({ key }) => {
const plugin = settings.find((item) => item.name === key); const plugin = settings.find((item) => item.name === key);
@ -124,12 +122,12 @@ export const SettingsCenterComponent = () => {
<PageHeader <PageHeader
className={styles.pageHeader} className={styles.pageHeader}
style={{ style={{
paddingBottom: currentPlugin.children?.length > 0 ? 0 : theme.paddingSM, paddingBottom: currentTopLevelSetting.children?.length > 0 ? 0 : theme.paddingSM,
}} }}
ghost={false} ghost={false}
title={currentPlugin.title} title={currentTopLevelSetting.title}
footer={ footer={
currentPlugin.children?.length > 0 && ( currentTopLevelSetting.children?.length > 0 && (
<Menu <Menu
style={{ marginLeft: -theme.margin }} style={{ marginLeft: -theme.margin }}
onClick={({ key }) => { onClick={({ key }) => {
@ -137,7 +135,7 @@ export const SettingsCenterComponent = () => {
}} }}
selectedKeys={[currentSetting?.name]} selectedKeys={[currentSetting?.name]}
mode="horizontal" mode="horizontal"
items={getMenuItems(currentPlugin.children)} items={getMenuItems(currentTopLevelSetting.children)}
></Menu> ></Menu>
) )
} }