refactor(ui): unify low-level controls and expand design system
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 2m57s
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 2m57s
This commit is contained in:
@@ -2,7 +2,18 @@
|
||||
|
||||
import { useState, useTransition } from 'react';
|
||||
import type { SwotItem, Action, ActionLink, SwotCategory } from '@prisma/client';
|
||||
import { Button, Badge, Modal, ModalFooter, Input, Textarea, Select } from '@/components/ui';
|
||||
import {
|
||||
Button,
|
||||
Badge,
|
||||
Modal,
|
||||
ModalFooter,
|
||||
Input,
|
||||
Textarea,
|
||||
Select,
|
||||
IconButton,
|
||||
IconEdit,
|
||||
IconTrash,
|
||||
} from '@/components/ui';
|
||||
import { createAction, updateAction, deleteAction } from '@/actions/swot';
|
||||
|
||||
type ActionWithLinks = Action & {
|
||||
@@ -202,44 +213,19 @@ export function ActionPanel({
|
||||
<div className="flex items-start justify-between gap-2">
|
||||
<h3 className="font-medium text-foreground line-clamp-2">{action.title}</h3>
|
||||
<div className="flex shrink-0 items-center gap-1">
|
||||
<button
|
||||
<IconButton
|
||||
icon={<IconEdit />}
|
||||
label="Modifier"
|
||||
onClick={() => openEditModal(action)}
|
||||
className="rounded p-1 text-muted opacity-0 transition-opacity hover:bg-card-hover hover:text-foreground group-hover:opacity-100"
|
||||
aria-label="Modifier"
|
||||
>
|
||||
<svg
|
||||
className="h-3.5 w-3.5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
className="opacity-0 transition-opacity group-hover:opacity-100"
|
||||
/>
|
||||
<IconButton
|
||||
icon={<IconTrash />}
|
||||
label="Supprimer"
|
||||
variant="destructive"
|
||||
onClick={() => handleDelete(action.id)}
|
||||
className="rounded p-1 text-muted opacity-0 transition-opacity hover:bg-destructive/10 hover:text-destructive group-hover:opacity-100"
|
||||
aria-label="Supprimer"
|
||||
>
|
||||
<svg
|
||||
className="h-3.5 w-3.5"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
className="opacity-0 transition-opacity group-hover:opacity-100"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -377,35 +363,37 @@ export function ActionPanel({
|
||||
<label className="mb-2 block text-sm font-medium text-foreground">Priorité</label>
|
||||
<div className="flex gap-2">
|
||||
{priorityLabels.map((label, index) => (
|
||||
<button
|
||||
<Button
|
||||
key={index}
|
||||
type="button"
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => setPriority(index)}
|
||||
className={`
|
||||
flex-1 rounded-lg border px-3 py-2 text-sm font-medium transition-colors
|
||||
flex-1
|
||||
${
|
||||
priority === index
|
||||
? index === 2
|
||||
? 'border-destructive bg-destructive/10 text-destructive'
|
||||
: index === 1
|
||||
? 'border-warning bg-warning/10 text-warning'
|
||||
: 'border-primary bg-primary/10 text-primary'
|
||||
: 'border-primary bg-primary/10 text-primary'
|
||||
: 'border-border bg-card text-muted hover:bg-card-hover'
|
||||
}
|
||||
`}
|
||||
>
|
||||
{label}
|
||||
</button>
|
||||
</Button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ModalFooter>
|
||||
<Button type="button" variant="outline" onClick={closeModal}>
|
||||
<Button type="button" variant="outline" size="sm" onClick={closeModal}>
|
||||
Annuler
|
||||
</Button>
|
||||
<Button type="submit" loading={isPending}>
|
||||
<Button type="submit" size="sm" loading={isPending}>
|
||||
{editingAction ? 'Enregistrer' : "Créer l'action"}
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
|
||||
Reference in New Issue
Block a user