diff --git a/src/app/p/[secret]/posts/page.tsx b/src/app/p/[secret]/posts/page.tsx index 7803fae..6c9fbab 100644 --- a/src/app/p/[secret]/posts/page.tsx +++ b/src/app/p/[secret]/posts/page.tsx @@ -3,10 +3,11 @@ import { useEffect, useState } from "react"; import { useInfiniteQuery, useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; import { useTRPC } from "@/trpc/client"; -import { Trash2, MessageSquare, Loader2, ChevronDown, Play, ImageOff, PawPrint, EyeOff, Eye, Sparkles, Pin, PinOff, Hash } from "lucide-react"; +import { Trash2, MessageSquare, Loader2, ChevronDown, Play, ImageOff, PawPrint, EyeOff, Eye, Sparkles, Pin, PinOff, Hash, HelpCircle } from "lucide-react"; import { Button } from "@/components/ui/button"; import { Input } from "@/components/ui/input"; import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "@/components/ui/dialog"; +import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"; import { getMediaUrl } from "@/lib/media-url"; import { BlurImage } from "@/components/ui/blur-image"; import { MILESTONE_META } from "@/lib/milestone-meta"; @@ -26,6 +27,16 @@ const GRID_COLS_CLASS: Record = { const GRID_SIZE_STORAGE_KEY = "pawfeed-admin-posts-grid-size"; +const POST_ACTION_LEGEND: { icon: React.ElementType; label: string; tone?: string }[] = [ + { icon: MessageSquare, label: "View comments" }, + { icon: EyeOff, label: "Hide post" }, + { icon: Eye, label: "Unhide post" }, + { icon: Pin, label: "Pin post" }, + { icon: PinOff, label: "Unpin post" }, + { icon: Sparkles, label: "Correct AI-content disclosure" }, + { icon: Trash2, label: "Delete post", tone: "text-red-400" }, +]; + export default function AdminPostsPage() { const trpc = useTRPC(); const qc = useQueryClient(); @@ -160,7 +171,28 @@ export default function AdminPostsPage() { return (
-

Posts

+
+

Posts

+ + + + + +

Post actions

+
    + {POST_ACTION_LEGEND.map(({ icon: Icon, label, tone }) => ( +
  • +
  • + ))} +
+
+
+
{GRID_SIZES.map((size) => (