From 8f06c9168a556ce2b0be36bcbdce8c2dcb981b01 Mon Sep 17 00:00:00 2001 From: Usman Baig Date: Fri, 13 Mar 2026 16:32:26 +0100 Subject: [PATCH 1/4] feat: show verified/unverified badge on site cards --- CHANGELOG.md | 1 + components/sites/SiteList.tsx | 23 ++++++++++++++++------- components/sites/VerificationModal.tsx | 3 ++- lib/api/sites.ts | 7 +++++++ 4 files changed, 26 insertions(+), 8 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index dbdea1a..e819caf 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/), ### Improved +- **Sites now show their verification status.** Each site on your dashboard now displays either a green "Active" badge (if verified) or an amber "Unverified" badge. When you verify your tracking script installation, the status is saved permanently — no more showing "Active" for sites that haven't been set up yet. - **Cleaner page paths in your reports.** Pages like `/products?_t=123456` or `/about?session=abc` now correctly show as `/products` and `/about`. Only marketing attribution parameters (like UTM tags) are preserved for traffic source tracking — all other junk parameters are automatically removed, so your Top Pages and Journeys stay clean without us having to chase down every new parameter format. - **Easier to hover country dots on the map.** The orange location markers on the world map are now much easier to interact with — you no longer need pixel-perfect aim to see the tooltip. - **Smoother chart curves and filled area.** The dashboard chart line now flows with natural curves instead of sharp flat tops at peaks. The area beneath the line is filled with a soft transparent orange gradient that fades toward the bottom, making trends easier to read at a glance. diff --git a/components/sites/SiteList.tsx b/components/sites/SiteList.tsx index 718386b..ea15114 100644 --- a/components/sites/SiteList.tsx +++ b/components/sites/SiteList.tsx @@ -62,13 +62,22 @@ function SiteCard({ site, stats, statsLoading, onDelete, canDelete }: SiteCardPr -
- - - - - Active -
+ {site.is_verified ? ( +
+ + + + + Active +
+ ) : ( +
+ + + + Unverified +
+ )} {/* Mini Stats Grid */} diff --git a/components/sites/VerificationModal.tsx b/components/sites/VerificationModal.tsx index 1b360f1..f382e47 100644 --- a/components/sites/VerificationModal.tsx +++ b/components/sites/VerificationModal.tsx @@ -9,7 +9,7 @@ import { AlertTriangleIcon, ZapIcon } from '@ciphera-net/ui' -import { Site } from '@/lib/api/sites' +import { Site, verifySite } from '@/lib/api/sites' import { getRealtime } from '@/lib/api/stats' import { toast, Button } from '@ciphera-net/ui' @@ -56,6 +56,7 @@ export default function VerificationModal({ isOpen, onClose, site }: Verificatio if (data.visitors > 0) { setStatus('success') toast.success('Connection established!') + try { await verifySite(site.id) } catch {} } } catch (e) { // Ignore errors diff --git a/lib/api/sites.ts b/lib/api/sites.ts index e17d886..34f5f99 100644 --- a/lib/api/sites.ts +++ b/lib/api/sites.ts @@ -25,6 +25,7 @@ export interface Site { hide_unknown_locations?: boolean // Data retention (months); 0 = keep forever data_retention_months?: number + is_verified?: boolean created_at: string updated_at: string } @@ -91,3 +92,9 @@ export async function resetSiteData(id: string): Promise { method: 'POST', }) } + +export async function verifySite(id: string): Promise { + await apiRequest(`/sites/${id}/verify`, { + method: 'POST', + }) +} From e336d2c7e5f8eaa2ddc7208f562ad1712d24916c Mon Sep 17 00:00:00 2001 From: Usman Baig Date: Fri, 13 Mar 2026 16:40:37 +0100 Subject: [PATCH 2/4] feat: show verification status in site settings page --- CHANGELOG.md | 1 + app/sites/[id]/settings/page.tsx | 43 ++++++++++++++++++-------- components/sites/VerificationModal.tsx | 5 +-- 3 files changed, 34 insertions(+), 15 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e819caf..d9df91f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/), ### Improved - **Sites now show their verification status.** Each site on your dashboard now displays either a green "Active" badge (if verified) or an amber "Unverified" badge. When you verify your tracking script installation, the status is saved permanently — no more showing "Active" for sites that haven't been set up yet. +- **Verification status visible in Settings too.** Once your tracking script is verified, the Settings page shows a green confirmation bar instead of the verify button — so you can tell at a glance that everything is working. A "Re-verify" link is still there if you ever need to check again. - **Cleaner page paths in your reports.** Pages like `/products?_t=123456` or `/about?session=abc` now correctly show as `/products` and `/about`. Only marketing attribution parameters (like UTM tags) are preserved for traffic source tracking — all other junk parameters are automatically removed, so your Top Pages and Journeys stay clean without us having to chase down every new parameter format. - **Easier to hover country dots on the map.** The orange location markers on the world map are now much easier to interact with — you no longer need pixel-perfect aim to see the tooltip. - **Smoother chart curves and filled area.** The dashboard chart line now flows with natural curves instead of sharp flat tops at peaks. The area beneath the line is filled with a soft transparent orange gradient that fades toward the bottom, making trends easier to read at a glance. diff --git a/app/sites/[id]/settings/page.tsx b/app/sites/[id]/settings/page.tsx index 4a6a939..087f6ee 100644 --- a/app/sites/[id]/settings/page.tsx +++ b/app/sites/[id]/settings/page.tsx @@ -709,19 +709,35 @@ export default function SiteSettingsPage() { className="mb-4" /> -
- -

- Check if your site is sending data correctly. -

-
+ {site.is_verified ? ( +
+
+ + Script verified — your site is sending data correctly. +
+ +
+ ) : ( +
+ +

+ Check if your site is sending data correctly. +

+
+ )}
@@ -1614,6 +1630,7 @@ export default function SiteSettingsPage() { isOpen={showVerificationModal} onClose={() => setShowVerificationModal(false)} site={site} + onVerified={() => mutateSite()} />
) diff --git a/components/sites/VerificationModal.tsx b/components/sites/VerificationModal.tsx index f382e47..926b342 100644 --- a/components/sites/VerificationModal.tsx +++ b/components/sites/VerificationModal.tsx @@ -17,9 +17,10 @@ interface VerificationModalProps { isOpen: boolean onClose: () => void site: Site + onVerified?: () => void } -export default function VerificationModal({ isOpen, onClose, site }: VerificationModalProps) { +export default function VerificationModal({ isOpen, onClose, site, onVerified }: VerificationModalProps) { const [mounted, setMounted] = useState(false) const [status, setStatus] = useState<'idle' | 'checking' | 'success' | 'error'>('idle') const [attempts, setAttempts] = useState(0) @@ -56,7 +57,7 @@ export default function VerificationModal({ isOpen, onClose, site }: Verificatio if (data.visitors > 0) { setStatus('success') toast.success('Connection established!') - try { await verifySite(site.id) } catch {} + try { await verifySite(site.id); onVerified?.() } catch {} } } catch (e) { // Ignore errors From 344838e0cd9afcc1e1975516f5ec0598d01def39 Mon Sep 17 00:00:00 2001 From: Usman Baig Date: Fri, 13 Mar 2026 16:44:00 +0100 Subject: [PATCH 3/4] style: use subtle inline text for verified status in settings --- app/sites/[id]/settings/page.tsx | 61 +++++++++++++++++--------------- 1 file changed, 32 insertions(+), 29 deletions(-) diff --git a/app/sites/[id]/settings/page.tsx b/app/sites/[id]/settings/page.tsx index 087f6ee..b8a3bbc 100644 --- a/app/sites/[id]/settings/page.tsx +++ b/app/sites/[id]/settings/page.tsx @@ -709,35 +709,38 @@ export default function SiteSettingsPage() { className="mb-4" /> - {site.is_verified ? ( -
-
- - Script verified — your site is sending data correctly. -
- -
- ) : ( -
- -

- Check if your site is sending data correctly. -

-
- )} +
+ {site.is_verified ? ( + <> +
+ + Verified +
+ · + + + ) : ( + <> + +

+ Check if your site is sending data correctly. +

+ + )} +
From f7bd61187aa28ffaa920675755b0a8b182289842 Mon Sep 17 00:00:00 2001 From: Usman Baig Date: Fri, 13 Mar 2026 16:46:51 +0100 Subject: [PATCH 4/4] style: make verified state match button shape of unverified state --- app/sites/[id]/settings/page.tsx | 45 +++++++++++--------------------- 1 file changed, 15 insertions(+), 30 deletions(-) diff --git a/app/sites/[id]/settings/page.tsx b/app/sites/[id]/settings/page.tsx index b8a3bbc..8d0d1eb 100644 --- a/app/sites/[id]/settings/page.tsx +++ b/app/sites/[id]/settings/page.tsx @@ -710,36 +710,21 @@ export default function SiteSettingsPage() { />
- {site.is_verified ? ( - <> -
- - Verified -
- · - - - ) : ( - <> - -

- Check if your site is sending data correctly. -

- - )} + +

+ {site.is_verified ? 'Your site is sending data correctly.' : 'Check if your site is sending data correctly.'} +