✨ Add generic menu for tiles

src/components/Dashboard/Tiles/GenericTileMenu.tsx

@@ -0,0 +1,57 @@
+import { ActionIcon, Menu } from '@mantine/core';
+import { IconDots, IconLayoutKanban, IconPencil, IconTrash } from '@tabler/icons';
+import { useTranslation } from 'next-i18next';
+import { useEditModeStore } from '../Views/useEditModeStore';
+
+interface GenericTileMenuProps {
+  handleClickEdit: () => void;
+  handleClickChangePosition: () => void;
+  handleClickDelete: () => void;
+  displayEdit: boolean;
+}
+
+export const GenericTileMenu = ({
+  handleClickEdit,
+  handleClickChangePosition,
+  handleClickDelete,
+  displayEdit,
+}: GenericTileMenuProps) => {
+  const { t } = useTranslation('common');
+  const isEditMode = useEditModeStore((x) => x.enabled);
+
+  if (!isEditMode) {
+    return null;
+  }
+
+  return (
+    <Menu withinPortal>
+      <Menu.Target>
+        <ActionIcon pos="absolute" top={4} right={4}>
+          <IconDots />
+        </ActionIcon>
+      </Menu.Target>
+      <Menu.Dropdown w={250}>
+        <Menu.Label>{t('sections.settings')}</Menu.Label>
+        {displayEdit && (
+          <Menu.Item icon={<IconPencil size={16} stroke={1.5} />} onClick={handleClickEdit}>
+            {t('actions.edit')}
+          </Menu.Item>
+        )}
+        <Menu.Item
+          icon={<IconLayoutKanban size={16} stroke={1.5} />}
+          onClick={handleClickChangePosition}
+        >
+          {t('actions.changePosition')}
+        </Menu.Item>
+        <Menu.Label>{t('sections.dangerZone')}</Menu.Label>
+        <Menu.Item
+          color="red"
+          icon={<IconTrash size={16} stroke={1.5} color="red" />}
+          onClick={handleClickDelete}
+        >
+          {t('actions.remove')}
+        </Menu.Item>
+      </Menu.Dropdown>
+    </Menu>
+  );
+};