settings overhaul and reset
This commit is contained in:
parent
4ef3160515
commit
3195ff5d74
6 changed files with 904 additions and 1651 deletions
306
app/api/settings/route.ts
Normal file
306
app/api/settings/route.ts
Normal file
|
|
@ -0,0 +1,306 @@
|
|||
// app/api/settings/route.ts
|
||||
import { NextResponse } from "next/server";
|
||||
|
||||
/**
|
||||
* Fresh, minimal Directus client (no external helpers).
|
||||
* - Upload assets to /files with multipart/form-data.
|
||||
* - Create and update records via /items/{collection}.
|
||||
* - Auth is via user cookie (ma_at) or a submit token (DIRECTUS_TOKEN_SUBMIT).
|
||||
*/
|
||||
|
||||
export const runtime = "nodejs";
|
||||
|
||||
// ─────────────────────────────────────────────────────────────
|
||||
// Env
|
||||
// ─────────────────────────────────────────────────────────────
|
||||
const DX = (process.env.NEXT_PUBLIC_API_BASE_URL || "").replace(/\/$/, "");
|
||||
const SUBMIT_TOKEN = process.env.DIRECTUS_TOKEN_SUBMIT || "";
|
||||
|
||||
// Folder IDs from env (data sheet says fixed, not browsable)
|
||||
const FOLDERS = {
|
||||
settings_co2gal: {
|
||||
photo: process.env.DX_FOLDER_GALVO_PHOTOS || "",
|
||||
screen: process.env.DX_FOLDER_GALVO_SCREENS || "",
|
||||
},
|
||||
settings_co2gan: {
|
||||
photo: process.env.DX_FOLDER_GANTRY_PHOTOS || "",
|
||||
screen: process.env.DX_FOLDER_GANTRY_SCREENS || "",
|
||||
},
|
||||
settings_fiber: {
|
||||
photo: process.env.DX_FOLDER_FIBER_PHOTOS || "",
|
||||
screen: process.env.DX_FOLDER_FIBER_SCREENS || "",
|
||||
},
|
||||
settings_uv: {
|
||||
photo: process.env.DX_FOLDER_UV_PHOTOS || "",
|
||||
screen: process.env.DX_FOLDER_UV_SCREENS || "",
|
||||
},
|
||||
} as const;
|
||||
|
||||
type Target = "settings_co2gal" | "settings_co2gan" | "settings_fiber" | "settings_uv";
|
||||
|
||||
function bearerFrom(req: Request) {
|
||||
// Prefer user cookie (session) else fall back to submit token for server ops.
|
||||
const cookie = req.headers.get("cookie") || "";
|
||||
const m = cookie.match(/(?:^|;\s*)ma_at=([^;]+)/);
|
||||
const at = m?.[1];
|
||||
return at ? `Bearer ${at}` : SUBMIT_TOKEN ? `Bearer ${SUBMIT_TOKEN}` : "";
|
||||
}
|
||||
|
||||
async function dxUpload(file: File, folderId: string, bearer: string) {
|
||||
const form = new FormData();
|
||||
form.set("file", file, file.name || "upload");
|
||||
if (folderId) form.set("folder", folderId);
|
||||
|
||||
const res = await fetch(`${DX}/files`, {
|
||||
method: "POST",
|
||||
headers: bearer ? { authorization: bearer } : undefined,
|
||||
body: form,
|
||||
});
|
||||
const j = await res.json().catch(() => ({}));
|
||||
if (!res.ok) {
|
||||
const msg = j?.errors?.[0]?.message || `Directus /files failed (HTTP ${res.status})`;
|
||||
throw new Error(msg);
|
||||
}
|
||||
return j?.data?.id as string;
|
||||
}
|
||||
|
||||
async function dxCreate(target: Target, data: any, bearer: string) {
|
||||
const res = await fetch(`${DX}/items/${target}`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"content-type": "application/json",
|
||||
...(bearer ? { authorization: bearer } : {}),
|
||||
},
|
||||
body: JSON.stringify(data),
|
||||
});
|
||||
const j = await res.json().catch(() => ({}));
|
||||
if (!res.ok) {
|
||||
const msg = j?.errors?.[0]?.message || `Directus create failed (HTTP ${res.status})`;
|
||||
throw new Error(msg);
|
||||
}
|
||||
return j?.data;
|
||||
}
|
||||
|
||||
async function dxUpdate(target: Target, pk: string | number, data: any, bearer: string) {
|
||||
const res = await fetch(`${DX}/items/${target}/${encodeURIComponent(String(pk))}`, {
|
||||
method: "PATCH",
|
||||
headers: {
|
||||
"content-type": "application/json",
|
||||
...(bearer ? { authorization: bearer } : {}),
|
||||
},
|
||||
body: JSON.stringify(data),
|
||||
});
|
||||
const j = await res.json().catch(() => ({}));
|
||||
if (!res.ok) {
|
||||
const msg = j?.errors?.[0]?.message || `Directus update failed (HTTP ${res.status})`;
|
||||
throw new Error(msg);
|
||||
}
|
||||
return j?.data;
|
||||
}
|
||||
|
||||
// Guard numeric
|
||||
const num = (v: any) => (v === "" || v == null || Number.isNaN(Number(v)) ? null : Number(v));
|
||||
// Guard bool
|
||||
const bool = (v: any) => !!v;
|
||||
// Guard id string
|
||||
const idOrNull = (v: any) => (v === "" || v == null ? null : String(v));
|
||||
|
||||
type ReadResult = {
|
||||
mode: "json" | "multipart";
|
||||
body: any;
|
||||
photoFile: File | null;
|
||||
screenFile: File | null;
|
||||
};
|
||||
|
||||
async function readJsonOrMultipart(req: Request): Promise<ReadResult> {
|
||||
const ct = (req.headers.get("content-type") || "").toLowerCase();
|
||||
if (ct.includes("multipart/form-data")) {
|
||||
const form = await (req as any).formData();
|
||||
const payloadRaw = String(form.get("payload") ?? "{}");
|
||||
let body: any = {};
|
||||
try {
|
||||
body = JSON.parse(payloadRaw);
|
||||
} catch {
|
||||
throw new Error("Invalid JSON in 'payload'");
|
||||
}
|
||||
const p = form.get("photo");
|
||||
const s = form.get("screen");
|
||||
return {
|
||||
mode: "multipart",
|
||||
body,
|
||||
photoFile: p instanceof File && p.size > 0 ? (p as File) : null,
|
||||
screenFile: s instanceof File && s.size > 0 ? (s as File) : null,
|
||||
};
|
||||
}
|
||||
const body = await (req as any).json().catch(() => ({}));
|
||||
return { mode: "json", body, photoFile: null, screenFile: null };
|
||||
}
|
||||
|
||||
/**
|
||||
* POST: create or update a settings_* record
|
||||
* Body (JSON or multipart with { payload }):
|
||||
* {
|
||||
* target: "settings_co2gal" | ...,
|
||||
* mode?: "edit",
|
||||
* submission_id?: string|number,
|
||||
* // fields per data sheet (CO2 Galvo shown)
|
||||
* setting_title: string (required),
|
||||
* setting_notes?: string,
|
||||
* photo?: string (asset id) // if not provided in create, require file in multipart
|
||||
* screen?: string (asset id) // optional
|
||||
* // Material & Rig / Optics
|
||||
* mat: string (id),
|
||||
* mat_coat: string (id),
|
||||
* mat_color: string (id),
|
||||
* mat_opacity: string (id),
|
||||
* mat_thickness?: number,
|
||||
* laser_soft: string (id),
|
||||
* source: string (submission_id of laser_source),
|
||||
* lens: string (id),
|
||||
* focus?: number,
|
||||
* // CO2 Galvo Options (part of Rig & Optics per sheet)
|
||||
* lens_conf: string (id),
|
||||
* lens_apt: string (id),
|
||||
* lens_exp: string (id),
|
||||
* repeat_all?: number,
|
||||
* // Repeaters
|
||||
* fill_settings?: Array<...>,
|
||||
* line_settings?: Array<...>,
|
||||
* raster_settings?: Array<...>
|
||||
* }
|
||||
*/
|
||||
export async function POST(req: Request) {
|
||||
try {
|
||||
const { body, photoFile, screenFile } = await readJsonOrMultipart(req);
|
||||
|
||||
const target = String(body?.target || "") as Target;
|
||||
if (!target || !FOLDERS[target]) {
|
||||
return NextResponse.json({ error: "Invalid or missing target." }, { status: 400 });
|
||||
}
|
||||
|
||||
const isEdit = body?.mode === "edit";
|
||||
const pk = isEdit ? body?.submission_id : null;
|
||||
|
||||
// Upload assets if files are present
|
||||
const bearer = bearerFrom(req);
|
||||
|
||||
const folderCfg = FOLDERS[target];
|
||||
let photoId = idOrNull(body.photo);
|
||||
let screenId = idOrNull(body.screen);
|
||||
|
||||
if (photoFile) {
|
||||
if (!folderCfg.photo) throw new Error("Photo folder not configured.");
|
||||
photoId = await dxUpload(photoFile, folderCfg.photo, bearer);
|
||||
}
|
||||
if (screenFile) {
|
||||
if (!folderCfg.screen) throw new Error("Screen folder not configured.");
|
||||
screenId = await dxUpload(screenFile, folderCfg.screen, bearer);
|
||||
}
|
||||
|
||||
// Enforce requireds (data sheet: title + result photo on create)
|
||||
if (!body.setting_title || String(body.setting_title).trim() === "") {
|
||||
return NextResponse.json({ error: "Missing required: setting_title" }, { status: 400 });
|
||||
}
|
||||
if (!isEdit && !photoId) {
|
||||
return NextResponse.json({ error: "Result photo is required." }, { status: 400 });
|
||||
}
|
||||
|
||||
// Build Directus payload strictly as the collection expects (ids + arrays)
|
||||
const payload: any = {
|
||||
setting_title: String(body.setting_title),
|
||||
setting_notes: String(body.setting_notes || ""),
|
||||
// Assets
|
||||
...(photoId ? { photo: photoId } : {}),
|
||||
...(screenId ? { screen: screenId } : {}),
|
||||
// Material/Rig & Optics (M2O ids)
|
||||
mat: idOrNull(body.mat),
|
||||
mat_coat: idOrNull(body.mat_coat),
|
||||
mat_color: idOrNull(body.mat_color),
|
||||
mat_opacity: idOrNull(body.mat_opacity),
|
||||
mat_thickness: num(body.mat_thickness),
|
||||
laser_soft: idOrNull(body.laser_soft),
|
||||
source: idOrNull(body.source), // note: this is submission_id for laser_source; schema should be configured accordingly
|
||||
lens: idOrNull(body.lens),
|
||||
focus: num(body.focus),
|
||||
// CO2 Galvo option triplet (Rig & Optics)
|
||||
lens_conf: idOrNull(body.lens_conf),
|
||||
lens_apt: idOrNull(body.lens_apt),
|
||||
lens_exp: idOrNull(body.lens_exp),
|
||||
repeat_all: num(body.repeat_all),
|
||||
// Repeaters (arrays of plain objects)
|
||||
fill_settings: Array.isArray(body.fill_settings) ? body.fill_settings.map(mapFill) : [],
|
||||
line_settings: Array.isArray(body.line_settings) ? body.line_settings.map(mapLine) : [],
|
||||
raster_settings: Array.isArray(body.raster_settings) ? body.raster_settings.map(mapRaster) : [],
|
||||
};
|
||||
|
||||
let saved;
|
||||
if (isEdit) {
|
||||
if (!pk) return NextResponse.json({ error: "Missing submission_id for edit mode." }, { status: 400 });
|
||||
saved = await dxUpdate(target, pk, payload, bearer);
|
||||
} else {
|
||||
saved = await dxCreate(target, payload, bearer);
|
||||
}
|
||||
|
||||
return NextResponse.json({ id: saved?.submission_id ?? saved?.id ?? null, data: saved }, { status: 200 });
|
||||
} catch (e: any) {
|
||||
return NextResponse.json({ error: e?.message || "Failed" }, { status: 500 });
|
||||
}
|
||||
}
|
||||
|
||||
// ─────────────────────────────────────────────────────────────
|
||||
// Mappers (ensure numeric/bool normalization per sheet)
|
||||
// ─────────────────────────────────────────────────────────────
|
||||
function mapFill(r: any) {
|
||||
return {
|
||||
name: r?.name || "",
|
||||
type: (r?.type || "").toString(), // uni|bi|offset
|
||||
power: num(r?.power),
|
||||
speed: num(r?.speed),
|
||||
interval: num(r?.interval),
|
||||
pass: num(r?.pass),
|
||||
frequency: num(r?.frequency),
|
||||
pulse: num(r?.pulse),
|
||||
angle: num(r?.angle),
|
||||
auto: bool(r?.auto),
|
||||
increment: num(r?.increment),
|
||||
cross: bool(r?.cross),
|
||||
flood: bool(r?.flood),
|
||||
air: bool(r?.air),
|
||||
};
|
||||
}
|
||||
function mapLine(r: any) {
|
||||
return {
|
||||
name: r?.name || "",
|
||||
power: num(r?.power),
|
||||
speed: num(r?.speed),
|
||||
perf: bool(r?.perf),
|
||||
cut: bool(r?.cut),
|
||||
skip: bool(r?.skip),
|
||||
pass: num(r?.pass),
|
||||
air: bool(r?.air),
|
||||
frequency: num(r?.frequency),
|
||||
pulse: num(r?.pulse),
|
||||
wobble: bool(r?.wobble),
|
||||
step: num(r?.step),
|
||||
size: num(r?.size),
|
||||
};
|
||||
}
|
||||
function mapRaster(r: any) {
|
||||
return {
|
||||
name: r?.name || "",
|
||||
type: (r?.type || "").toString(), // uni|bi|offset
|
||||
dither: (r?.dither || "").toString(), // threshold|ordered|...
|
||||
halftone_cell: num(r?.halftone_cell),
|
||||
halftone_angle: num(r?.halftone_angle),
|
||||
inversion: bool(r?.inversion),
|
||||
interval: num(r?.interval),
|
||||
dot: num(r?.dot),
|
||||
power: num(r?.power),
|
||||
speed: num(r?.speed),
|
||||
pass: num(r?.pass),
|
||||
air: bool(r?.air),
|
||||
frequency: num(r?.frequency),
|
||||
pulse: num(r?.pulse),
|
||||
cross: bool(r?.cross),
|
||||
};
|
||||
}
|
||||
|
|
@ -1,330 +0,0 @@
|
|||
// app/api/submit/settings/route.ts
|
||||
import { NextResponse } from "next/server";
|
||||
import { uploadFile, createSettingsItem, bytesFromMB, dxGET, dxPATCH } from "@/lib/directus";
|
||||
import { requireBearer } from "@/app/api/_lib/auth";
|
||||
|
||||
/** ─────────────────────────────────────────────────────────────
|
||||
* Accepts EITHER:
|
||||
* - application/json
|
||||
* (photo/screen can be existing file ids on the body)
|
||||
* - multipart/form-data with:
|
||||
* - payload = JSON string (same shape as JSON body)
|
||||
* - photo = File (required if no photo id present) ← create only
|
||||
* - screen = File (optional)
|
||||
*
|
||||
* Targets (collections):
|
||||
* - settings_fiber (+ laser_soft, repeat_all)
|
||||
* - settings_co2gan
|
||||
* - settings_co2gal
|
||||
* - settings_uv
|
||||
*
|
||||
* Also supports editing:
|
||||
* Body must include { mode: "edit", submission_id: string|number }
|
||||
* We PATCH via filter[submission_id][_eq] and owner = current user.
|
||||
* ──────────────────────────────────────────────────────────── */
|
||||
|
||||
export const runtime = "nodejs";
|
||||
|
||||
const MAX_MB = Number(process.env.FILE_MAX_MB || 25);
|
||||
const MAX_BYTES = bytesFromMB(MAX_MB);
|
||||
|
||||
// simple in-memory rate limiter
|
||||
const BUCKET = new Map<string, { c: number; resetAt: number }>();
|
||||
const WINDOW_MS = Number(process.env.RATE_LIMIT_WINDOW || 60) * 1000;
|
||||
const MAX_REQ = Number(process.env.RATE_LIMIT_MAX || 15);
|
||||
function rateLimitOk(ip: string) {
|
||||
const now = Date.now();
|
||||
const rec = BUCKET.get(ip);
|
||||
if (!rec || now > rec.resetAt) {
|
||||
BUCKET.set(ip, { c: 1, resetAt: now + WINDOW_MS });
|
||||
return true;
|
||||
}
|
||||
if (rec.c >= MAX_REQ) return false;
|
||||
rec.c += 1;
|
||||
return true;
|
||||
}
|
||||
|
||||
type Target = "settings_fiber" | "settings_co2gan" | "settings_co2gal" | "settings_uv";
|
||||
|
||||
function num(v: any, fallback: number | null = null) {
|
||||
if (v === "" || v == null) return fallback;
|
||||
const n = Number(v);
|
||||
return Number.isFinite(n) ? n : fallback;
|
||||
}
|
||||
|
||||
type ReadResult = {
|
||||
mode: "json" | "multipart"; // transport mode, not create/edit
|
||||
body: any;
|
||||
photoFile: File | null;
|
||||
screenFile: File | null;
|
||||
};
|
||||
|
||||
async function readJsonOrMultipart(req: Request): Promise<ReadResult> {
|
||||
const ct = (req.headers.get("content-type") || "").toLowerCase();
|
||||
|
||||
if (ct.includes("multipart/form-data")) {
|
||||
const form = await (req as any).formData();
|
||||
|
||||
const payloadRaw = String(form.get("payload") ?? "{}");
|
||||
let body: any = {};
|
||||
try {
|
||||
body = JSON.parse(payloadRaw);
|
||||
} catch {
|
||||
throw new Error("Invalid JSON in 'payload'");
|
||||
}
|
||||
|
||||
const p = form.get("photo");
|
||||
const s = form.get("screen");
|
||||
const photoFile = p instanceof File && p.size > 0 ? (p as File) : null;
|
||||
const screenFile = s instanceof File && s.size > 0 ? (s as File) : null;
|
||||
|
||||
return { mode: "multipart", body, photoFile, screenFile };
|
||||
}
|
||||
|
||||
const body = await (req as any).json().catch(() => ({}));
|
||||
return { mode: "json", body, photoFile: null, screenFile: null };
|
||||
}
|
||||
|
||||
/** Env-based folder IDs (no folder browsing) */
|
||||
function folderIdFor(
|
||||
target: Target,
|
||||
kind: "photo" | "screen" | "notes"
|
||||
): string | undefined {
|
||||
const E = process.env;
|
||||
const map: Record<Target, { photo?: string; screen?: string; notes?: string }> = {
|
||||
settings_co2gal: {
|
||||
photo: E.DX_FOLDER_GALVO_PHOTOS,
|
||||
screen: E.DX_FOLDER_GALVO_SCREENS,
|
||||
notes: E.DX_FOLDER_GALVO_NOTES,
|
||||
},
|
||||
settings_co2gan: {
|
||||
photo: E.DX_FOLDER_GANTRY_PHOTOS,
|
||||
screen: E.DX_FOLDER_GANTRY_SCREENS,
|
||||
notes: E.DX_FOLDER_GANTRY_NOTES,
|
||||
},
|
||||
settings_fiber: {
|
||||
photo: E.DX_FOLDER_FIBER_PHOTOS,
|
||||
screen: E.DX_FOLDER_FIBER_SCREENS,
|
||||
notes: E.DX_FOLDER_FIBER_NOTES,
|
||||
},
|
||||
settings_uv: {
|
||||
photo: E.DX_FOLDER_UV_PHOTOS,
|
||||
screen: E.DX_FOLDER_UV_SCREENS,
|
||||
notes: E.DX_FOLDER_UV_NOTES,
|
||||
},
|
||||
};
|
||||
return map[target]?.[kind];
|
||||
}
|
||||
|
||||
export async function POST(req: Request) {
|
||||
const started = Date.now();
|
||||
try {
|
||||
const ip =
|
||||
(req.headers.get("x-forwarded-for")?.split(",")[0]?.trim() as string) ||
|
||||
"0.0.0.0";
|
||||
if (!rateLimitOk(ip)) {
|
||||
return NextResponse.json({ error: "Rate limited" }, { status: 429 });
|
||||
}
|
||||
|
||||
// Enforce user auth (everything uses the user's token)
|
||||
const bearer = requireBearer(req);
|
||||
|
||||
const { body, photoFile, screenFile } = await readJsonOrMultipart(req);
|
||||
|
||||
const target: Target = body?.target;
|
||||
if (
|
||||
!target ||
|
||||
!["settings_fiber", "settings_co2gan", "settings_co2gal", "settings_uv"].includes(target)
|
||||
) {
|
||||
return NextResponse.json({ error: "Invalid target" }, { status: 400 });
|
||||
}
|
||||
|
||||
// Create vs Edit
|
||||
const op: "create" | "edit" = body?.mode === "edit" ? "edit" : "create";
|
||||
|
||||
// Required basics
|
||||
const setting_title = String(body?.setting_title || "").trim();
|
||||
if (!setting_title) {
|
||||
return NextResponse.json(
|
||||
{ error: "Missing required: setting_title" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
// Current user (handle both {data:{...}} and {...} shapes)
|
||||
const meRes = await dxGET<any>("/users/me?fields=id,username", bearer);
|
||||
const meId = meRes?.data?.id ?? meRes?.id ?? null;
|
||||
const meUsername = meRes?.data?.username ?? meRes?.username ?? null;
|
||||
if (!meId) {
|
||||
return NextResponse.json(
|
||||
{ error: "Unable to resolve current user." },
|
||||
{ status: 401 }
|
||||
);
|
||||
}
|
||||
|
||||
// Attribution
|
||||
const uploader = meUsername || "user"; // string field mirrors owner.username
|
||||
|
||||
// Relations & numerics
|
||||
const mat = body?.mat ?? null;
|
||||
const mat_coat = body?.mat_coat ?? null;
|
||||
const mat_color = body?.mat_color ?? null;
|
||||
const mat_opacity = body?.mat_opacity ?? null;
|
||||
const mat_thickness = num(body?.mat_thickness, null);
|
||||
const source = body?.source ?? null;
|
||||
const lens = body?.lens ?? null;
|
||||
const focus = num(body?.focus, null);
|
||||
const setting_notes = String(body?.setting_notes || "").trim();
|
||||
|
||||
// Shared string fields
|
||||
const laser_soft = body?.laser_soft ?? null; // exact key: 'laser_soft'
|
||||
const repeat_all = num(body?.repeat_all, null); // universally applicable
|
||||
|
||||
// CO2 lens extras (may be null on non-co2)
|
||||
const lens_conf = body?.lens_conf ?? null;
|
||||
const lens_apt = body?.lens_apt ?? null;
|
||||
const lens_exp = body?.lens_exp ?? null;
|
||||
|
||||
// Upload / accept existing file ids
|
||||
let photo_id: string | null = body?.photo ?? null;
|
||||
let screen_id: string | null = body?.screen ?? null;
|
||||
|
||||
// In CREATE mode: require a photo (either an id or a file upload)
|
||||
if (op === "create" && !photo_id && photoFile) {
|
||||
if (photoFile.size > MAX_BYTES) {
|
||||
return NextResponse.json(
|
||||
{ error: `Photo exceeds ${MAX_MB} MB` },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
const up = await uploadFile(photoFile, (photoFile as File).name, bearer, {
|
||||
folderId: folderIdFor(target, "photo"),
|
||||
title: setting_title,
|
||||
});
|
||||
photo_id = up.id;
|
||||
}
|
||||
if (op === "create" && !photo_id) {
|
||||
return NextResponse.json(
|
||||
{ error: "Missing required: photo" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
// Optional screen (both modes)
|
||||
if (!screen_id && screenFile) {
|
||||
if (screenFile.size > MAX_BYTES) {
|
||||
return NextResponse.json(
|
||||
{ error: `Screenshot exceeds ${MAX_MB} MB` },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
const up = await uploadFile(screenFile, (screenFile as File).name, bearer, {
|
||||
folderId: folderIdFor(target, "screen"),
|
||||
title: `${setting_title} (screen)`,
|
||||
});
|
||||
screen_id = up.id;
|
||||
}
|
||||
|
||||
// Repeaters (pass-through; UI coerces numbers/bools)
|
||||
const fills = Array.isArray(body?.fill_settings) ? body.fill_settings : [];
|
||||
const lines = Array.isArray(body?.line_settings) ? body.line_settings : [];
|
||||
const rasters = Array.isArray(body?.raster_settings) ? body.raster_settings : [];
|
||||
|
||||
// timestamps
|
||||
const nowIso = new Date().toISOString();
|
||||
|
||||
// Build payload common to both modes
|
||||
const basePayload: Record<string, any> = {
|
||||
setting_title,
|
||||
setting_notes,
|
||||
|
||||
// Ownership & attribution
|
||||
owner: meId || null, // M2O to directus_users
|
||||
uploader, // string mirror of username
|
||||
|
||||
// exact keys
|
||||
laser_soft,
|
||||
repeat_all,
|
||||
|
||||
mat,
|
||||
mat_coat,
|
||||
mat_color,
|
||||
mat_opacity,
|
||||
mat_thickness,
|
||||
source,
|
||||
lens,
|
||||
focus,
|
||||
|
||||
// CO2-specific lens extras
|
||||
lens_conf,
|
||||
lens_apt,
|
||||
lens_exp,
|
||||
|
||||
fill_settings: fills,
|
||||
line_settings: lines,
|
||||
raster_settings: rasters,
|
||||
|
||||
status: "pending",
|
||||
last_modified_date: nowIso,
|
||||
};
|
||||
|
||||
if (op === "create") {
|
||||
// Create-only fields
|
||||
basePayload.photo = photo_id;
|
||||
basePayload.screen = screen_id ?? null;
|
||||
basePayload.submission_date = nowIso;
|
||||
basePayload.submitted_via = "makearmy-app";
|
||||
basePayload.submitted_at = nowIso;
|
||||
|
||||
// Helper is expected to wrap as { data: … } internally
|
||||
const { data } = await createSettingsItem(target, basePayload, bearer);
|
||||
return NextResponse.json({ ok: true, id: data.id });
|
||||
}
|
||||
|
||||
// EDIT mode
|
||||
const submission_id = body?.submission_id ?? null;
|
||||
if (!submission_id) {
|
||||
return NextResponse.json(
|
||||
{ error: "Edit mode requires submission_id" },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
// Only include photo/screen if provided; otherwise leave untouched
|
||||
const editPayload: Record<string, any> = { ...basePayload };
|
||||
if (photo_id) editPayload.photo = photo_id;
|
||||
if (screen_id) editPayload.screen = screen_id;
|
||||
|
||||
// Patch by filter to avoid needing internal item id, and restrict to your own record
|
||||
const qs = new URLSearchParams();
|
||||
qs.set("filter[_and][0][submission_id][_eq]", String(submission_id));
|
||||
// enforce owner matches current user (works whether owner is id or M2O)
|
||||
qs.set("filter[_and][1][owner][_eq]", String(meId));
|
||||
|
||||
// ⬇⬇⬇ Directus expects { data: {...} } here (this fixes the 400 "data is required")
|
||||
const res = await dxPATCH<{ data: any[] }>(
|
||||
`/items/${target}?${qs.toString()}`,
|
||||
bearer,
|
||||
{ data: editPayload }
|
||||
);
|
||||
|
||||
const updatedCount = Array.isArray(res?.data) ? res.data.length : 0;
|
||||
if (updatedCount < 1) {
|
||||
return NextResponse.json(
|
||||
{ error: "Nothing updated (not found or not owned by you)" },
|
||||
{ status: 404 }
|
||||
);
|
||||
}
|
||||
|
||||
return NextResponse.json({ ok: true, updated: updatedCount, submission_id });
|
||||
} catch (err: any) {
|
||||
console.error("[submit/settings] error", err?.message || err);
|
||||
return NextResponse.json(
|
||||
{ error: err?.message || "Unknown error" },
|
||||
{ status: err?.status ?? 500 }
|
||||
);
|
||||
} finally {
|
||||
const ms = Date.now() - started;
|
||||
if (ms) console.log(`[submit/settings] handled in ~${ms}ms`);
|
||||
}
|
||||
}
|
||||
|
|
@ -2,8 +2,6 @@
|
|||
"use client";
|
||||
|
||||
import { useEffect, useMemo, useState } from "react";
|
||||
import { useSearchParams, useRouter } from "next/navigation";
|
||||
import SettingsSubmit from "@/components/forms/SettingsSubmit";
|
||||
|
||||
type Rec = {
|
||||
submission_id: string | number;
|
||||
|
|
@ -13,25 +11,23 @@ type Rec = {
|
|||
photo?: { id?: string } | string | null;
|
||||
screen?: { id?: string } | string | null;
|
||||
|
||||
// ids & readable fields
|
||||
mat?: { id?: string | number; name?: string | null } | null;
|
||||
mat_coat?: { id?: string | number; name?: string | null } | null;
|
||||
mat_color?: { id?: string | number; name?: string | null } | null;
|
||||
mat_opacity?: { id?: string | number; opacity?: string | number | null } | null;
|
||||
mat_thickness?: number | null;
|
||||
|
||||
laser_soft?: { id?: string | number; name?: string | null } | string | number | null;
|
||||
source?: { submission_id?: string | number; make?: string | null; model?: string | null; nm?: string | null } | null;
|
||||
lens?: { id?: string | number; field_size?: string | number | null; focal_length?: string | number | null } | null;
|
||||
focus?: number | null;
|
||||
|
||||
laser_soft?: { id?: string | number; name?: string | null } | string | number | null;
|
||||
repeat_all?: number | null;
|
||||
|
||||
// CO₂ Galvo extras (M2O)
|
||||
lens_conf?: { id?: string | number; name?: string | null } | null;
|
||||
lens_apt?: { id?: string | number; name?: string | null } | null;
|
||||
lens_exp?: { id?: string | number; name?: string | null } | null;
|
||||
|
||||
repeat_all?: number | null;
|
||||
|
||||
fill_settings?: any[] | null;
|
||||
line_settings?: any[] | null;
|
||||
raster_settings?: any[] | null;
|
||||
|
|
@ -42,308 +38,110 @@ type Rec = {
|
|||
last_modified_date?: string | null;
|
||||
};
|
||||
|
||||
async function readJson(res: Response) {
|
||||
const text = await res.text();
|
||||
const API = (process.env.NEXT_PUBLIC_API_BASE_URL || "").replace(/\/$/, "");
|
||||
const asset = (id?: string | number) => (id ? `${API}/assets/${id}` : "");
|
||||
|
||||
async function readJson(r: Response) {
|
||||
const t = await r.text();
|
||||
try {
|
||||
return text ? JSON.parse(text) : null;
|
||||
return t ? JSON.parse(t) : null;
|
||||
} catch {
|
||||
throw new Error(`Unexpected response (HTTP ${res.status})`);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function ownerLabel(o: Rec["owner"]) {
|
||||
if (!o) return "—";
|
||||
if (typeof o === "string" || typeof o === "number") return String(o);
|
||||
return o.username || String(o.id ?? "—");
|
||||
}
|
||||
|
||||
// Prefer public assets if available (avoids auth cookie issues in <img>)
|
||||
const API_BASE = (process.env.NEXT_PUBLIC_API_BASE_URL || "").replace(/\/$/, "");
|
||||
function fileUrl(id?: string) {
|
||||
if (!id) return "";
|
||||
return API_BASE ? `${API_BASE}/assets/${id}` : `/api/dx/assets/${id}`;
|
||||
}
|
||||
|
||||
function ZoomableSquareImage(props: { src: string; alt: string; onOpen: () => void }) {
|
||||
const { src, alt, onOpen } = props;
|
||||
return (
|
||||
<div className="border rounded overflow-hidden" style={{ aspectRatio: "1 / 1" }}>
|
||||
<img
|
||||
src={src}
|
||||
alt={alt}
|
||||
className="w-full h-full object-cover cursor-zoom-in"
|
||||
loading="lazy"
|
||||
onClick={onOpen}
|
||||
onError={(e) => {
|
||||
(e.currentTarget as HTMLImageElement).style.display = "none";
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default function CO2GalvoDetail({
|
||||
id,
|
||||
mode,
|
||||
onSaved,
|
||||
onBack,
|
||||
showOwnerEdit = true,
|
||||
}: {
|
||||
id: string | number;
|
||||
mode?: "view" | "edit";
|
||||
onSaved?: (submission_id: string | number) => void;
|
||||
onBack?: () => void;
|
||||
showOwnerEdit?: boolean;
|
||||
}) {
|
||||
const sp = useSearchParams();
|
||||
const router = useRouter();
|
||||
const editParam = sp.get("edit") === "1";
|
||||
const editMode = mode ? mode === "edit" : editParam;
|
||||
|
||||
export default function CO2GalvoDetail({ id, editable = true }: { id: string | number; editable?: boolean }) {
|
||||
const [rec, setRec] = useState<Rec | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [err, setErr] = useState<string | null>(null);
|
||||
|
||||
// Current user id to gate the Edit button
|
||||
const [meId, setMeId] = useState<string | null>(null);
|
||||
useEffect(() => {
|
||||
let dead = false;
|
||||
let live = true;
|
||||
(async () => {
|
||||
try {
|
||||
const r = await fetch(`/api/dx/users/me?fields=id`, { cache: "no-store", credentials: "include" });
|
||||
if (!r.ok) return;
|
||||
const j = await readJson(r);
|
||||
const id = j?.data?.id ?? j?.id ?? null;
|
||||
if (!dead) setMeId(id ? String(id) : null);
|
||||
} catch {
|
||||
/* ignore */
|
||||
setLoading(true);
|
||||
setErr(null);
|
||||
const fields = [
|
||||
"submission_id",
|
||||
"setting_title",
|
||||
"setting_notes",
|
||||
"photo.id",
|
||||
"screen.id",
|
||||
"mat.id",
|
||||
"mat.name",
|
||||
"mat_coat.id",
|
||||
"mat_coat.name",
|
||||
"mat_color.id",
|
||||
"mat_color.name",
|
||||
"mat_opacity.id",
|
||||
"mat_opacity.opacity",
|
||||
"mat_thickness",
|
||||
"laser_soft.id",
|
||||
"laser_soft.name",
|
||||
"source.submission_id",
|
||||
"source.make",
|
||||
"source.model",
|
||||
"source.nm",
|
||||
"lens.id",
|
||||
"lens.field_size",
|
||||
"lens.focal_length",
|
||||
"focus",
|
||||
"lens_conf.id",
|
||||
"lens_conf.name",
|
||||
"lens_apt.id",
|
||||
"lens_apt.name",
|
||||
"lens_exp.id",
|
||||
"lens_exp.name",
|
||||
"repeat_all",
|
||||
"fill_settings",
|
||||
"line_settings",
|
||||
"raster_settings",
|
||||
"owner.id",
|
||||
"owner.username",
|
||||
"uploader",
|
||||
"last_modified_date",
|
||||
].join(",");
|
||||
|
||||
const url = `${API}/items/settings_co2gal?fields=${encodeURIComponent(fields)}&filter[submission_id][_eq]=${encodeURIComponent(
|
||||
String(id)
|
||||
)}&limit=1`;
|
||||
|
||||
const res = await fetch(url, { credentials: "include", cache: "no-store" });
|
||||
if (!res.ok) {
|
||||
const j = await readJson(res);
|
||||
throw new Error(j?.errors?.[0]?.message || `HTTP ${res.status}`);
|
||||
}
|
||||
})();
|
||||
const j = await res.json();
|
||||
const row = Array.isArray(j?.data) ? j.data[0] : null;
|
||||
if (!row) throw new Error("Not found");
|
||||
if (live) setRec(row);
|
||||
})()
|
||||
.catch((e: any) => live && setErr(e?.message || "Failed"))
|
||||
.finally(() => live && setLoading(false));
|
||||
return () => {
|
||||
dead = true;
|
||||
};
|
||||
}, []);
|
||||
|
||||
// lightbox
|
||||
const [viewerSrc, setViewerSrc] = useState<string | null>(null);
|
||||
useEffect(() => {
|
||||
const 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, +laser_soft.name)
|
||||
useEffect(() => {
|
||||
if (!id) return;
|
||||
let dead = false;
|
||||
|
||||
(async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
setErr(null);
|
||||
|
||||
const fields = [
|
||||
"submission_id",
|
||||
"setting_title",
|
||||
"setting_notes",
|
||||
"photo.id",
|
||||
"screen.id",
|
||||
|
||||
"mat.id",
|
||||
"mat.name",
|
||||
"mat_coat.id",
|
||||
"mat_coat.name",
|
||||
"mat_color.id",
|
||||
"mat_color.name",
|
||||
"mat_opacity.id",
|
||||
"mat_opacity.opacity",
|
||||
"mat_thickness",
|
||||
|
||||
"source.submission_id",
|
||||
"source.make",
|
||||
"source.model",
|
||||
"source.nm",
|
||||
|
||||
"lens.id",
|
||||
"lens.field_size",
|
||||
"lens.focal_length",
|
||||
|
||||
// CO₂ Galvo extras
|
||||
"lens_conf.id",
|
||||
"lens_conf.name",
|
||||
"lens_apt.id",
|
||||
"lens_apt.name",
|
||||
"lens_exp.id",
|
||||
"lens_exp.name",
|
||||
|
||||
"focus",
|
||||
"laser_soft.id",
|
||||
"laser_soft.name",
|
||||
"repeat_all",
|
||||
|
||||
"fill_settings",
|
||||
"line_settings",
|
||||
"raster_settings",
|
||||
|
||||
"owner.id",
|
||||
"owner.username",
|
||||
"uploader",
|
||||
"last_modified_date",
|
||||
].join(",");
|
||||
|
||||
const url = `/api/dx/items/settings_co2gal?fields=${encodeURIComponent(
|
||||
fields
|
||||
)}&filter[submission_id][_eq]=${encodeURIComponent(String(id))}&limit=1`;
|
||||
|
||||
const r = await fetch(url, { cache: "no-store", credentials: "include" });
|
||||
if (!r.ok) {
|
||||
const j = await readJson(r).catch(() => null);
|
||||
throw new Error(j?.errors?.[0]?.message || `HTTP ${r.status}`);
|
||||
}
|
||||
const j = await readJson(r);
|
||||
const row: Rec | null = Array.isArray(j?.data) ? j.data[0] || null : null;
|
||||
if (!row) throw new Error("Setting not found.");
|
||||
if (!dead) setRec(row);
|
||||
} catch (e: any) {
|
||||
if (!dead) setErr(e?.message || String(e));
|
||||
} finally {
|
||||
if (!dead) setLoading(false);
|
||||
}
|
||||
})();
|
||||
|
||||
return () => {
|
||||
dead = true;
|
||||
live = false;
|
||||
};
|
||||
}, [id]);
|
||||
|
||||
const initialValues = useMemo(() => {
|
||||
if (!rec) return null;
|
||||
const toId = (v: any) => (v == null ? null : typeof v === "object" ? v.id ?? v.submission_id ?? null : v);
|
||||
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 photoId = typeof rec.photo === "string" || typeof rec.photo === "number" ? String(rec.photo) : rec.photo?.id ?? null;
|
||||
const screenId =
|
||||
typeof rec.screen === "string" || typeof rec.screen === "number" ? String(rec.screen) : rec.screen?.id ?? null;
|
||||
|
||||
const matId = toId(rec.mat);
|
||||
const coatId = toId(rec.mat_coat);
|
||||
const colorId = toId(rec.mat_color);
|
||||
const opacityId = toId(rec.mat_opacity);
|
||||
const lensId = toId(rec.lens);
|
||||
const sourceId =
|
||||
rec.source && typeof rec.source === "object" ? rec.source.submission_id ?? null : (rec.source as any) ?? null;
|
||||
|
||||
// CO₂ Galvo M2O ids
|
||||
const lensConfId = toId(rec.lens_conf);
|
||||
const lensAptId = toId(rec.lens_apt);
|
||||
const lensExpId = toId(rec.lens_exp);
|
||||
|
||||
return {
|
||||
submission_id: rec.submission_id, // keep for edit mode parity
|
||||
setting_title: rec.setting_title ?? "",
|
||||
setting_notes: rec.setting_notes ?? "",
|
||||
|
||||
photo: photoId,
|
||||
screen: screenId,
|
||||
|
||||
mat: matId ? String(matId) : null,
|
||||
mat_coat: coatId ? String(coatId) : null,
|
||||
mat_color: colorId ? String(colorId) : null,
|
||||
mat_opacity: opacityId ? String(opacityId) : null,
|
||||
mat_thickness: rec.mat_thickness ?? null,
|
||||
|
||||
source: sourceId != null ? String(sourceId) : null,
|
||||
lens: lensId != null ? String(lensId) : null,
|
||||
focus: rec.focus ?? null,
|
||||
|
||||
laser_soft: (typeof rec.laser_soft === "object" ? rec.laser_soft?.id : (rec.laser_soft as any)) ?? null,
|
||||
repeat_all: rec.repeat_all ?? null,
|
||||
|
||||
// pass through for prefill
|
||||
lens_conf: lensConfId != null ? String(lensConfId) : null,
|
||||
lens_apt: lensAptId != null ? String(lensAptId) : null,
|
||||
lens_exp: lensExpId != null ? String(lensExpId) : null,
|
||||
|
||||
fill_settings: rec.fill_settings ?? [],
|
||||
line_settings: rec.line_settings ?? [],
|
||||
raster_settings: rec.raster_settings ?? [],
|
||||
};
|
||||
}, [rec]);
|
||||
|
||||
function clearEditParam() {
|
||||
const params = new URLSearchParams(sp.toString());
|
||||
params.delete("edit");
|
||||
router.replace(`?${params.toString()}`);
|
||||
}
|
||||
|
||||
if (loading) return <p className="p-6">Loading setting…</p>;
|
||||
if (err)
|
||||
return (
|
||||
<div className="p-6">
|
||||
<div className="rounded-md border border-red-300 bg-red-50 px-3 py-2 text-sm text-red-700">{err}</div>
|
||||
</div>
|
||||
);
|
||||
if (!rec) return <p className="p-6">Setting not found.</p>;
|
||||
|
||||
// ── EDIT MODE ───────────────────────────────────────────────
|
||||
if (editMode && initialValues) {
|
||||
return (
|
||||
<main className="space-y-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<h1 className="text-xl lg:text-2xl font-semibold">Edit CO₂ Galvo Setting</h1>
|
||||
<button className="px-2 py-1 border rounded" onClick={() => (onBack ? onBack() : clearEditParam())}>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
<SettingsSubmit
|
||||
mode="edit"
|
||||
initialTarget="settings_co2gal"
|
||||
submissionId={rec.submission_id}
|
||||
initialValues={initialValues}
|
||||
/>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
||||
// ── VIEW MODE (readable) ───────────────────────────────────
|
||||
const ownerDisplay = ownerLabel(rec.owner);
|
||||
const ownerId =
|
||||
typeof rec.owner === "object"
|
||||
? rec.owner?.id != null
|
||||
? String(rec.owner.id)
|
||||
: null
|
||||
: rec.owner != null
|
||||
? String(rec.owner)
|
||||
: null;
|
||||
const isMine = meId && ownerId ? meId === ownerId : false;
|
||||
|
||||
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)) : "";
|
||||
if (loading) return <p className="p-4">Loading…</p>;
|
||||
if (err) return <div className="p-4 border border-red-300 bg-red-50 text-red-700 rounded">{err}</div>;
|
||||
if (!rec) return <p className="p-4">Not found.</p>;
|
||||
|
||||
const softName = typeof rec.laser_soft === "object" ? rec.laser_soft?.name ?? "—" : "—";
|
||||
|
||||
function openEdit() {
|
||||
const q = new URLSearchParams(sp.toString());
|
||||
q.set("edit", "1");
|
||||
router.replace(`?${q.toString()}`, { scroll: false });
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<header className="space-y-1">
|
||||
<h1 className="text-2xl font-bold break-words">{rec.setting_title || "Untitled"}</h1>
|
||||
<h1 className="text-2xl font-bold">{rec.setting_title || "Untitled"}</h1>
|
||||
<div className="text-sm text-muted-foreground">Last modified: {rec.last_modified_date || "—"}</div>
|
||||
</header>
|
||||
|
||||
<section className="grid md:grid-cols-2 gap-6">
|
||||
<div className="space-y-2">
|
||||
<div className="text-sm">
|
||||
<div className="space-y-2 text-sm">
|
||||
<div>
|
||||
<span className="font-medium">Owner:</span> {ownerDisplay}
|
||||
<span className="font-medium">Owner:</span> {typeof rec.owner === "object" ? rec.owner?.username || rec.owner?.id : rec.owner || "—"}
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-medium">Uploader:</span> {rec.uploader || "—"}
|
||||
|
|
@ -379,161 +177,100 @@ export default function CO2GalvoDetail({
|
|||
<span className="font-medium">Software:</span> {softName}
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-medium">Repeat All:</span> {rec.repeat_all ?? "—"}
|
||||
<span className="font-medium">Lens Config:</span> {rec.lens_conf?.name || "—"}
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-medium">Scan Head Aperture:</span> {rec.lens_apt?.name || "—"}
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-medium">Beam Expander:</span> {rec.lens_exp?.name || "—"}
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-medium">Repeat All:</span> {rec.repeat_all ?? "—"}
|
||||
</div>
|
||||
|
||||
{rec.setting_notes ? (
|
||||
<div>
|
||||
<div className="pt-2">
|
||||
<div className="text-sm font-medium mb-1">Notes</div>
|
||||
<p className="text-sm whitespace-pre-wrap">{rec.setting_notes}</p>
|
||||
<p className="whitespace-pre-wrap">{rec.setting_notes}</p>
|
||||
</div>
|
||||
) : null}
|
||||
|
||||
{showOwnerEdit && isMine && (
|
||||
<div className="pt-2">
|
||||
<button onClick={openEdit} className="px-2 py-1 border rounded text-sm">
|
||||
Edit
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
{photoSrc ? (
|
||||
<figure className="space-y-1">
|
||||
<ZoomableSquareImage src={photoSrc} alt="Result" onOpen={() => setViewerSrc(photoSrc)} />
|
||||
<figcaption className="text-xs text-muted-foreground">Result</figcaption>
|
||||
<div className="grid grid-cols-2 gap-3">
|
||||
{photoId ? (
|
||||
<figure>
|
||||
<img className="w-full rounded border" src={asset(photoId)} alt="Result" />
|
||||
<figcaption className="text-xs text-muted-foreground mt-1">Result</figcaption>
|
||||
</figure>
|
||||
) : null}
|
||||
{screenSrc ? (
|
||||
<figure className="space-y-1">
|
||||
<ZoomableSquareImage src={screenSrc} alt="Settings Screenshot" onOpen={() => setViewerSrc(screenSrc)} />
|
||||
<figcaption className="text-xs text-muted-foreground">Settings Screenshot</figcaption>
|
||||
{screenId ? (
|
||||
<figure>
|
||||
<img className="w-full rounded border" src={asset(screenId)} alt="Settings Screenshot" />
|
||||
<figcaption className="text-xs text-muted-foreground mt-1">Settings</figcaption>
|
||||
</figure>
|
||||
) : null}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{(rec.fill_settings?.length ?? 0) > 0 && (
|
||||
<section className="space-y-2">
|
||||
<h2 className="text-lg font-semibold">Fill Settings</h2>
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full text-sm">
|
||||
<thead className="border-b">
|
||||
<tr>
|
||||
<th className="px-2 py-1 text-left">Name</th>
|
||||
<th className="px-2 py-1 text-left">Type</th>
|
||||
<th className="px-2 py-1 text-left">Power (%)</th>
|
||||
<th className="px-2 py-1 text-left">Speed (mm/s)</th>
|
||||
<th className="px-2 py-1 text-left">Interval</th>
|
||||
<th className="px-2 py-1 text-left">Angle</th>
|
||||
<th className="px-2 py-1 text-left">Pass</th>
|
||||
<th className="px-2 py-1 text-left">Freq (kHz)</th>
|
||||
<th className="px-2 py-1 text-left">Pulse (ns)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y">
|
||||
{rec.fill_settings!.map((r: any, i: number) => (
|
||||
<tr key={i}>
|
||||
<td className="px-2 py-1">{r.name || "—"}</td>
|
||||
<td className="px-2 py-1">{r.type || "—"}</td>
|
||||
<td className="px-2 py-1">{r.power ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.speed ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.interval ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.angle ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.pass ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.frequency ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.pulse ?? "—"}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
{/* Tables */}
|
||||
{Array.isArray(rec.fill_settings) && rec.fill_settings.length > 0 && (
|
||||
<Table title="Fill Settings" cols={["Name", "Type", "Power", "Speed", "Interval", "Angle", "Pass", "Freq", "Pulse"]} rows={rec.fill_settings.map((r) => [
|
||||
r.name ?? "—",
|
||||
r.type ?? "—",
|
||||
r.power ?? "—",
|
||||
r.speed ?? "—",
|
||||
r.interval ?? "—",
|
||||
r.angle ?? "—",
|
||||
r.pass ?? "—",
|
||||
r.frequency ?? "—",
|
||||
r.pulse ?? "—",
|
||||
])} />
|
||||
)}
|
||||
|
||||
{(rec.line_settings?.length ?? 0) > 0 && (
|
||||
<section className="space-y-2">
|
||||
<h2 className="text-lg font-semibold">Line Settings</h2>
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full text-sm">
|
||||
<thead className="border-b">
|
||||
<tr>
|
||||
<th className="px-2 py-1 text-left">Name</th>
|
||||
<th className="px-2 py-1 text-left">Power</th>
|
||||
<th className="px-2 py-1 text-left">Speed</th>
|
||||
<th className="px-2 py-1 text-left">Freq</th>
|
||||
<th className="px-2 py-1 text-left">Pulse</th>
|
||||
<th className="px-2 py-1 text-left">Pass</th>
|
||||
<th className="px-2 py-1 text-left">Air</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y">
|
||||
{rec.line_settings!.map((r: any, i: number) => (
|
||||
<tr key={i}>
|
||||
<td className="px-2 py-1">{r.name || "—"}</td>
|
||||
<td className="px-2 py-1">{r.power ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.speed ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.frequency ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.pulse ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.pass ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.air ? "Yes" : "No"}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
{Array.isArray(rec.line_settings) && rec.line_settings.length > 0 && (
|
||||
<Table title="Line Settings" cols={["Name", "Power", "Speed", "Freq", "Pulse", "Pass", "Air"]} rows={rec.line_settings.map((r) => [
|
||||
r.name ?? "—",
|
||||
r.power ?? "—",
|
||||
r.speed ?? "—",
|
||||
r.frequency ?? "—",
|
||||
r.pulse ?? "—",
|
||||
r.pass ?? "—",
|
||||
r.air ? "Yes" : "No",
|
||||
])} />
|
||||
)}
|
||||
|
||||
{(rec.raster_settings?.length ?? 0) > 0 && (
|
||||
<section className="space-y-2">
|
||||
<h2 className="text-lg font-semibold">Raster Settings</h2>
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full text-sm">
|
||||
<thead className="border-b">
|
||||
<tr>
|
||||
<th className="px-2 py-1 text-left">Name</th>
|
||||
<th className="px-2 py-1 text-left">Type</th>
|
||||
<th className="px-2 py-1 text-left">Dither</th>
|
||||
<th className="px-2 py-1 text-left">Power</th>
|
||||
<th className="px-2 py-1 text-left">Speed</th>
|
||||
<th className="px-2 py-1 text-left">Interval</th>
|
||||
<th className="px-2 py-1 text-left">Pass</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y">
|
||||
{rec.raster_settings!.map((r: any, i: number) => (
|
||||
<tr key={i}>
|
||||
<td className="px-2 py-1">{r.name || "—"}</td>
|
||||
<td className="px-2 py-1">{r.type || "—"}</td>
|
||||
<td className="px-2 py-1">{r.dither || "—"}</td>
|
||||
<td className="px-2 py-1">{r.power ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.speed ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.interval ?? "—"}</td>
|
||||
<td className="px-2 py-1">{r.pass ?? "—"}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
)}
|
||||
|
||||
{viewerSrc && (
|
||||
<div
|
||||
className="fixed inset-0 z-50 bg-black/80 p-4 flex items-center justify-center"
|
||||
onClick={() => setViewerSrc(null)}
|
||||
>
|
||||
<img
|
||||
src={viewerSrc}
|
||||
alt=""
|
||||
className="max-w-full max-h-full cursor-zoom-out"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
/>
|
||||
</div>
|
||||
{Array.isArray(rec.raster_settings) && rec.raster_settings.length > 0 && (
|
||||
<Table title="Raster Settings" cols={["Name", "Type", "Dither", "Power", "Speed", "Interval", "Pass"]} rows={rec.raster_settings.map((r) => [
|
||||
r.name ?? "—",
|
||||
r.type ?? "—",
|
||||
r.dither ?? "—",
|
||||
r.power ?? "—",
|
||||
r.speed ?? "—",
|
||||
r.interval ?? "—",
|
||||
r.pass ?? "—",
|
||||
])} />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function Table({ title, cols, rows }: { title: string; cols: string[]; rows: any[][] }) {
|
||||
return (
|
||||
<section className="space-y-2">
|
||||
<h2 className="text-lg font-semibold">{title}</h2>
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full text-sm">
|
||||
<thead className="border-b">
|
||||
<tr>{cols.map((c) => <th key={c} className="px-2 py-1 text-left">{c}</th>)}</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y">
|
||||
{rows.map((r, i) => (
|
||||
<tr key={i}>{r.map((v, j) => <td key={j} className="px-2 py-1">{String(v)}</td>)}</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
|
|
@ -17,266 +17,136 @@ type Owner =
|
|||
| null
|
||||
| undefined;
|
||||
|
||||
type SettingsRow = {
|
||||
type Row = {
|
||||
submission_id: string | number;
|
||||
setting_title?: string | null;
|
||||
uploader?: string | null;
|
||||
owner?: Owner;
|
||||
uploader?: string | null;
|
||||
mat?: { name?: string | null } | null;
|
||||
mat_coat?: { name?: string | null } | null;
|
||||
source?: { model?: string | null } | null;
|
||||
lens?: { field_size?: string | number | null } | null;
|
||||
};
|
||||
|
||||
export type CO2GalvoListProps = {
|
||||
/** Build the href for a record (portal vs standalone) */
|
||||
linkFor: (submission_id: string | number, opts?: { edit?: boolean }) => string;
|
||||
/** Optional controlled search text (else internal input) */
|
||||
queryText?: string;
|
||||
onQueryChange?: (q: string) => void;
|
||||
};
|
||||
const API = (process.env.NEXT_PUBLIC_API_BASE_URL || "").replace(/\/$/, "");
|
||||
|
||||
async function readJson(res: Response) {
|
||||
const text = await res.text();
|
||||
async function readJson(r: Response) {
|
||||
const t = await r.text();
|
||||
try {
|
||||
return text ? JSON.parse(text) : null;
|
||||
return t ? JSON.parse(t) : null;
|
||||
} catch {
|
||||
throw new Error(`Unexpected response (status ${res.status})`);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
export default function CO2GalvoList({ linkFor, queryText, onQueryChange }: CO2GalvoListProps) {
|
||||
const [settings, setSettings] = useState<SettingsRow[]>([]);
|
||||
const [ownerMap, setOwnerMap] = useState<Record<string, string>>({});
|
||||
export default function CO2GalvoList({
|
||||
linkFor,
|
||||
queryText,
|
||||
onQueryChange,
|
||||
}: {
|
||||
linkFor: (id: string | number) => string;
|
||||
queryText?: string;
|
||||
onQueryChange?: (q: string) => void;
|
||||
}) {
|
||||
const [rows, setRows] = useState<Row[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [resolvingOwners, setResolvingOwners] = useState(false);
|
||||
const [meId, setMeId] = useState<string | null>(null);
|
||||
const [localQuery, setLocalQuery] = useState(queryText ?? "");
|
||||
|
||||
// keep local and external search text in sync
|
||||
useEffect(() => {
|
||||
if (queryText !== undefined) setLocalQuery(queryText);
|
||||
}, [queryText]);
|
||||
|
||||
// load current user id (for edit visibility)
|
||||
useEffect(() => {
|
||||
let dead = false;
|
||||
let live = true;
|
||||
(async () => {
|
||||
try {
|
||||
const r = await fetch(`/api/dx/users/me?fields=id`, {
|
||||
cache: "no-store",
|
||||
credentials: "include",
|
||||
});
|
||||
if (!r.ok) return;
|
||||
setLoading(true);
|
||||
const fields = [
|
||||
"submission_id",
|
||||
"setting_title",
|
||||
"owner",
|
||||
"owner.id",
|
||||
"owner.username",
|
||||
"uploader",
|
||||
"mat.name",
|
||||
"mat_coat.name",
|
||||
"source.model",
|
||||
"lens.field_size",
|
||||
].join(",");
|
||||
const url = `${API}/items/settings_co2gal?fields=${encodeURIComponent(fields)}&limit=-1`;
|
||||
const r = await fetch(url, { credentials: "include", cache: "no-store" });
|
||||
if (!r.ok) {
|
||||
const j = await readJson(r);
|
||||
const id = j?.data?.id ?? j?.id ?? null;
|
||||
if (!dead) setMeId(id ? String(id) : null);
|
||||
} catch {
|
||||
/* ignore */
|
||||
throw new Error(j?.errors?.[0]?.message || `HTTP ${r.status}`);
|
||||
}
|
||||
})();
|
||||
const j = await r.json();
|
||||
const list = Array.isArray(j?.data) ? j.data : [];
|
||||
if (live) setRows(list);
|
||||
})()
|
||||
.catch(() => live && setRows([]))
|
||||
.finally(() => live && setLoading(false));
|
||||
return () => {
|
||||
dead = true;
|
||||
live = false;
|
||||
};
|
||||
}, []);
|
||||
|
||||
// load list
|
||||
useEffect(() => {
|
||||
const fields = [
|
||||
"submission_id",
|
||||
"setting_title",
|
||||
"uploader",
|
||||
"owner",
|
||||
"owner.id",
|
||||
"owner.username",
|
||||
"photo.id",
|
||||
"photo.title",
|
||||
"mat.name",
|
||||
"mat_coat.name",
|
||||
"source.model",
|
||||
"lens.field_size",
|
||||
].join(",");
|
||||
|
||||
const url = `/api/dx/items/settings_co2gal?fields=${encodeURIComponent(fields)}&limit=-1`;
|
||||
|
||||
fetch(url, { cache: "no-store", credentials: "include" })
|
||||
.then(async (res) => {
|
||||
if (!res.ok) {
|
||||
const j = await readJson(res).catch(() => null);
|
||||
const msg = (j as any)?.errors?.[0]?.message || `HTTP ${res.status}`;
|
||||
throw new Error(msg);
|
||||
}
|
||||
return readJson(res);
|
||||
})
|
||||
.then((json: any) => setSettings(Array.isArray(json?.data) ? json.data : []))
|
||||
.catch((e) => {
|
||||
console.error("CO2 Galvo list fetch failed:", e);
|
||||
setSettings([]);
|
||||
})
|
||||
.finally(() => setLoading(false));
|
||||
}, []);
|
||||
|
||||
// resolve owner usernames if needed
|
||||
useEffect(() => {
|
||||
if (!settings.length) return;
|
||||
|
||||
const ids = new Set<string>();
|
||||
for (const s of settings) {
|
||||
const o = s.owner;
|
||||
if (!o) continue;
|
||||
|
||||
if (typeof o === "string" || typeof o === "number") {
|
||||
const k = String(o);
|
||||
if (!ownerMap[k]) ids.add(k);
|
||||
} else {
|
||||
const id = o.id != null ? String(o.id) : "";
|
||||
const hasUsername = !!o.username;
|
||||
if (id && !hasUsername && !ownerMap[id]) ids.add(id);
|
||||
}
|
||||
}
|
||||
if (!ids.size) return;
|
||||
|
||||
const all = Array.from(ids);
|
||||
const chunk = 100;
|
||||
setResolvingOwners(true);
|
||||
|
||||
(async () => {
|
||||
const updates: Record<string, string> = {};
|
||||
for (let i = 0; i < all.length; i += chunk) {
|
||||
const slice = all.slice(i, i + chunk);
|
||||
const qs = new URLSearchParams();
|
||||
qs.set("fields", "id,username");
|
||||
qs.set("limit", String(slice.length));
|
||||
qs.set("filter[id][_in]", slice.join(","));
|
||||
|
||||
try {
|
||||
const r = await fetch(`/api/dx/users?${qs.toString()}`, {
|
||||
credentials: "include",
|
||||
cache: "no-store",
|
||||
});
|
||||
if (!r.ok) {
|
||||
const j = await readJson(r).catch(() => null);
|
||||
const msg = (j as any)?.errors?.[0]?.message || `HTTP ${r.status}`;
|
||||
console.warn("Owner lookup failed:", msg);
|
||||
if (r.status === 401 || r.status === 403) break;
|
||||
continue;
|
||||
}
|
||||
const j = await readJson(r);
|
||||
const rows: Array<{ id: string; username?: string | null }> = j?.data || [];
|
||||
for (const row of rows) {
|
||||
updates[String(row.id)] = row.username || String(row.id);
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn("Owner lookup error:", e);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (Object.keys(updates).length) {
|
||||
setOwnerMap((prev) => ({ ...prev, ...updates }));
|
||||
}
|
||||
setResolvingOwners(false);
|
||||
})();
|
||||
}, [settings, ownerMap]);
|
||||
|
||||
const isMine = (o: Owner) => {
|
||||
if (!meId || !o) return false;
|
||||
if (typeof o === "string" || typeof o === "number") return String(o) === meId;
|
||||
if (o.id != null) return String(o.id) === meId;
|
||||
return false;
|
||||
};
|
||||
|
||||
const ownerLabel = (o: Owner) => {
|
||||
if (!o) return "—";
|
||||
if (typeof o === "string" || typeof o === "number") {
|
||||
const id = String(o);
|
||||
return ownerMap[id] || id;
|
||||
}
|
||||
return (
|
||||
o.username ||
|
||||
[o.first_name, o.last_name].filter(Boolean).join(" ").trim() ||
|
||||
o.email ||
|
||||
(o.id != null ? String(o.id) : "—")
|
||||
);
|
||||
if (typeof o === "string" || typeof o === "number") return String(o);
|
||||
return o.username || [o.first_name, o.last_name].filter(Boolean).join(" ").trim() || o.email || (o.id != null ? String(o.id) : "—");
|
||||
};
|
||||
|
||||
const filtered = useMemo(() => {
|
||||
const nq = (localQuery || "").toLowerCase();
|
||||
if (!nq) return settings;
|
||||
return settings.filter((entry) => {
|
||||
const fields = [
|
||||
entry.setting_title,
|
||||
ownerLabel(entry.owner),
|
||||
entry.uploader,
|
||||
entry.mat?.name,
|
||||
entry.mat_coat?.name,
|
||||
entry.source?.model,
|
||||
entry.lens?.field_size as any,
|
||||
].filter(Boolean);
|
||||
return fields.some((v: any) => String(v).toLowerCase().includes(nq));
|
||||
});
|
||||
}, [settings, localQuery, ownerMap]);
|
||||
const q = (localQuery || "").toLowerCase();
|
||||
if (!q) return rows;
|
||||
return rows.filter((r) =>
|
||||
[r.setting_title, ownerLabel(r.owner), r.uploader, r.mat?.name, r.mat_coat?.name, r.source?.model, r.lens?.field_size]
|
||||
.filter(Boolean)
|
||||
.some((v) => String(v).toLowerCase().includes(q))
|
||||
);
|
||||
}, [rows, localQuery]);
|
||||
|
||||
return (
|
||||
<div className="space-y-3">
|
||||
<div>
|
||||
<input
|
||||
value={localQuery}
|
||||
onChange={(e) => {
|
||||
setLocalQuery(e.currentTarget.value);
|
||||
onQueryChange?.(e.currentTarget.value);
|
||||
}}
|
||||
placeholder="Search by title, owner, material, model…"
|
||||
placeholder="Search title, owner, material, model…"
|
||||
className="w-full border rounded px-3 py-2"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{loading ? (
|
||||
<p>Loading…</p>
|
||||
) : (
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full table-fixed text-sm">
|
||||
<thead className="sticky top-0">
|
||||
<tr className="border-b">
|
||||
<thead className="border-b">
|
||||
<tr>
|
||||
<th className="px-2 py-2 text-left w-[30%]">Title</th>
|
||||
<th className="px-2 py-2 text-left w-[14%]">
|
||||
Owner {resolvingOwners ? "…resolving" : ""}
|
||||
</th>
|
||||
<th className="px-2 py-2 text-left w-[16%]">Owner</th>
|
||||
<th className="px-2 py-2 text-left w-[14%]">Material</th>
|
||||
<th className="px-2 py-2 text-left w-[14%]">Coating</th>
|
||||
<th className="px-2 py-2 text-left w-[14%]">Model</th>
|
||||
<th className="px-2 py-2 text-left w-[10%]">Field</th>
|
||||
<th className="px-2 py-2 text-left w-[4%]">Edit</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y">
|
||||
{filtered.map((s) => {
|
||||
const mine = isMine(s.owner);
|
||||
const ownerText = ownerLabel(s.owner) + (mine ? " (you)" : "");
|
||||
return (
|
||||
<tr key={s.submission_id} className="hover:bg-muted/40">
|
||||
<td className="px-2 py-2 truncate">
|
||||
<Link href={linkFor(s.submission_id)} className="underline">
|
||||
{s.setting_title || "Untitled"}
|
||||
</Link>
|
||||
</td>
|
||||
<td className="px-2 py-2 truncate">{ownerText}</td>
|
||||
<td className="px-2 py-2 truncate">{s.mat?.name || "—"}</td>
|
||||
<td className="px-2 py-2 truncate">{s.mat_coat?.name || "—"}</td>
|
||||
<td className="px-2 py-2 truncate">{s.source?.model || "—"}</td>
|
||||
<td className="px-2 py-2 truncate">{s.lens?.field_size || "—"}</td>
|
||||
<td className="px-2 py-2">
|
||||
{mine ? (
|
||||
<Link href={linkFor(s.submission_id, { edit: true })} className="underline">
|
||||
Edit
|
||||
</Link>
|
||||
) : (
|
||||
<span className="opacity-50">—</span>
|
||||
)}
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
})}
|
||||
{filtered.map((r) => (
|
||||
<tr key={r.submission_id} className="hover:bg-muted/40">
|
||||
<td className="px-2 py-2 truncate">
|
||||
<Link href={linkFor(r.submission_id)} className="underline">
|
||||
{r.setting_title || "Untitled"}
|
||||
</Link>
|
||||
</td>
|
||||
<td className="px-2 py-2 truncate">{ownerLabel(r.owner)}</td>
|
||||
<td className="px-2 py-2 truncate">{r.mat?.name || "—"}</td>
|
||||
<td className="px-2 py-2 truncate">{r.mat_coat?.name || "—"}</td>
|
||||
<td className="px-2 py-2 truncate">{r.source?.model || "—"}</td>
|
||||
<td className="px-2 py-2 truncate">{r.lens?.field_size || "—"}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue