style(artifact/admin):change enka icon feat(artifact/rubgram admin):add toast when action on setting

app/(ui)/artifact/admin/[id]/client.tsx

@@ -15,6 +15,7 @@ import { SimpleTooltip } from "@/components/tooltip";
 import { Button } from "@/components/ui/button";
 import { getCardStatus } from "@/lib/api";
 import { cn } from "@/lib/utils";
+import Enka from "#/enka_logo.png";
 
 export function EnkaBrowser({ sub, uid }: { sub: string; uid: string }) {
   const [ready, setReady] = useState(false);
@@ -35,12 +36,15 @@ export function EnkaBrowser({ sub, uid }: { sub: string; uid: string }) {
   return (
     <div className="h-full w-full relative">
       {!ready && !error && (isCached || useWeb) && (
-        <ScanSearch
+        <div
           className={cn(
-            "animate-pulse absolute left-1/2 -translate-x-1/2 -translate-y-1/2 size-8 text-muted-foreground z-45",
+            "flex flex-col items-center gap-2 absolute left-1/2 -translate-x-1/2 -translate-y-1/2 z-40",
             useWeb ? "top-[calc(50%+80px)]" : "top-1/2",
           )}
-        />
+        >
+          <ScanSearch className="size-8 animate-pulse" />
+          <span>กำลังโหลดข้อมูล...</span>
+        </div>
       )}
       {error && (
         <div className="flex flex-col items-center gap-2 absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-40">
@@ -69,7 +73,7 @@ export function EnkaBrowser({ sub, uid }: { sub: string; uid: string }) {
         <Button
           variant="outline"
           className={cn(
-            "absolute left-1 z-45 bg-[#222a]! backdrop-blur-sm opacity-50 md:opacity-20 hover:opacity-100",
+            "absolute left-1 z-45 bg-[#222a]! backdrop-blur-sm opacity-70 md:opacity-50 hover:opacity-100",
             useWeb ? "-bottom-19" : "bottom-1",
           )}
           size="icon"
@@ -79,7 +83,11 @@ export function EnkaBrowser({ sub, uid }: { sub: string; uid: string }) {
             setUseWeb((x) => !x);
           }}
         >
-          {useWeb ? <ImageIcon /> : <Dock />}
+          {useWeb ? (
+            <ImageIcon />
+          ) : (
+            <Image src={Enka} alt="Enka" className="size-5" />
+          )}
         </Button>
       </SimpleTooltip>
       {useWeb ? (

app/(ui)/artifact/admin/client.tsx

@@ -22,6 +22,7 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
+import { toast } from "sonner";
 import { Input } from "@/components/ui/input";
 import {
   SidebarMenu,
@@ -143,9 +144,10 @@ export function LimitManager({
                 </DialogHeader>
                 <form
                   id="limit-form"
-                  action={async (data: FormData) =>
-                    setLimit(Number(data.get("limit")) || -1)
-                  }
+                  action={async (data: FormData) => {
+                    await setLimit(Number(data.get("limit")) || -1);
+                    toast.success("บันทึกการเปลี่ยนแปลงแล้ว");
+                  }}
                 >
                   <Input
                     id="limit"
@@ -166,7 +168,12 @@ export function LimitManager({
                   </DialogClose>
                 </DialogFooter>
               </DialogContent>
-              <DropdownMenuItem onClick={toggleLock}>
+              <DropdownMenuItem
+                onClick={async () => {
+                  await toggleLock();
+                  toast.success("บันทึกการเปลี่ยนแปลงแล้ว");
+                }}
+              >
                 <span>{config.locked && "เ"}ปิดรับ</span>
               </DropdownMenuItem>
             </DropdownMenuContent>
@@ -190,7 +197,7 @@ export function SubmissionList({
   return (
     <>
       <Input
-        placeholder="Search..."
+        placeholder="ค้นหา..."
         type="search"
         onChange={(ev) => setQuery(ev.target.value.toLowerCase())}
       />

app/(ui)/rubgram/admin/client.tsx

@@ -22,6 +22,7 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
+import { toast } from "sonner";
 import { Input } from "@/components/ui/input";
 import {
   SidebarMenu,
@@ -143,7 +144,12 @@ export function LimitManager({
                   <span>ตั้งจำกัดคิว</span>
                 </DropdownMenuItem>
               </DialogTrigger>
-              <DropdownMenuItem onClick={toggleLock}>
+              <DropdownMenuItem
+                onClick={async () => {
+                  await toggleLock();
+                  toast.success("บันทึกการเปลี่ยนแปลงแล้ว");
+                }}
+              >
                 <span>{config.locked && "เ"}ปิดรับ</span>
               </DropdownMenuItem>
               <DialogTrigger asChild>
@@ -165,9 +171,10 @@ export function LimitManager({
               </DialogHeader>
               <form
                 id="limit-form"
-                action={async (data: FormData) =>
-                  setLimit(Number(data.get("limit")) || -1)
-                }
+                action={async (data: FormData) => {
+                  await setLimit(Number(data.get("limit")) || -1);
+                  toast.success("บันทึกการเปลี่ยนแปลงแล้ว");
+                }}
               >
                 <Input
                   id="limit"
@@ -196,9 +203,10 @@ export function LimitManager({
               </DialogHeader>
               <form
                 id="free-form"
-                action={async (data: FormData) =>
-                  setFree(Number(data.get("free")) || 0)
-                }
+                action={async (data: FormData) => {
+                  await setFree(Number(data.get("free")) || 0);
+                  toast.success("บันทึกการเปลี่ยนแปลงแล้ว");
+                }}
               >
                 <Input
                   id="free"
@@ -249,7 +257,7 @@ export function SubmissionList({
   return (
     <>
       <Input
-        placeholder="Search..."
+        placeholder="ค้นหา..."
         type="search"
         onChange={(ev) => setQuery(ev.target.value.toLowerCase())}
       />