feat(dashboard): activity feed and KPI panels
This commit is contained in:
@@ -195,7 +195,7 @@
|
|||||||
|
|
||||||
**Status:** ✅ Done. `placeholder-parser.ts` uses JSZip to read all `word/*.xml` files from the .docx ZIP, searches for `{{...}}` patterns in both raw XML and stripped text (handles Word’s split-run encoding). Form now has: “Alege fișier .docx” button (local file picker, most reliable — no CORS) and a Wand icon on the URL field for URL-based detection (may fail on CORS). Parsing spinner shown during detection. Detected placeholders auto-populate the field. Build ok, pushed.
|
**Status:** ✅ Done. `placeholder-parser.ts` uses JSZip to read all `word/*.xml` files from the .docx ZIP, searches for `{{...}}` patterns in both raw XML and stripped text (handles Word’s split-run encoding). Form now has: “Alege fișier .docx” button (local file picker, most reliable — no CORS) and a Wand icon on the URL field for URL-based detection (may fail on CORS). Parsing spinner shown during detection. Detected placeholders auto-populate the field. Build ok, pushed.
|
||||||
|
|
||||||
### 1.11 `[STANDARD]` Dashboard — Activity Feed + KPI Panels
|
### ✅ 1.11 `[STANDARD]` Dashboard — Activity Feed + KPI Panels
|
||||||
|
|
||||||
**What:**
|
**What:**
|
||||||
|
|
||||||
@@ -205,6 +205,8 @@
|
|||||||
|
|
||||||
**Files to modify:** `src/modules/dashboard/components/` or `src/app/(modules)/page.tsx`
|
**Files to modify:** `src/modules/dashboard/components/` or `src/app/(modules)/page.tsx`
|
||||||
|
|
||||||
|
**Status:** ✅ Done. Created `src/modules/dashboard/hooks/use-dashboard-data.ts` — scans all `architools:*` localStorage keys directly, extracts entities with timestamps, builds activity feed (last 20, sorted by `updatedAt`) and KPI counters. Updated `src/app/page.tsx`: KPI grid (6 cards: registratura this week, open dosare, deadlines this week, overdue in red, new contacts this month, active IT equipment), activity feed with module icon + label + action + relative time (Romanian locale). Build ok, pushed.
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
### 1.12 `[LIGHT]` Registratura — Increase Linked-Entry Selector Limit
|
### 1.12 `[LIGHT]` Registratura — Increase Linked-Entry Selector Limit
|
||||||
|
|||||||
@@ -4,6 +4,30 @@
|
|||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## Session — 2026-02-19 (GitHub Copilot - Claude Sonnet 4.6) [continued]
|
||||||
|
|
||||||
|
### Completed
|
||||||
|
|
||||||
|
- **Task 1.11: Dashboard — Activity Feed + KPI Panels** ✅
|
||||||
|
- Created `src/modules/dashboard/hooks/use-dashboard-data.ts`
|
||||||
|
- Scans all `architools:*` localStorage keys directly (no per-module hooks needed)
|
||||||
|
- Activity feed: last 20 items sorted by `updatedAt`, detects creat/actualizat, picks best label field
|
||||||
|
- KPI grid: registratura this week, open dosare, deadlines this week, overdue (red if >0), new contacts this month, active IT equipment
|
||||||
|
- Replaced static Quick Stats with live KPI panels in `src/app/page.tsx`
|
||||||
|
- Relative timestamps in Romanian via `Intl.RelativeTimeFormat`
|
||||||
|
- Build passes zero errors
|
||||||
|
|
||||||
|
### Commits
|
||||||
|
|
||||||
|
- (this session) feat(dashboard): activity feed and KPI panels
|
||||||
|
|
||||||
|
### Notes
|
||||||
|
|
||||||
|
- Build verified: `npx next build` → ✓ Compiled successfully
|
||||||
|
- Next task: **1.12** — Registratura linked-entry selector fix
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
## Session — 2026-02-19 (GitHub Copilot - Claude Sonnet 4.6)
|
## Session — 2026-02-19 (GitHub Copilot - Claude Sonnet 4.6)
|
||||||
|
|
||||||
### Completed
|
### Completed
|
||||||
|
|||||||
295
src/app/page.tsx
295
src/app/page.tsx
@@ -1,22 +1,53 @@
|
|||||||
'use client';
|
"use client";
|
||||||
|
|
||||||
import Link from 'next/link';
|
import Link from "next/link";
|
||||||
import * as Icons from 'lucide-react';
|
import * as Icons from "lucide-react";
|
||||||
import { getAllModules } from '@/core/module-registry';
|
import { getAllModules } from "@/core/module-registry";
|
||||||
import { useFeatureFlag } from '@/core/feature-flags';
|
import { useFeatureFlag } from "@/core/feature-flags";
|
||||||
import { useI18n } from '@/core/i18n';
|
import { useI18n } from "@/core/i18n";
|
||||||
import { EXTERNAL_TOOLS } from '@/config/external-tools';
|
import { EXTERNAL_TOOLS } from "@/config/external-tools";
|
||||||
import { Card, CardHeader, CardTitle, CardDescription, CardContent } from '@/shared/components/ui/card';
|
import {
|
||||||
import { Badge } from '@/shared/components/ui/badge';
|
Card,
|
||||||
|
CardHeader,
|
||||||
|
CardTitle,
|
||||||
|
CardDescription,
|
||||||
|
CardContent,
|
||||||
|
} from "@/shared/components/ui/card";
|
||||||
|
import { Badge } from "@/shared/components/ui/badge";
|
||||||
|
import { useDashboardData } from "@/modules/dashboard/hooks/use-dashboard-data";
|
||||||
|
|
||||||
function DynamicIcon({ name, className }: { name: string; className?: string }) {
|
function DynamicIcon({
|
||||||
const pascalName = name.replace(/(^|-)([a-z])/g, (_, _p, c: string) => c.toUpperCase());
|
name,
|
||||||
const IconComponent = (Icons as unknown as Record<string, React.ComponentType<{ className?: string }>>)[pascalName];
|
className,
|
||||||
|
}: {
|
||||||
|
name: string;
|
||||||
|
className?: string;
|
||||||
|
}) {
|
||||||
|
const pascalName = name.replace(/(^|-)([a-z])/g, (_, _p, c: string) =>
|
||||||
|
c.toUpperCase(),
|
||||||
|
);
|
||||||
|
const IconComponent = (
|
||||||
|
Icons as unknown as Record<
|
||||||
|
string,
|
||||||
|
React.ComponentType<{ className?: string }>
|
||||||
|
>
|
||||||
|
)[pascalName];
|
||||||
if (!IconComponent) return <Icons.Circle className={className} />;
|
if (!IconComponent) return <Icons.Circle className={className} />;
|
||||||
return <IconComponent className={className} />;
|
return <IconComponent className={className} />;
|
||||||
}
|
}
|
||||||
|
|
||||||
function ModuleCard({ module }: { module: { id: string; name: string; description: string; icon: string; route: string; featureFlag: string } }) {
|
function ModuleCard({
|
||||||
|
module,
|
||||||
|
}: {
|
||||||
|
module: {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
description: string;
|
||||||
|
icon: string;
|
||||||
|
route: string;
|
||||||
|
featureFlag: string;
|
||||||
|
};
|
||||||
|
}) {
|
||||||
const enabled = useFeatureFlag(module.featureFlag);
|
const enabled = useFeatureFlag(module.featureFlag);
|
||||||
if (!enabled) return null;
|
if (!enabled) return null;
|
||||||
|
|
||||||
@@ -29,7 +60,9 @@ function ModuleCard({ module }: { module: { id: string; name: string; descriptio
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<CardTitle className="text-base">{module.name}</CardTitle>
|
<CardTitle className="text-base">{module.name}</CardTitle>
|
||||||
<CardDescription className="text-sm">{module.description}</CardDescription>
|
<CardDescription className="text-sm">
|
||||||
|
{module.description}
|
||||||
|
</CardDescription>
|
||||||
</div>
|
</div>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
</Card>
|
</Card>
|
||||||
@@ -37,59 +70,166 @@ function ModuleCard({ module }: { module: { id: string; name: string; descriptio
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const RELATIVE_LABELS: Intl.RelativeTimeFormatUnit[] = [
|
||||||
|
"year",
|
||||||
|
"month",
|
||||||
|
"week",
|
||||||
|
"day",
|
||||||
|
"hour",
|
||||||
|
"minute",
|
||||||
|
"second",
|
||||||
|
];
|
||||||
|
const RELATIVE_MS = [
|
||||||
|
31536000000, 2592000000, 604800000, 86400000, 3600000, 60000, 1000,
|
||||||
|
];
|
||||||
|
|
||||||
|
function relativeTime(isoString: string): string {
|
||||||
|
const diff = new Date(isoString).getTime() - Date.now();
|
||||||
|
const rtf = new Intl.RelativeTimeFormat("ro", { numeric: "auto" });
|
||||||
|
for (let i = 0; i < RELATIVE_MS.length; i++) {
|
||||||
|
const ms = RELATIVE_MS[i];
|
||||||
|
if (ms === undefined) continue;
|
||||||
|
const absMs = RELATIVE_LABELS[i];
|
||||||
|
if (absMs === undefined) continue;
|
||||||
|
if (Math.abs(diff) >= ms || i === RELATIVE_MS.length - 1) {
|
||||||
|
return rtf.format(Math.round(diff / ms), absMs);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return "acum";
|
||||||
|
}
|
||||||
|
|
||||||
|
const MODULE_ICONS: Record<string, string> = {
|
||||||
|
registratura: "BookOpen",
|
||||||
|
"address-book": "Users",
|
||||||
|
"it-inventory": "Monitor",
|
||||||
|
"password-vault": "KeyRound",
|
||||||
|
"digital-signatures": "PenLine",
|
||||||
|
"word-templates": "FileText",
|
||||||
|
"tag-manager": "Tag",
|
||||||
|
"prompt-generator": "Wand2",
|
||||||
|
};
|
||||||
|
|
||||||
const CATEGORY_LABELS: Record<string, string> = {
|
const CATEGORY_LABELS: Record<string, string> = {
|
||||||
dev: 'Dezvoltare',
|
dev: "Dezvoltare",
|
||||||
tools: 'Instrumente',
|
tools: "Instrumente",
|
||||||
monitoring: 'Monitorizare',
|
monitoring: "Monitorizare",
|
||||||
security: 'Securitate',
|
security: "Securitate",
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function DashboardPage() {
|
export default function DashboardPage() {
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const modules = getAllModules();
|
const modules = getAllModules();
|
||||||
|
const { activity, kpis } = useDashboardData();
|
||||||
|
|
||||||
const toolCategories = Object.keys(CATEGORY_LABELS).filter(
|
const toolCategories = Object.keys(CATEGORY_LABELS).filter((cat) =>
|
||||||
(cat) => EXTERNAL_TOOLS.some((tool) => tool.category === cat)
|
EXTERNAL_TOOLS.some((tool) => tool.category === cat),
|
||||||
);
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="mx-auto max-w-6xl space-y-8">
|
<div className="mx-auto max-w-6xl space-y-8">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-3xl font-bold tracking-tight">{t('dashboard.welcome')}</h1>
|
<h1 className="text-3xl font-bold tracking-tight">
|
||||||
<p className="mt-1 text-muted-foreground">{t('dashboard.subtitle')}</p>
|
{t("dashboard.welcome")}
|
||||||
|
</h1>
|
||||||
|
<p className="mt-1 text-muted-foreground">{t("dashboard.subtitle")}</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Quick stats */}
|
{/* KPI panels */}
|
||||||
<div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
|
<div>
|
||||||
<Card>
|
<h2 className="mb-3 text-lg font-semibold">Indicatori cheie</h2>
|
||||||
<CardContent className="p-4">
|
<div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
|
||||||
<p className="text-xs text-muted-foreground">Module active</p>
|
<Card>
|
||||||
<p className="text-2xl font-bold">{modules.length}</p>
|
<CardContent className="p-4">
|
||||||
</CardContent>
|
<p className="text-xs text-muted-foreground">
|
||||||
</Card>
|
Registratură — intrări săptămâna aceasta
|
||||||
<Card>
|
</p>
|
||||||
<CardContent className="p-4">
|
<p className="text-2xl font-bold">{kpis.registraturaThisWeek}</p>
|
||||||
<p className="text-xs text-muted-foreground">Companii</p>
|
</CardContent>
|
||||||
<p className="text-2xl font-bold">3</p>
|
</Card>
|
||||||
</CardContent>
|
<Card>
|
||||||
</Card>
|
<CardContent className="p-4">
|
||||||
<Card>
|
<p className="text-xs text-muted-foreground">Dosare deschise</p>
|
||||||
<CardContent className="p-4">
|
<p className="text-2xl font-bold">{kpis.registraturaOpen}</p>
|
||||||
<p className="text-xs text-muted-foreground">Instrumente externe</p>
|
</CardContent>
|
||||||
<p className="text-2xl font-bold">{EXTERNAL_TOOLS.length}</p>
|
</Card>
|
||||||
</CardContent>
|
<Card>
|
||||||
</Card>
|
<CardContent className="p-4">
|
||||||
<Card>
|
<p className="text-xs text-muted-foreground">
|
||||||
<CardContent className="p-4">
|
Termene legale săptămâna aceasta
|
||||||
<p className="text-xs text-muted-foreground">Stocare</p>
|
</p>
|
||||||
<p className="text-2xl font-bold">localStorage</p>
|
<p className="text-2xl font-bold">{kpis.deadlinesThisWeek}</p>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
|
<Card>
|
||||||
|
<CardContent className="p-4">
|
||||||
|
<p className="text-xs text-muted-foreground">Termene depășite</p>
|
||||||
|
<p
|
||||||
|
className={`text-2xl font-bold ${kpis.overdueDeadlines > 0 ? "text-destructive" : ""}`}
|
||||||
|
>
|
||||||
|
{kpis.overdueDeadlines}
|
||||||
|
</p>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
<Card>
|
||||||
|
<CardContent className="p-4">
|
||||||
|
<p className="text-xs text-muted-foreground">
|
||||||
|
Contacte noi luna aceasta
|
||||||
|
</p>
|
||||||
|
<p className="text-2xl font-bold">{kpis.contactsThisMonth}</p>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
<Card>
|
||||||
|
<CardContent className="p-4">
|
||||||
|
<p className="text-xs text-muted-foreground">
|
||||||
|
Echipamente IT active
|
||||||
|
</p>
|
||||||
|
<p className="text-2xl font-bold">{kpis.inventoryActive}</p>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* Activity feed */}
|
||||||
|
{activity.length > 0 && (
|
||||||
|
<div>
|
||||||
|
<h2 className="mb-3 text-lg font-semibold">Activitate recentă</h2>
|
||||||
|
<Card>
|
||||||
|
<CardContent className="divide-y p-0">
|
||||||
|
{activity.map((item) => (
|
||||||
|
<div
|
||||||
|
key={item.id}
|
||||||
|
className="flex items-center gap-3 px-4 py-2.5"
|
||||||
|
>
|
||||||
|
<div className="flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-muted">
|
||||||
|
<DynamicIcon
|
||||||
|
name={MODULE_ICONS[item.namespace] ?? "Circle"}
|
||||||
|
className="h-3.5 w-3.5 text-muted-foreground"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="min-w-0 flex-1">
|
||||||
|
<p className="truncate text-sm">
|
||||||
|
<span className="font-medium">{item.label}</span>
|
||||||
|
<span className="ml-1 text-muted-foreground text-xs">
|
||||||
|
{item.action}
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
<p className="text-[11px] text-muted-foreground">
|
||||||
|
{item.moduleLabel}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<span className="shrink-0 text-[11px] text-muted-foreground">
|
||||||
|
{relativeTime(item.timestamp)}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{/* Modules grid */}
|
{/* Modules grid */}
|
||||||
<div>
|
<div>
|
||||||
<h2 className="mb-4 text-lg font-semibold">{t('dashboard.modules')}</h2>
|
<h2 className="mb-4 text-lg font-semibold">{t("dashboard.modules")}</h2>
|
||||||
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
||||||
{modules.map((m) => (
|
{modules.map((m) => (
|
||||||
<ModuleCard key={m.id} module={m} />
|
<ModuleCard key={m.id} module={m} />
|
||||||
@@ -103,27 +243,44 @@ export default function DashboardPage() {
|
|||||||
<div className="space-y-4">
|
<div className="space-y-4">
|
||||||
{toolCategories.map((cat) => (
|
{toolCategories.map((cat) => (
|
||||||
<div key={cat}>
|
<div key={cat}>
|
||||||
<Badge variant="outline" className="mb-2">{CATEGORY_LABELS[cat]}</Badge>
|
<Badge variant="outline" className="mb-2">
|
||||||
|
{CATEGORY_LABELS[cat]}
|
||||||
|
</Badge>
|
||||||
<div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
|
<div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
|
||||||
{EXTERNAL_TOOLS.filter((tool) => tool.category === cat).map((tool) => {
|
{EXTERNAL_TOOLS.filter((tool) => tool.category === cat).map(
|
||||||
const cardContent = (
|
(tool) => {
|
||||||
<Card key={tool.id} className="transition-colors hover:bg-accent/30">
|
const cardContent = (
|
||||||
<CardHeader className="flex flex-row items-center gap-3 space-y-0 p-4">
|
<Card
|
||||||
<DynamicIcon name={tool.icon} className="h-4 w-4 text-muted-foreground" />
|
key={tool.id}
|
||||||
<div>
|
className="transition-colors hover:bg-accent/30"
|
||||||
<p className="text-sm font-medium">{tool.name}</p>
|
>
|
||||||
<p className="text-xs text-muted-foreground">{tool.description}</p>
|
<CardHeader className="flex flex-row items-center gap-3 space-y-0 p-4">
|
||||||
</div>
|
<DynamicIcon
|
||||||
</CardHeader>
|
name={tool.icon}
|
||||||
</Card>
|
className="h-4 w-4 text-muted-foreground"
|
||||||
);
|
/>
|
||||||
if (!tool.url) return cardContent;
|
<div>
|
||||||
return (
|
<p className="text-sm font-medium">{tool.name}</p>
|
||||||
<a key={tool.id} href={tool.url} target="_blank" rel="noopener noreferrer">
|
<p className="text-xs text-muted-foreground">
|
||||||
{cardContent}
|
{tool.description}
|
||||||
</a>
|
</p>
|
||||||
);
|
</div>
|
||||||
})}
|
</CardHeader>
|
||||||
|
</Card>
|
||||||
|
);
|
||||||
|
if (!tool.url) return cardContent;
|
||||||
|
return (
|
||||||
|
<a
|
||||||
|
key={tool.id}
|
||||||
|
href={tool.url}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
>
|
||||||
|
{cardContent}
|
||||||
|
</a>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
|
|||||||
193
src/modules/dashboard/hooks/use-dashboard-data.ts
Normal file
193
src/modules/dashboard/hooks/use-dashboard-data.ts
Normal file
@@ -0,0 +1,193 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { useEffect, useState } from "react";
|
||||||
|
|
||||||
|
export interface ActivityItem {
|
||||||
|
id: string;
|
||||||
|
namespace: string;
|
||||||
|
moduleLabel: string;
|
||||||
|
label: string;
|
||||||
|
action: "creat" | "actualizat";
|
||||||
|
timestamp: string; // ISO
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DashboardKpis {
|
||||||
|
registraturaThisWeek: number;
|
||||||
|
registraturaOpen: number;
|
||||||
|
deadlinesThisWeek: number;
|
||||||
|
overdueDeadlines: number;
|
||||||
|
contactsThisMonth: number;
|
||||||
|
inventoryActive: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
const MODULE_LABELS: Record<string, string> = {
|
||||||
|
registratura: "Registratură",
|
||||||
|
"address-book": "Agendă",
|
||||||
|
"it-inventory": "IT Inventory",
|
||||||
|
"password-vault": "Parole",
|
||||||
|
"digital-signatures": "Semnături",
|
||||||
|
"word-templates": "Șabloane Word",
|
||||||
|
"tag-manager": "Tag Manager",
|
||||||
|
"prompt-generator": "Prompt Generator",
|
||||||
|
};
|
||||||
|
|
||||||
|
/** Extract a human-readable label from a stored entity */
|
||||||
|
function pickLabel(obj: Record<string, unknown>): string {
|
||||||
|
const candidates = ["subject", "name", "label", "title", "number"];
|
||||||
|
for (const key of candidates) {
|
||||||
|
const val = obj[key];
|
||||||
|
if (typeof val === "string" && val.trim()) return val.trim();
|
||||||
|
}
|
||||||
|
return "(fără titlu)";
|
||||||
|
}
|
||||||
|
|
||||||
|
function startOfWeek(): Date {
|
||||||
|
const d = new Date();
|
||||||
|
d.setHours(0, 0, 0, 0);
|
||||||
|
d.setDate(d.getDate() - d.getDay() + 1); // Monday
|
||||||
|
return d;
|
||||||
|
}
|
||||||
|
|
||||||
|
function startOfMonth(): Date {
|
||||||
|
const d = new Date();
|
||||||
|
d.setHours(0, 0, 0, 0);
|
||||||
|
d.setDate(1);
|
||||||
|
return d;
|
||||||
|
}
|
||||||
|
|
||||||
|
function readAllNamespaceItems(): Record<string, Record<string, unknown>[]> {
|
||||||
|
if (typeof window === "undefined") return {};
|
||||||
|
const PREFIX = "architools:";
|
||||||
|
const result: Record<string, Record<string, unknown>[]> = {};
|
||||||
|
|
||||||
|
for (let i = 0; i < window.localStorage.length; i++) {
|
||||||
|
const fullKey = window.localStorage.key(i);
|
||||||
|
if (!fullKey?.startsWith(PREFIX)) continue;
|
||||||
|
const rest = fullKey.slice(PREFIX.length);
|
||||||
|
const colonIdx = rest.indexOf(":");
|
||||||
|
if (colonIdx === -1) continue;
|
||||||
|
const ns = rest.slice(0, colonIdx);
|
||||||
|
try {
|
||||||
|
const raw = window.localStorage.getItem(fullKey);
|
||||||
|
if (!raw) continue;
|
||||||
|
const parsed = JSON.parse(raw) as unknown;
|
||||||
|
if (parsed && typeof parsed === "object" && !Array.isArray(parsed)) {
|
||||||
|
if (!result[ns]) result[ns] = [];
|
||||||
|
result[ns].push(parsed as Record<string, unknown>);
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
// ignore malformed entries
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useDashboardData() {
|
||||||
|
const [activity, setActivity] = useState<ActivityItem[]>([]);
|
||||||
|
const [kpis, setKpis] = useState<DashboardKpis>({
|
||||||
|
registraturaThisWeek: 0,
|
||||||
|
registraturaOpen: 0,
|
||||||
|
deadlinesThisWeek: 0,
|
||||||
|
overdueDeadlines: 0,
|
||||||
|
contactsThisMonth: 0,
|
||||||
|
inventoryActive: 0,
|
||||||
|
});
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const allItems = readAllNamespaceItems();
|
||||||
|
const weekStart = startOfWeek();
|
||||||
|
const monthStart = startOfMonth();
|
||||||
|
const now = new Date();
|
||||||
|
|
||||||
|
// --- Activity feed ---
|
||||||
|
const activityItems: ActivityItem[] = [];
|
||||||
|
|
||||||
|
for (const [ns, items] of Object.entries(allItems)) {
|
||||||
|
const moduleLabel = MODULE_LABELS[ns] ?? ns;
|
||||||
|
for (const item of items) {
|
||||||
|
const updatedAt =
|
||||||
|
typeof item.updatedAt === "string" ? item.updatedAt : null;
|
||||||
|
const createdAt =
|
||||||
|
typeof item.createdAt === "string" ? item.createdAt : null;
|
||||||
|
const id =
|
||||||
|
typeof item.id === "string" ? item.id : String(Math.random());
|
||||||
|
if (!updatedAt && !createdAt) continue;
|
||||||
|
const timestamp = updatedAt ?? createdAt ?? "";
|
||||||
|
const created = createdAt ? new Date(createdAt) : null;
|
||||||
|
const updated = updatedAt ? new Date(updatedAt) : null;
|
||||||
|
const action: "creat" | "actualizat" =
|
||||||
|
created &&
|
||||||
|
updated &&
|
||||||
|
Math.abs(updated.getTime() - created.getTime()) < 2000
|
||||||
|
? "creat"
|
||||||
|
: "actualizat";
|
||||||
|
|
||||||
|
activityItems.push({
|
||||||
|
id: `${ns}:${id}`,
|
||||||
|
namespace: ns,
|
||||||
|
moduleLabel,
|
||||||
|
label: pickLabel(item),
|
||||||
|
action,
|
||||||
|
timestamp,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
activityItems.sort((a, b) => b.timestamp.localeCompare(a.timestamp));
|
||||||
|
setActivity(activityItems.slice(0, 20));
|
||||||
|
|
||||||
|
// --- KPIs ---
|
||||||
|
const registraturaItems = allItems["registratura"] ?? [];
|
||||||
|
const registraturaThisWeek = registraturaItems.filter((e) => {
|
||||||
|
const d = typeof e.date === "string" ? new Date(e.date) : null;
|
||||||
|
return d && d >= weekStart;
|
||||||
|
}).length;
|
||||||
|
|
||||||
|
const registraturaOpen = registraturaItems.filter(
|
||||||
|
(e) => e.status === "deschis",
|
||||||
|
).length;
|
||||||
|
|
||||||
|
// Deadlines
|
||||||
|
let deadlinesThisWeek = 0;
|
||||||
|
let overdueDeadlines = 0;
|
||||||
|
for (const entry of registraturaItems) {
|
||||||
|
const deadlines = Array.isArray(entry.trackedDeadlines)
|
||||||
|
? (entry.trackedDeadlines as Record<string, unknown>[])
|
||||||
|
: [];
|
||||||
|
for (const dl of deadlines) {
|
||||||
|
if (dl.resolution !== "pending") continue;
|
||||||
|
const dueDate =
|
||||||
|
typeof dl.dueDate === "string" ? new Date(dl.dueDate) : null;
|
||||||
|
if (!dueDate) continue;
|
||||||
|
if (dueDate < now) overdueDeadlines++;
|
||||||
|
if (
|
||||||
|
dueDate >= weekStart &&
|
||||||
|
dueDate <= new Date(weekStart.getTime() + 7 * 86400000)
|
||||||
|
)
|
||||||
|
deadlinesThisWeek++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const contactItems = allItems["address-book"] ?? [];
|
||||||
|
const contactsThisMonth = contactItems.filter((c) => {
|
||||||
|
const d = typeof c.createdAt === "string" ? new Date(c.createdAt) : null;
|
||||||
|
return d && d >= monthStart;
|
||||||
|
}).length;
|
||||||
|
|
||||||
|
const inventoryItems = allItems["it-inventory"] ?? [];
|
||||||
|
const inventoryActive = inventoryItems.filter(
|
||||||
|
(i) => i.status === "active",
|
||||||
|
).length;
|
||||||
|
|
||||||
|
setKpis({
|
||||||
|
registraturaThisWeek,
|
||||||
|
registraturaOpen,
|
||||||
|
deadlinesThisWeek,
|
||||||
|
overdueDeadlines,
|
||||||
|
contactsThisMonth,
|
||||||
|
inventoryActive,
|
||||||
|
});
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return { activity, kpis };
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user