37 lines
956 B
TypeScript
Executable File
37 lines
956 B
TypeScript
Executable File
import {NavLink} from 'react-router-dom';
|
|
import {AppearanceButton} from './appearance-button';
|
|
import {useAppearanceStore} from './appearance-store';
|
|
import {Trans} from '../../i18n/trans';
|
|
import {Fragment, useMemo} from 'react';
|
|
|
|
export function SectionList() {
|
|
const sections = useAppearanceStore(s => s.config?.sections);
|
|
const sortedSection = useMemo(() => {
|
|
if (!sections) return [];
|
|
return Object.entries(sections || [])
|
|
.map(([key, value]) => {
|
|
return {
|
|
...value,
|
|
key,
|
|
};
|
|
})
|
|
.sort((a, b) => (a?.position || 1) - (b?.position || 1));
|
|
}, [sections]);
|
|
|
|
return (
|
|
<Fragment>
|
|
{sortedSection.map(section => {
|
|
return (
|
|
<AppearanceButton
|
|
key={section.key}
|
|
to={section.key}
|
|
elementType={NavLink}
|
|
>
|
|
<Trans {...section.label} />
|
|
</AppearanceButton>
|
|
);
|
|
})}
|
|
</Fragment>
|
|
);
|
|
}
|