fix(ui) : simplify admin controls and artifact selection

components/admin/editors/artifact-editor.tsx

@@ -15,6 +15,7 @@ import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader,
 import { Combobox, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxList } from "@/components/ui/combobox";
 import { Field, FieldDescription, FieldGroup, FieldLabel, FieldLegend, FieldSet } from "@/components/ui/field";
 import { ClearableInput as Input } from "@/components/admin/ui/clearable-input";
+import { Input as StandardInput } from "@/components/ui/input";
 import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Textarea } from "@/components/ui/textarea";
 import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group";
@@ -231,9 +232,9 @@ export function SortableTalentCard({
           <CardAction>
             <Button
               type="button"
-              variant="ghost"
+              variant="plain"
               size="icon-sm"
-              className="touch-none"
+              className="touch-none cursor-grab active:cursor-grabbing"
               {...attributes}
               {...listeners}
             >
@@ -280,9 +281,9 @@ export function SortableArtifactRow({
       {children(
         <Button
           type="button"
-          variant="ghost"
+          variant="plain"
           size="icon-sm"
-          className="touch-none"
+          className="touch-none cursor-grab active:cursor-grabbing"
           {...attributes}
           {...listeners}
         >
@@ -612,26 +613,17 @@ export function ArtifactEditor({
                             >
                               {dragHandle}
                               <div className="flex min-w-0 flex-1 flex-col gap-3">
-                                <div className="grid gap-3 lg:grid-cols-[1fr_1fr_8rem_auto]">
+                                <div className="grid gap-3 lg:grid-cols-[1fr_8rem_auto]">
                                   <ArtifactSelect
+                                    multiple
+                                    presentation="dropdown"
                                     items={artifacts}
-                                    value={row.firstArtifactKey}
+                                    values={[row.firstArtifactKey, row.secondArtifactKey].filter((key): key is string => Boolean(key))}
                                     invalid={artifactIssue("groups", activeArtifactGroupIndex, "tiers", groupIndex, "rows", rowIndex, "firstArtifactKey")}
-                                    placeholder="ค้นหาชุด Artifact แรก…"
-                                    rarityBackground
-                                    showSelectedImage
-                                    onValueChange={(firstArtifactKey) =>
-                                      setArtifactTierRows(groupIndex, (rows) => rows.map((candidate, inner) => inner === rowIndex ? { ...candidate, firstArtifactKey } : candidate))
-                                    }
-                                  />
-                                  <ArtifactSelect
-                                    items={artifacts}
-                                    value={row.secondArtifactKey ?? ""}
-                                    placeholder="ค้นหาชุดที่สอง (ถ้ามี)…"
-                                    rarityBackground
-                                    showSelectedImage
-                                    onValueChange={(secondArtifactKey) =>
-                                      setArtifactTierRows(groupIndex, (rows) => rows.map((candidate, inner) => inner === rowIndex ? { ...candidate, secondArtifactKey: secondArtifactKey || null } : candidate))
+                                    label="เลือกชุด Artifact (สูงสุด 2 ชุด)"
+                                    placeholder="ค้นหาชุด Artifact…"
+                                    onValuesChange={(keys) =>
+                                      setArtifactTierRows(groupIndex, (rows) => rows.map((candidate, inner) => inner === rowIndex ? { ...candidate, firstArtifactKey: keys[0] ?? "", secondArtifactKey: keys[1] ?? null } : candidate))
                                     }
                                   />
                                   <Input
@@ -651,7 +643,7 @@ export function ArtifactEditor({
                                     trigger={
                                       <Button
                                         type="button"
-                                        variant="ghost"
+                                        variant="plain"
                                         size="icon"
                                       />
                                     }
@@ -853,7 +845,7 @@ export function ArtifactEditor({
                             <StatIcons values={[stat]} />
                             {stat}
                           </FieldLabel>
-                          <Input
+                          <StandardInput
                             value={target?.value ?? ""}
                             placeholder="Value or text"
                             aria-label={`${stat} value`}