Add task and note create option in comand menu (#1115)

* add task and note create option in comand menu

* Re-run CIs

---------

Co-authored-by: Weiko <corentin@twenty.com>
Co-authored-by: Charles Bochet <charlesBochet@users.noreply.github.com>

front/src/sync-hooks/AppInternalHooks.tsx

@@ -1,9 +1,11 @@
+import { CommandMenuHook } from './CommandMenuHook';
 import { GotoHotkeysHooks } from './GotoHotkeysHooks';
 
 export function AppInternalHooks() {
   return (
     <>
       <GotoHotkeysHooks />
+      <CommandMenuHook />
     </>
   );
 }

front/src/sync-hooks/AuthAutoRouter.tsx

@@ -1,15 +1,20 @@
 import { useEffect, useState } from 'react';
-import { useLocation, useNavigate } from 'react-router-dom';
+import { matchPath, useLocation, useNavigate } from 'react-router-dom';
+import { IconCheckbox, IconNotes } from '@tabler/icons-react';
 
+import { useOpenCreateActivityDrawer } from '@/activities/hooks/useOpenCreateActivityDrawer';
 import { useEventTracker } from '@/analytics/hooks/useEventTracker';
 import { useOnboardingStatus } from '@/auth/hooks/useOnboardingStatus';
 import { OnboardingStatus } from '@/auth/utils/getOnboardingStatus';
+import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
+import { CommandType } from '@/command-menu/types/Command';
 import { AppBasePath } from '@/types/AppBasePath';
 import { AppPath } from '@/types/AppPath';
 import { PageHotkeyScope } from '@/types/PageHotkeyScope';
 import { SettingsPath } from '@/types/SettingsPath';
 import { TableHotkeyScope } from '@/ui/table/types/TableHotkeyScope';
 import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
+import { ActivityType, CommentableType } from '~/generated/graphql';
 
 import { useIsMatchingLocation } from '../hooks/useIsMatchingLocation';
 
@@ -27,6 +32,10 @@ export function AuthAutoRouter() {
 
   const eventTracker = useEventTracker();
 
+  const { addToCommandMenu, setToIntitialCommandMenu } = useCommandMenu();
+
+  const openCreateActivity = useOpenCreateActivityDrawer();
+
   useEffect(() => {
     if (!previousLocation || previousLocation !== location.pathname) {
       setPreviousLocation(location.pathname);
@@ -129,6 +138,75 @@ export function AuthAutoRouter() {
       }
     }
 
+    setToIntitialCommandMenu();
+    switch (true) {
+      case isMatchingLocation(AppPath.CompanyShowPage): {
+        const companyId = matchPath(
+          { path: '/companies/:id' },
+          location.pathname,
+        )?.params.id;
+
+        const entity = !!companyId
+          ? { id: companyId, type: CommentableType.Company }
+          : undefined;
+
+        addToCommandMenu([
+          {
+            to: '',
+            label: 'Create Task',
+            type: CommandType.Create,
+            icon: <IconCheckbox />,
+            onCommandClick: () => openCreateActivity(ActivityType.Task, entity),
+          },
+          {
+            to: '',
+            label: 'Create Note',
+            type: CommandType.Create,
+            icon: <IconNotes />,
+            onCommandClick: () => openCreateActivity(ActivityType.Note, entity),
+          },
+        ]);
+        break;
+      }
+      case isMatchingLocation(AppPath.PersonShowPage): {
+        const personId = matchPath({ path: '/person/:id' }, location.pathname)
+          ?.params.id;
+
+        const entity = !!personId
+          ? { id: personId, type: CommentableType.Person }
+          : undefined;
+
+        addToCommandMenu([
+          {
+            to: '',
+            label: 'Create Task',
+            type: CommandType.Create,
+            icon: <IconCheckbox />,
+            onCommandClick: () => openCreateActivity(ActivityType.Task, entity),
+          },
+          {
+            to: '',
+            label: 'Create Note',
+            type: CommandType.Create,
+            icon: <IconNotes />,
+            onCommandClick: () => openCreateActivity(ActivityType.Note, entity),
+          },
+        ]);
+        break;
+      }
+      default:
+        addToCommandMenu([
+          {
+            to: '',
+            label: 'Create Task',
+            type: CommandType.Create,
+            icon: <IconCheckbox />,
+            onCommandClick: () => openCreateActivity(ActivityType.Task),
+          },
+        ]);
+        break;
+    }
+
     setTimeout(() => {
       eventTracker('pageview', {
         location: {
@@ -144,6 +222,9 @@ export function AuthAutoRouter() {
     location,
     previousLocation,
     eventTracker,
+    addToCommandMenu,
+    openCreateActivity,
+    setToIntitialCommandMenu,
   ]);
 
   return <></>;

front/src/sync-hooks/CommandMenuHook.tsx

@@ -0,0 +1,13 @@
+import { useSetRecoilState } from 'recoil';
+
+import { commandMenuCommands } from '@/command-menu/constants/commandMenuCommands';
+import { commandMenuCommand } from '@/command-menu/states/commandMenuCommandsState';
+
+export function CommandMenuHook() {
+  const setCommands = useSetRecoilState(commandMenuCommand);
+
+  const commands = commandMenuCommands;
+  setCommands(commands);
+
+  return <></>;
+}