AgentUX

Changelog

What's new in AgentUX Catalogue

Every feature, fix, and improvement from the very first commit.

May 19 – 20, 2026 Saved animation, Videos overhaul & keyboard-first lightbox
  • Lightbox keyboard shortcuts. Single-letter actions while a screenshot is open: E edit, D delete, C crop, B bookmark, A annotate. Each shortcut respects the same permission gate as its icon-bar button; all are skipped while typing in a field, holding a modifier, or with another mode (inline edit, crop, delete confirm) already in flight. One useEffect hosts them all and shares guards.
  • Inline editor keyboard flow. Open with E and the Name field is pre-focused + selected. Tab walks Name → Group → Flow → Theme → Platform → (Web preset / Mobile OS) → Save → Cancel with a visible indigo focus ring on every stop. / cycle the segmented controls (Theme, Platform, Mobile OS). Enter saves from anywhere; Esc cancels. Save button shows a Lucide CornerDownLeft return-key icon for discoverability.
  • Dropdown arrow nav + Enter to select. Type to filter, then / walk filtered options with wrap, Enter picks the highlighted row (or the "+ Create '…'" row in creatable mode). Highlight scrolls into view; mouse-hover re-syncs the highlight so pointer takeover doesn't fight the indicator.
  • Crop: per-handle keyboard nudge. Open crop with C and the top handle pre-focuses; / (top / bottom handles) and / (left / right handles) nudge in 1% steps. Shift+arrow jumps 5%. Tab cycles handles; soft indigo glow shows which handle the keyboard is driving. Lightbox prev/next is suppressed during crop so arrows belong to the handle, not the carousel.
  • "Saved" + the parabolic save animation. "Bookmarks" → "Saved" across every surface (lightbox tooltip, card overlay, toolbar filter, header menu). Icon swaps to lucide's Save (floppy disk). On save, a 64×64 thumbnail of the screenshot launches from the clicked button and arcs along a parabolic path to the toolbar's Save filter button (~1.15s, ease-in-out chord + sin(πt)·140px apex, gentle rotation + scale-down + fade-out). Unsave is silent.
  • Share buttons: Copy icon + morph-to-check. Share icons swap from Link2 (chain) to Copy (two stacked rectangles) on cards + lightbox. On click the Copy icon cross-fades out (scale 0.6, 180 ms) while a green Check bounces in via cubic-bezier(0.34, 1.56, 0.64, 1) overshoot. Holds 1.4 s, morphs back. Title flips to "Copied!" during the success state.
  • OG / Twitter preview cards on /designer/share links. Paste a share URL into Slack / iMessage / Twitter / Discord — a preview card now renders with the actual screenshot, title, and description. New Vercel serverless function at /api/share-meta reads the deployed catalogue.html, fetches screenshot data from Supabase, injects og:image + og:title + og:description + twitter:* meta tags into <head>. SPA boots normally for humans; crawlers read the meta before any JS executes.
  • Group category "Other". Groups that are intentionally neither CEX nor DEX (analytics tools, regulator dashboards, news sites) can now be tagged Other — distinct from Untagged which means "we haven't classified this yet". Migration widens the CHECK constraint, new option appears in the Edit modal + Type filter + bokeh hover label. Neutral slate tag colour so it doesn't compete with CEX (blue) / DEX (purple).
  • Flow chip strip + chip-variant dropdown. Two surfaces of the same data: a horizontal chip strip below the toolbar (one chip per flow, sorted by screenshot count) and an expanded chip-cloud variant of the Flow dropdown (instead of a vertical list). Both read/write the same filterFlow state. User picks presentation (dropdown vs strip) via a two-button toggle inside the Filters ▾ menu — preference persists in localStorage, defaults to dropdown so existing users see no change.
  • Videos: thumbnail-first X-post cards. The Videos section no longer embeds widgets.js on every paint. Each X post now renders as a thumbnail-first card with author + handle + text excerpt + media poster — fetched lazily via a new fetch-tweet-metadata edge function (hits cdn.syndication.twitter.com/tweet-result, batches 20 per call, writes results back to the row). Text-only tweets fall back to a deterministic gradient (hashed from tweet ID) with the excerpt rendered on top. Click the card to open the existing preview modal; / arrow keys + prev/next buttons now navigate between saved references. Closes the "click-to-load X embeds" backlog item — X JS only loads when the user explicitly opens the preview.
  • "Explore latest" empty-state CTA. When filters narrow the catalogue to nothing, an "Explore latest" pill button appears below the message. One click wipes every filter + search + resets sort to default.
  • Visible focus rings on dropdown triggers and segmented controls. outline: none on .dropdown__trigger had been swallowing Tab focus on every dropdown in the app — users were tabbing through invisible focus stops. A :focus-visible ring now matches the open-state border + soft accent glow. Same treatment on the segmented control buttons so arrow-key cycling reads visually.
  • Group filter is case-insensitive. The bokeh-backdrop login click writes normalized lowercase group_keys; the catalogue dropdown writes the original casing from screenshots.group. The query is now ilike-based exact-case-insensitive, and the chip-strip resolver was fixed to also expand single-casing groups (the old rawKeys.length <= 1 bail had been skipping the most common case).
  • Toolbar's Saved button uses lucide's Save icon. Active state reads via the existing amber colour shift in bookmarks.scss — no fill on the floppy (the geometric shape doesn't read well filled). Clean colour shift on its own.
  • Toasts appear over the lightbox. Toast z-index bumped to 1000 (was 300, lightbox sits at 500). "Link copied", bookmark errors, and any other in-lightbox notification surfaces correctly.
  • Share button clicks no longer open the lightbox. The card overlay's Share / Save buttons live inside the preview <button> (nested-button HTML — Safari was swallowing the inner click intermittently). Added event.stopPropagation() on both. Lightbox no longer opens spuriously when you copy a share link or save from the card.
  • Group icon upload no longer blocked by stale project gate. uploadCatalogueGroupIconToSupabase was still gating on scopedProjects.length === 0 — left over from before Project was flattened out in PRs #109 / #110. New groups created via Quick Upload couldn't have an icon attached. Dropped the guard; everything downstream was already ready.
  • Empty catalogue after login. Clicking a group icon on the login bokeh seeded filterGroup with a lowercase key, but screenshots.group stores original case and the query was case-sensitive — silent zero rows, no chip selected to indicate why. Fixed via the case-insensitive query + resolver above.
  • FlowStrip "Rendered more hooks" crash. Early return null sat between two useMemo calls — when a project's flow set toggled empty / non-empty across renders, React's hook count changed mid-flight and threw. Both useMemos now sit before the bail.
May 16 – 19, 2026 Group Detail Pages, Login Backdrop & Lightbox Keyboard Shortcuts
  • Group detail page at /g/<key> — every group now has a dedicated page with header (icon, name, meta, Share + Edit), a sub-nav, and a breakpoint-bucketed thumb grid (mobile / web-narrow / web-medium / web-wide). All cells share a uniform row height; web-medium/wide span two columns and grid-auto-flow: dense packs single-col tiles into the gaps. Concentric radii (outer 18 · pad 10 · inner 8) frame each screenshot. Tabs default to "All", with a 50/page infinite scroll; the Group View dock chip and a single-group filter now both redirect to this page.
  • Lightbox keyboard shortcuts — single-letter actions while a screenshot is open: E edit, D delete, C crop, B bookmark, A annotate. Each respects the same permission gate as its button; all are skipped while typing in a field or holding a modifier key.
  • Inline editor keyboard flow — open with E and the Name field is pre-focused + selected. Tab walks through Name → Group → Flow → Theme → Platform → Web preset / Mobile OS → Save → Cancel with a visible indigo focus ring on every stop. / cycle Theme, Platform, and Mobile OS segmented controls. Enter saves from anywhere (with the dropdowns getting their own Enter behaviour). Esc cancels.
  • Dropdown arrow navigation + Enter to select — type to filter, then / walk through filtered options with wrap, Enter picks the highlighted row (or the "+ Create '…'" row in creatable mode). Highlight scrolls into view automatically; mouse-hover re-syncs the highlight so pointer takeover doesn't fight the indicator.
  • Crop: Esc cancels, Enter applies, and arrows nudge each handle — open crop with C and the top handle pre-focuses; / (or / on vertical handles) nudge in 1% steps, Shift+arrow jumps 5%. Tab cycles through all four handles. Click any handle to focus it; a soft indigo glow shows which one the keyboard is driving. Lightbox prev/next is suppressed during crop so arrows belong to the handle, not the carousel.
  • Login page bokeh backdrop — replaces the placeholder geometric SVG with a scatter of ~50 group icons across the viewport, heavily gaussian-blurred at rest, hover one to focus (crisp + brand-coloured ring + glow + label with name / screenshot count / category · region). The two-way wobble + pendulum animation are sine-smooth thanks to a from/to + alternate infinite pattern. Click any icon to pre-seed the catalogue's group filter for after sign-in (lazy useState initialiser, no flash of unfiltered catalogue). "Don't have a passcode? Ping @yamparalarahul1 →" replaces "Ask the admin".
  • Bayer-dithered 404 page — soft-404 for unknown groups (/g/<not-a-group>), plus a branded "Back to catalogue" affordance. The interactive Bayer dither + click-to-randomise echo the site's emerging visual vocabulary.
  • Catalogue toolbar filter icons + sort icons — leading icons next to Filter / Group / Flow / Group View dropdowns, plus icons on Sort options. Each Group filter dropdown row also now renders its group's appearance icon next to the name.
  • Clickable group labels — the group chip on every catalogue card, every screenshot in the lightbox header, and the meta-line chip in the lightbox comments panel are all clickable. They navigate to /g/<key> via a scoped linkTo prop, so share-page H1 and other read-only consumers stay non-interactive.
  • "Explore latest" empty-state CTA — when filters are active and nothing matches, a pill button under the message clears every filter + search + resets sort to default in one click. The "No screenshots yet" first-upload empty state is untouched (that one needs Upload, not "clear filters").
  • Screenshot framing across catalogue, group detail, and lightbox. The <img> in every ThumbHashImage consumer now auto-sizes to its natural bounds (capped to the wrapper), so any border-radius / box-shadow applies to the visible screenshot rectangle, not the letterboxed container. Catalogue cards get a 4px top-only rounding + 1px hairline; group-detail thumbs get the full frame (outer 18 · pad 10 · inner 8); the lightbox image rounds 8px with a 1px white-22% stroke that hugs the contained image rect.
  • Group + Flow filter chips are default-visible in the toolbar. First-time users were landing on an empty toolbar that hid the only path to understand "No matching screen families". The default for catalogue:toolbar-visible-filters flips from [] to ['group', 'flow']; existing users who'd hidden either chip keep their localStorage choice.
  • Visible focus rings on dropdown triggers and segmented-control buttons. outline: none on .dropdown__trigger had been swallowing tab focus on every dropdown in the app — users were tabbing through invisible focus stops. A :focus-visible ring now matches the open-state border colour with a soft accent glow. Same treatment on the segmented controls so arrow-key cycling reads visually.
  • Lightbox media padding + concentric framing. The lightbox image area now has 32px horizontal padding so the screenshot doesn't crowd the surrounding chrome. A new inner wrapper carries the contain-math measurement so all annotation positioning stays accurate after the padding change.
  • Toasts now appear over the lightbox, not behind it. The .toast class was at z-index: 300, but the lightbox backdrop sits at 500 — so "Link copied", bookmark errors, and any other in-lightbox notification was rendering below a dimming layer and going entirely unseen. Toast bumps to z-index: 1000, still below the welcome-modal layer (9999).
  • Group detail screenshot count stale after upload / delete / restore. Cache invalidation now fires on mutate so the count badge stays honest.
  • Capability-broadcast audit follow-up. Flow label and variant details changes invalidate the full-scope cache so other tabs / sessions pick up the new values without a manual reload.
May 15, 2026 Role System, Marketing Bucket & Capability-aware UI
  • Per-role capability system — every member now holds a role (Admin, Researcher, ResearcherAI, Marketing, QA), and every role holds a set of capability strings (upload, delete_own, delete_any, edit_metadata, share, labeling_studio, manage_members, manage_flags). Capabilities are enforced server-side via RLS — only delete_any can soft-delete others' uploads; delete_own + ownership match (uploader_email = me) lets owners delete their own; edit_metadata is the cross-team metadata-edit gate. Two SECURITY DEFINER helper functions (current_member_role, current_member_has_capability) keep the policies tight.
  • Members panel role dropdown — a new Role column with a per-row dropdown for assigning + changing roles. The Add Member modal also picks the role at mint time. Last-admin demotion is blocked server-side (409 last_admin) so you can't accidentally lock yourself out of the admin panel.
  • Roles admin panel — new Settings → Team → Roles sub-tab. List view shows every role with its current capabilities (as chips) and member count. Edit modal flips capabilities via a checkbox grid; the Save button surfaces the blast radius ("Save (affects 3 members)") before committing. Custom roles are first-class: create with a lowercase id, name, description, capability set; delete unused ones. Admin (the only system role) shows a "cannot edit" hint and no action buttons.
  • Marketing Bucket — lightweight workflow for the Marketing role. Their Quick Upload locks the Group selector to a hardcoded Marketing Bucket group and exposes a "Suggested catalogue group (optional)" free-text input. When an Admin opens one of these uploads in the lightbox, the suggested group appears as a hint above the Group dropdown — promote it to the catalogue by editing the group via the existing dropdown. No new actions, no new tables, no approval queue. (The approval-workflow design is parked for future content types that genuinely need vetting.)
  • UI affordances gate by capability — Quick Upload hidden when the caller lacks upload; Share hidden without share; Labeling Studio nav opens to anyone with labeling_studio (ResearcherAI now reaches Studio without being admin). Delete and Edit buttons on cards and in the lightbox hide entirely when the caller can't act on that specific family — RLS still enforces server-side, this just stops showing buttons that would silently fail.
  • Upload progress card now shrinks correctly after uploads complete. The leave-animation effect was cancelling its own removal timer whenever a new item changed state, so completed items stayed stuck in the ribbon at width 0 but full height — holding the card at full height long after everything finished. Drop the cleanup return so the timer always fires.
  • Mobile bulk action bar redesigned — the previous layout stacked the four action buttons one-per-row, eating ~280px of vertical space. New phone layout: row 1 = count + close, row 2 = four icon-only action buttons stretched evenly across the bar with big tap targets and labels swapped for aria-label / title. Tablet keeps icon+text inline; desktop unchanged. Also fixes the "1 families selected" grammar.
  • Soft-delete toast is role-aware. Admin still sees "Moved to Trash. Recoverable for 15 days." Non-admin roles see "Deleted." instead — accurate for them since the Trash view currently lives inside the admin-only Settings section.
  • The legacy admins table mirrors role changes automatically. Promoting a member to the Admin role inserts the matching row; demoting deletes it. Keeps the existing useIsAdmin hook working unchanged while the role column becomes the source of truth.
  • Delete UI no longer silently fails. Clicking Delete on a screenshot you didn't own previously optimistically removed the card and showed a "Moved to Trash" toast — but the underlying UPDATE was rejected by RLS (0 rows updated, no error). On refresh the card came back. The handler now .select('id')s the updated rows and restores local state if zero come back, with a clear "You don't have permission to delete this" toast.
  • Marketing role ownership tracking was pointed at the wrong column. The initial role-system migration accidentally added a duplicate uploaded_by column on screenshots, while the existing uploader_email column was the one being populated by every insert via the existing helper. The three ownership-dependent RLS policies (insert with check, update own, delete own) pointed at the duplicate. A reconciliation migration drops the duplicate and re-creates the policies keyed on uploader_email — same security model, no client changes required.
May 13 – 14, 2026 Auth Gate, RLS Hardening & Telegram Bot Security
  • Passcode login screen — the old self-asserted email prompt is gone. Visitors now land on a full-page PasscodeLogin and must redeem an admin-minted passcode (argon2id-hashed server-side) to get a real Supabase Auth session. 90-day refresh token keeps members signed in across reloads. Wrong passcode is rate-limited: 5 failed attempts trigger a 15-minute lockout with a live countdown.
  • Members admin panel — new Settings → Team → Members subtab for admins. Mint, rotate, disable, or remove member passcodes; force log-out everywhere; reset lockout counters. Add-member modal generates a fresh XXXX-XXXX-XXXX passcode and reveals it once with a one-click Copy. Self-protect on the admin's own row (no disable / delete icons). Mobile renders the same data as cards.
  • Log out everywhere in the profile menu — calls signOut({ scope: 'global' }) to invalidate every refresh token issued to the user, kicking out all other tabs and devices.
  • Row Level Security across the database — the 11 catalogue tables that previously had RLS disabled are now locked down. Permissive policies for authenticated users; anon role can only read non-deleted screenshots (so public share pages keep working). Storage buckets follow the same pattern: public read for share-page images, authenticated-only for writes.
  • scan-secrets hook on the dev side — a PostToolUse hook that redacts secret-shaped strings (JWTs, Stripe / GitHub / Google / Telegram tokens, AWS keys, PEM blocks, named env-var assignments) from Bash output before they enter Claude Code's context. Closes the "cat .env" bypass that the deny list alone couldn't catch.
  • Admin gate switched from hardcoded email to the admins table. Multiple admins can now share Settings / Members / Studio access — backed by RLS-readable rows rather than a string literal in code. Both bootstrapped accounts have full admin reach.
  • Edge Function CORSauth-login, auth-admin, and purge-orphan-storage all gained CORS headers + OPTIONS preflight handlers. Browser fetch calls no longer get silently blocked at preflight.
  • Telegram bot allow-list flipped to fail-closed. Previously, an unset ALLOWED_TELEGRAM_USER_IDS env meant any Telegram user could upload to the catalogue. Now an empty list rejects everyone — including the operator, on purpose, so the misconfiguration is loud.
  • Pre-public-release checklist in CLAUDE.md rewritten as a "done" note. The three blockers that gated linking the catalogue from hirahul.xyz (auth gate, RLS, Claude permissions) are all closed.
  • Telegram webhook verification — the bot endpoint was reachable by anyone who learned its URL. Added TELEGRAM_WEBHOOK_SECRET env that's compared against the x-telegram-bot-api-secret-token header Telegram echoes on every delivery. Missing or mismatched header now returns 401 before any DB writes.
  • Personal Telegram user ID redacted from docs/telegram-bot-setup.md. The setup doc was committing a real numeric ID as the "Adding more allowed users" example; replaced with a placeholder.
  • "Allow all" public-role policies dropped on comparisons, connections, flows, projects, and screenshots. These were the second back door alongside the RLS-disabled tables — RLS was technically on, but the policy said "anyone can do anything." Replaced with authenticated-only equivalents.
  • Mobile toolbar Quick Upload — the text button was leaking onto narrow viewports next to the search icon. Hidden below 960px so mobile only shows the icon button.
  • Storage bucket policies tightened — public INSERT and public DELETE on the screenshots bucket are gone (anyone could previously overwrite or delete any uploaded screenshot). Anon write policies on catalogue-group-icons dropped the same way. Public read stays where the share page needs it.
May 13, 2026 Categorised Search Modal
  • Catalogue search modal — Cmd+K (or Option+Space) opens a Spotlight-style modal that searches across Groups, Flows, and Screenshots at once. Each category gets its own section with match counts; up to five results per category before a "+N more" indicator. The screenshot results render as vertical cards with thumbnails in a horizontal scrolling row — click to filter the catalogue to that exact screenshot.
  • Click actions — selecting a Group filters the catalogue to that group; a Flow narrows to that group + flow; a Screenshot narrows further by platform and search query so the card surfaces immediately. Modal closes on select.
  • Keyboard nav — ↑/↓ and ←/→ move across results, Enter selects, Esc closes. Cmd+K / Option+Space toggle the modal. Shortcuts are suppressed while typing in any input so they don't fight with paste / undo.
  • Recents — the last five queries persist across sessions in localStorage and surface as one-tap shortcuts when the modal is empty.
  • Group icons — uploaded group icons render in the result row; groups without an uploaded icon fall back to a generic Lucide LayoutGrid.
  • HTML mockup preserved at docs/mockups/mockup-2026-05-13-catalogue-search-modal.html as a before/after visual reference. Static screenshots of the modal in action live alongside it. Future feature: surface these from the changelog page directly.
  • Toolbar search — the inline desktop search pill is gone, replaced by a Search icon sibling to the Share icon on the right side of the toolbar. Single discovery point across desktop and mobile.
  • Mobile search — the mobile Search pill now opens the same categorised modal full-screen, instead of expanding an inline search row. One mental model for everyone; the inline expandable row has been removed.
  • Full-scope query picks up name, file_name, and storage_path so search can match on screenshot names and render real thumbnails for top results.
May 11 – 12, 2026 Trash, Groups Taxonomy & Carousel Share View
  • Trash with 15-day Restore — deletes are now soft. Cards move to a new Settings → Team → Trash tab where each row shows thumb, name, group/flow/platform, who deleted it, and when. One-click Restore. A pg_cron job at 03:00 UTC permanently purges anything older than 15 days. The delete confirm now reads "Move to Trash. Recoverable for 15 days". Cards animate out with a blur + fade + scale dissolve (~280ms) so the removal feels intentional, not abrupt.
  • Groups Type / Region taxonomy — tag each group as CEX or DEX, and as India or Global. Tags render as coloured pills on each group card. New filter bar above the Groups grid: search input + Type radio + Region radio (each with an Untagged option, AND across axes). Filter state mirrors to URL params (?q=&type=&region=) via replaceState, so links are shareable and back/forward restores correctly. The Edit-group modal grew two segmented radio rows for setting Type and Region; icon uploads no longer wipe the taxonomy.
  • Share view: List ⇄ Carousel toggle — public share links can now be viewed as the existing vertical list or a new carousel. The toggle sits next to the title; URL persists the choice (?view=carousel). Carousel uses a peek layout on desktop (~75% centre, ~12% prev/next neighbours dimmed and blurred), full-width single screen below 768px. Arrows, dots, keyboard ( Home End), touch swipe, click-on-peek to jump. Deep-link to a specific step via ?view=carousel&step=N. Edge cases handled: single screen (no chrome), two screens (no peeks), first/last (matching arrow + peek hidden).
  • Share view: Last-updated pill in the header, with a Clock icon and relative time ("2h ago"). Hover/focus reveals the full date in a tooltip. Header logo centres when no timestamp is available.
  • Share view: Footer attribution links"Powered by AgentUX · Built by Yamparala Rahul". AgentUX opens agentux.hirahul.xyz/designer/, Yamparala Rahul opens the portfolio at www.hirahul.xyz. Both open in new tabs.
  • Auth gate design spec — frozen-at-decision document for the upcoming public-release auth gate: per-email passcodes (argon2id hashed), Supabase Edge Functions for login + admin operations, a Members admin panel inside Settings → Team. Lives at docs/security-auth-passcode-and-members.md. Implementation lands in a follow-up PR.
  • Share view header — the "AgentUX Catalogue" wordmark next to the logo is gone. Logo only on the left, last-updated pill on the right (or logo centred when no timestamp). Cleaner, less visually noisy.
  • Share view logo — the source SVG contains both the icon mark and a wordmark; previously it was pillarboxed inside a forced square, making the visible mark tiny. Now sized to the icon's natural aspect (~55×56 in the header, ~29×30 in the footer) with the wordmark cropped off via object-fit: cover.
  • Share view meta line — replaced text labels with lucide icons: User for the sharer, Images for the count, Monitor / Smartphone for platform.
  • Share view state visuals — Loading shows a spinning Loader2, errors show AlertTriangle, empty shows Inbox. Less text, more glance-able.
  • Delete confirms updated everywhere — per-card, lightbox, and bulk-select dialogs all now read "Move to Trash. Recoverable for 15 days from Settings → Team → Trash." instead of the old "cannot be undone" copy.
  • Groups view card layout — edit pencil moved into the meta row (top-right of the card); screenshot count drops to its own line below. Tag pills (when set) render below that.
  • Bookmark filter leaked through on mobile — the toolbar's bookmark-filter button is tagged catalogue-toolbar--desktop-only, but a higher-source-order rule in bookmarks.scss overrode the display: none via equal specificity. Now hidden on viewports ≤ 960px via an attribute-scoped rule that only targets the filter button (Share button next to it stays visible on mobile).
  • Mobile carousel arrows took horizontal room for no benefit on touch viewports. Hidden below 768px — swipe and dots already convey navigation.
  • Portfolio link in share footer didn't load in Safari for some users — it pointed to the apex domain (hirahul.xyz). Switched to www.hirahul.xyz.
May 7 – 9, 2026 Identity pill, Logout, Drag-Drop Upload & Progress Ribbon
  • Identity pill in the header — replaces the hamburger menu. Click reveals a dropdown with the signed-in email, a ★ My bookmarks toggle (flips the toolbar bookmark filter), Settings, Team (admin), Labelling Studio (admin), and Logout. When no email is set the pill becomes a Sign in CTA.
  • Drag-and-drop to Quick Upload — drop image files (or a top-level folder of images) anywhere on the catalogue grid and they queue into the Quick Upload modal. Folders walk one level deep; subfolders are skipped. Non-image files are silently filtered, hidden files (.DS_Store etc) ignored, and drops are capped at 200 files with a toast if exceeded.
  • Upload progress ribbon — bottom-right slim card with a thumbnail per file. Each box shows live status: queued, uploading (spinner), uploaded, or failed (red badge with error). Successful uploads fade out (blur + scale + width-to-zero) and the ribbon shrinks; the card itself shrinks to fit. A Retry failed button appears whenever any item failed and re-runs only those. Auto-dismisses 2s after a clean run; persists with errors visible until dismissed.
  • One identity, one email. The bookmark-only email key (agentux:bookmark-email) and its prompt modal are gone — bookmarks now read the same login email used for comments, annotations, and label review. Guests bookmarking a card open the standard login modal instead of a separate flow.
  • The legacy "Uploading screenshots…" canvas overlay is gone. The progress ribbon is the single source of truth for upload status now.
  • Drag-drop overlay no longer covers the Quick Upload modal — when the modal is already open, the global drop handler stands down so the modal's own drop zone takes the files.
  • Upload outcomes were silent — the toast briefly flashed then nothing, leaving users wondering whether the batch succeeded. Per-file status in the ribbon makes outcome unambiguous, and individual errors are now surfaced with the actual error message.
May 6 – 7, 2026 Labelling Studio, Comments Polish & Lightbox Focus
  • Labelling Studio (admin) — paste-or-type structured metadata per screenshot. Six sections: Identity, Journey, Screen analysis, Visual design, Design reference, Review. Auto-fills platform, device type, theme, and flow name from existing metadata on first open. New Paste JSON modal with live preview so an AI-generated JSON blob can populate the editor in one click; pasted verified status is silently downgraded to draft so paste cannot bypass human verification.
  • Database-aggregated status totals at the top of the Studio so admins see how many screenshots are still unlabelled, drafted, in review, or verified — across the whole catalogue, not just the loaded grid. Refreshes after every save.
  • Public catalogue filter chips driven by label data — Page type, UI element, UX pattern, and Screen state. Search also matches labelled title and one_line_summary.
  • Lightbox area focus — clicking an area annotation dims the rest of the screenshot via a stacked box-shadow. Click outside or press Esc to clear.
  • Comments simplified to delete-only — Resolve concept removed (no green pills, no "Resolved by …" copy). Admin can delete any comment; authors keep delete on their own.
  • Annotations: admin can delete any annotation (mirrors comments). Existing pin annotations from before pin-creation was disabled are now deletable by the admin.
  • Card surface (grid): the comment-count chip and the misleading pencil button (labelled "Open preview" but opened the editor) are removed. Card click is the only entry; edit is reachable from inside the lightbox.
  • Studio context in the lightbox: only the Label tab renders; Comments and Annotations are hidden. Action toolbar reduced to Edit (pencil) only — Crop, Bookmark, Comments, Annotations, and Delete are hidden in admin-labelling mode.
  • Reference Image attachments are now behind a feature flag (REFERENCE_IMAGES_ENABLED, off by default). Existing data preserved; flip the flag to re-surface the "Ref" chips, the upload UI in the inline editor, and the gallery side panel.
  • TypeScript error that silently hid the Studio and Team menu entries — the canViewTeam → canAdmin rename was missed at the call site between Catalogue.tsx and CatalogueHeader.tsx. Both menu entries now appear for admins.
  • Studio grid was capped at 50 screenshots because it used the paginated source without scroll-load. Now loads progressively as you scroll, matching the catalogue grid behaviour.
May 2 – 4, 2026 Edit-Icon Modal, Four-Side Crop & Sticky Quick Upload
  • Quick Upload now opens at sensible defaults — Dark theme, Web platform, 1512 web preset (and iOS when Mobile is picked) — and field values stick within a browser session: Flow, Group, Platform, Theme, preset, and Mobile OS persist across modal close, successful uploads, and reopens. A page reload returns to defaults.
  • On the first Quick Upload open after a page reload, single-value catalogue toolbar filters (Flow, Group, Platform, Theme, Web preset, Mobile OS) seed the modal so a filtered context carries naturally into upload.
  • Lightbox crop now supports all four sides — left and right handles alongside the existing top and bottom. Combine any subset of trims in one pass; the footer reads T · B · L · R and the final width × height. Annotations re-project across both axes — pins outside the kept rectangle are removed, area annotations clip and re-percent over the new dimensions.
  • Edit Icon for catalogue groups is a focused modal — paste an image with ⌘V / Ctrl+V, drag-and-drop, or click the dropzone. Replaces the old inline editor row.
  • Group appearance: the Emoji field has been removed from the editor, the lib layer, and the database (icon_emoji column dropped). Uploaded icon is the only icon source; first-letter avatar is the fallback.
  • supabase/.temp/ added to .gitignore (Supabase CLI-generated metadata).
May 1, 2026 Group Rename, Live Chip Strip, Lucide Icons & Toolbar Polish
  • Lucide icon library across primary surfaces — header, toolbar, chip strip, lightbox actions, bulk bar, dropdowns, modals, scroll-to-top, view toggle, and confirm dialogs all use Lucide icons in place of the older inline SVGs / Unicode glyphs.
  • Toolbar's Quick Upload button doubles as Upload All (N) while the Quick Upload modal is open — kick off the upload from the toolbar without scrolling to the modal's footer.
  • Group chip strip now refreshes instantly when a screenshot's group changes (bulk move, single change, or admin rename) — no reload required.
  • Chip strip aggregates groups case-insensitively. Coinbase and coinbase now show as one chip with the combined count; clicking it filters across every casing.
  • Renaming a group from Team Settings is now a true rename. Saving a new name opens a confirm dialog ("Rename X → Y, affects N screenshots"), then runs a single project-wide UPDATE that catches every DB casing under that canonical, and refreshes the appearance label to the new key.
  • Team Settings project picker dropped (single-project workflow). Per-project appearance logic still works internally.
  • Upload Analytics tab in Team Settings is now hidden by default. Default sub-tab is Flows.
  • Sort button on the chip strip simplified to label + chevron; the redundant up/down arrow icon was removed.
  • Past partial bulk renames that left mixed casings in the DB (e.g. some Coinbase, some coinbase) can now be cleaned in one Team Settings save — the rename merges every casing under the new name.
Apr 30, 2026 Group Chip Strip, Folder Upload & Toolbar Polish
  • Group chip strip above the toolbar — one chip per group, click to scope into that group with a shareable ?group= URL. Paused by default; resume the ticker from the sort menu. While paused, scroll the strip horizontally with no visible scrollbar. Honors prefers-reduced-motion.
  • Sort menu next to the strip (Recent · A–Z · Count) is the single source of truth for between-group ordering, and now also drives Grid view section ordering. Preference persists in localStorage.
  • Folder drag-and-drop in Quick Upload — drop a folder onto the Quick Upload zone and its name auto-fills the Flow input (only when empty; typed values are preserved). Images inside, plus any loose images dropped alongside, all queue together. Multi-folder drops are rejected with a toast; non-image files are skipped with a count.
  • Floating scroll-to-top button on the catalogue — appears after 600px of scroll, smooth-scrolls to the top, hides itself when at the top.
  • Lightbox crop — trim the top and/or bottom of a screenshot from the lightbox. Two horizontal drag handles, live size readout, a Preview toggle that shows the cropped result before committing, and Apply replaces the original (no version row to keep storage tight). Existing annotations on the screenshot are auto-shifted and clipped to the new bounds; ones fully outside the kept area are removed.
  • Toolbar default is now a clean slate — first-time users see only Search and Filters ▾ (renamed from + Filter for label consistency). Filters opt in one at a time via the dropdown. Existing users keep their saved visibility selections.
  • Toolbar layout: Quick Upload stays pinned to the right at all times. When many filters are visible, the filter row absorbs the overflow with a hidden-scrollbar horizontal scroll instead of wrapping to a new line.
  • Header reflowed — AgentUX logo pinned to the left, Catalogue / Videos / Links tabs centered, ☰ menu remains on the right.
  • Bulk Change Group dialog now uses a searchable combobox (matches the sibling Bulk Change Flow dialog) — type to find a group, press Enter to create a new one. Replaces the wall of chips that stretched the modal vertically with many groups. Primary group badge preserved.
  • Reupload icon hidden in the lightbox (feature-flagged off) now that Crop covers the common "fix this screenshot" case.
  • Card thumbnails now fit the whole screenshot inside the card (object-fit: contain) instead of cropping the edges. The blurred thumbhash placeholder fills the letterbox so there's no transparent gap.
Apr 29, 2026 Area Annotations, Annotation Filter & Bulk Flow
  • Area annotations — drag a box on any screenshot in the lightbox to mark a region (e.g. "Sign-up modal"), name it, and save. Old point pins still render as legacy data; new annotations are areas by default (a feature flag toggles pin creation if needed).
  • Toolbar Annotation filter — multi-select with built-in search; pick one or more annotation labels and the catalogue narrows to every screenshot tagged with them, scoped across the full DB regardless of pagination.
  • Composer autocomplete — when naming an annotation, suggestions appear from your full set of existing labels so naming stays consistent.
  • Bulk Change Flow — select multiple families and assign or remove a flow with one click, mirroring Change Group; combobox search includes a "Remove flow from N" action for unassigning in batch.
  • Annotations live in their own screenshot_annotations table with a one-time backfill from the legacy metadata blob, plus a screenshots_with_annotation_labels RPC for case-insensitive label lookup.
  • Annotation editing is desktop-only (≤720px viewports show existing annotations read-only); the Add control hides and a small notice appears in the panel.
  • Concurrent annotation edits no longer race — each pin/area is its own row instead of being part of a single overwritten JSON array.
  • Annotation count and "last added" timestamps are now hydrated from the table for grid badges, family counts, and view-by sorting; changes propagate without a refetch.
  • The "Annotations added" view-by option was removed from the dropdown — the new multi-select replaces it. "Comments added" view-by is unchanged.
  • Shared Dropdown component supports an opt-in searchable prop with a search input + filter, used by the Annotation filter today.
  • Toolbar search now also matches Group names — typing a group like "Binance" surfaces every screenshot in that group alongside name and filename matches, with no UX change to the search input or filter chips.
  • Quick Upload side panel no longer hides under the sticky toolbar when scrolling — the panel is now offset by the toolbar height so the close button and Flow input stay reachable.
Apr 28, 2026 Lightbox & Quick Upload Polish
  • Lightbox keyboard navigation — arrow keys step between screenshots without leaving the preview
  • Lightbox auto-loads the next page when you arrow past the loaded boundary; spinner overlay while it fetches; "End of catalogue" toast at the very last screenshot
  • Lightbox now uses the app's confirm modal for deletion (no more native browser dialog) and jumps to the neighbor screenshot after delete instead of closing
  • Closing the lightbox highlights the last-viewed card with a soft 3-second accent glow and scrolls it into view
  • Quick Upload: Group field is now a search-and-add combobox sourced from every group across your projects (no longer limited to paginated rows)
  • Quick Upload: Flow field is a search-and-add combobox over existing flows, with free-type for new ones
  • Toolbar filters for Group and Flow now support multi-select
  • Quick Upload group UX collapsed: removed the auto / existing / new chip switcher in favor of one combobox; empty input falls back to per-file filename-parsed group
  • Quick Upload header tightened — dropped the subtitle and project picker; Theme paired with Group assignment
  • Flow name is now required to upload — Upload All stays disabled with an inline hint until a flow is set
  • Multi-file drop occasionally lost files when async work ran between the drop event and the read — DataTransfer entries are now snapshotted up front
Apr 27, 2026 Catalogue Goes Solo — Repo Split & Cleanup
  • Links section announced (coming soon) — save URLs alongside screenshots and videos
  • Dedicated Telegram Bot section on landing page
  • Repository stripped to Catalogue-only: screenshots, videos, and links (144 files removed, 28k lines trimmed)
  • Dev Mode, Flow Builder, Feature Log, Compare View, Archive, and Figma sections moved to AgentUX-other
  • Landing page rewritten: "Screenshots. Videos. Links." — focused entirely on Catalogue
  • Header tabs simplified to Catalogue + Videos
  • Vite config and Vercel rewrites updated for single-app deployment
  • Removed @xyflow/react and @dagrejs/dagre dependencies (Flow Builder only)
Apr 20, 2026 ThumbHash Image Placeholders
  • ThumbHash placeholder system — blurry 28-byte previews render instantly before full images load
  • ThumbHash generated on every screenshot upload and stored in the database
  • ThumbHashImage component with blur-to-sharp crossfade transition (0.3s ease-in)
  • Database migration adding thumb_hash column to screenshots table
  • Catalogue family cards now use ThumbHash placeholders instead of blank/progress-bar-only loading
  • Landing page updated with ThumbHash feature mention
Apr 15 – 17, 2026 Telegram Bot, X Video Links & Feature Log Improvements
  • Telegram bot Edge Function — share screenshot images from your phone and they land in the Catalogue "Social" group
  • X (Twitter) video link support in Telegram bot — paste an X post URL and it's added to the Videos section
  • Duplicate detection for X posts — bot replies with "already in catalogue" instead of failing
  • Archive link added to landing page navigation
  • Feature Log: renamed "Designed" status to "Reference" for clearer intent
  • Feature Log: cards are now clickable for faster navigation to detail views
  • Feature Log: replaced text back-link with an icon back button
  • Landing page updated with Telegram bot, archive compare, and X video link features
  • Reduced image loading progress bar from default height to 1px for a subtler loading indicator
Apr 14, 2026 Feature Log Lifecycle, Global Scope & Navigation Restructure
  • Feature Log tab with planned/reference/shipped grouping and feature CRUD
  • Feature detail view with separate Shipped and Reference sections
  • Global screenshot link picker for linking existing screenshots into features
  • Archive menu surfaces for Flow Builder and Projects (read-only context)
  • Catalogue header now uses primary tabs (Catalogue, Feature Log, Videos) with a right-corner menu
  • Team and catalogue filter scope now default to full DB view instead of project-scoped pages
  • Feature edit modal now supports manual status override alongside title and description edits
  • Mark Shipped flow now prompts clearly when shipped evidence is missing
  • Feature link picker visual polish (single-stroke controls, cleaner metadata tags, image fit containment)
  • Catalogue preview cards now include a bottom loading progress indicator while images are resolving
Apr 7 – 8, 2026 Folder View, Group Appearance & Gallery Workflow
  • Folder view on CD page — groups render as brand cards with swipeable carousel previews
  • Group appearance system — custom icons (Supabase-backed upload), descriptions, and status badges per brand
  • Gallery inline editor and feedback panel for reviewing screenshots in-context
  • Team section group management with 32px section icons
  • Bulk webapp-to-Figma capture SOP and runner template
  • CD page now uses the same dark theme tokens as the main Catalogue (removed Nothing Design system)
  • Group rename and icon updates no longer require a project selection
  • React hook-order error in gallery view
  • Header tabs styling on CD page
  • CI pipeline — upgraded vite to patch 3 high-severity vulnerabilities
Apr 6, 2026 Compare Mode, Team Flows & CD Page Experiments
  • Compare mode — side-by-side flow comparison across primary and vs groups
  • Team section with Flows sub-tab and Figma Prototypes tab
  • CD page with Nothing Design light theme for layout experiments
  • Catalogue rename script for local batch execution
  • Quick upload improvements with enhanced naming conventions
  • Max-lines build failures from compare mode additions
  • Gallery preview image fit
Apr 4 – 5, 2026 Videos Tab, AgentUX Branding & CD Page
  • Videos section in Catalogue for design references and competitive UX studies
  • CD test page (/designer/cd) for prototyping new layouts
  • AgentUX logo in all designer headers
  • List-view UX updates with improved inline editing
  • Family grouping and legacy fallback for older screenshots
  • Desktop/mobile UI scoping and card delete modal
Apr 3, 2026 Mobile UX Overhaul & Filter Sheet
  • Filter bottom sheet replacing inline filters — 11 iterations to get it right
  • Redesigned lightbox preview with compact layout and minimizable bottom sheet
  • Floating search with collapsible pill on mobile
  • Inline toolbar pills for search and upload on mobile
  • Team upload analytics (admin-only)
  • Reference removal actions and gallery zoom toolbar
  • Preview-first catalogue UX restored as default interaction
  • Header tabs repositioned with platform icons
  • Catalogue inline editing and comment workflows refined
  • Modal rendering and list inline editing
  • Details modal sticky save footer
  • Upload modal scroll on small screens
  • Search pill positioning and toolbar overlap on mobile
Apr 2, 2026 Catalogue Core Features
  • Sorting controls and refined toolbar layout
  • Quick upload flow with lightbox rename
  • Annotations and multiple view modes (grid, list, gallery)
  • Filter and gallery controls
  • 700-line max rule enforced in CI
Apr 1, 2026 Flow Builder Canvas Enhancements
  • Multi-path flow insert with node deduplication
  • Undo support, placeholder flow insertion, and auto-refresh
  • Text-flow studio, flow compare, and catalogue sidebar
  • New flow steps and catalogue additions no longer overlap existing nodes
  • Viewport preserved during canvas auto-refresh
Mar 28, 2026 Designer Flow Builder
  • Standalone web-based Flow Builder with drag-and-drop canvas
  • Screenshot upload with auto-naming and flow connection
  • Catalogue sidebar for managing screenshots alongside flows
Mar 21, 2026 Landing Page & MVP Definition
  • Static landing page at agentux.hirahul.xyz
  • Vercel deployment configuration
  • AgentUX flow MVP specification
Mar 18 – 19, 2026 Project Launch
  • Initial appmap package — interactive app map visualization for React
  • Auto-detection for Next.js App Router, Pages Router, and React Router
  • Runtime route transition tracking
  • Floating dev button with draggable positioning
  • Markdown + JSON export for AI agents
  • Published as @yamparala27/agentux on npm
  • CI/CD pipeline, security policy, and open-source governance
  • "use client" directive for Next.js App Router compatibility