Commit Graph

1208 Commits

Author SHA1 Message Date
Usman Baig
8b95620ec1 polish(pagespeed): mini gauges, animated tab switcher, filmstrip title
- Replace compact dot+number scores with 64px ScoreGauge circles
- ScoreGauge scales font/stroke/spacing for small sizes
- Add "Page Load Timeline" header to filmstrip section
- Replace pill toggle with animated underline tabs (matches dashboard)
2026-03-22 20:43:11 +01:00
Usman Baig
783530940e polish(pagespeed): design consistency pass
- Filmstrip: dark mode bg fix, consistent card padding, scroll fade
- Metrics: font-semibold to match uptime page
- Hero: tighter compact scores, smaller legend, centered alignment
- Chart: hide x-axis when single day, height matches uptime (h-40)
- Diagnostics: hide categories with zero failures, muted display values
- Skeleton: matches new hero layout
2026-03-22 20:19:07 +01:00
Usman Baig
dd0700cbea fix(pagespeed): poll silently without triggering SWR re-renders
Use direct API fetch for polling instead of mutateLatest() which was
causing the page to flicker and clear data every 5 seconds. SWR cache
is only updated once when new results arrive.
2026-03-22 19:56:00 +01:00
Usman Baig
8649f37bb9 feat(pagespeed): split diagnostics by category (Performance, Accessibility, Best Practices, SEO)
Each Lighthouse category gets its own card with failing audits sorted
by impact and collapsed passed audits. Matches pagespeed.web.dev layout.
2026-03-22 19:52:49 +01:00
Usman Baig
fcbf21b715 feat(pagespeed): render page load filmstrip between hero and metrics
Horizontal scrollable filmstrip showing page rendering progression
with timing labels. Appears between the score hero and metrics card.
2026-03-22 19:43:44 +01:00
Usman Baig
50960d0556 feat(pagespeed): render element screenshots in expandable audit items
Shows node screenshots, labels, HTML snippets, and URLs in audit
detail rows — matching pagespeed.web.dev's failing elements display.
2026-03-22 19:18:03 +01:00
Usman Baig
6b00b8b04a redesign(pagespeed): full page redesign inspired by pagespeed.web.dev
- Hero card: large performance gauge + compact inline scores + screenshot
- Single metrics card with 2x3 grid and colored status dots
- Flat diagnostics list sorted by impact with severity indicators
- ScoreGauge accepts size prop for flexible gauge sizing
- Unicode severity markers (triangle/square/circle) per audit
2026-03-22 19:10:47 +01:00
Usman Baig
b0e6db36a1 feat(pagespeed): add screenshot display and expandable diagnostics
- Page screenshot thumbnail next to score gauges
- Expandable audit rows with description and detail items table
- Shows URLs, HTML snippets, wasted bytes/ms for each failing element
- AuditRow component replaces flat diagnostic rows
2026-03-22 18:54:45 +01:00
Usman Baig
2fd9bf82f1 fix(pagespeed): poll for results after async check trigger
Backend now returns 202 immediately. Frontend polls every 5s for up
to 2 minutes until new results appear, then shows success toast.
2026-03-22 18:35:17 +01:00
Usman Baig
d1af25266b fix(pagespeed): increase fetch timeout for manual PSI checks to 120s
PSI checks run mobile + desktop sequentially (up to 60s total).
The default 30s client timeout was causing false network errors.
2026-03-22 18:28:06 +01:00
Usman Baig
52906344cf feat(pagespeed): add PageSpeed page with gauges, CWV cards, chart, and diagnostics
- ScoreGauge SVG component with color-coded circular arcs
- Full page: disabled state, score overview, CWV metrics, trend chart
- Diagnostics accordion with opportunities/diagnostics/passed groups
- Mobile/desktop strategy toggle, manual check trigger
- Loading skeleton, frequency selector
2026-03-22 18:13:08 +01:00
Usman Baig
780dd464a1 feat(pagespeed): add API client, SWR hooks, and sidebar navigation
- PageSpeed API client with types for config, checks, and audits
- SWR hooks: usePageSpeedConfig, usePageSpeedLatest, usePageSpeedHistory
- GaugeIcon added to sidebar under Infrastructure group
2026-03-22 18:05:17 +01:00
Usman
b026476311 Merge pull request #67 from ciphera-net/staging
Landing page redesign, dashboard improvements & new settings sections
2026-03-22 17:17:38 +01:00
Usman Baig
6a1698b794 feat: add Notifications section to settings with Reports and Alerts
- Adds purpose field to report schedule API client
- Adds useAlertSchedules SWR hook
- Reorganizes settings: Reports tab becomes Notifications tab
- Groups existing Reports and new Alerts subsections
- Alert channels reuse report delivery infrastructure (email, Slack, Discord, webhooks)
2026-03-22 16:57:04 +01:00
Usman Baig
1d26819727 feat: simplify uptime page to single auto-managed monitor with toggle
Rewrites uptime page from 978 to ~370 lines. Removes all monitor CRUD
UI (modals, monitor list, selection state). Adds enable/disable toggle
and empty state. Reads the single auto-managed monitor.
2026-03-22 16:51:42 +01:00
Usman Baig
5c30043550 feat: remove uptime CRUD functions from API client
Removes create/update/delete/list monitor functions and request types.
Keeps getUptimeStatus and getMonitorChecks for the simplified UI.
2026-03-22 16:47:15 +01:00
Usman Baig
b7e92abb40 feat: persist script feature toggles to backend
Features (scroll, 404, outbound, downloads, frustration, storage, ttl)
are saved to site.script_features JSONB column on every toggle change.
Values are read from the site object on load.
2026-03-22 15:31:45 +01:00
Usman Baig
e626350f14 fix: use UTC hours for intra-day chart labels to match server timezone buckets
Backend returns timestamps already bucketed in site timezone but as
UTC values. Using getUTCHours/getUTCMinutes prevents the browser
from adding its local timezone offset.
2026-03-22 15:16:20 +01:00
Usman Baig
bd023e76f5 fix: use European date/time formats (en-GB) and guard against undefined dateObj 2026-03-22 15:04:11 +01:00
Usman Baig
c85f305f1e fix: show time labels on X-axis and tooltip for intra-day chart views
Added formatLabel prop to XAxis component. When viewing Today (hour
or minute interval), X-axis shows "2:00 PM" instead of "Mar 22".
Tooltip shows time for intra-day, date for multi-day.
2026-03-22 14:59:24 +01:00
Usman Baig
430e6f5d48 feat: use session cookie auth for public dashboard password flow
handlePasswordSubmit now calls POST /public/sites/:id/auth which
sets an HttpOnly cookie. All subsequent API calls authenticate via
cookie automatically — no password in URLs, no captcha state needed
for data fetching. Simplifies share page state management.
2026-03-22 14:45:25 +01:00
Usman Baig
82a201a043 fix: stop password keystrokes from triggering API calls on public dashboard
Used refs for password/captcha values so loadDashboard doesn't
recreate on every keystroke. Password is only sent to API on
explicit form submit. Also fixes stale captcha state in closures.
2026-03-22 13:52:10 +01:00
Usman Baig
ef21004519 fix: skip auth token refresh for public API endpoints
Public dashboard endpoints use password auth, not session tokens.
A 401 on /public/ should surface to the caller (for password prompt),
not trigger a token refresh that fails and shows "Session expired".
2026-03-22 13:47:02 +01:00
Usman Baig
0805bbaeee fix: improve password protection UX with status badge and remove option
- Shows green "Password set" badge when a password is active
- Simplified placeholder to "Enter new password"
- Added helper text explaining current password persists
- Added "Remove password protection" link for easy removal
- Cleaned up dark-mode toggle styling
2026-03-22 13:40:26 +01:00
Usman Baig
3f3d81a41f fix: style bot filter checkboxes with accent-color orange 2026-03-22 13:30:29 +01:00
Usman Baig
0878bde259 fix: redesign session review as card layout instead of cramped table 2026-03-22 13:25:02 +01:00
Usman Baig
42b7363cf9 feat: add Bot & Spam settings tab with session review UI 2026-03-22 13:16:07 +01:00
Usman Baig
6444cec454 fix: use inline styles for Slack SVG fills to prevent CSS override 2026-03-22 01:06:03 +01:00
Usman Baig
5fc1a33745 fix: use official multicolored Slack logo (pink, blue, green, yellow) 2026-03-22 01:01:58 +01:00
Usman Baig
185cb8699f fix: use white color for Slack icon on dark background 2026-03-22 00:52:29 +01:00
Usman Baig
7e48d70411 fix: use real Slack and Discord brand icons in report schedule modal
Replaced generic WebhooksLogo with actual Slack SVG (pink) and
SiDiscord (blurple) in both the channel selector and the report list.
2026-03-22 00:40:02 +01:00
Usman Baig
4043a678db fix: add proper empty state to Peak Hours with icon and description 2026-03-22 00:16:17 +01:00
Usman Baig
5008992f59 feat: replace Phosphor brand icons with real SVG logos
Uses @icons-pack/react-simple-icons for available brands (Google,
Facebook, Instagram, GitHub, YouTube, Reddit, etc.) and inline SVGs
for brands missing from the package (X, LinkedIn, OpenAI, Bing).
All icons now show actual brand logos with correct colors.
2026-03-21 23:38:55 +01:00
Usman Baig
5b0d0e1dc1 fix: use Phosphor icons for all known referrers, skip unreliable favicons
Google's favicon service returns wrong/low-quality icons for known
services. Now all major platforms, search engines, and AI assistants
use their Phosphor icon directly. Favicons only fetched for unknown
domains.
2026-03-21 23:22:31 +01:00
Usman Baig
9d253523e2 fix: remove bar chart toggle, keep area chart only 2026-03-21 23:05:41 +01:00
Usman Baig
d4e4ca819c fix: add numeric Y-axis to bar chart view 2026-03-21 22:59:41 +01:00
Usman Baig
830da49c5f feat: add bar chart toggle to dashboard
Added visx bar chart component with rounded corners and grow animation.
Dashboard now has area/bar toggle buttons next to the export icon.
2026-03-21 22:55:19 +01:00
Usman Baig
9e128c4945 fix: remove pattern fill from dashboard chart, use gradient only 2026-03-21 22:49:43 +01:00
Usman Baig
9c06a845a0 fix: add missing @testing-library/dom dev dependency 2026-03-21 22:46:37 +01:00
Usman Baig
1270aa99a9 feat: add diagonal pattern fill to dashboard area chart 2026-03-21 22:44:14 +01:00
Usman Baig
d37e817cc9 fix: add legacy-peer-deps to .npmrc for visx React 19 compat 2026-03-21 22:40:52 +01:00
Usman Baig
1c7667562c feat: replace Recharts dashboard chart with visx area chart
Integrated 21st.dev AreaChart component with animated crosshair,
spring-based tooltip, and date ticker. Uses brand orange for the
line/fill with dark-only CSS variables.
2026-03-21 22:39:51 +01:00
Usman Baig
24fa01dd25 fix: reduce funnel segment thickness (0.44 -> 0.3) 2026-03-21 22:30:50 +01:00
Usman Baig
028e4e5425 fix: reduce funnel chart height with wider aspect ratio (4:1) 2026-03-21 22:27:37 +01:00
Usman Baig
6098b5e158 feat: replace vertical funnel with horizontal funnel chart
Switched to horizontal orientation with grouped labels for better
readability across multi-step funnels.
2026-03-21 22:23:47 +01:00
Usman Baig
4ef92b9e3a fix: use monotone interpolation for smooth dashboard chart curves 2026-03-21 22:12:30 +01:00
Usman Baig
93347f6454 fix: revert outer container size, increase inner padding to show more bg 2026-03-21 21:05:46 +01:00
Usman Baig
b3bb0685f9 fix: smooth chart curve data, translucent dashboard, smaller demo container 2026-03-21 21:02:35 +01:00
Usman Baig
9ce272d3e5 fix: smooth chart data and increase outer frame padding for more visible gradient 2026-03-21 20:57:10 +01:00
Usman Baig
0bd2f94dd7 fix: fix div nesting in DashboardDemo 2026-03-21 20:53:04 +01:00