@nightkatana/kronosys-app 1.0.0-beta.21 → 1.0.0-beta.22

package/components/dashboard/AppShellToolbarCommandCenter.tsx

@@ -0,0 +1,225 @@
+"use client";
+
+import { useCallback, useMemo } from "react";
+import { useRouter } from "next/navigation";
+import { useKronosysPayload } from "@/components/KronosysPayloadProvider";
+import { postKronosysAction } from "@/lib/kronosysApi";
+import {
+  DashboardCommandCenter,
+  type DashboardCommandHandlers,
+} from "@/components/dashboard/DashboardCommandCenter";
+import type { DashboardStrings } from "@/lib/dashboardCopy";
+import type { Lang } from "@/lib/dashboardCopy";
+import { buildDashboardQuickSearchItems } from "@/lib/dashboardQuickSearch";
+import { parseTaskTemplatesFromPayload } from "@/lib/taskTemplateDraft";
+import { withDashboardSessionParam } from "@/lib/dashboardSessionNav";
+import { computeToolbarSessionSlices } from "@/lib/appShellToolbarSessionSlices";
+import {
+  stashAppShellDeferredNewSession,
+  stashAppShellDeferredScroll,
+  stashAppShellDeferredSessionListFocus,
+  stashAppShellDeferredTaskFocus,
+  stashAppShellDeferredTaskTemplateDraft,
+} from "@/lib/appShellToolbarDeferredIntents";
+
+type ToolbarLiveShape = { sessionId?: string };
+
+export type AppShellToolbarCommandCenterProps = Readonly<{
+  dt: DashboardStrings;
+  lang: Lang;
+  /** Valeur courante de `?session=` sur la page (navigation stable). */
+  dashboardSessionNavId: string | null;
+  onManualRefresh: () => void | Promise<unknown>;
+  toolbarDomId?: string;
+}>;
+
+export function AppShellToolbarCommandCenter({
+  dt,
+  lang,
+  dashboardSessionNavId,
+  onManualRefresh,
+  toolbarDomId,
+}: AppShellToolbarCommandCenterProps) {
+  const router = useRouter();
+  const { payload, refresh } = useKronosysPayload();
+
+  const navSessionTrim =
+    typeof dashboardSessionNavId === "string"
+      ? dashboardSessionNavId.trim()
+      : "";
+
+  const pushHome = useCallback(
+    (sessionId?: string | null) => {
+      void router.push(
+        withDashboardSessionParam(
+          "/",
+          typeof sessionId === "string" && sessionId.trim() !== ""
+            ? sessionId.trim()
+            : undefined,
+        ),
+      );
+    },
+    [router],
+  );
+
+  const postAndRefresh = useCallback(
+    async (body: Record<string, unknown>) => {
+      await postKronosysAction(body);
+      await refresh({ routerInvalidate: true });
+    },
+    [refresh],
+  );
+
+  const selectSessionAcrossApp = useCallback(
+    async (sessionId: string) => {
+      const { live } = computeToolbarSessionSlices(payload, navSessionTrim);
+      const liveSid =
+        typeof live?.sessionId === "string" ? live.sessionId.trim() : "";
+      const pickLive = sessionId === liveSid;
+      if (pickLive) {
+        await postKronosysAction({ type: "inspectSession", sessionId: null });
+        await postKronosysAction({ type: "setPaused", paused: false });
+      } else {
+        await postKronosysAction({ type: "inspectSession", sessionId });
+      }
+      await refresh({ routerInvalidate: true });
+      pushHome(pickLive ? null : sessionId);
+    },
+    [navSessionTrim, payload, pushHome, refresh],
+  );
+
+  const commandHandlers = useMemo(
+    (): DashboardCommandHandlers => ({
+      newSession: () => {
+        stashAppShellDeferredNewSession();
+        pushHome(navSessionTrim !== "" ? navSessionTrim : null);
+      },
+      refresh: () => void onManualRefresh(),
+      openReporting: () =>
+        void router.push(
+          withDashboardSessionParam("/reporting", navSessionTrim || undefined),
+        ),
+      openSettings: () =>
+        void router.push(
+          withDashboardSessionParam("/settings", navSessionTrim || undefined),
+        ),
+      openUserGuide: () =>
+        void router.push(
+          withDashboardSessionParam("/guide", navSessionTrim || undefined),
+        ),
+      focusSessions: () => {
+        stashAppShellDeferredScroll("sessions");
+        pushHome(navSessionTrim !== "" ? navSessionTrim : null);
+      },
+      focusTasks: () => {
+        stashAppShellDeferredScroll("tasks");
+        pushHome(navSessionTrim !== "" ? navSessionTrim : null);
+      },
+      focusTags: () => {
+        stashAppShellDeferredScroll("tags");
+        pushHome(navSessionTrim !== "" ? navSessionTrim : null);
+      },
+      toggleLang: () =>
+        void postAndRefresh({
+          type: "setLanguage",
+          lang: lang === "fr" ? "en" : "fr",
+        }),
+    }),
+    [lang, navSessionTrim, onManualRefresh, postAndRefresh, pushHome, router],
+  );
+
+  const { history, historyArchived, sessionCurrent, live } = useMemo(
+    () => computeToolbarSessionSlices(payload, navSessionTrim),
+    [navSessionTrim, payload],
+  );
+
+  const liveSearchContext =
+    live &&
+    typeof (live as ToolbarLiveShape).sessionId === "string" &&
+    (live as ToolbarLiveShape).sessionId!.trim() !== ""
+      ? {
+          sessionId: (live as ToolbarLiveShape).sessionId!.trim(),
+          sessionPaused: (live as { isPaused?: boolean }).isPaused === true,
+        }
+      : null;
+
+  const taskTemplatesForSearch = useMemo(
+    () =>
+      parseTaskTemplatesFromPayload(
+        (payload as Record<string, unknown> | null | undefined)?.taskTemplates,
+      ),
+    [payload],
+  );
+
+  const quickSearchItems = useMemo(
+    () =>
+      buildDashboardQuickSearchItems({
+        history,
+        historyArchived,
+        sessionCurrent,
+        dt,
+        liveSearchContext,
+        taskTemplates: taskTemplatesForSearch,
+        onSelectTaskTemplate: (draft) => {
+          stashAppShellDeferredTaskTemplateDraft(draft);
+          stashAppShellDeferredScroll("tasks");
+          const sid =
+            typeof (sessionCurrent as { sessionId?: string } | undefined)
+              ?.sessionId === "string"
+              ? (sessionCurrent as { sessionId: string }).sessionId.trim()
+              : typeof live?.sessionId === "string"
+              ? live.sessionId.trim()
+              : navSessionTrim !== ""
+              ? navSessionTrim
+              : "";
+          pushHome(sid !== "" ? sid : null);
+        },
+        onSelectSession: (id) => {
+          void selectSessionAcrossApp(id);
+        },
+        scrollToSession: (sessionId) => {
+          stashAppShellDeferredSessionListFocus(sessionId);
+          void selectSessionAcrossApp(sessionId);
+        },
+        focusTasksColumn: () => {
+          stashAppShellDeferredScroll("tasks");
+          pushHome(navSessionTrim !== "" ? navSessionTrim : null);
+        },
+        scrollToTask: (taskId) => {
+          stashAppShellDeferredTaskFocus(taskId);
+          stashAppShellDeferredScroll("tasks");
+          const sid =
+            typeof (sessionCurrent as { sessionId?: string } | undefined)
+              ?.sessionId === "string"
+              ? (sessionCurrent as { sessionId: string }).sessionId.trim()
+              : typeof live?.sessionId === "string"
+              ? live.sessionId.trim()
+              : navSessionTrim !== ""
+              ? navSessionTrim
+              : "";
+          pushHome(sid !== "" ? sid : null);
+        },
+      }),
+    [
+      dt,
+      history,
+      historyArchived,
+      live,
+      liveSearchContext,
+      navSessionTrim,
+      pushHome,
+      selectSessionAcrossApp,
+      sessionCurrent,
+      taskTemplatesForSearch,
+    ],
+  );
+
+  return (
+    <DashboardCommandCenter
+      dt={dt}
+      handlers={commandHandlers}
+      searchItems={quickSearchItems}
+      toolbarDomId={toolbarDomId}
+    />
+  );
+}

package/components/dashboard/AppShellToolbarRouteNav.tsx

@@ -0,0 +1,204 @@
+"use client";
+
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { usePathname, useRouter } from "next/navigation";
+import { useKronosysPayload } from "@/components/KronosysPayloadProvider";
+import { postKronosysAction } from "@/lib/kronosysApi";
+import { GlobalPauseConfirmModal } from "@/components/dashboard/GlobalPauseConfirmModal";
+import {
+  AppShellRouteNav,
+  type AppShellRouteNavCurrent,
+  type AppShellRouteNavLabels,
+} from "@/components/dashboard/AppShellRouteNav";
+import { withDashboardSessionParam } from "@/lib/dashboardSessionNav";
+import {
+  buildGlobalPauseActivationPreview,
+  isGlobalPauseActivationNoOp,
+} from "@/lib/globalPausePreview";
+import { readDashboardUse24HourClockFromCfg } from "@/lib/dashboardClockFormat";
+import { readDashboardTimeZoneFromCfg } from "@/lib/dashboardTimeZone";
+import type { DashboardStrings, Lang } from "@/lib/dashboardCopy";
+import { stashAppShellDeferredTodayGantt } from "@/lib/appShellToolbarDeferredIntents";
+
+type ToolbarLiveShape = {
+  sessionId?: string;
+  archived?: boolean;
+  globalPauseContext?: unknown;
+};
+
+export type AppShellToolbarRouteNavProps = Readonly<{
+  current: AppShellRouteNavCurrent;
+  labels: AppShellRouteNavLabels;
+  navAriaLabel: string;
+  dashboardSessionId?: string | null;
+  lang: Lang;
+  dt: DashboardStrings;
+  /** Tableau de bord : ouvre le Gantt « aujourd’hui » sans quitter la page. */
+  onOpenTodayGantt?: () => void;
+}>;
+
+export function AppShellToolbarRouteNav({
+  current,
+  labels,
+  navAriaLabel,
+  dashboardSessionId,
+  lang,
+  dt,
+  onOpenTodayGantt,
+}: AppShellToolbarRouteNavProps) {
+  const { payload, refresh } = useKronosysPayload();
+  const router = useRouter();
+  const pathname = usePathname() ?? "";
+  const isHome = pathname === "/" || pathname === "";
+  const [globalPauseConfirmOpen, setGlobalPauseConfirmOpen] = useState(false);
+
+  const live = payload?.current as ToolbarLiveShape | undefined;
+  const globalPauseContextActive = Boolean(
+    live && typeof live === "object" && live.globalPauseContext,
+  );
+  const globalPauseActivationPreview = useMemo(
+    () =>
+      live && typeof live === "object"
+        ? buildGlobalPauseActivationPreview(live as Record<string, unknown>)
+        : null,
+    [live],
+  );
+  const globalPauseNavDisabled = useMemo(
+    () =>
+      !globalPauseContextActive &&
+      globalPauseActivationPreview !== null &&
+      isGlobalPauseActivationNoOp(globalPauseActivationPreview),
+    [globalPauseActivationPreview, globalPauseContextActive],
+  );
+
+  const post = useCallback(
+    async (body: Record<string, unknown>) => {
+      await postKronosysAction(body);
+      await refresh({ routerInvalidate: true });
+    },
+    [refresh],
+  );
+
+  const onGlobalPauseNavPress = useCallback(() => {
+    if (globalPauseContextActive) {
+      void post({ type: "toggleGlobalPauseContext" });
+      return;
+    }
+    if (globalPauseNavDisabled) {
+      return;
+    }
+    setGlobalPauseConfirmOpen(true);
+  }, [globalPauseContextActive, globalPauseNavDisabled, post]);
+
+  const confirmGlobalPauseActivation = useCallback(() => {
+    setGlobalPauseConfirmOpen(false);
+    void post({ type: "toggleGlobalPauseContext" });
+  }, [post]);
+
+  const cancelGlobalPauseConfirm = useCallback(() => {
+    setGlobalPauseConfirmOpen(false);
+  }, []);
+
+  useEffect(() => {
+    if (globalPauseContextActive) {
+      setGlobalPauseConfirmOpen(false);
+    }
+  }, [globalPauseContextActive]);
+
+  useEffect(() => {
+    if (!live) {
+      setGlobalPauseConfirmOpen(false);
+    }
+  }, [live]);
+
+  const navSessionTrim =
+    typeof dashboardSessionId === "string" ? dashboardSessionId.trim() : "";
+
+  const ganttOnPress = useCallback(() => {
+    if (onOpenTodayGantt && isHome) {
+      onOpenTodayGantt();
+      return;
+    }
+    stashAppShellDeferredTodayGantt();
+    void router.push(
+      withDashboardSessionParam(
+        "/",
+        navSessionTrim !== "" ? navSessionTrim : undefined,
+      ),
+    );
+  }, [isHome, navSessionTrim, onOpenTodayGantt, router]);
+
+  const ganttControl = useMemo(
+    () => ({
+      label: labels.navGanttButtonLabel,
+      onPress: ganttOnPress,
+    }),
+    [ganttOnPress, labels.navGanttButtonLabel],
+  );
+
+  const globalPauseControl = useMemo(() => {
+    if (live && live.archived !== true) {
+      return {
+        active: globalPauseContextActive,
+        label: globalPauseContextActive
+          ? dt.appShellRouteNavGlobalResume
+          : dt.appShellRouteNavGlobalPause,
+        disabled: globalPauseNavDisabled,
+        disabledTooltip: dt.appShellRouteNavGlobalPauseDisabledTooltip,
+        onPress: onGlobalPauseNavPress,
+      };
+    }
+    return {
+      active: false,
+      label: labels.navGlobalPauseButtonLabel,
+      disabled: true,
+      disabledTooltip:
+        current === "dashboard"
+          ? labels.navGlobalPauseNoSessionContextTooltip
+          : labels.navGlobalPauseDashboardOnlyTooltip,
+      onPress: () => {},
+    };
+  }, [
+    current,
+    dt.appShellRouteNavGlobalPause,
+    dt.appShellRouteNavGlobalPauseDisabledTooltip,
+    dt.appShellRouteNavGlobalResume,
+    globalPauseContextActive,
+    globalPauseNavDisabled,
+    labels.navGlobalPauseButtonLabel,
+    labels.navGlobalPauseDashboardOnlyTooltip,
+    labels.navGlobalPauseNoSessionContextTooltip,
+    live,
+    onGlobalPauseNavPress,
+  ]);
+
+  const displayTimeZone = readDashboardTimeZoneFromCfg(
+    payload?.cfg as Record<string, unknown> | undefined,
+  );
+  const use24HourClock = readDashboardUse24HourClockFromCfg(
+    payload?.cfg as Record<string, unknown> | undefined,
+  );
+
+  return (
+    <>
+      <GlobalPauseConfirmModal
+        open={globalPauseConfirmOpen}
+        preview={globalPauseActivationPreview}
+        lang={lang}
+        displayTimeZone={displayTimeZone}
+        use24HourClock={use24HourClock}
+        t={dt}
+        onCancel={cancelGlobalPauseConfirm}
+        onConfirm={confirmGlobalPauseActivation}
+      />
+      <AppShellRouteNav
+        current={current}
+        labels={labels}
+        navAriaLabel={navAriaLabel}
+        dashboardSessionId={dashboardSessionId}
+        ganttControl={ganttControl}
+        globalPauseControl={globalPauseControl}
+      />
+    </>
+  );
+}