🌐 Category menu

This commit is contained in:
Tagaishi
2023-08-13 21:46:19 +02:00
parent d4c9a5bb26
commit 8130504430
2 changed files with 21 additions and 8 deletions

View File

@@ -14,5 +14,12 @@
"category": {
"openAllInNewTab": "Open all in new tab"
}
},
"menu": {
"moveUp": "Move up",
"moveDown": "Move down",
"addCategory": "Add category",
"addAbove": "above",
"addBelow": "below"
}
}

View File

@@ -12,6 +12,7 @@ import {
import { useConfigContext } from '../../../../config/provider';
import { CategoryType } from '../../../../types/category';
import { useCategoryActions } from './useCategoryActions';
import { useTranslation } from 'next-i18next';
interface CategoryEditMenuProps {
category: CategoryType;
@@ -21,6 +22,7 @@ export const CategoryEditMenu = ({ category }: CategoryEditMenuProps) => {
const { name: configName } = useConfigContext();
const { addCategoryAbove, addCategoryBelow, moveCategoryUp, moveCategoryDown, edit, remove } =
useCategoryActions(configName, category);
const { t } = useTranslation(['layout/common','common']);
return (
<Menu withinPortal withArrow>
@@ -31,24 +33,28 @@ export const CategoryEditMenu = ({ category }: CategoryEditMenuProps) => {
</Menu.Target>
<Menu.Dropdown>
<Menu.Item icon={<IconEdit size={20} />} onClick={edit}>
Edit
{t('common:edit')}
</Menu.Item>
<Menu.Item icon={<IconTrash size={20} />} onClick={remove}>
Remove
{t('common:remove')}
</Menu.Item>
<Menu.Label>Change positon</Menu.Label>
<Menu.Label>
{t('common:changePosition')}
</Menu.Label>
<Menu.Item icon={<IconTransitionTop size={20} />} onClick={moveCategoryUp}>
Move up
{t('menu.moveUp')}
</Menu.Item>
<Menu.Item icon={<IconTransitionBottom size={20} />} onClick={moveCategoryDown}>
Move down
{t('menu.moveDown')}
</Menu.Item>
<Menu.Label>Add category</Menu.Label>
<Menu.Label>
{t('menu.addCategory')}
</Menu.Label>
<Menu.Item icon={<IconRowInsertTop size={20} />} onClick={addCategoryAbove}>
Add category above
{t('menu.addCategory') + ' ' + t('menu.addAbove')}
</Menu.Item>
<Menu.Item icon={<IconRowInsertBottom size={20} />} onClick={addCategoryBelow}>
Add category below
{t('menu.addCategory') + ' ' + t('menu.addBelow')}
</Menu.Item>
</Menu.Dropdown>
</Menu>