updated bucket settings page
Deploy / deploy (push) Successful in 3m1s

This commit is contained in:
twotalesanimation
2026-06-25 17:25:25 +02:00
parent ba579db494
commit 5b613b7107
6 changed files with 284 additions and 16 deletions
+76
View File
@@ -0,0 +1,76 @@
"use server";
import { auth } from "@/auth";
import { db } from "@/lib/db";
import { revalidatePath } from "next/cache";
import { z } from "zod";
const HETZNER_KEYS = [
"hetzner_endpoint",
"hetzner_access_key",
"hetzner_secret_key",
"hetzner_bucket_name",
] as const;
type HetznerKey = (typeof HETZNER_KEYS)[number];
async function requireAdmin() {
const session = await auth();
if (!session?.user) throw new Error("Unauthorized");
if (session.user.role !== "ADMIN") throw new Error("Admin access required");
return session;
}
/** Returns the current Hetzner config values (secret key masked for display). */
export async function getHetznerConfig(): Promise<{
hetzner_endpoint: string;
hetzner_access_key: string;
hetzner_secret_key: string;
hetzner_bucket_name: string;
}> {
await requireAdmin();
const rows = await db.systemConfig.findMany({
where: { key: { in: [...HETZNER_KEYS] } },
});
const map = Object.fromEntries(rows.map((r) => [r.key, r.value])) as Partial<
Record<HetznerKey, string>
>;
return {
hetzner_endpoint: map.hetzner_endpoint ?? process.env.HETZNER_ENDPOINT ?? "",
hetzner_access_key: map.hetzner_access_key ?? process.env.HETZNER_ACCESS_KEY ?? "",
hetzner_secret_key: map.hetzner_secret_key ?? process.env.HETZNER_SECRET_KEY ?? "",
hetzner_bucket_name: map.hetzner_bucket_name ?? process.env.HETZNER_BUCKET_NAME ?? "",
};
}
const hetznerConfigSchema = z.object({
hetzner_endpoint: z.string().url("Must be a valid URL").or(z.literal("")),
hetzner_access_key: z.string().min(1, "Required"),
hetzner_secret_key: z.string().min(1, "Required"),
hetzner_bucket_name: z.string().min(1, "Required"),
});
/** Upserts all four Hetzner config values into system_config. */
export async function saveHetznerConfig(
data: z.infer<typeof hetznerConfigSchema>
): Promise<{ success: true }> {
await requireAdmin();
const parsed = hetznerConfigSchema.parse(data);
await db.$transaction(
(Object.entries(parsed) as [HetznerKey, string][]).map(([key, value]) =>
db.systemConfig.upsert({
where: { key },
create: { key, value },
update: { value },
})
)
);
revalidatePath("/settings");
return { success: true };
}
+12
View File
@@ -3,6 +3,8 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
import { getInitials } from "@/lib/utils";
import { ChangePasswordForm } from "@/components/settings/ChangePasswordForm";
import { HetznerConfigForm } from "@/components/settings/HetznerConfigForm";
import { getHetznerConfig } from "@/actions/settings";
export const metadata = { title: "Settings" };
@@ -10,6 +12,9 @@ export default async function SettingsPage() {
const session = await auth();
if (!session?.user) return null;
const isAdmin = session.user.role === "ADMIN";
const hetznerConfig = isAdmin ? await getHetznerConfig() : null;
return (
<div className="p-6 space-y-6 max-w-2xl mx-auto">
<h1 className="text-2xl font-bold">Account Settings</h1>
@@ -36,6 +41,13 @@ export default async function SettingsPage() {
</Card>
<ChangePasswordForm mustChangePassword={session.user.mustChangePassword ?? false} />
{isAdmin && hetznerConfig && (
<div className="space-y-2">
<h2 className="text-lg font-semibold">Admin Storage Configuration</h2>
<HetznerConfigForm initialConfig={hetznerConfig} />
</div>
)}
</div>
);
}
+146
View File
@@ -0,0 +1,146 @@
'use client';
import { useState } from 'react';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import { Eye, EyeOff, HardDrive, CheckCircle2, AlertCircle } from 'lucide-react';
import { saveHetznerConfig } from '@/actions/settings';
interface HetznerConfig {
hetzner_endpoint: string;
hetzner_access_key: string;
hetzner_secret_key: string;
hetzner_bucket_name: string;
}
interface Props {
initialConfig: HetznerConfig;
}
export function HetznerConfigForm({ initialConfig }: Props) {
const [form, setForm] = useState<HetznerConfig>(initialConfig);
const [showSecret, setShowSecret] = useState(false);
const [loading, setLoading] = useState(false);
const [status, setStatus] = useState<'idle' | 'success' | 'error'>('idle');
const [errorMsg, setErrorMsg] = useState<string | null>(null);
function handleChange(key: keyof HetznerConfig) {
return (e: React.ChangeEvent<HTMLInputElement>) => {
setForm((prev) => ({ ...prev, [key]: e.target.value }));
setStatus('idle');
};
}
async function handleSubmit(e: React.FormEvent) {
e.preventDefault();
setLoading(true);
setStatus('idle');
setErrorMsg(null);
try {
await saveHetznerConfig(form);
setStatus('success');
} catch (err: unknown) {
setStatus('error');
setErrorMsg(err instanceof Error ? err.message : 'Failed to save configuration.');
} finally {
setLoading(false);
}
}
return (
<Card>
<CardHeader>
<CardTitle className="text-base flex items-center gap-2">
<HardDrive className="h-4 w-4" />
Hetzner Object Storage
</CardTitle>
<CardDescription className="text-sm text-muted-foreground">
Configure the Hetzner S3-compatible bucket used for high-res deliverable storage.
These values override the environment variables and take effect immediately no rebuild required.
</CardDescription>
</CardHeader>
<CardContent>
<form onSubmit={handleSubmit} className="space-y-4 max-w-sm">
<div className="space-y-1.5">
<Label htmlFor="hetzner_endpoint">Endpoint URL</Label>
<Input
id="hetzner_endpoint"
type="url"
placeholder="https://nbg1.your-objectstorage.com"
value={form.hetzner_endpoint}
onChange={handleChange('hetzner_endpoint')}
autoComplete="off"
/>
</div>
<div className="space-y-1.5">
<Label htmlFor="hetzner_bucket_name">Bucket Name</Label>
<Input
id="hetzner_bucket_name"
type="text"
placeholder="vfxreview"
value={form.hetzner_bucket_name}
onChange={handleChange('hetzner_bucket_name')}
autoComplete="off"
/>
</div>
<div className="space-y-1.5">
<Label htmlFor="hetzner_access_key">Access Key</Label>
<Input
id="hetzner_access_key"
type="text"
placeholder="Access key ID"
value={form.hetzner_access_key}
onChange={handleChange('hetzner_access_key')}
autoComplete="off"
/>
</div>
<div className="space-y-1.5">
<Label htmlFor="hetzner_secret_key">Secret Key</Label>
<div className="relative">
<Input
id="hetzner_secret_key"
type={showSecret ? 'text' : 'password'}
placeholder="Secret key"
value={form.hetzner_secret_key}
onChange={handleChange('hetzner_secret_key')}
autoComplete="new-password"
className="pr-10"
/>
<button
type="button"
onClick={() => setShowSecret((v) => !v)}
className="absolute right-2.5 top-1/2 -translate-y-1/2 text-zinc-400 hover:text-white"
tabIndex={-1}
>
{showSecret ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
</button>
</div>
</div>
{status === 'success' && (
<div className="flex items-center gap-2 text-sm text-emerald-400">
<CheckCircle2 className="h-4 w-4 shrink-0" />
Configuration saved changes are live immediately.
</div>
)}
{status === 'error' && (
<div className="flex items-center gap-2 text-sm text-red-400">
<AlertCircle className="h-4 w-4 shrink-0" />
{errorMsg}
</div>
)}
<Button type="submit" disabled={loading} size="sm">
{loading ? 'Saving…' : 'Save Configuration'}
</Button>
</form>
</CardContent>
</Card>
);
}
+33 -16
View File
@@ -20,6 +20,7 @@ import { getSignedUrl } from "@aws-sdk/s3-request-presigner";
import fs from "fs";
import path from "path";
import { randomUUID } from "crypto";
import { db } from "@/lib/db";
export type StorageProvider = "local" | "uploadthing" | "s3" | "r2" | "b2" | "minio";
@@ -222,19 +223,35 @@ function getPublicUrl(key: string, provider: StorageProvider): string {
// ── Hetzner Object Storage (dedicated high-res bucket) ───────────────────────
function buildHetznerClient(): S3Client {
return new S3Client({
region: "auto",
endpoint: process.env.HETZNER_ENDPOINT!,
credentials: {
accessKeyId: process.env.HETZNER_ACCESS_KEY!,
secretAccessKey: process.env.HETZNER_SECRET_KEY!,
},
async function getHetznerConfig(): Promise<{
endpoint: string;
accessKey: string;
secretKey: string;
bucket: string;
}> {
const rows = await db.systemConfig.findMany({
where: { key: { in: ["hetzner_endpoint", "hetzner_access_key", "hetzner_secret_key", "hetzner_bucket_name"] } },
});
const map = Object.fromEntries(rows.map((r) => [r.key, r.value]));
return {
endpoint: map["hetzner_endpoint"] ?? process.env.HETZNER_ENDPOINT ?? "",
accessKey: map["hetzner_access_key"] ?? process.env.HETZNER_ACCESS_KEY ?? "",
secretKey: map["hetzner_secret_key"] ?? process.env.HETZNER_SECRET_KEY ?? "",
bucket: map["hetzner_bucket_name"] ?? process.env.HETZNER_BUCKET_NAME ?? "vfx-review",
};
}
function getHetznerBucket(): string {
return process.env.HETZNER_BUCKET_NAME ?? "vfx-review";
async function buildHetznerClient(): Promise<{ client: S3Client; bucket: string }> {
const cfg = await getHetznerConfig();
const client = new S3Client({
region: "auto",
endpoint: cfg.endpoint,
credentials: {
accessKeyId: cfg.accessKey,
secretAccessKey: cfg.secretKey,
},
});
return { client, bucket: cfg.bucket };
}
/**
@@ -248,10 +265,10 @@ export async function uploadToHetzner(
folder: string = "highres"
): Promise<{ key: string }> {
const key = `${folder}/${randomUUID()}-${fileName}`;
const client = buildHetznerClient();
const { client, bucket } = await buildHetznerClient();
await client.send(
new PutObjectCommand({
Bucket: getHetznerBucket(),
Bucket: bucket,
Key: key,
Body: buffer,
ContentType: contentType,
@@ -269,9 +286,9 @@ export async function generateHetznerDownloadUrl(
originalFilename: string,
expiresIn: number = 3600
): Promise<string> {
const client = buildHetznerClient();
const { client, bucket } = await buildHetznerClient();
const command = new GetObjectCommand({
Bucket: getHetznerBucket(),
Bucket: bucket,
Key: key,
ResponseContentDisposition: `attachment; filename="${originalFilename}"`,
});
@@ -282,8 +299,8 @@ export async function generateHetznerDownloadUrl(
* Delete a file from the Hetzner bucket by key.
*/
export async function deleteFromHetzner(key: string): Promise<void> {
const client = buildHetznerClient();
const { client, bucket } = await buildHetznerClient();
await client.send(
new DeleteObjectCommand({ Bucket: getHetznerBucket(), Key: key })
new DeleteObjectCommand({ Bucket: bucket, Key: key })
);
}
@@ -0,0 +1,8 @@
-- CreateTable
CREATE TABLE "system_config" (
"key" TEXT NOT NULL,
"value" TEXT NOT NULL,
"updatedAt" TIMESTAMP(3) NOT NULL,
CONSTRAINT "system_config_pkey" PRIMARY KEY ("key")
);
+9
View File
@@ -546,3 +546,12 @@ model ReviewSession {
@@map("review_sessions")
}
/// Key-value store for system-wide configuration (e.g. storage credentials)
model SystemConfig {
key String @id
value String @db.Text
updatedAt DateTime @updatedAt
@@map("system_config")
}