poyrazavsever/neta
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(settings): restructure settings layout and separate route modules

Browse Source
This commit is contained in:
poyrazavsever
2026-07-20 10:25:40 +03:00
parent cc22c8ee1d
commit b424385667
34 changed files with 2867 additions and 1691 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/(dashboard)/settings/general/actions.ts
+72
View File
@@ -0,0 +1,72 @@
"use server";
import { revalidatePath } from "next/cache";
import { getBrandingService } from "@/server/branding/runtime";
import { getSqliteConnection } from "@/server/db/client";
import {
ContentTranslationService,
parseContentTranslationsFromFormData,
} from "@/server/i18n/content";
import { requireFreelancerBackend } from "@/server/web/freelancer";
import { cleanText } from "@/server/web/form-data";
export async function saveGeneralSettingsAction(formData: FormData) {
try {
const { actor } = await requireFreelancerBackend();
const workspaceName = cleanText(formData.get("workspaceName"));
const metaTitle = cleanText(formData.get("metaTitle"));
const shortName = cleanText(formData.get("shortName"));
if (!workspaceName || workspaceName.length > 120) {
return { errorKey: "settings.general.errors.workspaceName" };
}
if (!metaTitle || metaTitle.length > 80) {
return { errorKey: "settings.general.errors.metaTitle" };
}
if (!shortName || shortName.length > 24) {
return { errorKey: "settings.general.errors.shortName" };
}
const contentI18n = new ContentTranslationService(getSqliteConnection().db);
const localization = contentI18n.getLocalizationContext(actor);
const activeLocalization = {
...localization,
locales: localization.locales.filter((locale) => locale.status === "active"),
};
const translations = parseContentTranslationsFromFormData(
formData,
"branding",
activeLocalization,
);
const defaultContent = translations[activeLocalization.defaultLocale] ?? {};
const branding = getBrandingService().update(actor, {
applicationName: metaTitle,
shortName,
organizationName: workspaceName,
portalWelcomeText: defaultContent.portalWelcome ?? null,
portalFooterText: defaultContent.portalFooter ?? null,
});
contentI18n.upsertEntityTranslations("branding", "default", translations);
revalidateGeneralSettings();
return {
success: true,
data: {
workspaceName: branding.organizationName ?? branding.applicationName,
metaTitle: branding.applicationName,
shortName: branding.shortName,
},
};
} catch (error) {
console.error("General settings update failed", error);
return { errorKey: "settings.general.errors.saveFailed" };
}
}
function revalidateGeneralSettings() {
revalidatePath("/", "layout");
revalidatePath("/settings/general");
revalidatePath("/portal", "layout");
revalidatePath("/manifest.webmanifest");
}
app/(dashboard)/settings/general/general-settings-form.tsx
+168
View File
@@ -0,0 +1,168 @@
"use client";
import { useMemo, useState, useTransition } from "react";
import { useRouter } from "next/navigation";
import { Building2, Save, TextCursorInput } from "lucide-react";
import { Button, Card, CardContent, Input, Label } from "poyraz-ui/atoms";
import { toast } from "poyraz-ui/molecules";
import { useTranslations } from "@/components/i18n/i18n-provider";
import {
LocalizedFields,
type LocalizedFieldLocale,
type LocalizedFieldValues,
} from "@/components/i18n/localized-fields";
import { contentTranslationRegistry } from "@/lib/i18n/content";
import { saveGeneralSettingsAction } from "./actions";
type GeneralSettingsFormProps = {
defaultLocale: string;
locales: LocalizedFieldLocale[];
initial: {
metaTitle: string;
shortName: string;
workspaceName: string;
translations: LocalizedFieldValues;
};
};
export function GeneralSettingsForm({
defaultLocale,
locales,
initial,
}: GeneralSettingsFormProps) {
const t = useTranslations();
const router = useRouter();
const [pending, startTransition] = useTransition();
const [workspaceName, setWorkspaceName] = useState(initial.workspaceName);
const [metaTitle, setMetaTitle] = useState(initial.metaTitle);
const [shortName, setShortName] = useState(initial.shortName);
const localizedFields = useMemo(
() => contentTranslationRegistry.branding.map((field) => ({
...field,
label: field.name === "portalWelcome"
? t("settings.general.fields.portalWelcome")
: t("settings.general.fields.portalFooter"),
placeholder: field.name === "portalWelcome"
? t("settings.general.placeholders.portalWelcome")
: t("settings.general.placeholders.portalFooter"),
})),
[t],
);
function submit(formData: FormData) {
startTransition(async () => {
const result = await saveGeneralSettingsAction(formData);
if (result.errorKey) {
toast.error(t(result.errorKey));
return;
}
toast.success(t("settings.general.messages.saved"));
router.refresh();
});
}
return (
<Card>
<CardContent className="space-y-8 p-6 sm:p-8">
<div className="space-y-1.5">
<h2 className="text-xl font-semibold text-foreground">
{t("settings.general.title")}
</h2>
<p className="max-w-2xl text-sm text-muted-foreground">
{t("settings.general.description")}
</p>
</div>
<form action={submit} className="space-y-8">
<section className="space-y-5">
<div className="flex items-center gap-2 text-sm font-semibold text-foreground">
<Building2 className="h-4 w-4 text-muted-foreground" aria-hidden="true" />
{t("settings.general.sections.identity")}
</div>
<div className="grid gap-5 sm:grid-cols-2">
<div className="space-y-2">
<Label htmlFor="workspaceName">{t("settings.general.fields.workspaceName")}</Label>
<Input
id="workspaceName"
name="workspaceName"
value={workspaceName}
onChange={(event) => setWorkspaceName(event.target.value)}
minLength={1}
maxLength={120}
required
/>
<p className="text-xs text-muted-foreground">
{t("settings.general.help.workspaceName")}
</p>
</div>
<div className="space-y-2">
<Label htmlFor="metaTitle">{t("settings.general.fields.metaTitle")}</Label>
<Input
id="metaTitle"
name="metaTitle"
value={metaTitle}
onChange={(event) => setMetaTitle(event.target.value)}
minLength={1}
maxLength={80}
required
/>
<p className="text-xs text-muted-foreground">
{t("settings.general.help.metaTitle")}
</p>
</div>
</div>
<div className="max-w-md space-y-2">
<Label htmlFor="shortName">{t("settings.general.fields.shortName")}</Label>
<Input
id="shortName"
name="shortName"
value={shortName}
onChange={(event) => setShortName(event.target.value)}
minLength={1}
maxLength={24}
required
/>
<p className="text-xs text-muted-foreground">
{t("settings.general.help.shortName")}
</p>
</div>
</section>
<section className="space-y-4 border-t border-border pt-7">
<div className="flex items-center gap-2 text-sm font-semibold text-foreground">
<TextCursorInput className="h-4 w-4 text-muted-foreground" aria-hidden="true" />
{t("settings.general.sections.portalContent")}
</div>
<p className="max-w-2xl text-sm text-muted-foreground">
{t("settings.general.help.portalContent")}
</p>
<LocalizedFields
idPrefix="branding-content"
defaultLocale={defaultLocale}
locales={locales}
fields={localizedFields}
values={initial.translations}
labels={{
defaultBadge: t("settings.localized.defaultBadge"),
missingRequired: t("settings.localized.missingRequired"),
}}
/>
</section>
<div className="flex justify-end border-t border-border pt-6">
<Button
type="submit"
variant="default"
effect="shine"
loading={pending}
className="gap-2"
>
<Save className="h-4 w-4" aria-hidden="true" />
{t("settings.general.actions.save")}
</Button>
</div>
</form>
</CardContent>
</Card>
);
}
app/(dashboard)/settings/general/page.tsx
+36
View File
@@ -0,0 +1,36 @@
import { getBrandingService } from "@/server/branding/runtime";
import { getSqliteConnection } from "@/server/db/client";
import { ContentTranslationService } from "@/server/i18n/content";
import { requireFreelancerBackend } from "@/server/web/freelancer";
import { GeneralSettingsForm } from "./general-settings-form";
export default async function GeneralSettingsPage() {
const { actor } = await requireFreelancerBackend();
const branding = getBrandingService().getPublic();
const contentI18n = new ContentTranslationService(getSqliteConnection().db);
const localization = contentI18n.getLocalizationContext(actor);
const translations = contentI18n.listEntityTranslations("branding", "default");
return (
<GeneralSettingsForm
defaultLocale={localization.defaultLocale}
locales={localization.locales.filter((locale) => locale.status === "active")}
initial={{
workspaceName: branding.organizationName ?? branding.applicationName,
metaTitle: branding.applicationName,
shortName: branding.shortName,
translations: toLocalizedValues(translations),
}}
/>
);
}
function toLocalizedValues(
rows: Array<{ locale: string; field: string; value: string }>,
) {
return rows.reduce<Record<string, Record<string, string>>>((result, row) => {
result[row.locale] = result[row.locale] ?? {};
result[row.locale][row.field] = row.value;
return result;
}, {});
}