Add hero stats last updated

app/globals.css

@@ -112,7 +112,9 @@ h4{font-size:18px;line-height:1.3}
 
 .hero-top{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto;gap:64px;align-items:start}
 .hero-top-copy{}
-.hero-top-stats{display:flex;flex-direction:column;gap:32px;justify-self:end;padding-top:61px}
+.hero-top-stats{display:flex;flex-direction:column;gap:28px;justify-self:end;padding-top:61px}
+.hero-top-stats-items{display:flex;flex-direction:column;gap:28px}
+.hero-stats-updated{font-size:11px;color:var(--ink-4);text-align:right}
 .hero-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;background:var(--bg);border:1px solid var(--line);padding:6px 14px;border-radius:999px;color:var(--ink-2);margin-bottom:28px;}
 .hero-eyebrow .led{width:6px;height:6px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px rgba(44,122,255,.18);}
 .hero-eyebrow [data-gh-version]{color:var(--brand);font-weight:500}
@@ -504,7 +506,9 @@ h4{font-size:18px;line-height:1.3}
   h1{font-size:54px}h2{font-size:34px}
   .hero h1{font-size:56px}.hero{padding:64px 0 64px}
   .hero-top{grid-template-columns:1fr}
-  .hero-top-stats{flex-direction:row;justify-self:start;margin-top:32px}
+  .hero-top-stats{flex-direction:row;flex-wrap:wrap;justify-self:start;margin-top:32px}
+  .hero-top-stats-items{flex-direction:row;gap:32px}
+  .hero-stats-updated{width:100%;text-align:left}
   .hero-concepts{grid-template-columns:repeat(2,1fr);margin-top:40px}
   .mock-body{grid-template-columns:1fr}
   .mock-sidebar{border-right:none;border-bottom:1px solid var(--ink-line);display:grid;grid-template-columns:1fr 1fr;gap:16px}

components/community/routes/HomeRoute.tsx

@@ -23,6 +23,14 @@ function formatNum(n: number): string {
   return String(n)
 }
 
+function formatUpdatedAt(iso: string, lang: string): string {
+  const d = new Date(iso)
+  if (isNaN(d.getTime())) return ''
+  return d.toLocaleString(lang, {
+    year: 'numeric', month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit',
+  })
+}
+
 export function HomeRoute({ ghVersion }: { ghVersion: string }) {
   const { t, i18n } = useTranslation('home')
   const th = (key: string) => ({ __html: t(key) })
@@ -82,31 +90,38 @@ export function HomeRoute({ ghVersion }: { ghVersion: string }) {
             </div>
 
             <div className="hero-top-stats">
-              <a
-                className="hero-stat"
-                href="#download"
-              >
-                <div className="hero-stat-num">
-                  {statsLoading ? <span className="stat-skeleton" aria-hidden="true" /> : formatNum(totalDownloads ?? 0)}
-                </div>
-                <div className="hero-stat-label">{t('hero.stat.dl')}</div>
-              </a>
-              <a
-                className="hero-stat"
-                href="https://github.com/DashAISoftware/dashAI"
-                target="_blank"
-                rel="noopener"
-              >
-                <div className="hero-stat-num">
-                  {statsLoading ? <span className="stat-skeleton" aria-hidden="true" /> : formatNum(stars ?? 0)}
-                </div>
-                <div className="hero-stat-label">
-                  <svg style={{ width: 12, height: 12, flexShrink: 0 }}>
-                    <use href="#i-github" />
-                  </svg>
-                  {t('hero.stat.stars')}
+              <div className="hero-top-stats-items">
+                <a
+                  className="hero-stat"
+                  href="#download"
+                >
+                  <div className="hero-stat-num">
+                    {statsLoading ? <span className="stat-skeleton" aria-hidden="true" /> : formatNum(totalDownloads ?? 0)}
+                  </div>
+                  <div className="hero-stat-label">{t('hero.stat.dl')}</div>
+                </a>
+                <a
+                  className="hero-stat"
+                  href="https://github.com/DashAISoftware/dashAI"
+                  target="_blank"
+                  rel="noopener"
+                >
+                  <div className="hero-stat-num">
+                    {statsLoading ? <span className="stat-skeleton" aria-hidden="true" /> : formatNum(stars ?? 0)}
+                  </div>
+                  <div className="hero-stat-label">
+                    <svg style={{ width: 12, height: 12, flexShrink: 0 }}>
+                      <use href="#i-github" />
+                    </svg>
+                    {t('hero.stat.stars')}
+                  </div>
+                </a>
+              </div>
+              {stats?.updatedAt && (
+                <div className="hero-stats-updated">
+                  {t('hero.stat.updated', { date: formatUpdatedAt(stats.updatedAt, lang) })}
                 </div>
-              </a>
+              )}
             </div>
           </div>
 

lib/stats.ts

@@ -1,4 +1,5 @@
 export interface Stats {
+  updatedAt?:  string
   github:      { downloads: number; stars: number }
   website:     { downloads: number }
   sourceForge: { downloads: number }

public/locales/en/home.json

@@ -129,5 +129,6 @@
   "tag.tab": "tabular",
   "tag.tr": "translation",
   "hero.stat.stars": "Support us with a star",
-  "hero.stat.dl": "Total downloads"
+  "hero.stat.dl": "Total downloads",
+  "hero.stat.updated": "Last update: {{date}}"
 }

public/locales/es/home.json

@@ -129,5 +129,6 @@
   "tag.tab": "tabular",
   "tag.tr": "traducción",
   "hero.stat.stars": "Apóyanos con una estrella",
-  "hero.stat.dl": "Total descargas"
+  "hero.stat.dl": "Total descargas",
+  "hero.stat.updated": "Última actualización: {{date}}"
 }

public/locales/pt/home.json

@@ -129,5 +129,6 @@
   "tag.tab": "tabular",
   "tag.tr": "tradução",
   "hero.stat.stars": "Apoie-nos com uma estrela",
-  "hero.stat.dl": "Total downloads"
+  "hero.stat.dl": "Total downloads",
+  "hero.stat.updated": "Última atualização: {{date}}"
 }