feat : remove random padding in admin footer and add public button to every section of admin

app/admin/[character]/[page]/page.tsx

@@ -8,6 +8,7 @@ import { GuideSectionEditor } from "@/components/admin/guide-section-editor";
 import { GuideSectionNav } from "@/components/admin/guide-section-nav";
 import { AdminHeader } from "@/components/admin/admin-header";
 import { EditorPresence } from "@/components/admin/editor-presence";
+import { GuideVisibilityControl } from "@/components/admin/guide-visibility-control";
 import { Button } from "@/components/ui/button";
 import { getAdminSession } from "@/lib/auth/server";
 import { getCachedCatalogOptions } from "@/lib/cache/catalog";
@@ -64,7 +65,7 @@ export default async function StructuredEditorPage({
       <AdminHeader />
       <main className="mx-auto flex w-full max-w-7xl flex-col gap-6 px-4 pb-4 sm:px-6 sm:pb-6 lg:px-8 lg:pb-8">
         <div className="flex flex-col">
-          <header className="flex items-center gap-4">
+          <header className="flex flex-wrap items-center gap-4">
             <Button
               variant="ghost"
               size="icon"
@@ -77,14 +78,20 @@ export default async function StructuredEditorPage({
             <div className="relative size-16 shrink-0 overflow-hidden rounded-lg border">
               <Image src={guide.coverUrl} alt={guide.name} fill sizes="64px" className="object-cover" />
             </div>
-            <div className="min-w-0">
+            <div className="min-w-0 flex-1">
               <p className="text-sm text-muted-foreground">{guide.name}</p>
               <h1 className="whitespace-nowrap font-heading text-3xl font-semibold">
                 {sectionTitle}
               </h1>
               <EditorPresence guideId={guide.id} section={sectionTitle} />
             </div>
-            <Button className="ml-auto" variant="outline" render={<Link href={`/admin/${guide.characterKey}/preview/${page}`} target="_blank" />} nativeButton={false}>
+            <GuideVisibilityControl
+              guideId={guide.id}
+              guideName={guide.name}
+              isPublic={guide.isPublic}
+              version={guide.version}
+            />
+            <Button variant="outline" render={<Link href={`/admin/${guide.characterKey}/preview/${page}`} target="_blank" />} nativeButton={false}>
               Preview
             </Button>
           </header>

app/admin/[character]/comment/page.tsx

@@ -6,6 +6,7 @@ import { connection } from "next/server";
 
 import { AdminHeader } from "@/components/admin/admin-header";
 import { GuideSectionNav } from "@/components/admin/guide-section-nav";
+import { GuideVisibilityControl } from "@/components/admin/guide-visibility-control";
 import { CommentBoardContent } from "@/components/comments/comment-board-content";
 import { CommentBoardSkeleton } from "@/components/comments/comment-skeleton";
 import { Button } from "@/components/ui/button";
@@ -34,17 +35,23 @@ export default async function GuideCommentPage({
       <AdminHeader />
       <main lang="th" className="mx-auto flex w-full max-w-7xl flex-col gap-6 px-4 pb-4 sm:px-6 sm:pb-6 lg:px-8 lg:pb-8">
         <div className="flex flex-col">
-          <header className="flex items-center gap-4">
+          <header className="flex flex-wrap items-center gap-4">
             <Button variant="ghost" size="icon" render={<Link href="/admin" />} nativeButton={false} aria-label="กลับหน้าภาพรวม">
               <ArrowLeftIcon />
             </Button>
             <div className="relative size-16 shrink-0 overflow-hidden rounded-lg border">
               <Image src={guide.coverUrl} alt={guide.name} fill sizes="64px" className="object-cover" />
             </div>
-            <div className="min-w-0">
+            <div className="min-w-0 flex-1">
               <p className="text-sm text-muted-foreground">{guide.name}</p>
               <h1 className="font-heading text-3xl font-semibold">ความคิดเห็น</h1>
             </div>
+            <GuideVisibilityControl
+              guideId={guide.id}
+              guideName={guide.name}
+              isPublic={guide.isPublic}
+              version={guide.version}
+            />
           </header>
           <GuideSectionNav guideId={guide.id} characterKey={guide.characterKey} current="comment" extras={extras} />
         </div>