allow hiding context menu items

2026-06-10 22:32:17 +02:00 · 2024-08-26 21:35:12 -07:00
parent f746114041
commit 004c9a8d06
6 changed files with 100 additions and 1 deletions
@@ -0,0 +1,58 @@
+import { useTranslation } from 'react-i18next';
+import { SettingsOptions } from '/@/renderer/features/settings/components/settings-option';
+import { useState } from 'react';
+import { Button, Checkbox } from '/@/renderer/components';
+import { Divider, Stack } from '@mantine/core';
+import {
+    CONFIGURABLE_CONTEXT_MENU_ITEMS,
+    CONTEXT_MENU_ITEM_MAPPING,
+} from '/@/renderer/features/context-menu';
+import { useSettingsStore, useSettingsStoreActions } from '/@/renderer/store';
+
+export const ContextMenuSettings = () => {
+    const disabledItems = useSettingsStore((state) => state.general.disabledContextMenu);
+    const { toggleContextMenuItem } = useSettingsStoreActions();
+    const [open, setOpen] = useState(false);
+    const { t } = useTranslation();
+
+    return (
+        <>
+            <SettingsOptions
+                control={
+                    <Button
+                        compact
+                        variant="filled"
+                        onClick={() => setOpen(!open)}
+                    >
+                        {t(open ? 'common.close' : 'common.edit', { postProcess: 'titleCase' })}
+                    </Button>
+                }
+                description={t('setting.contextMenu', {
+                    context: 'description',
+                    postProcess: 'sentenceCase',
+                })}
+                title={t('setting.contextMenu', {
+                    postProcess: 'sentenceCase',
+                })}
+            />
+            {open && (
+                <Stack>
+                    {CONFIGURABLE_CONTEXT_MENU_ITEMS.map((item) => (
+                        <Checkbox
+                            key={item}
+                            checked={!disabledItems[item]}
+                            label={t(
+                                `page.contextMenu.${CONTEXT_MENU_ITEM_MAPPING[item] || item}`,
+                                {
+                                    postProcess: 'sentenceCase',
+                                },
+                            )}
+                            onChange={() => toggleContextMenuItem(item)}
+                        />
+                    ))}
+                </Stack>
+            )}
+            <Divider />
+        </>
+    );
+};