npm - @nightkatana/kronosys-app - Versions diffs - 1.0.0-beta.2 → 1.0.0-beta.21 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (112) hide show

package/README.md +28 -1
package/app/api/action/route.ts +39 -3
package/app/api/action-logs/route.ts +24 -0
package/app/api/backup/route.ts +1 -1
package/app/api/restore/route.ts +145 -0
package/app/changelog/page.tsx +71 -4
package/app/globals.css +127 -0
package/app/guide/page.tsx +61 -15
package/app/implementation/page.tsx +700 -0
package/app/layout.tsx +14 -3
package/app/licenses/page.tsx +99 -37
package/app/logs/page.tsx +258 -0
package/app/manifest.ts +5 -5
package/app/page.tsx +784 -229
package/app/reporting/page.tsx +1266 -474
package/app/settings/page.tsx +252 -18
package/bin/kronosys.mjs +140 -15
package/components/KronosysPayloadProvider.tsx +2 -0
package/components/RouteTransition.tsx +18 -0
package/components/dashboard/AppShellCommandCenterPlaceholder.tsx +17 -0
package/components/dashboard/AppShellHeaderSessionMeta.tsx +210 -0
package/components/dashboard/AppShellHeaderWallClock.tsx +54 -0
package/components/dashboard/AppShellLiveSessionDrawer.tsx +154 -38
package/components/dashboard/AppShellRouteNav.tsx +323 -48
package/components/dashboard/DashboardPauseBackdrop.tsx +50 -0
package/components/dashboard/DashboardSimpleModal.tsx +168 -25
package/components/dashboard/DashboardTour.tsx +115 -29
package/components/dashboard/GlobalPauseConfirmModal.tsx +183 -0
package/components/dashboard/KronosysDatetimePopoverField.tsx +167 -122
package/components/dashboard/KronosysTimePopoverField.tsx +54 -12
package/components/dashboard/NewSessionScopeModal.tsx +211 -20
package/components/dashboard/PlannedTaskBoundaryConflictWatcher.tsx +275 -0
package/components/dashboard/ReportingTour.tsx +87 -21
package/components/dashboard/SavedProjectPicker.tsx +16 -3
package/components/dashboard/SelectedSessionSidebarBlock.tsx +512 -142
package/components/dashboard/SessionListPanel.tsx +327 -44
package/components/dashboard/SettingsTagsProjectsSection.tsx +1073 -264
package/components/dashboard/SettingsTaskTemplatesSection.tsx +316 -0
package/components/dashboard/SettingsTour.tsx +86 -21
package/components/dashboard/TagPills.tsx +14 -1
package/components/dashboard/TaskFocusPanel.tsx +1081 -478
package/components/dashboard/TaskSessionLiveCard.tsx +650 -135
package/components/dashboard/TaskTimelineGanttModal.tsx +601 -0
package/components/dashboard/taskFieldStyles.ts +20 -4
package/components/dashboard/useReportingInteractionState.ts +80 -0
package/lib/appShellHeaderClasses.ts +13 -0
package/lib/businessRulesMatrix.ts +210 -0
package/lib/copyToClipboard.ts +43 -0
package/lib/dashboardCopy.ts +494 -84
package/lib/dashboardQuickSearch.ts +54 -2
package/lib/dashboardTimeZone.ts +109 -0
package/lib/formatAppShellWallClock.ts +66 -0
package/lib/formatSessionNameTemplate.ts +141 -0
package/lib/generatedUserChangelog.ts +177 -6
package/lib/globalPausePreview.ts +292 -0
package/lib/implementationNotes.ts +1188 -0
package/lib/kronosysApi.ts +6 -0
package/lib/kronosysDashboardModalGates.ts +24 -0
package/lib/plannedBoundaryAttention.ts +9 -0
package/lib/plannedBoundaryConflict.ts +23 -0
package/lib/reportingAggregate.ts +517 -75
package/lib/reportingMetricHelp.ts +8 -0
package/lib/reportingStrings.ts +37 -3
package/lib/sessionListMerge.ts +4 -0
package/lib/sessionTaskSidebarStats.ts +182 -21
package/lib/settingsCopy.ts +178 -4
package/lib/taskParsing.ts +360 -103
package/lib/taskTemplateDraft.ts +135 -0
package/lib/taskTimelineGantt.ts +265 -0
package/lib/temporalDisplayPlanned.ts +71 -0
package/lib/userGuideCopy.ts +121 -47
package/next.config.ts +7 -0
package/package.json +12 -24
package/server/actionDispatch.ts +1000 -77
package/server/actionTaskSession.ts +337 -24
package/server/db.ts +7 -15
package/server/dbSchema.ts +24 -0
package/server/defaultCfg.ts +5 -0
package/server/gitlabTokenStore.ts +0 -12
package/server/liveHistorySync.ts +53 -0
package/server/mainTimerHydrate.ts +38 -2
package/server/payloadStore.ts +33 -11
package/server/sessionWallHydrate.ts +66 -3
package/server/userActionLog.ts +126 -0
package/sonar-project.properties +11 -0
package/tsconfig.json +2 -1
package/components/dashboard/IssuePickerModal.tsx +0 -168
package/components/dashboard/ThemeToggle.test.tsx +0 -26
package/lib/backupCsvExport.test.ts +0 -149
package/lib/dashboardQuickSearchQuery.test.ts +0 -63
package/lib/dataDir.test.ts +0 -87
package/lib/formatIsoShort.test.ts +0 -46
package/lib/kronoFocusRhythm.test.ts +0 -130
package/lib/kronoFocusTimerUrgency.test.ts +0 -74
package/lib/legacyKronoFocusStorageKeys.test.ts +0 -29
package/lib/reportingAggregate.test.ts +0 -325
package/lib/reportingNonFinalIndicators.test.ts +0 -157
package/lib/reportingTagWeekBreakdown.test.ts +0 -141
package/lib/reportingWeekLayout.test.ts +0 -239
package/lib/sessionAssiduity.test.ts +0 -25
package/lib/sessionEndWarnings.test.ts +0 -200
package/lib/sessionListMerge.test.ts +0 -101
package/lib/sessionTaskSidebarStats.test.ts +0 -24
package/lib/taskParsing.test.ts +0 -153
package/lib/usageProfile.test.ts +0 -84
package/server/actionDispatch.test.ts +0 -723
package/server/actionTaskSession.test.ts +0 -713
package/server/kronoFocusHydrate.test.ts +0 -142
package/server/kronoFocusMigrate.test.ts +0 -53
package/server/mainTimerHydrate.test.ts +0 -65
package/server/payloadStore.test.ts +0 -78
package/server/sessionWallHydrate.test.ts +0 -46

package/app/layout.tsx CHANGED Viewed

@@ -7,6 +7,8 @@ import { KronosysPackageVersionProvider } from "@/components/KronosysPackageVers
 import { DashboardToastProvider } from "@/components/dashboard/DashboardToastProvider";
 import { KronosysPayloadProvider } from "@/components/KronosysPayloadProvider";
 import { AppShellLiveSessionDrawer } from "@/components/dashboard/AppShellLiveSessionDrawer";
+import { PlannedTaskBoundaryConflictWatcher } from "@/components/dashboard/PlannedTaskBoundaryConflictWatcher";
+import { RouteTransition } from "@/components/RouteTransition";
 import { readKronosysPackageVersion } from "@/lib/readKronosysPackageVersion";
 import { getThemeBootstrapScript } from "@/lib/theme";
 import "./globals.css";
@@ -27,7 +29,11 @@ export const metadata: Metadata = {
     "Kronosys : sessions, tâches, KronoFocus — application web locale (Next.js + SQLite).",
   applicationName: "Kronosys Dashboard",
   icons: {
-    icon: [{ url: "/icon-192.png", sizes: "192x192", type: "image/png" }, { url: "/icon-512.png", sizes: "512x512", type: "image/png" }],
+    icon: [
+      { url: "/icon-512.png", sizes: "512x512", type: "image/png" },
+      { url: "/icon-192.png", sizes: "192x192", type: "image/png" },
+    ],
+    shortcut: [{ url: "/icon-512.png", sizes: "512x512", type: "image/png" }],
     apple: [{ url: "/apple-icon.png", sizes: "180x180", type: "image/png" }],
   },
   appleWebApp: {
@@ -58,13 +64,18 @@ export default function RootLayout({
       suppressHydrationWarning
     >
       <body className="flex min-h-full flex-col font-sans">
-        <script dangerouslySetInnerHTML={{ __html: getThemeBootstrapScript() }} />
+        <script
+          dangerouslySetInnerHTML={{ __html: getThemeBootstrapScript() }}
+        />
         <ThemeProvider>
           <KronosysPackageVersionProvider version={kronosysPackageVersion}>
             <DashboardToastProvider>
               <KronosysPayloadProvider>
+                <PlannedTaskBoundaryConflictWatcher />
                 <PwaRegister />
-                <div className="flex min-h-full flex-1 flex-col">{children}</div>
+                <div className="flex min-h-full flex-1 flex-col">
+                  <RouteTransition>{children}</RouteTransition>
+                </div>
                 <AppShellLiveSessionDrawer />
                 <SiteLegalFooter />
               </KronosysPayloadProvider>

package/app/licenses/page.tsx CHANGED Viewed

@@ -8,8 +8,17 @@ import { ScrollToTopFab } from "@/components/dashboard/ScrollToTopFab";
 import { ThemeToggle } from "@/components/dashboard/ThemeToggle";
 import { PageRefreshButton } from "@/components/dashboard/PageRefreshButton";
 import { AppShellRouteNav } from "@/components/dashboard/AppShellRouteNav";
+import { useKronosysPayload } from "@/components/KronosysPayloadProvider";
 import { dashboardStrings, type Lang } from "@/lib/dashboardCopy";
-import { appShellHeaderClassName, appShellHeaderToolRowClassName } from "@/lib/appShellHeaderClasses";
+import {
+  appShellHeaderClassName,
+  appShellHeaderTitleMetaRowClassName,
+  appShellHeaderToolbarClassName,
+} from "@/lib/appShellHeaderClasses";
+import { AppShellCommandCenterPlaceholder } from "@/components/dashboard/AppShellCommandCenterPlaceholder";
+import { AppShellHeaderSessionMeta } from "@/components/dashboard/AppShellHeaderSessionMeta";
+import { AppShellHeaderWallClock } from "@/components/dashboard/AppShellHeaderWallClock";
+import { LanguageMenu } from "@/components/dashboard/LanguageMenu";
 import { reportingNav } from "@/lib/reportingStrings";
 import {
   DASHBOARD_DEV_THIRD_PARTY,
@@ -23,6 +32,7 @@ import { withDashboardSessionParam } from "@/lib/dashboardSessionNav";
 function LicensesBody() {
   const router = useRouter();
   const searchParams = useSearchParams();
+  const { payload } = useKronosysPayload();
   const dashboardSessionNavId = searchParams.get("session");
   const lang: LicensesLang = searchParams.get("lang") === "en" ? "en" : "fr";
   const c = useMemo(() => licensesCopy(lang), [lang]);
@@ -32,7 +42,7 @@ function LicensesBody() {
   return (
     <div className="min-h-screen bg-zinc-100 text-zinc-900 dark:bg-zinc-900 dark:text-zinc-100">
       <header className={appShellHeaderClassName}>
-        <div className={appShellHeaderToolRowClassName}>
+        <div className={appShellHeaderTitleMetaRowClassName}>
           <div className="flex min-w-0 flex-col gap-1">
             <div className="flex min-w-0 flex-wrap items-baseline gap-x-2 gap-y-0.5">
               <Link
@@ -42,7 +52,9 @@ function LicensesBody() {
                 Kronosys
               </Link>
               <span className="text-zinc-400 dark:text-zinc-600">/</span>
-              <span className="text-lg font-medium text-zinc-700 dark:text-zinc-300">{c.title}</span>
+              <span className="text-lg font-medium text-zinc-700 dark:text-zinc-300">
+                {c.title}
+              </span>
             </div>
             <p className="flex flex-wrap items-center gap-x-2 text-xs font-medium leading-snug text-zinc-500 dark:text-zinc-400">
               <span>{dt.brandTagline}</span>
@@ -52,14 +64,20 @@ function LicensesBody() {
               <AppVersionStamp ariaLabelTemplate={dt.appVersionAriaLabel} />
             </p>
           </div>
-          <div className="flex flex-wrap items-center gap-1.5 text-sm">
+          <AppShellHeaderSessionMeta payload={payload} dt={dt} />
+        </div>
+        <div className="flex w-full justify-end">
+          <div className={appShellHeaderToolbarClassName}>
+            <AppShellHeaderWallClock lang={lang as Lang} dt={dt} />
+            <AppShellCommandCenterPlaceholder />
             <AppShellRouteNav
               current="licenses"
               labels={{ ...nav, licenses: c.title }}
               navAriaLabel={dt.appShellRouteNavAria}
               dashboardSessionId={dashboardSessionNavId}
+              reserveGlobalPauseSlot
             />
-            <ThemeToggle lang={lang} />
+            <ThemeToggle lang={lang as Lang} />
             <PageRefreshButton
               title={dt.pageRefreshTitle}
               ariaLabel={dt.pageRefreshAriaLabel}
@@ -72,21 +90,28 @@ function LicensesBody() {
                 router.refresh();
               }}
             />
-            <span className="hidden h-4 w-px bg-zinc-300 dark:bg-zinc-700 sm:inline-block" aria-hidden />
-            <Link
-              href={withDashboardSessionParam("/licenses", dashboardSessionNavId)}
-              className={`rounded-md px-3 py-1.5 ${lang === "fr" ? "border border-violet-600/60 bg-violet-950/40 text-violet-100" : "border border-zinc-700 bg-zinc-900 text-zinc-200 hover:border-zinc-500"}`}
-              hrefLang="fr"
-            >
-              Français
-            </Link>
-            <Link
-              href={withDashboardSessionParam("/licenses?lang=en", dashboardSessionNavId)}
-              className={`rounded-md px-3 py-1.5 ${lang === "en" ? "border border-violet-600/60 bg-violet-950/40 text-violet-100" : "border border-zinc-700 bg-zinc-900 text-zinc-200 hover:border-zinc-500"}`}
-              hrefLang="en"
-            >
-              English
-            </Link>
+            <LanguageMenu
+              lang={lang as Lang}
+              labelEn="English"
+              labelFr="Français"
+              menuHeading={lang === "fr" ? "Langue" : "Language"}
+              triggerAriaLabel={
+                lang === "fr" ? "Langue de l’interface" : "Interface language"
+              }
+              onSelect={(next) => {
+                const path =
+                  next === "en"
+                    ? withDashboardSessionParam(
+                        "/licenses?lang=en",
+                        dashboardSessionNavId,
+                      )
+                    : withDashboardSessionParam(
+                        "/licenses",
+                        dashboardSessionNavId,
+                      );
+                router.push(path);
+              }}
+            />
           </div>
         </div>
       </header>
@@ -95,13 +120,22 @@ function LicensesBody() {
         <p className="text-sm leading-relaxed text-zinc-400">{c.intro}</p>
         <section className="mt-10" aria-labelledby="lic-kronosys-product">
-          <h2 id="lic-kronosys-product" className="text-base font-semibold text-zinc-200">
+          <h2
+            id="lic-kronosys-product"
+            className="text-base font-semibold text-zinc-200"
+          >
             {c.kronosysSectionTitle}
           </h2>
-          <p className="mt-2 text-sm leading-relaxed text-zinc-400">{c.kronosysProduct}</p>
-          <p className="mt-2 text-sm font-medium text-zinc-300">{c.copyrightLine}</p>
+          <p className="mt-2 text-sm leading-relaxed text-zinc-400">
+            {c.kronosysProduct}
+          </p>
+          <p className="mt-2 text-sm font-medium text-zinc-300">
+            {c.copyrightLine}
+          </p>
-          <h3 className="mt-6 text-sm font-semibold uppercase tracking-wide text-zinc-500">{c.mitHeading}</h3>
+          <h3 className="mt-6 text-sm font-semibold uppercase tracking-wide text-zinc-500">
+            {c.mitHeading}
+          </h3>
           <pre className="mt-3 overflow-x-auto rounded-lg border border-zinc-800 bg-zinc-900/60 p-4 text-xs leading-relaxed whitespace-pre-wrap text-zinc-300">
             {KRONOSYS_MIT_LICENSE_BODY}
           </pre>
@@ -115,16 +149,27 @@ function LicensesBody() {
             <table className="w-full min-w-[20rem] text-left text-sm">
               <thead className="border-b border-zinc-800 bg-zinc-900/50 text-xs uppercase text-zinc-500">
                 <tr>
-                  <th className="px-3 py-2 font-medium">{c.thirdPartyColName}</th>
-                  <th className="px-3 py-2 font-medium">{c.thirdPartyColLicense}</th>
-                  <th className="px-3 py-2 font-medium">{c.thirdPartyColLink}</th>
+                  <th className="px-3 py-2 font-medium">
+                    {c.thirdPartyColName}
+                  </th>
+                  <th className="px-3 py-2 font-medium">
+                    {c.thirdPartyColLicense}
+                  </th>
+                  <th className="px-3 py-2 font-medium">
+                    {c.thirdPartyColLink}
+                  </th>
                 </tr>
               </thead>
               <tbody>
                 {DASHBOARD_THIRD_PARTY.map((row) => (
-                  <tr key={row.name} className="border-b border-zinc-800/80 last:border-0">
+                  <tr
+                    key={row.name}
+                    className="border-b border-zinc-800/80 last:border-0"
+                  >
                     <td className="px-3 py-2.5 text-zinc-200">{row.name}</td>
-                    <td className="px-3 py-2.5 font-mono text-xs text-zinc-400">{row.license}</td>
+                    <td className="px-3 py-2.5 font-mono text-xs text-zinc-400">
+                      {row.license}
+                    </td>
                     <td className="px-3 py-2.5">
                       <a
                         href={row.url}
@@ -150,16 +195,27 @@ function LicensesBody() {
             <table className="w-full min-w-[20rem] text-left text-sm">
               <thead className="border-b border-zinc-800 bg-zinc-900/50 text-xs uppercase text-zinc-500">
                 <tr>
-                  <th className="px-3 py-2 font-medium">{c.thirdPartyColName}</th>
-                  <th className="px-3 py-2 font-medium">{c.thirdPartyColLicense}</th>
-                  <th className="px-3 py-2 font-medium">{c.thirdPartyColLink}</th>
+                  <th className="px-3 py-2 font-medium">
+                    {c.thirdPartyColName}
+                  </th>
+                  <th className="px-3 py-2 font-medium">
+                    {c.thirdPartyColLicense}
+                  </th>
+                  <th className="px-3 py-2 font-medium">
+                    {c.thirdPartyColLink}
+                  </th>
                 </tr>
               </thead>
               <tbody>
                 {DASHBOARD_DEV_THIRD_PARTY.map((row) => (
-                  <tr key={row.name} className="border-b border-zinc-800/80 last:border-0">
+                  <tr
+                    key={row.name}
+                    className="border-b border-zinc-800/80 last:border-0"
+                  >
                     <td className="px-3 py-2.5 text-zinc-200">{row.name}</td>
-                    <td className="px-3 py-2.5 font-mono text-xs text-zinc-400">{row.license}</td>
+                    <td className="px-3 py-2.5 font-mono text-xs text-zinc-400">
+                      {row.license}
+                    </td>
                     <td className="px-3 py-2.5">
                       <a
                         href={row.url}
@@ -181,7 +237,9 @@ function LicensesBody() {
           <h2 id="lic-fonts" className="text-base font-semibold text-zinc-200">
             {c.fontsSectionTitle}
           </h2>
-          <p className="mt-2 text-sm leading-relaxed text-zinc-400">{c.fontsBody}</p>
+          <p className="mt-2 text-sm leading-relaxed text-zinc-400">
+            {c.fontsBody}
+          </p>
           <ul className="mt-3 list-inside list-disc text-sm text-zinc-400">
             <li>
               <a
@@ -220,13 +278,17 @@ function LicensesBody() {
           <h2 id="lic-ext" className="text-base font-semibold text-zinc-200">
             {c.extensionSectionTitle}
           </h2>
-          <p className="mt-2 text-sm leading-relaxed text-zinc-400">{c.extensionNote}</p>
+          <p className="mt-2 text-sm leading-relaxed text-zinc-400">
+            {c.extensionNote}
+          </p>
         </section>
         <p className="mt-8 text-xs text-zinc-600">{c.disclaimer}</p>
       </main>
-      <ScrollToTopFab ariaLabel={lang === "fr" ? "Retour en haut de la page" : "Back to top"} />
+      <ScrollToTopFab
+        ariaLabel={lang === "fr" ? "Retour en haut de la page" : "Back to top"}
+      />
     </div>
   );
 }

package/app/logs/page.tsx ADDED Viewed

@@ -0,0 +1,258 @@
+"use client";
+import { Suspense, useCallback, useEffect, useMemo, useState } from "react";
+import Link from "next/link";
+import { useSearchParams } from "next/navigation";
+import { Logs } from "lucide-react";
+import { useKronosysPayload } from "@/components/KronosysPayloadProvider";
+import { postKronosysAction } from "@/lib/kronosysApi";
+import { AppVersionStamp } from "@/components/dashboard/AppVersionStamp";
+import {
+  appShellHeaderClassName,
+  appShellHeaderTitleMetaRowClassName,
+  appShellHeaderToolbarClassName,
+} from "@/lib/appShellHeaderClasses";
+import { AppShellCommandCenterPlaceholder } from "@/components/dashboard/AppShellCommandCenterPlaceholder";
+import { AppShellHeaderSessionMeta } from "@/components/dashboard/AppShellHeaderSessionMeta";
+import { AppShellHeaderWallClock } from "@/components/dashboard/AppShellHeaderWallClock";
+import { AppShellRouteNav } from "@/components/dashboard/AppShellRouteNav";
+import { ThemeToggle } from "@/components/dashboard/ThemeToggle";
+import { PageRefreshButton } from "@/components/dashboard/PageRefreshButton";
+import { LanguageMenu } from "@/components/dashboard/LanguageMenu";
+import { dashboardStrings, type Lang } from "@/lib/dashboardCopy";
+import { withDashboardSessionParam } from "@/lib/dashboardSessionNav";
+import { reportingNav, reportingStrings } from "@/lib/reportingStrings";
+type ActionLogRow = {
+  id: number;
+  createdAt: string;
+  actionType: string;
+  ok: boolean;
+  sourceIp: string | null;
+  userAgent: string | null;
+  sessionId: string | null;
+  payloadJson: string | null;
+};
+type LiveShape = { language?: string };
+function LogsContent() {
+  const searchParams = useSearchParams();
+  const dashboardSessionNavId = searchParams.get("session");
+  const { payload, refresh } = useKronosysPayload();
+  const live = payload?.current as LiveShape | undefined;
+  const lang: Lang = live?.language === "fr" ? "fr" : "en";
+  const dt = dashboardStrings(lang);
+  const nav = useMemo(() => reportingNav(lang), [lang]);
+  const t = reportingStrings(lang);
+  const [logs, setLogs] = useState<ActionLogRow[]>([]);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const labels = useMemo(
+    () =>
+      lang === "fr"
+        ? {
+            title: "Journal des actions",
+            subtitle: "Historique des actions utilisateur enregistrées côté serveur.",
+            refresh: "Rafraîchir",
+            empty: "Aucune action enregistrée.",
+            action: "Action",
+            status: "Statut",
+            date: "Date",
+            sourceIp: "IP source",
+            session: "Session",
+            ok: "OK",
+            failed: "Échec",
+            unknown: "—",
+          }
+        : {
+            title: "Action logs",
+            subtitle: "History of user actions recorded on the server.",
+            refresh: "Refresh",
+            empty: "No action logs available.",
+            action: "Action",
+            status: "Status",
+            date: "Date",
+            sourceIp: "Source IP",
+            session: "Session",
+            ok: "OK",
+            failed: "Failed",
+            unknown: "—",
+          },
+    [lang]
+  );
+  const loadLogs = useCallback(async () => {
+    setLoading(true);
+    setError(null);
+    try {
+      const res = await fetch(withDashboardSessionParam("/api/action-logs?limit=200", dashboardSessionNavId), {
+        cache: "no-store",
+      });
+      if (!res.ok) {
+        throw new Error(`HTTP ${res.status}`);
+      }
+      const body = (await res.json()) as { ok?: boolean; logs?: ActionLogRow[] };
+      setLogs(Array.isArray(body.logs) ? body.logs : []);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : String(e));
+    } finally {
+      setLoading(false);
+    }
+  }, [dashboardSessionNavId]);
+  useEffect(() => {
+    void loadLogs();
+  }, [loadLogs]);
+  const postLang = async (next: Lang) => {
+    await postKronosysAction({ type: "setLanguage", lang: next });
+    await refresh();
+  };
+  return (
+    <div className="min-h-screen bg-zinc-100 text-zinc-900 dark:bg-zinc-900 dark:text-zinc-100">
+      <header className={appShellHeaderClassName}>
+        <div className={appShellHeaderTitleMetaRowClassName}>
+          <div className="flex min-w-0 flex-col gap-1">
+            <div className="flex min-w-0 flex-wrap items-baseline gap-x-2 gap-y-0.5">
+              <Link
+                href={withDashboardSessionParam("/", dashboardSessionNavId)}
+                className="text-xl font-semibold tracking-tight text-zinc-900 hover:text-violet-700 dark:text-zinc-100 dark:hover:text-violet-300"
+              >
+                Kronosys
+              </Link>
+              <span className="text-zinc-400 dark:text-zinc-600" aria-hidden>
+                /
+              </span>
+              <span className="text-lg font-medium text-zinc-700 dark:text-zinc-300">
+                {labels.title}
+              </span>
+              <span
+                className="inline-flex items-center text-violet-500 dark:text-violet-400"
+                aria-hidden
+              >
+                <Logs className="size-5" strokeWidth={2} />
+              </span>
+            </div>
+            <p className="flex flex-wrap items-center gap-x-2 text-xs font-medium leading-snug text-zinc-500 dark:text-zinc-400">
+              <span>{dt.brandTagline}</span>
+              <span className="text-zinc-400/70 dark:text-zinc-600" aria-hidden>
+                ·
+              </span>
+              <AppVersionStamp ariaLabelTemplate={dt.appVersionAriaLabel} />
+            </p>
+          </div>
+          <AppShellHeaderSessionMeta payload={payload} dt={dt} />
+        </div>
+        <div className="flex w-full justify-end">
+          <div className={appShellHeaderToolbarClassName}>
+            <AppShellHeaderWallClock lang={lang} dt={dt} />
+            <AppShellCommandCenterPlaceholder />
+            <AppShellRouteNav
+              current="logs"
+              labels={nav}
+              navAriaLabel={dt.appShellRouteNavAria}
+              dashboardSessionId={dashboardSessionNavId}
+              reserveGlobalPauseSlot
+            />
+            <ThemeToggle lang={lang} />
+            <PageRefreshButton
+              title={dt.pageRefreshTitle}
+              ariaLabel={dt.pageRefreshAriaLabel}
+              inlineMessages={{
+                loading: dt.pageRefreshProgressLabel,
+                success: dt.pageRefreshDoneToast,
+                error: dt.pageRefreshFailedToast,
+              }}
+              onRefresh={async () => {
+                await loadLogs();
+                return await refresh({ routerInvalidate: true });
+              }}
+            />
+            <LanguageMenu
+              lang={lang}
+              labelEn="English"
+              labelFr="Français"
+              menuHeading={lang === "fr" ? "Langue" : "Language"}
+              triggerAriaLabel={
+                lang === "fr" ? "Langue de l’interface" : "Interface language"
+              }
+              onSelect={(next) => void postLang(next)}
+            />
+          </div>
+        </div>
+      </header>
+      <main className="mx-auto w-full max-w-[1200px] px-5 pb-16 pt-6 sm:px-8 lg:px-10">
+        <p className="text-sm text-zinc-600 dark:text-zinc-400">{labels.subtitle}</p>
+        <div className="mt-4">
+          <button
+            type="button"
+            onClick={() => void loadLogs()}
+            disabled={loading}
+            className="rounded-md border border-zinc-300 bg-white px-3 py-1.5 text-sm font-medium text-zinc-700 hover:bg-zinc-50 disabled:cursor-wait disabled:opacity-60 dark:border-zinc-600 dark:bg-zinc-800 dark:text-zinc-200"
+          >
+            {loading ? t.loading : labels.refresh}
+          </button>
+        </div>
+        {error ? (
+          <p className="mt-4 text-sm text-red-600 dark:text-red-400">{error}</p>
+        ) : null}
+        <div className="mt-4 overflow-x-auto rounded-xl border border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-800/70">
+          <table className="w-full min-w-[900px] text-left text-sm">
+            <thead className="bg-zinc-50 dark:bg-zinc-800/90">
+              <tr className="text-zinc-600 dark:text-zinc-300">
+                <th className="px-3 py-2">{labels.date}</th>
+                <th className="px-3 py-2">{labels.action}</th>
+                <th className="px-3 py-2">{labels.status}</th>
+                <th className="px-3 py-2">{labels.sourceIp}</th>
+                <th className="px-3 py-2">{labels.session}</th>
+              </tr>
+            </thead>
+            <tbody>
+              {logs.length === 0 ? (
+                <tr>
+                  <td colSpan={5} className="px-3 py-4 text-zinc-500 dark:text-zinc-400">
+                    {loading ? t.loading : labels.empty}
+                  </td>
+                </tr>
+              ) : (
+                logs.map((row) => (
+                  <tr
+                    key={row.id}
+                    className="border-t border-zinc-200 text-zinc-700 dark:border-zinc-700 dark:text-zinc-200"
+                  >
+                    <td className="px-3 py-2">{new Date(row.createdAt).toLocaleString()}</td>
+                    <td className="px-3 py-2 font-mono text-xs">{row.actionType}</td>
+                    <td className="px-3 py-2">{row.ok ? labels.ok : labels.failed}</td>
+                    <td className="px-3 py-2">{row.sourceIp ?? labels.unknown}</td>
+                    <td className="px-3 py-2 font-mono text-xs">{row.sessionId ?? labels.unknown}</td>
+                  </tr>
+                ))
+              )}
+            </tbody>
+          </table>
+        </div>
+      </main>
+    </div>
+  );
+}
+export default function LogsPage() {
+  return (
+    <Suspense
+      fallback={
+        <div className="min-h-screen bg-zinc-100 px-6 py-10 text-sm text-zinc-500 dark:bg-zinc-900">
+          Kronosys…
+        </div>
+      }
+    >
+      <LogsContent />
+    </Suspense>
+  );
+}

package/app/manifest.ts CHANGED Viewed

@@ -16,14 +16,14 @@ export default function manifest(): MetadataRoute.Manifest {
     categories: ["productivity", "developer"],
     icons: [
       {
-        src: "/icon-192.png",
-        sizes: "192x192",
+        src: "/icon-512.png",
+        sizes: "512x512",
         type: "image/png",
-        purpose: "any",
+        purpose: "maskable",
       },
       {
-        src: "/icon-512.png",
-        sizes: "512x512",
+        src: "/icon-192.png",
+        sizes: "192x192",
         type: "image/png",
         purpose: "any",
       },