Commit Graph

20 Commits (main)

Author SHA1 Message Date
boban 3eada67b9a fix(sidebar): remove collapse, fix mobile overlay and blur effect
- Remove desktop collapse feature — sidebar always open at 264px
- Simplify Alpine sidebar store to mobileOpen only
- Fix mobile overlay: add x-data to #nim-app so Alpine processes x-show/x-transition
- Mobile overlay uses direct backdrop-filter: blur(4px) bypassing Tailwind v4 CSS variable chain
- Fix close/workspace-trigger overlap: restructure header as flex row with close as sibling
- Clicking overlay (z-30) closes sidebar; sidebar stays at z-40

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-17 14:34:33 +02:00
boban e36ecb1dba fix(BUG-2): sidebar pure Tailwind, revert logo, fix mobile translate
- Replace all inline style= with Tailwind classes (except progress bar width)
- Remove onmouseenter/onmouseleave JS hover handlers → hover: Tailwind classes
- Revert ws-logo to /brand/logo-mark.svg (user requirement)
- Fix mobile: 'transform: translateX(0)' → 'translate: 0' (Tailwind v4 uses
  CSS translate property, not transform, for -translate-x-full)
- Move sidebar transition to .nim-sidebar critical CSS rule
- Switch --nim-* CSS vars to --color-* tokens already in app.css
- nav-item hover uses :not(.nim-nav-active) to avoid conflict with active state
- Workspace/Account section labels, icon partial, AI badge

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-17 13:47:50 +02:00
boban d2d43e1097 feat(BUG-2): redesign sidebar from template — Geist font, section nav, CSS-driven collapse
Implement user-provided template design:
- Split nav into Workspace / Account sections with labels
- New CSS design tokens (--nim-*) for sidebar without breaking app vars
- Active indicator: left glow bar via ::before, CSS class nim-nav-active
- Collapsed tooltip via CSS ::after content: attr(data-label)
- Geist font for sidebar via Google Fonts
- 264px expanded / 72px collapsed sidebar widths
- All collapse state driven by html[data-sidebar-collapsed] critical CSS
  (no Alpine reactivity needed, works across @persist boundary)
- Mobile: always full expanded sidebar regardless of collapse state
- Icon partial at partials/sidebar-icon with 24px viewBox icons

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-17 13:40:16 +02:00
boban e71bd33e63 fix(BUG-2): drive sidebar collapse/expand via CSS attribute, not Alpine reactivity
x-show and :class bindings inside @persist blocks do not re-evaluate when
Alpine store changes. Replace all collapse-dependent bindings with CSS utility
classes (nim-sb-expanded, nim-sb-collapsed, sidebar-nav-link) driven by
html[data-sidebar-collapsed] in the critical inline style block.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-17 13:05:33 +02:00
boban 0a08d0f268 fix(bug-2): sidebar width via CSS attribute — bypasses @persist Alpine reactivity issue
@persist disconnects Alpine :class bindings from store reactivity on re-render.
Solution: drive sidebar width via html[data-sidebar-collapsed] CSS attribute
(same mechanism as skeleton) instead of Alpine :class.

- _syncDataset() now uses isCollapsed (respects mobile: never narrow on <768px)
- Blocking script checks window.innerWidth >= 768 before setting attribute
- Resize handler calls _syncDataset() to update attribute on viewport change
- aside gets sidebar-aside class; CSS sets 15rem/4rem at md+ via attribute

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-17 12:52:57 +02:00
boban d3ad4b4740 fix(bug-2): isCollapsed getter — sidebar auto-expands on mobile viewport
Add isMobile reactive property + resize listener to sidebar store.
isCollapsed getter returns collapsed && !isMobile, so:
- Desktop: collapse works as normal
- Mobile: isCollapsed always false → sidebar always shows expanded state
  regardless of desktop-set collapsed value

Replace all visual $store.sidebar.collapsed → isCollapsed in sidebar + layout.
toggle() / _syncDataset() remain on raw `collapsed` (persisted to localStorage).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-17 12:47:38 +02:00
boban e0624b5d7c fix(bug-2): collapse toggle hidden via max-md:hidden not hidden md:block 2026-05-17 12:43:58 +02:00
boban fbb57eec81 fix(bug-2): mobile sidebar close button + desktop-only collapse toggle
- Add mobile-only X button in sidebar header to call closeMobile()
  (splits workspace-switcher <button> into flex row with close sibling)
- Hide collapse toggle with hidden md:block — mobile only needs open/close,
  desktop uses collapse to go narrow/wide

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 19:07:02 +02:00
boban 90bf5a0c53 fix(bug-2): mobile hamburger — use CSS translate property to override Tailwind v4
Tailwind v4 compiles -translate-x-full to `translate: -100%` (CSS translate
shorthand), not `transform`. The old :style set `transform: translateX(0)` —
a different property — so the sidebar stayed hidden regardless of mobileOpen.

Fix: use `translate: 0` in inline style so it overrides the same property.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 19:01:26 +02:00
boban 436d80a097 fix(FIX-13): 8 bugs — sidebar flash, mobile hamburger, AI insights, button overlay, QR modal collapse, dashboard always-active, bio themes
- BUG 1: blocking script in <head> reads localStorage before first paint; CSS rule html[data-sidebar-collapsed] .skel-sidebar{width:64px} eliminates width flash
- BUG 2: sidebar store gains mobileOpen/toggleMobile()/closeMobile(); hamburger calls toggleMobile(); backdrop and sidebar :style use mobileOpen; SPA navigated handler calls closeMobile()
- BUG 3: text-purple → text-accent in AI Insights view (text-purple is undefined)
- BUG 4: ui/button.blade.php — spinner is now absolute inset-0 overlay; content fades to opacity-40 via wire:loading.class instead of hiding
- BUG 5: insights generate button and QR modal save/cancel migrated to x-ui.button component
- BUG 6: QR modal Styling/Frame/Advanced sections replaced from <details> (destroyed by Livewire re-render) to Alpine x-data{open:false} divs with x-show — state survives wire:model.live updates
- BUG 7: updateActiveNav() now checks el.dataset.navExact; Dashboard <a> gets data-nav-exact="1" so it only activates on exact pathname match
- BUG 8: bio_pages.theme JSON applied in public show.blade.php via inline CSS vars (4 presets: dark/light/purple/blue); EditBioPage gains theme property with preset selector in modal

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 18:28:27 +02:00
boban e211770312 fix(FIX-12): 10 bugs — AI workspace context, Alpine sidebar/theme, analytics clearFilters, link badge layout, slug suggest
BUG 1: Insights/Anomalies called require_workspace() in action methods — add mount() cache
BUG 2: Analytics clear-filter used multiple $set() calls — replace with clearFilters() action
BUG 3: Static md:ml-60 on main div blocked Alpine :class md:ml-16 override — remove static
BUG 4: updateActiveNav missed icon <span> colors on @persist sidebar — update icon span too
BUG 5: Topbar <header> lacked x-data — Alpine x-show on theme SVGs not reactive
BUG 6: --color-t2 #8888a0 too dark in dark mode — raise to #b8b8d0
BUG 7: UtmBuilder::createLink() used current_workspace() in AJAX — pass workspaceUlid via mount
BUG 8: Clicks badge in separate column, not rightmost — merge into actions cell
BUG 9: Sidebar nav icons w-4 h-4 — increase to w-5 h-5, justify-center when collapsed
BUG 10: suggestSlugs() no try-catch; text-purple undefined — add guard + use text-accent

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 18:02:23 +02:00
boban 28fbcba227 fix: bugs 1,4,5,7,8,9 — sidebar icon, theme button, copy-link, UTM computed, workspace context, theme sync
Bug 1: sidebar toggle — single rotating SVG → two x-show SVGs (chevron-left / chevron-right)
Bug 4: theme button — template x-if → svg x-show x-cloak; apply() now resolves 'system'
  to dark/light before setting data-theme (was setting data-theme="system" → CSS ignored it)
Bug 5: x-ui.copy-button added to links, bio, qr-codes rows and api-tokens new-token display
Bug 7: UtmBuilder::getFullUrlProperty() (Livewire v2 magic) → #[Computed] fullUrl()
  (Livewire v3 dropped getXProperty magic — $fullUrl was undefined in blade)
Bug 8: require_workspace() moved from render() to mount() in Overview, Links/Index, Settings/Index
  (Livewire update requests hit /livewire/update — ResolveWorkspace middleware never ran → threw)
Bug 9: Preferences::save() dispatches theme-changed-server → layout listener calls
  Alpine.store('theme').apply(theme) so DOM updates immediately without reload

Bugs 2, 3, 6 already correct in codebase (layout had transition/ml-60 binding,
mobile sidebar used $store.sidebar.open, routes used ULID via model route key).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 17:30:44 +02:00
boban 5d90c375f7 fix(sidebar+scripts): correct CSS specificity, externalize test credentials
- sidebar: revert translate to static class (-translate-x-full md:translate-x-0)
  + inline :style for mobile-open (highest specificity, beats Tailwind classes)
  Keeps transition-[width,transform] for smooth mobile slide animation
- crawl-all-routes.mjs, console-check.mjs: read TEST_EMAIL / TEST_PASSWORD
  from process.env; DB creds read from .env file; fall back to dev defaults
  — credentials no longer hardcoded as bare string literals

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 15:50:07 +02:00
boban 248c5100d1 fix(sidebar+types): mobile slide animation, close-on-navigate, PHPStan clean
- sidebar: transition-[width,transform] so mobile open/close animates
- sidebar: pure :class binding replaces mixed class+:style for translate
- layout: livewire:navigated closes mobile sidebar via Alpine store
- tests: RouteSmokeTest covers all 17 workspace/profile/AI routes
- scripts: crawl-all-routes.mjs + console-check.mjs (Playwright)
- phpstan: add @property-read, @var, @return generics across 15 modal/component files → 0 errors
- pint: auto-fix style violations in 9 files

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 15:47:17 +02:00
boban 1ff4114674 feat(sidebar+profile+buttons): sidebar active state, 3-tab profile, consistent button variants
- Sidebar JS: DOMContentLoaded + livewire:navigated updateActiveNav, data-nav-link on links
- Profile: exactly 3 tabs (Personal Info, Preferences, Security) with wire:navigate
- Buttons: all primary actions use bg-accent-gradient text-white
- UTM Builder + copy-to-clipboard Livewire event handler in app layout

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 15:14:04 +02:00
boban fa9985cc33 feat: modal infrastructure + 11 modals (links, team, settings, workspace)
wire-elements/modal v3 integration:
- Replace custom Alpine modal-container with <livewire:livewire-ui-modal />
- Customize vendor modal view with design tokens (bg-s1, dark overlay, smooth transitions)
- All modals extend ModalComponent, use $this->closeModal()

Modals built (PHP + Blade view + tests):
- ConfirmAction — reusable danger confirm with custom event dispatch
- CreateLink, EditLink, DeleteLink — full CRUD with workspace isolation
- InviteMember, EditMemberRole, RemoveMember — team management
- CreateApiToken, RevokeApiToken — Sanctum token lifecycle
- CreateWebhook, DeleteWebhook — webhook CRUD
- CreateWorkspace (uses CreateWorkspaceAction), DeleteWorkspace (confirmation input)

Fixes:
- Remove SoftDeletes from Webhook model (table has no deleted_at column)
- Auto-generate webhook secret when user leaves field empty
- Use correct role enum: owner/admin/editor/viewer (not member)
- Protected Livewire model properties replaced with re-query pattern
- Sidebar "New Workspace" button now dispatches openModal

Tests: 105/105 passing, 211 assertions

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 12:41:14 +02:00
boban 00673f3119 fix: Alpine double-load, FOUC, purple accent, logo/favicon
- Remove alpinejs devDep; Livewire v3 owns Alpine lifecycle
- Register sidebar + theme stores via alpine:init event
- @persist sidebar across wire:navigate to prevent re-render
- Inline critical CSS for FOUC prevention on initial load
- Purple #7c3aed accent + pink #ec4899 gradient in both themes
- Light-mode border visibility fix (solid color, not opacity)
- bg-accent-gradient / text-accent-gradient / border-accent-gradient utilities
- Logo mark SVG + full wordmark variants (dark/light/neutral)
- favicon.svg, favicon PNGs, apple-touch-icon, site.webmanifest
- Sidebar uses logo-mark.svg + text-accent-gradient wordmark

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 12:26:14 +02:00
boban 52d52824bc feat: add profile, team, settings subpages
- Profile pages: PersonalInfo, Preferences, Security
- Team: Members list with role management stub
- Settings: ApiTokens (Sanctum, one-time display), Webhooks stub
- Settings/Index: workspace name/slug update
- Sidebar: Team nav item + SVG icon
- Topbar: profile link → profile.personal
- Routes: profile.personal, profile.preferences, profile.security, w.team.index, w.settings.api-tokens, w.settings.webhooks

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 11:07:31 +02:00
boban 30989523cd feat: vollständiges Nimuli-Frontend Phase 1
Layouts:
- nimuli-app: Sidebar + Topbar + Mobile-Drawer (Alpine.js stores)
- guest: Nimuli-Brand, bg-bg, Inter/JetBrains Mono
- sidebar: Workspace-Switcher, Nav mit SVG-Icons, Plan-Usage-Box
- topbar: Theme-Toggle, Notifications-Bell, User-Dropdown

Auth (Breeze-Restyle mit Design-Tokens):
- Login: "Sign in" + dark-theme-native (text-t1, bg-s2, text-blue)
- Register: "Create account"
- Forgot Password: restyled
- Alle Input-Komponenten (text-input, label, button, errors) auf Tokens

Dashboard:
- Hero-Metrics (Today/7d/30d/Total Links)
- 30-Tage Chart.js Line-Chart
- Top-5-Links-Tabelle
- Quick-Actions

Links:
- Tabelle: nimu.li/-Prefix, font-mono slug, Tag-Badges, Status-Badges
- Create-Link Modal (Alpine.js + Livewire, auto-slug)
- Modal-Container-System

Stub-Pages (alle mit nimuli-app layout):
- QR Codes: Empty-State + CTA
- Link-in-Bio: Empty-State + CTA
- Analytics: Metrics + Top-Countries + By-Device
- Domains: Empty-State + CTA
- Settings: Workspace-Name + Danger-Zone
- Billing: Current-Plan + 3-Tier-Pricing-Cards

Demo-Daten:
- DemoDataSeeder: 20 Links + 957 Clicks (30 Tage)
- Workspace "Demo Agency" für nexxo@nimuli.com

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-16 10:52:52 +02:00
boban 3929c48ea1 feat(ui): app layout with sidebar and topbar
Implement Nimuli-specific authenticated layout with:
- Sidebar navigation with 7 main menu items (dashboard, links, qr codes, link-in-bio, analytics, domains, settings)
- Topbar header with user email and logout button
- Safe route checking using Route::has() for undefined routes
- Workspace display in sidebar when available
- Livewire AppLayout base class for future Livewire components
2026-05-16 07:54:31 +02:00