agentlytics 0.1.18 → 0.1.20

package/ui/src/pages/ProjectDetail.jsx

@@ -1,6 +1,6 @@
 import { useState, useEffect, useMemo } from 'react'
 import { useSearchParams, useNavigate } from 'react-router-dom'
-import { ArrowLeft, Search, FolderOpen, Calendar, MessageSquare, Wrench, Cpu, Zap, AlertTriangle } from 'lucide-react'
+import { ArrowLeft, Search, FolderOpen, Calendar, MessageSquare, Wrench, Cpu, Zap, AlertTriangle, ShieldCheck } from 'lucide-react'
 import { Chart as ChartJS, ArcElement, Tooltip, Legend, CategoryScale, LinearScale, BarElement } from 'chart.js'
 import { Doughnut, Bar } from 'react-chartjs-2'
 import { fetchProjects, fetchChats, fetchCosts } from '../lib/api'
@@ -10,6 +10,8 @@ import KpiCard from '../components/KpiCard'
 import EditorIcon from '../components/EditorIcon'
 import SectionTitle from '../components/SectionTitle'
 import ChatSidebar from '../components/ChatSidebar'
+import AnimatedLoader from '../components/AnimatedLoader'
+import AiAuditCard from '../components/AiAuditCard'
 
 ChartJS.register(ArcElement, Tooltip, Legend, CategoryScale, LinearScale, BarElement)
 
@@ -76,7 +78,7 @@ export default function ProjectDetail() {
   }
 
   if (!folder) return <div className="text-sm py-12 text-center" style={{ color: 'var(--c-text3)' }}>no project specified</div>
-  if (loading) return <div className="text-sm py-12 text-center" style={{ color: 'var(--c-text2)' }}>loading project...</div>
+  if (loading) return <AnimatedLoader label="Loading project..." />
   if (!project) return <div className="text-sm py-12 text-center" style={{ color: 'var(--c-text3)' }}>project not found</div>
 
   const editorEntries = Object.entries(project.editors).sort((a, b) => b[1] - a[1])
@@ -233,6 +235,10 @@ export default function ProjectDetail() {
         </div>
       </div>
 
+      {/* AI Readiness Audit */}
+      {console.log('Rendering AiAuditCard, folder:', folder)}
+      <AiAuditCard folder={folder} />
+
       {/* Sessions */}
       <div>
         <div className="flex items-center gap-3 mb-2">

package/ui/src/pages/Projects.jsx

@@ -10,6 +10,7 @@ import KpiCard from '../components/KpiCard'
 import EditorIcon from '../components/EditorIcon'
 import DateRangePicker from '../components/DateRangePicker'
 import SectionTitle from '../components/SectionTitle'
+import AnimatedLoader from '../components/AnimatedLoader'
 
 ChartJS.register(ArcElement, Tooltip, Legend, CategoryScale, LinearScale, BarElement)
 
@@ -37,7 +38,7 @@ export default function Projects({ overview }) {
     ]).then(([p, c]) => { setProjects(p); setCosts(c) })
   }, [dateRange])
 
-  if (!projects) return <div className="text-sm py-12 text-center" style={{ color: 'var(--c-text2)' }}>loading projects...</div>
+  if (!projects) return <AnimatedLoader label="Loading projects..." />
 
   const filtered = projects.filter(p => {
     if (editorFilter && !p.editors[editorFilter]) return false

package/ui/src/pages/RelayDashboard.jsx

@@ -10,6 +10,7 @@ import ChatSidebar from '../components/ChatSidebar'
 import LiveFeed from '../components/LiveFeed'
 import { editorColor, editorLabel, formatNumber, formatDate } from '../lib/constants'
 import { fetchRelayTeamStats, fetchRelaySearch, fetchRelaySession, mergeRelayUsers } from '../lib/api'
+import AnimatedLoader from '../components/AnimatedLoader'
 import { useTheme } from '../lib/theme'
 
 ChartJS.register(ArcElement, Tooltip, Legend, CategoryScale, LinearScale, BarElement)
@@ -291,7 +292,7 @@ export default function RelayDashboard() {
     return map
   }, [userList])
 
-  if (!stats) return <div className="text-sm py-12 text-center" style={{ color: 'var(--c-text2)' }}>loading relay data...</div>
+  if (!stats) return <AnimatedLoader label="Loading relay data..." />
 
   const editorData = stats.editors || []
   const models = stats.topModels || []

package/ui/src/pages/Settings.jsx

@@ -4,6 +4,7 @@ import { fetchConfig, updateConfig, fetchAllProjects } from '../lib/api'
 import { editorLabel, formatNumber, formatDate } from '../lib/constants'
 import EditorIcon from '../components/EditorIcon'
 import SectionTitle from '../components/SectionTitle'
+import AnimatedLoader from '../components/AnimatedLoader'
 
 export default function Settings() {
   const [config, setConfig] = useState(null)
@@ -21,7 +22,7 @@ export default function Settings() {
   }, [])
 
   if (loading || !config) {
-    return <div className="text-sm py-12 text-center" style={{ color: 'var(--c-text2)' }}>loading settings...</div>
+    return <AnimatedLoader label="Loading settings..." />
   }
 
   const hiddenProjects = config.hiddenProjects || []

package/ui/src/pages/Subscriptions.jsx

@@ -3,6 +3,7 @@ import { CreditCard, RefreshCw, Clock, Zap, Shield, ChevronDown, ChevronUp } fro
 import { fetchUsage } from '../lib/api'
 import { editorLabel, editorColor } from '../lib/constants'
 import EditorIcon from '../components/EditorIcon'
+import AnimatedLoader from '../components/AnimatedLoader'
 
 function UsageBar({ value, max = 100, color, label }) {
   const pct = max > 0 ? Math.min((value / max) * 100, 100) : 0
@@ -386,7 +387,7 @@ export default function Subscriptions() {
       </div>
 
       {loading && !data && (
-        <div className="text-sm py-12 text-center" style={{ color: 'var(--c-text2)' }}>loading subscriptions...</div>
+        <AnimatedLoader label="Loading subscriptions..." />
       )}
 
       {error && (