feat(artifact):rule update, feat(guide):add goback in header

app/(ui)/artifact/rules.tsx

@@ -26,16 +26,14 @@ export function RulesDialog({
         </DialogHeader>
         <p>
           {" "}
-          1. คิวจะใช้ระบบเรียง หรืออาจสุ่มบางครั้ง แต่ถ้ามีโดเนทลัดคิวมาจะดูไอดีที่โดเนทมาก่อน
+          1. คิวจะใช้ระบบเรียงแต่ถ้ามีโดเนทลัดคิวมาจะดูไอดีที่โดเนทมาก่อน
           <br />
-          2. คิวจะมีการลบใหม่หมดทุกครั้งหลังจบสตรีม (ต้องลงใหม่ทุกครั้งนะคับ)
-          <br /> 3. สามารถดูให้ได้แค่
-          <u className="text-red-500">ตัวละครเดียว</u>เท่านั้น แต่ถ้าโดเนทลัดคิว
-          สามารถดูได้สูงสุด 8 ตัว
+          2. คิวจะมีการลบใหม่หมดทุกครั้งหลังจบสตรีม (ต้องลงใหม่ทุกครั้ง)
+          <br /> 3. สำหรับการลงคิวฟรีจะดูให้แค่
+          <u className="text-red-500">ตัวละครเดียว</u> แต่ถ้าโดเนทลัดคิว
+          จะดูได้สูงสุด 8 ตัวละคร
           <br />
-          4. โดเนทขั้นต่ำ 10 บาท หากโดเนทมา แล้วลงคิวไปแล้ว แจ้งชื่อที่ลงไปในคิวมาด้วย
-          <br />
-          5. โดยการกดตกลงจะถือเป็นการยอมรับ{" "}
+          4. โดยการกดตกลงจะถือเป็นการยอมรับ{" "}
           <span className="text-blue-500 underline">
             <Link href="https://sudloh.com/privacy">Privacy policy</Link>
           </span>

app/(ui)/guide/client.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Compass, Search, SearchX } from "lucide-react";
+import { ArrowLeft, Compass, Search, SearchX } from "lucide-react";
 import Link from "next/link";
 import { useState } from "react";
 import { useDebounce } from "react-use";
@@ -40,10 +40,12 @@ export function GuideList({
   return (
     <div className="flex justify-center h-svh">
       <div className="w-full xl:max-w-2/3 border flex flex-col">
-        <div className="border-b p-3 font-semibold leading-none flex items-center gap-2">
-          <Compass className="opacity-50" />
-          ไกด์ตัวละคร
-        </div>
+        <div>
+          <Link href="/" className="border-b p-3 font-semibold leading-none flex items-center gap-2">
+            <Compass className="opacity-50" />
+            ไกด์ตัวละคร
+          </Link>
+          </div>
         <div className="p-4 pb-2">
           <InputGroup className="w-full h-10">
             <InputGroupInput
@@ -64,7 +66,7 @@ export function GuideList({
           {list.length === 0 && loading === 0 ? (
             <div className="col-span-full flex flex-col items-center justify-center py-20 text-muted-foreground">
               <SearchX className="w-16 h-16 mb-4 opacity-50" />
-              <p className="text-2xl font-semibold">ไม่พบตัวละครที่คุณหา</p>
+              <p className="text-2xl font-semibold">ไม่พบตัวละครที่ค้นหา</p>
               <p className="text-lg ">ลองคำอื่นที่ความหมายใกล้เคียงกันดูนะ</p>
             </div>
           ) : (