Hamza/musadeq
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🚀 Phase 4: AI Usage Tracking, Security Hardening, and Risk Monitor Dashboard

Browse Source
This commit is contained in:
Hamza-Ayed
2026-04-22 17:32:22 +03:00
parent 7e0e271be2
commit 6c1d67c695
11 changed files with 361 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
frontend/src/pages/dashboard/MultiEntityDashboard.tsx
View File

@@ -11,6 +11,10 @@ interface CompanyStats {
totalTax: number;
failedCount: number;
riskScore: number;
aiStats: {
totalTokens: number;
totalCost: number;
};
}
const getRiskStatus = (score: number) => {
@@ -62,6 +66,31 @@ const RiskGauge = ({ score }: { score: number }) => {
);
};
const Cpu = ({ className }: { className?: string }) => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24" height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className={className}
>
<rect x="4" y="4" width="16" height="16" rx="2" ry="2"/>
<rect x="9" y="9" width="6" height="6"/>
<line x1="9" y1="1" x2="9" y2="4"/>
<line x1="15" y1="1" x2="15" y2="4"/>
<line x1="9" y1="20" x2="9" y2="23"/>
<line x1="15" y1="20" x2="15" y2="23"/>
<line x1="20" y1="9" x2="23" y2="9"/>
<line x1="20" y1="15" x2="23" y2="15"/>
<line x1="1" y1="9" x2="4" y2="9"/>
<line x1="1" y1="15" x2="4" y2="15"/>
</svg>
);
export const MultiEntityDashboard = () => {
const [companies, setCompanies] = useState<CompanyStats[]>([]);
const [isLoading, setIsLoading] = useState(true);
@@ -158,6 +187,14 @@ export const MultiEntityDashboard = () => {
key={company.id}
className="card-premium p-6 relative overflow-hidden group"
>
{/* AI Usage Badge */}
<div className="absolute top-0 right-0 p-2">
<div className="flex items-center gap-1 bg-slate-100 dark:bg-slate-800 px-2 py-1 rounded-md text-[10px] font-bold text-slate-500 dark:text-slate-400 border border-slate-200 dark:border-slate-700">
<Cpu className="w-3 h-3 text-purple-400" />
<span>{company.aiStats?.totalTokens > 1000 ? `${(company.aiStats.totalTokens / 1000).toFixed(1)}k` : company.aiStats?.totalTokens || 0} tokens</span>
</div>
</div>
{/* Ambient glow */}
<div className={`absolute -inset-20 opacity-0 group-hover:opacity-10 blur-3xl transition-opacity duration-500 rounded-full
${status === 'High' ? 'bg-red-500' : status === 'Medium' ? 'bg-orange-500' : 'bg-emerald-500'}
@@ -197,11 +234,18 @@ export const MultiEntityDashboard = () => {
<div className="pt-4 border-t border-slate-100 dark:border-slate-800/50">
<div className="flex justify-between items-center mb-2">
<p className="text-sm text-slate-600 dark:text-slate-300">{company.totalInvoices} فاتورة</p>
{company.failedCount > 0 && (
<span className="text-xs text-red-400 flex items-center gap-1">
<AlertTriangle className="w-3 h-3" /> {company.failedCount} مرفوضة
</span>
)}
<div className="flex items-center gap-2">
{company.aiStats?.totalCost > 0 && (
<span className="text-[10px] font-black text-purple-400 bg-purple-500/10 px-2 py-0.5 rounded border border-purple-500/20">
${company.aiStats.totalCost.toFixed(3)}
</span>
)}
{company.failedCount > 0 && (
<span className="text-xs text-red-400 flex items-center gap-1">
<AlertTriangle className="w-3 h-3" /> {company.failedCount} مرفوضة
</span>
)}
</div>
</div>
{/* Progress Bar */}