diff --git a/app/settings/co2-galvo/[id]/page.tsx b/app/settings/co2-galvo/[id]/page.tsx
deleted file mode 100644
index a2bf90b2..00000000
--- a/app/settings/co2-galvo/[id]/page.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-// app/settings/co2-galvo/[id]/co2-galvo.tsx
-"use client";
-
-import { useParams, useSearchParams } from "next/navigation";
-import CO2GalvoDetail from "@/components/details/CO2GalvoDetail";
-
-export default function CO2GalvoSettingDetailPage() {
- const { id } = useParams<{ id: string }>();
- const sp = useSearchParams();
- const edit = sp.get("edit") === "1";
- return ;
-}
diff --git a/app/settings/co2-galvo/layout.tsx b/app/settings/co2-galvo/layout.tsx
deleted file mode 100644
index b2dbc671..00000000
--- a/app/settings/co2-galvo/layout.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Suspense } from "react";
-
-export default function Layout({ children }: { children: React.ReactNode }) {
- return {children};
-}
diff --git a/app/settings/co2-galvo/page.tsx b/app/settings/co2-galvo/page.tsx
deleted file mode 100644
index dcce1241..00000000
--- a/app/settings/co2-galvo/page.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-"use client";
-import CO2GalvoList from "@/components/lists/CO2GalvoList";
-
-export default function CO2GalvoSettingsPageStandalone() {
- return (
-
-
- opts?.edit ? `/settings/co2-galvo/${sid}?edit=1` : `/settings/co2-galvo/${sid}`
- }
- />
-
- );
-}
diff --git a/components/details/CO2GalvoDetail.tsx b/components/details/CO2GalvoDetail.tsx
index 6760facf..d8fdd1d9 100644
--- a/components/details/CO2GalvoDetail.tsx
+++ b/components/details/CO2GalvoDetail.tsx
@@ -57,6 +57,31 @@ function fileUrl(id?: string) {
return `/api/dx/assets/${id}`; // fallback if you proxy assets
}
+/** Small helper to render a square-cropped thumbnail that opens a lightbox on click */
+function ZoomableSquareImage({
+ src,
+ alt,
+ onOpen,
+}: {
+ src: string;
+ alt: string;
+ onOpen: () => void;
+}) {
+ // Use CSS aspect-ratio for a consistent 1:1 crop (works without Tailwind plugin)
+ return (
+
+

{ e.currentTarget.style.display = "none"; }}
+ />
+
+ );
+}
+
export default function CO2GalvoDetail({
id,
mode,
@@ -79,6 +104,18 @@ export default function CO2GalvoDetail({
const [loading, setLoading] = useState(true);
const [err, setErr] = useState(null);
+ // lightbox state
+ const [viewerSrc, setViewerSrc] = useState(null);
+
+ // close lightbox on Escape
+ useEffect(() => {
+ function onKey(e: KeyboardEvent) {
+ if (e.key === "Escape") setViewerSrc(null);
+ }
+ if (viewerSrc) window.addEventListener("keydown", onKey);
+ return () => window.removeEventListener("keydown", onKey);
+ }, [viewerSrc]);
+
// load record (with human-readable fields)
useEffect(() => {
if (!id) return;
@@ -215,6 +252,9 @@ export default function CO2GalvoDetail({
const photoId = typeof rec.photo === "object" ? rec.photo?.id : (rec.photo as any);
const screenId = typeof rec.screen === "object" ? rec.screen?.id : (rec.screen as any);
+ const photoSrc = photoId ? fileUrl(String(photoId)) : "";
+ const screenSrc = screenId ? fileUrl(String(screenId)) : "";
+
return (
@@ -248,32 +288,26 @@ export default function CO2GalvoDetail({
{showOwnerEdit && (
- Edit this setting
+
)}
+ {/* Thumbnails: square crop with lightbox on click */}
- {photoId ? (
-
-
{ e.currentTarget.style.display = "none"; }}
- />
- Result
+ {photoSrc ? (
+
+ setViewerSrc(photoSrc)} />
+ Result
) : null}
- {screenId ? (
-
-
{ e.currentTarget.style.display = "none"; }}
- />
- Settings Screenshot
+ {screenSrc ? (
+
+ setViewerSrc(screenSrc)} />
+ Settings Screenshot
) : null}
@@ -385,6 +419,21 @@ export default function CO2GalvoDetail({
)}
+
+ {/* Lightbox */}
+ {viewerSrc && (
+ setViewerSrc(null)}
+ >
+

e.stopPropagation()}
+ />
+
+ )}
);
}