Refactor galleries and single page

src/components/artworks/ContextBackButton.tsx

@@ -0,0 +1,43 @@
+"use client";
+
+import { ArrowLeftIcon } from "lucide-react";
+import Link from "next/link";
+import { useRouter, useSearchParams } from "next/navigation";
+
+const FROM_TO_PATH: Record<string, string> = {
+  portfolio: "/portfolio",
+  "animal-studies": "/animal-studies",
+};
+
+export function ContextBackButton() {
+  const router = useRouter();
+  const sp = useSearchParams();
+  const from = sp.get("from") ?? "";
+
+  const target = FROM_TO_PATH[from];
+  if (!target) return null;
+
+  return (
+    <div className="w-full max-w-xl">
+      <Link
+        href={target}
+        className={[
+          "inline-flex items-center gap-2 rounded-md border px-3 py-2",
+          "text-sm text-muted-foreground hover:text-foreground",
+          "hover:bg-muted transition-colors",
+        ].join(" ")}
+        onClick={(e) => {
+          // If user has real history, prefer back; otherwise use link target.
+          // (Prevents “dead end” if they opened single page directly in new tab.)
+          if (window.history.length > 1) {
+            e.preventDefault();
+            router.back();
+          }
+        }}
+      >
+        <ArrowLeftIcon className="h-4 w-4" />
+        Back
+      </Link>
+    </div>
+  );
+}