refactor: enforce shared Modal component (#100)
* refactor: enforce shared Modal component in remaining custom modals - ShareSessionModal: replaced custom modal markup with <Modal> - CreateCategoryModal: replaced custom modal markup with <Modal> - EditCategoryModal: replaced custom modal markup with <Modal> - All now get focus trapping, Escape close, body scroll lock for free Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * refactor: adopt shared Button component in 18 modal components Replace raw <button> elements with <Button> from ui/Button.tsx: - Primary buttons (bg-gradient-brand) → <Button variant="primary"> - Secondary buttons (border-border) → <Button variant="secondary"> - Ghost buttons → <Button variant="ghost"> - Loading states use loading prop instead of manual Loader2 spinner Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * refactor: adopt shared Button component in 20 page/component files Replace raw <button> elements with <Button> across pages and remaining components. 38 total files now use the shared Button component consistently. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
This commit was merged in pull request #100.
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import { useState, useEffect, useCallback } from 'react'
|
||||
import { Plus, Copy, Trash2, Ticket, Mail, MailCheck, RefreshCw } from 'lucide-react'
|
||||
import { Button } from '@/components/ui/Button'
|
||||
import { DataTable, PageHeader, StatusBadge, ActionMenu, EmptyState } from '@/components/admin'
|
||||
import type { Column } from '@/components/admin'
|
||||
import { Modal } from '@/components/common/Modal'
|
||||
@@ -215,16 +216,10 @@ export function InviteCodesPage() {
|
||||
title="Invite Codes"
|
||||
description="Create and manage registration invite codes with plan assignment"
|
||||
action={
|
||||
<button
|
||||
onClick={() => setCreateOpen(true)}
|
||||
className={cn(
|
||||
'flex items-center gap-2 rounded-md px-4 py-2 text-sm font-medium',
|
||||
'bg-gradient-brand text-white shadow-lg shadow-primary/20 hover:opacity-90'
|
||||
)}
|
||||
>
|
||||
<Button onClick={() => setCreateOpen(true)}>
|
||||
<Plus className="h-4 w-4" />
|
||||
Create Code
|
||||
</button>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
@@ -249,19 +244,10 @@ export function InviteCodesPage() {
|
||||
size="sm"
|
||||
footer={
|
||||
<div className="flex justify-end gap-3">
|
||||
<button
|
||||
onClick={() => { setCreateOpen(false); resetForm() }}
|
||||
className="rounded-md border border-border px-4 py-2 text-sm font-medium text-muted-foreground hover:bg-accent hover:text-foreground"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
onClick={handleCreate}
|
||||
disabled={creating}
|
||||
className="rounded-md bg-gradient-brand text-white shadow-lg shadow-primary/20 px-4 py-2 text-sm font-medium hover:opacity-90 disabled:opacity-50"
|
||||
>
|
||||
<Button variant="secondary" onClick={() => { setCreateOpen(false); resetForm() }}>Cancel</Button>
|
||||
<Button onClick={handleCreate} loading={creating}>
|
||||
{creating ? 'Creating...' : 'Create'}
|
||||
</button>
|
||||
</Button>
|
||||
</div>
|
||||
}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user