34 lines
1.4 KiB
Markdown
34 lines
1.4 KiB
Markdown
# Plan 32-03 Summary: Share Modal UI
|
|
|
|
**Status:** Complete
|
|
**Commit:** 7003e99
|
|
|
|
## What was done
|
|
|
|
1. **Share hooks** (`src/client/hooks/useShares.ts`):
|
|
- `useShareLinks(setupId)` — Query hook for fetching share links
|
|
- `useCreateShareLink(setupId)` — Mutation with query invalidation
|
|
- `useRevokeShareLink(setupId)` — Mutation with query invalidation
|
|
|
|
2. **ShareModal component** (`src/client/components/ShareModal.tsx`):
|
|
- Visibility picker with three options (private/link/public) — immediate API call on change
|
|
- Color-coded options: gray (private), blue (link), green (public)
|
|
- Share link creation with expiration dropdown (7/14/30 days, no expiration)
|
|
- Active links list with copy-to-clipboard and revoke actions
|
|
- Deactivation warning when links exist and switching to private
|
|
- Empty state "No share links yet"
|
|
- Escape key and overlay click to close
|
|
- Responsive: works on desktop and mobile
|
|
|
|
3. **Setup detail page update** (`src/client/routes/setups/$setupId.tsx`):
|
|
- Replaced static visibility badge with interactive share button
|
|
- Desktop: "Share" text + visibility icon
|
|
- Mobile: Icon-only with 44px touch target
|
|
- ShareModal rendered with visibility change wired to `updateSetup.mutate`
|
|
|
|
## Verification
|
|
|
|
- `bun run lint`: Passes
|
|
- ShareModal follows existing modal patterns (overlay, escape key, z-50)
|
|
- Colors match UI-SPEC: gray-500/gray-50, blue-600/blue-50, green-700/green-50
|