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

feat: support localized domain content

Browse Source
This commit is contained in:
poyrazavsever
2026-07-19 03:07:20 +03:00
parent c7a4f3de51
commit c1c473469a
15 changed files with 659 additions and 208 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/(dashboard)/clients/[id]/client-detail-client.tsx
+65 -7
View File
@@ -2,7 +2,7 @@
import { useState } from "react";
import { format } from "date-fns";
import { tr } from "date-fns/locale";
import { getDocumentDateFnsLocale } from "@/lib/i18n/date-fns";
import { Card, CardContent, Badge, Button, Input, Textarea, Label } from "poyraz-ui/atoms";
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger, DialogFooter, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, DialogDescription } from "poyraz-ui/molecules";
import { Phone, Mail, ExternalLink, Calendar, Plus, MessageSquare, UserPlus, Loader2, Copy } from "lucide-react";
@@ -20,6 +20,7 @@ export type ClientDetailData = {
status: string;
notes: string | null;
client_auth_id: string | null;
portal_locale: string;
};
export type ClientActivity = {
@@ -31,9 +32,18 @@ export type ClientActivity = {
created_at: string;
};
export function ClientDetailClient({ client, activities }: { client: ClientDetailData; activities: ClientActivity[] }) {
export function ClientDetailClient({
client,
activities,
locales,
}: {
client: ClientDetailData;
activities: ClientActivity[];
locales: Array<{ code: string; nativeName: string; name: string }>;
}) {
const [isAddingActivity, setIsAddingActivity] = useState(false);
const [openDialog, setOpenDialog] = useState(false);
const [portalLocale, setPortalLocale] = useState(client.portal_locale);
const getActivityIcon = (type: string) => {
switch (type) {
@@ -71,19 +81,21 @@ export function ClientDetailClient({ client, activities }: { client: ClientDetai
e.preventDefault();
const formData = new FormData(e.currentTarget);
const email = formData.get("email") as string;
const locale = formData.get("locale") as string;
setIsCreatingUser(true);
try {
const res = await fetch("/api/create-client-user", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ email, client_id: client.id })
body: JSON.stringify({ email, client_id: client.id, locale })
});
const data = await res.json();
if (!res.ok || data.error) {
throw new Error(data.error || "Kullanıcı oluşturulamadı.");
}
setInvitationUrl(data.invitation.invitationUrl);
setPortalLocale(data.invitation.locale ?? locale);
toast.success("Güvenli portal daveti oluşturuldu.");
} catch (error: unknown) {
toast.error(error instanceof Error ? error.message : "Davet oluşturulamadı.");
@@ -92,6 +104,23 @@ export function ClientDetailClient({ client, activities }: { client: ClientDetai
}
}
async function handlePortalLocaleChange(nextLocale: string) {
setPortalLocale(nextLocale);
try {
const response = await fetch(`/api/portal-clients/${client.id}/locale`, {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ locale: nextLocale }),
});
const data = await response.json();
if (!response.ok || data.error) throw new Error(data.error || "Portal dili güncellenemedi.");
toast.success("Portal dili güncellendi.");
} catch (error) {
setPortalLocale(client.portal_locale);
toast.error(error instanceof Error ? error.message : "Portal dili güncellenemedi.");
}
}
return (
<div className="mx-auto flex max-w-7xl flex-col gap-6 animate-in fade-in slide-in-from-bottom-4 duration-500">
{/* Header Info */}
@@ -129,6 +158,21 @@ export function ClientDetailClient({ client, activities }: { client: ClientDetai
<Label htmlFor="email">E-posta Adresi</Label>
<Input id="email" name="email" type="email" required defaultValue={client.email || ""} />
</div>
<div className="space-y-2">
<Label>Portal dili</Label>
<Select name="locale" defaultValue={portalLocale}>
<SelectTrigger>
<SelectValue placeholder="Dil seç" />
</SelectTrigger>
<SelectContent>
{locales.map((locale) => (
<SelectItem key={locale.code} value={locale.code}>
{locale.nativeName || locale.name}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
{invitationUrl ? (
<div className="space-y-2">
<Label htmlFor="invitation-url">Davet bağlantısı</Label>
@@ -163,9 +207,23 @@ export function ClientDetailClient({ client, activities }: { client: ClientDetai
</Dialog>
)}
{client.client_auth_id && (
<Badge className="bg-emerald-500/10 text-emerald-600 border-emerald-500/20 px-3 py-1 text-sm flex items-center gap-1.5 ml-2">
<UserPlus className="h-3.5 w-3.5" /> Portal Aktif
</Badge>
<>
<Badge className="bg-emerald-500/10 text-emerald-600 border-emerald-500/20 px-3 py-1 text-sm flex items-center gap-1.5 ml-2">
<UserPlus className="h-3.5 w-3.5" /> Portal Aktif
</Badge>
<Select value={portalLocale} onValueChange={handlePortalLocaleChange}>
<SelectTrigger className="h-9 w-36">
<SelectValue placeholder="Portal dili" />
</SelectTrigger>
<SelectContent>
{locales.map((locale) => (
<SelectItem key={locale.code} value={locale.code}>
{locale.nativeName || locale.name}
</SelectItem>
))}
</SelectContent>
</Select>
</>
)}
</div>
</div>
@@ -290,7 +348,7 @@ export function ClientDetailClient({ client, activities }: { client: ClientDetai
{getActivityBadge(activity.type)}
</div>
<time className="text-xs text-muted-foreground block mb-2 font-medium">
{format(new Date(activity.activity_date), "d MMM yyyy, HH:mm", { locale: tr })}
{format(new Date(activity.activity_date), "d MMM yyyy, HH:mm", { locale: getDocumentDateFnsLocale() })}
</time>
{activity.content && (
<p className="text-sm text-muted-foreground whitespace-pre-wrap">{activity.content}</p>
app/(dashboard)/clients/[id]/page.tsx
+7 -1
View File
@@ -1,11 +1,16 @@
import { notFound } from "next/navigation";
import { ClientDetailClient, type ClientDetailData, type ClientActivity } from "./client-detail-client";
import { getSqliteConnection } from "@/server/db/client";
import { DomainError } from "@/server/domain/errors";
import { I18nService } from "@/server/i18n/service";
import { requireFreelancerBackend } from "@/server/web/freelancer";
export default async function ClientDetailPage({ params }: { params: Promise<{ id: string }> }) {
const { id } = await params;
const { actor, service } = await requireFreelancerBackend();
const i18n = new I18nService(getSqliteConnection().db);
const locales = i18n.listLocales(actor).filter((locale) => locale.status === "active");
const defaultLocale = i18n.getSettings(actor).defaultLocale;
let data: { client: ClientDetailData; activities: ClientActivity[] };
try {
@@ -21,6 +26,7 @@ export default async function ClientDetailPage({ params }: { params: Promise<{ i
status: row.status,
notes: row.notes,
client_auth_id: row.authUserId,
portal_locale: row.portalLocale ?? defaultLocale,
};
const activities: ClientActivity[] = service.listClientActivities(actor, id).map((activity) => ({
id: activity.id,
@@ -37,5 +43,5 @@ export default async function ClientDetailPage({ params }: { params: Promise<{ i
throw error;
}
return <ClientDetailClient client={data.client} activities={data.activities} />;
return <ClientDetailClient client={data.client} activities={data.activities} locales={locales} />;
}
app/(dashboard)/clients/clients-client.tsx
+8 -5
View File
@@ -1,5 +1,7 @@
"use client";
import { getDocumentIntlLocale } from "@/lib/i18n/browser";
import { useTranslations } from "@/components/i18n/i18n-provider";
import {
createClientRecord,
updateClientRecord,
@@ -40,7 +42,7 @@ import {
import Link from "next/link";
import { useState } from "react";
import { format, isPast, isToday } from "date-fns";
import { tr } from "date-fns/locale";
import { getDocumentDateFnsLocale } from "@/lib/i18n/date-fns";
import { cn } from "@/lib/utils";
import { StatCard } from "@/components/system/stat-card";
@@ -88,6 +90,7 @@ export function ClientsClient({
totalRevenue,
activeCount,
}: ClientsClientProps) {
const t = useTranslations();
const [query, setQuery] = useState("");
const normalizedQuery = query.trim().toLowerCase();
@@ -154,7 +157,7 @@ export function ClientsClient({
<div className="flex flex-col gap-4 border-b border-border pb-5 lg:flex-row lg:items-end lg:justify-between">
<div>
<h1 className="text-3xl font-semibold tracking-normal text-foreground">
CRM & Müşteriler
{t("clients.title")}
</h1>
</div>
@@ -326,7 +329,7 @@ function DraggableClientCard({
<div className="mt-3 flex items-center gap-1.5 text-xs pointer-events-none">
<Clock className={`h-3 w-3 ${isPast(new Date(client.next_follow_up_date)) ? 'text-rose-500' : 'text-muted-foreground'}`} />
<span className={isPast(new Date(client.next_follow_up_date)) ? 'text-rose-500 font-medium' : 'text-muted-foreground'}>
{format(new Date(client.next_follow_up_date), 'd MMM yyyy', { locale: tr })}
{format(new Date(client.next_follow_up_date), 'd MMM yyyy', { locale: getDocumentDateFnsLocale() })}
</span>
</div>
)}
@@ -384,7 +387,7 @@ function ClientRow({ client }: { client: ClientListItem }) {
{client.next_follow_up_date ? (
<div className={`flex items-center gap-1.5 ${isFollowUpOverdue ? 'text-rose-600 font-medium' : 'text-muted-foreground'}`}>
<Clock className="h-3.5 w-3.5" />
{format(new Date(client.next_follow_up_date), 'd MMM yyyy', { locale: tr })}
{format(new Date(client.next_follow_up_date), 'd MMM yyyy', { locale: getDocumentDateFnsLocale() })}
</div>
) : (
<span className="text-muted-foreground opacity-50">-</span>
@@ -635,5 +638,5 @@ function formatPhone(input: string) {
}
function formatCurrency(value: number) {
return new Intl.NumberFormat("tr-TR", { style: "currency", currency: "USD", maximumFractionDigits: 0 }).format(value);
return new Intl.NumberFormat(getDocumentIntlLocale(), { style: "currency", currency: "USD", maximumFractionDigits: 0 }).format(value);
}
app/(dashboard)/projects/[id]/page.tsx
+64 -20
View File
@@ -7,12 +7,18 @@ import {
type ProjectPlanningSectionItem,
type ProjectRevisionItem,
} from "@/app/(dashboard)/projects/[id]/project-detail-client";
import { getSqliteConnection } from "@/server/db/client";
import { DomainError } from "@/server/domain/errors";
import { ContentTranslationService, type ContentTranslationRow } from "@/server/i18n/content";
import { resolveRequestLocale } from "@/server/i18n/resolver";
import { requireFreelancerBackend } from "@/server/web/freelancer";
export default async function ProjectDetailPage({ params }: { params: Promise<{ id: string }> }) {
const { id } = await params;
const locale = await resolveRequestLocale();
const { actor, service } = await requireFreelancerBackend();
const content = new ContentTranslationService(getSqliteConnection().db);
const localization = content.getLocalizationContext(actor);
let data: {
project: ProjectDetail;
@@ -23,14 +29,20 @@ export default async function ProjectDetailPage({ params }: { params: Promise<{
};
try {
const row = service.getProject(actor, id);
const projectTranslationRows = content.listEntityTranslations("project", row.id);
const resolvedProject = content.resolveEntity("project", row, {
locale: locale.locale,
defaultLocale: localization.defaultLocale,
translations: projectTranslationRows,
});
const client = row.clientId ? service.getClient(actor, row.clientId) : null;
const project: ProjectDetail = {
id: row.id,
client_id: row.clientId,
clientName: client?.name ?? null,
name: row.name,
name: resolvedProject.name,
type: row.type,
description: row.description,
description: resolvedProject.description,
status: row.status,
start_date: row.startDate,
due_date: row.dueDate,
@@ -39,27 +51,50 @@ export default async function ProjectDetailPage({ params }: { params: Promise<{
progress: row.progress,
progress_type: row.progressType,
revision_quota: row.revisionQuota,
cover_image_alt: row.coverImageAlt,
cover_image_alt: resolvedProject.coverImageAlt,
coverImageUrl: row.legacyCoverImagePath,
translations: toLocalizedValues(projectTranslationRows),
};
const sections: ProjectPlanningSectionItem[] = service.listPlanningSections(actor, id).map((section) => ({
id: section.id,
project_id: section.projectId,
category: section.category,
title: section.title,
content: section.content,
sort_order: section.sortOrder,
}));
const tasks: ProjectDetailTaskItem[] = service.listTasks(actor, id)
const sectionRows = service.listPlanningSections(actor, id);
const sectionTranslations = content.listBatch("planning_section", sectionRows.map((section) => section.id));
const sections: ProjectPlanningSectionItem[] = sectionRows.map((section) => {
const translationRows = sectionTranslations.get(section.id) ?? [];
const resolvedSection = content.resolveEntity("planning_section", section, {
locale: locale.locale,
defaultLocale: localization.defaultLocale,
translations: translationRows,
});
return {
id: section.id,
project_id: section.projectId,
category: section.category,
title: resolvedSection.title,
content: resolvedSection.content,
sort_order: section.sortOrder,
translations: toLocalizedValues(translationRows),
};
});
const taskRows = service.listTasks(actor, id).filter((task) => task.status !== "cancelled");
const taskTranslations = content.listBatch("task", taskRows.map((task) => task.id));
const tasks: ProjectDetailTaskItem[] = taskRows
.filter((task) => task.status !== "cancelled")
.map((task) => ({
id: task.id,
title: task.title,
status: task.status as ProjectDetailTaskItem["status"],
priority: task.priority,
due_at: task.dueAt?.toISOString() ?? null,
is_public_to_client: task.isPublicToClient,
}));
.map((task) => {
const translationRows = taskTranslations.get(task.id) ?? [];
const resolvedTask = content.resolveEntity("task", task, {
locale: locale.locale,
defaultLocale: localization.defaultLocale,
translations: translationRows,
});
return {
id: task.id,
title: resolvedTask.title,
status: task.status as ProjectDetailTaskItem["status"],
priority: task.priority,
due_at: task.dueAt?.toISOString() ?? null,
is_public_to_client: task.isPublicToClient,
translations: toLocalizedValues(translationRows),
};
});
const financeTransactions: ProjectFinanceItem[] = service.listFinanceTransactions(actor)
.filter((transaction) => transaction.projectId === id)
.map((transaction) => ({
@@ -92,6 +127,15 @@ export default async function ProjectDetailPage({ params }: { params: Promise<{
tasks={data.tasks}
financeTransactions={data.financeTransactions}
revisions={data.revisions}
localization={localization}
/>
);
}
function toLocalizedValues(rows: ContentTranslationRow[]) {
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;
}, {});
}
app/(dashboard)/projects/[id]/project-detail-client.tsx
+56 -50
View File
@@ -1,5 +1,6 @@
"use client";
import { getDocumentIntlLocale } from "@/lib/i18n/browser";
import {
completeProjectRecord,
createProjectPlanningSectionRecord,
@@ -10,9 +11,11 @@ import {
createTaskRecord,
updateTaskStatusRecord,
} from "@/app/(dashboard)/tasks/actions";
import { LocalizedFields, type LocalizedFieldLocale, type LocalizedFieldValues } from "@/components/i18n/localized-fields";
import { PendingLink } from "@/components/ui/pending-link";
import { PendingSubmitButton } from "@/components/ui/pending-submit-button";
import { Badge, Button, Card, CardContent, Input, Label, Textarea } from "poyraz-ui/atoms";
import { contentTranslationRegistry } from "@/lib/i18n/content";
import { Badge, Button, Card, CardContent, Input, Label } from "poyraz-ui/atoms";
import {
Dialog,
DialogContent,
@@ -66,6 +69,7 @@ export type ProjectDetail = {
revision_quota: number;
cover_image_alt: string | null;
coverImageUrl: string | null;
translations?: LocalizedFieldValues;
};
export type ProjectPlanningSectionItem = {
@@ -85,6 +89,7 @@ export type ProjectPlanningSectionItem = {
title: string;
content: string | null;
sort_order: number;
translations?: LocalizedFieldValues;
};
export type ProjectDetailTaskItem = {
@@ -94,6 +99,7 @@ export type ProjectDetailTaskItem = {
priority: "low" | "medium" | "high" | "urgent";
due_at: string | null;
is_public_to_client: boolean;
translations?: LocalizedFieldValues;
};
export type ProjectFinanceItem = {
@@ -120,6 +126,10 @@ type ProjectDetailClientProps = {
tasks: ProjectDetailTaskItem[];
financeTransactions: ProjectFinanceItem[];
revisions: ProjectRevisionItem[];
localization: {
defaultLocale: string;
locales: LocalizedFieldLocale[];
};
};
const typeLabels = {
@@ -185,6 +195,7 @@ export function ProjectDetailClient({
tasks,
financeTransactions,
revisions,
localization,
}: ProjectDetailClientProps) {
const [activeTab, setActiveTab] = useState<"planning" | "design" | "tasks" | "finance" | "revisions">(
"planning",
@@ -227,7 +238,7 @@ export function ProjectDetailClient({
<div className="flex gap-2">
<ProjectSettingsDialog project={project} />
<SectionDialog projectId={project.id} mode="create" defaultCategory="overview" />
<SectionDialog projectId={project.id} mode="create" defaultCategory="overview" localization={localization} />
{project.status !== "completed" ? (
<form action={completeProjectRecord}>
<input type="hidden" name="id" value={project.id} />
@@ -329,6 +340,7 @@ export function ProjectDetailClient({
description="Problem, amaç, hedef kitle, kapsam ve proje notlarını burada tut."
sections={planningSections}
defaultCategory="overview"
localization={localization}
/>
) : null}
@@ -339,11 +351,12 @@ export function ProjectDetailClient({
description="Renk paleti, tipografi, görsel dil ve asset notlarını proje kaynağına bağla."
sections={designSections}
defaultCategory="design_system"
localization={localization}
/>
) : null}
{activeTab === "tasks" ? (
<TaskPanel projectId={project.id} clientId={project.client_id} tasks={tasks} />
<TaskPanel projectId={project.id} clientId={project.client_id} tasks={tasks} localization={localization} />
) : null}
{activeTab === "finance" ? <FinancePanel transactions={financeTransactions} /> : null}
{activeTab === "revisions" ? <RevisionsPanel projectId={project.id} revisions={revisions} /> : null}
@@ -391,7 +404,7 @@ function RevisionsPanel({
<div key={rev.id} className="p-4 border rounded-md">
<div className="flex justify-between items-start mb-3">
<div className="text-sm text-muted-foreground">
{new Date(rev.created_at).toLocaleString('tr-TR')}
{new Date(rev.created_at).toLocaleString(getDocumentIntlLocale())}
</div>
<Select
defaultValue={rev.status}
@@ -430,12 +443,14 @@ function SectionGrid({
description,
sections,
defaultCategory,
localization,
}: {
projectId: string;
title: string;
description: string;
sections: ProjectPlanningSectionItem[];
defaultCategory: ProjectPlanningSectionItem["category"];
localization: ProjectDetailClientProps["localization"];
}) {
return (
<Card>
@@ -445,13 +460,13 @@ function SectionGrid({
<h2 className="text-lg font-semibold text-foreground">{title}</h2>
<p className="mt-1 text-sm text-muted-foreground">{description}</p>
</div>
<SectionDialog projectId={projectId} mode="create" defaultCategory={defaultCategory} />
<SectionDialog projectId={projectId} mode="create" defaultCategory={defaultCategory} localization={localization} />
</div>
{sections.length > 0 ? (
<div className="grid gap-4 md:grid-cols-2">
{sections.map((section) => (
<PlanningSectionCard key={section.id} section={section} />
<PlanningSectionCard key={section.id} section={section} localization={localization} />
))}
</div>
) : (
@@ -469,7 +484,13 @@ function SectionGrid({
);
}
function PlanningSectionCard({ section }: { section: ProjectPlanningSectionItem }) {
function PlanningSectionCard({
section,
localization,
}: {
section: ProjectPlanningSectionItem;
localization: ProjectDetailClientProps["localization"];
}) {
return (
<Card className="transition-colors hover:border-primary/30">
<CardContent className="flex h-full flex-col gap-4 p-4">
@@ -479,7 +500,7 @@ function PlanningSectionCard({ section }: { section: ProjectPlanningSectionItem
<h3 className="mt-3 text-base font-semibold text-foreground">{section.title}</h3>
</div>
<div className="flex gap-2">
<SectionDialog projectId={section.project_id} mode="edit" section={section} />
<SectionDialog projectId={section.project_id} mode="edit" section={section} localization={localization} />
<form action={deleteProjectPlanningSectionRecord}>
<input type="hidden" name="id" value={section.id} />
<input type="hidden" name="project_id" value={section.project_id} />
@@ -505,11 +526,13 @@ function SectionDialog({
mode,
defaultCategory,
section,
localization,
}: {
projectId: string;
mode: "create" | "edit";
defaultCategory?: ProjectPlanningSectionItem["category"];
section?: ProjectPlanningSectionItem;
localization: ProjectDetailClientProps["localization"];
}) {
const [open, setOpen] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
@@ -569,26 +592,17 @@ function SectionDialog({
</SelectContent>
</Select>
</div>
<div className="grid gap-2">
<Label htmlFor={`section-title-${section?.id || "new"}`}>Başlık</Label>
<Input
id={`section-title-${section?.id || "new"}`}
name="title"
defaultValue={section?.title || ""}
required
placeholder="Örn. Başarı kriterleri"
/>
</div>
<div className="grid gap-2">
<Label htmlFor={`section-content-${section?.id || "new"}`}>İçerik</Label>
<Textarea
id={`section-content-${section?.id || "new"}`}
name="content"
defaultValue={section?.content || ""}
rows={8}
placeholder="Kısa notlar, kriterler, renkler, tipografi kararları..."
/>
</div>
<LocalizedFields
idPrefix={`section-${section?.id || "new"}`}
defaultLocale={localization.defaultLocale}
locales={localization.locales}
fields={contentTranslationRegistry.planning_section}
values={section?.translations}
fallbackValues={{
title: section?.title,
content: section?.content,
}}
/>
<div className="grid gap-2">
<Label htmlFor={`section-order-${section?.id || "new"}`}>Sıra</Label>
<Input
@@ -615,10 +629,12 @@ function TaskPanel({
projectId,
clientId,
tasks,
localization,
}: {
projectId: string;
clientId: string | null;
tasks: ProjectDetailTaskItem[];
localization: ProjectDetailClientProps["localization"];
}) {
const [view, setView] = useState<"list" | "kanban">("list");
const [statusOverrides, setStatusOverrides] = useState<
@@ -703,7 +719,7 @@ function TaskPanel({
Kanban
</Button>
</div>
<ProjectTaskDialog projectId={projectId} clientId={clientId} />
<ProjectTaskDialog projectId={projectId} clientId={clientId} localization={localization} />
</div>
</div>
@@ -989,9 +1005,11 @@ function ProjectSettingsDialog({ project }: { project: ProjectDetail }) {
function ProjectTaskDialog({
projectId,
clientId,
localization,
}: {
projectId: string;
clientId: string | null;
localization: ProjectDetailClientProps["localization"];
}) {
const [open, setOpen] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
@@ -1027,24 +1045,12 @@ function ProjectTaskDialog({
</DialogHeader>
<div className="grid gap-4">
<div className="grid gap-2">
<Label htmlFor="project-task-title">Başlık</Label>
<Input
id="project-task-title"
name="title"
required
placeholder="Örn. Mobil görünüm kontrolü"
/>
</div>
<div className="grid gap-2">
<Label htmlFor="project-task-description">Açıklama</Label>
<Textarea
id="project-task-description"
name="description"
rows={3}
placeholder="Kapsam, teslim notu veya kabul kriterleri..."
/>
</div>
<LocalizedFields
idPrefix="project-task"
defaultLocale={localization.defaultLocale}
locales={localization.locales}
fields={contentTranslationRegistry.task}
/>
<div className="grid gap-4 md:grid-cols-2">
<div className="grid gap-2">
<Label>Durum</Label>
@@ -1262,7 +1268,7 @@ function TabButton({
}
function formatDate(value: string) {
return new Intl.DateTimeFormat("tr-TR", {
return new Intl.DateTimeFormat(getDocumentIntlLocale(), {
day: "2-digit",
month: "short",
year: "numeric",
@@ -1270,7 +1276,7 @@ function formatDate(value: string) {
}
function formatDateTime(value: string) {
return new Intl.DateTimeFormat("tr-TR", {
return new Intl.DateTimeFormat(getDocumentIntlLocale(), {
day: "2-digit",
month: "short",
hour: "2-digit",
@@ -1285,7 +1291,7 @@ function getTaskStatusLabel(status: ProjectDetailTaskItem["status"]) {
}
function formatCurrency(value: number, currency: string) {
return new Intl.NumberFormat("tr-TR", {
return new Intl.NumberFormat(getDocumentIntlLocale(), {
style: "currency",
currency,
maximumFractionDigits: 0,
app/(dashboard)/projects/actions.ts
+32 -12
View File
@@ -3,6 +3,11 @@
import { randomUUID } from "node:crypto";
import { revalidatePath } from "next/cache";
import { getFileService } from "@/server/files/runtime";
import { getSqliteConnection } from "@/server/db/client";
import {
ContentTranslationService,
parseContentTranslationsFromFormData,
} from "@/server/i18n/content";
import { cleanText, decimalToMinor, requiredText } from "@/server/web/form-data";
import { requireFreelancerBackend } from "@/server/web/freelancer";
@@ -20,20 +25,21 @@ function numberValue(value: FormDataEntryValue | null, fallback = 0) {
return Number.isFinite(parsed) ? parsed : fallback;
}
function projectPayload(formData: FormData) {
function projectPayload(formData: FormData, translations?: Record<string, Record<string, string | null>>, defaultLocale = "tr") {
const type = enumValue(formData.get("type"), PROJECT_TYPES, "client_project");
const localized = translations?.[defaultLocale] ?? {};
return {
name: requiredText(formData.get("name"), "Proje adı zorunludur."),
name: localized.name ?? requiredText(formData.get("name"), "Proje adı zorunludur."),
type,
clientId: type === "client_project" ? cleanText(formData.get("client_id")) : null,
description: cleanText(formData.get("description")),
description: localized.description ?? cleanText(formData.get("description")),
status: enumValue(formData.get("status"), PROJECT_STATUSES, "planning"),
startDate: cleanText(formData.get("start_date")),
dueDate: cleanText(formData.get("due_date")),
budgetAmountMinor: decimalToMinor(formData.get("budget_amount")),
currency: cleanText(formData.get("currency")) ?? "USD",
progress: Math.min(100, Math.max(0, Math.round(numberValue(formData.get("progress"))))),
coverImageAlt: cleanText(formData.get("cover_image_alt")),
coverImageAlt: localized.coverImageAlt ?? cleanText(formData.get("cover_image_alt")),
};
}
@@ -57,8 +63,11 @@ async function uploadCover(
export async function createProjectRecord(formData: FormData) {
const { actor, service } = await requireFreelancerBackend();
const i18n = new ContentTranslationService(getSqliteConnection().db);
const context = i18n.getLocalizationContext(actor);
const translations = parseContentTranslationsFromFormData(formData, "project", context);
const id = randomUUID();
service.createProject(actor, { id, ...projectPayload(formData) });
service.createProject(actor, { id, ...projectPayload(formData, translations, context.defaultLocale), translations });
try {
const cover = await uploadCover(actor, id, formData);
if (cover) service.updateProject(actor, id, { legacyCoverImagePath: cover });
@@ -71,8 +80,11 @@ export async function createProjectRecord(formData: FormData) {
export async function updateProjectRecord(formData: FormData) {
const { actor, service } = await requireFreelancerBackend();
const i18n = new ContentTranslationService(getSqliteConnection().db);
const context = i18n.getLocalizationContext(actor);
const translations = parseContentTranslationsFromFormData(formData, "project", context);
const id = requiredText(formData.get("id"), "Proje kaydı bulunamadı.");
service.updateProject(actor, id, projectPayload(formData));
service.updateProject(actor, id, { ...projectPayload(formData, translations, context.defaultLocale), translations });
const cover = await uploadCover(actor, id, formData);
if (cover) service.updateProject(actor, id, { legacyCoverImagePath: cover });
revalidatePath("/projects");
@@ -87,28 +99,35 @@ export async function completeProjectRecord(formData: FormData) {
revalidatePath(`/projects/${id}`);
}
function sectionPayload(formData: FormData) {
function sectionPayload(formData: FormData, translations?: Record<string, Record<string, string | null>>, defaultLocale = "tr") {
const localized = translations?.[defaultLocale] ?? {};
return {
projectId: requiredText(formData.get("project_id"), "Proje zorunludur."),
category: enumValue(formData.get("category"), SECTION_CATEGORIES, "overview"),
title: requiredText(formData.get("title"), "Planlama başlığı zorunludur."),
content: cleanText(formData.get("content")),
title: localized.title ?? requiredText(formData.get("title"), "Planlama başlığı zorunludur."),
content: localized.content ?? cleanText(formData.get("content")),
sortOrder: Math.max(0, Math.round(numberValue(formData.get("sort_order")))),
};
}
export async function createProjectPlanningSectionRecord(formData: FormData) {
const { actor, service } = await requireFreelancerBackend();
const payload = sectionPayload(formData);
service.addPlanningSection(actor, payload);
const i18n = new ContentTranslationService(getSqliteConnection().db);
const context = i18n.getLocalizationContext(actor);
const translations = parseContentTranslationsFromFormData(formData, "planning_section", context);
const payload = sectionPayload(formData, translations, context.defaultLocale);
service.addPlanningSection(actor, { ...payload, translations });
revalidatePath("/projects");
revalidatePath(`/projects/${payload.projectId}`);
}
export async function updateProjectPlanningSectionRecord(formData: FormData) {
const { actor, service } = await requireFreelancerBackend();
const i18n = new ContentTranslationService(getSqliteConnection().db);
const context = i18n.getLocalizationContext(actor);
const translations = parseContentTranslationsFromFormData(formData, "planning_section", context);
const id = requiredText(formData.get("id"), "Planlama alanı bulunamadı.");
const payload = sectionPayload(formData);
const payload = sectionPayload(formData, translations, context.defaultLocale);
if (!service.listPlanningSections(actor, payload.projectId).some((section) => section.id === id)) {
throw new Error("Planlama alanı bu projeye ait değil.");
}
@@ -117,6 +136,7 @@ export async function updateProjectPlanningSectionRecord(formData: FormData) {
title: payload.title,
content: payload.content,
sortOrder: payload.sortOrder,
translations,
});
revalidatePath("/projects");
revalidatePath(`/projects/${payload.projectId}`);
app/(dashboard)/projects/page.tsx
+27 -5
View File
@@ -1,8 +1,14 @@
import { ProjectsClient, type ProjectClientOption, type ProjectListItem } from "@/app/(dashboard)/projects/projects-client";
import { getSqliteConnection } from "@/server/db/client";
import { ContentTranslationService, type ContentTranslationRow } from "@/server/i18n/content";
import { resolveRequestLocale } from "@/server/i18n/resolver";
import { requireFreelancerBackend } from "@/server/web/freelancer";
export default async function ProjectsPage() {
const locale = await resolveRequestLocale();
const { actor, service } = await requireFreelancerBackend();
const content = new ContentTranslationService(getSqliteConnection().db);
const localization = content.getLocalizationContext(actor);
const projectRows = service.listProjects(actor);
const clientRows = service.listClients(actor);
const taskRows = service.listTasks(actor);
@@ -17,15 +23,22 @@ export default async function ProjectsPage() {
taskStats.set(task.projectId, stats);
}
const projectTranslations = content.listBatch("project", projectRows.map((project) => project.id));
const projects: ProjectListItem[] = projectRows.map((project) => {
const stats = taskStats.get(project.id) ?? { total: 0, done: 0 };
const translationRows = projectTranslations.get(project.id) ?? [];
const resolvedProject = content.resolveEntity("project", project, {
locale: locale.locale,
defaultLocale: localization.defaultLocale,
translations: translationRows,
});
return {
id: project.id,
client_id: project.clientId,
clientName: project.clientId ? clientNames.get(project.clientId) ?? null : null,
name: project.name,
name: resolvedProject.name,
type: project.type,
description: project.description,
description: resolvedProject.description,
status: project.status,
start_date: project.startDate,
due_date: project.dueDate,
@@ -33,16 +46,25 @@ export default async function ProjectsPage() {
currency: project.currency,
progress: project.progress,
cover_image_path: project.legacyCoverImagePath,
cover_image_alt: project.coverImageAlt,
cover_image_alt: resolvedProject.coverImageAlt,
coverImageUrl: project.legacyCoverImagePath,
taskCount: stats.total,
doneTaskCount: stats.done,
translations: toLocalizedValues(translationRows),
};
});
const clients: ProjectClientOption[] = clientRows
.filter((client) => client.status !== "archived")
.sort((a, b) => a.name.localeCompare(b.name, "tr"))
.sort((a, b) => a.name.localeCompare(b.name, locale.locale))
.map(({ id, name }) => ({ id, name }));
return <ProjectsClient projects={projects} clients={clients} />;
return <ProjectsClient projects={projects} clients={clients} localization={localization} />;
}
function toLocalizedValues(rows: ContentTranslationRow[]) {
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;
}, {});
}
app/(dashboard)/projects/projects-client.tsx
+47 -44
View File
@@ -1,13 +1,17 @@
"use client";
import { getDocumentIntlLocale } from "@/lib/i18n/browser";
import { useTranslations } from "@/components/i18n/i18n-provider";
import {
completeProjectRecord,
createProjectRecord,
updateProjectRecord,
} from "@/app/(dashboard)/projects/actions";
import { LocalizedFields, type LocalizedFieldLocale, type LocalizedFieldValues } from "@/components/i18n/localized-fields";
import { PendingLink } from "@/components/ui/pending-link";
import { PendingSubmitButton } from "@/components/ui/pending-submit-button";
import { Badge, Button, Card, CardContent, Input, Label, Textarea } from "poyraz-ui/atoms";
import { contentTranslationRegistry } from "@/lib/i18n/content";
import { Badge, Button, Card, CardContent, Input, Label } from "poyraz-ui/atoms";
import {
Dialog,
DialogContent,
@@ -66,6 +70,7 @@ export type ProjectListItem = {
coverImageUrl: string | null;
taskCount: number;
doneTaskCount: number;
translations?: LocalizedFieldValues;
};
const typeLabels = {
@@ -92,9 +97,14 @@ const statusClasses = {
type ProjectsClientProps = {
projects: ProjectListItem[];
clients: ProjectClientOption[];
localization: {
defaultLocale: string;
locales: LocalizedFieldLocale[];
};
};
export function ProjectsClient({ projects, clients }: ProjectsClientProps) {
export function ProjectsClient({ projects, clients, localization }: ProjectsClientProps) {
const t = useTranslations();
const [query, setQuery] = useState("");
const [view, setView] = useState<"grid" | "list">("grid");
const normalizedQuery = query.trim().toLowerCase();
@@ -118,21 +128,21 @@ export function ProjectsClient({ projects, clients }: ProjectsClientProps) {
<div className="flex flex-col gap-4 border-b border-border pb-5 lg:flex-row lg:items-end lg:justify-between">
<div>
<h1 className="text-3xl font-semibold tracking-normal text-foreground">
Projeler
{t("projects.title")}
</h1>
</div>
<div className="flex gap-2">
<AIProjectRiskDialog />
<ProjectDialog mode="create" clients={clients} />
<ProjectDialog mode="create" clients={clients} localization={localization} />
</div>
</div>
<div className="grid gap-3 md:grid-cols-4">
<StatCard label="Aktif proje" value={activeCount.toString()} icon={FolderKanban} tone="green" />
<StatCard label={t("projects.stats.active")} value={activeCount.toString()} icon={FolderKanban} tone="green" />
<StatCard label="Side project" value={sideProjectCount.toString()} icon={Target} tone="blue" />
<StatCard label="Ortalama ilerleme" value={`${averageProgress}%`} icon={CheckCircle2} tone="amber" />
<StatCard label="Toplam bütçe" value={formatCurrency(totalBudget)} icon={Wallet} tone="red" />
<StatCard label={t("projects.stats.progress")} value={`${averageProgress}%`} icon={CheckCircle2} tone="amber" />
<StatCard label={t("projects.stats.budget")} value={formatCurrency(totalBudget)} icon={Wallet} tone="red" />
</div>
<Card>
@@ -178,7 +188,7 @@ export function ProjectsClient({ projects, clients }: ProjectsClientProps) {
view === "grid" ? (
<div className="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
{filteredProjects.map((project) => (
<ProjectCard key={project.id} project={project} clients={clients} />
<ProjectCard key={project.id} project={project} clients={clients} localization={localization} />
))}
</div>
) : (
@@ -193,7 +203,7 @@ export function ProjectsClient({ projects, clients }: ProjectsClientProps) {
</div>
<div className="divide-y divide-border">
{filteredProjects.map((project) => (
<ProjectRow key={project.id} project={project} clients={clients} />
<ProjectRow key={project.id} project={project} clients={clients} localization={localization} />
))}
</div>
</div>
@@ -211,9 +221,11 @@ export function ProjectsClient({ projects, clients }: ProjectsClientProps) {
function ProjectCard({
project,
clients,
localization,
}: {
project: ProjectListItem;
clients: ProjectClientOption[];
localization: ProjectsClientProps["localization"];
}) {
const router = useRouter();
const [isNavigating, startNavigation] = useTransition();
@@ -274,7 +286,7 @@ function ProjectCard({
<div className="text-xs text-muted-foreground">
{project.doneTaskCount}/{project.taskCount} görev tamamlandı
</div>
<ProjectActions project={project} clients={clients} showDetail={false} />
<ProjectActions project={project} clients={clients} localization={localization} showDetail={false} />
</div>
</CardContent>
</Card>
@@ -307,9 +319,11 @@ function ProjectCover({ project }: { project: ProjectListItem }) {
function ProjectRow({
project,
clients,
localization,
}: {
project: ProjectListItem;
clients: ProjectClientOption[];
localization: ProjectsClientProps["localization"];
}) {
return (
<div className="grid gap-4 px-4 py-4 grid-cols-[1.5fr_1fr_1fr_0.8fr_1fr] items-center">
@@ -327,7 +341,7 @@ function ProjectRow({
<ProgressBar progress={project.progress} compact />
</div>
<div className="flex justify-end gap-2">
<ProjectActions project={project} clients={clients} showDetail />
<ProjectActions project={project} clients={clients} localization={localization} showDetail />
</div>
</div>
);
@@ -350,10 +364,12 @@ function ProjectMeta({ project }: { project: ProjectListItem }) {
function ProjectActions({
project,
clients,
localization,
showDetail,
}: {
project: ProjectListItem;
clients: ProjectClientOption[];
localization: ProjectsClientProps["localization"];
showDetail: boolean;
}) {
return (
@@ -376,7 +392,7 @@ function ProjectActions({
</PendingLink>
</Button>
) : null}
<ProjectDialog mode="edit" project={project} clients={clients} iconOnly />
<ProjectDialog mode="edit" project={project} clients={clients} localization={localization} iconOnly />
{project.status !== "completed" ? (
<form action={completeProjectRecord}>
<input type="hidden" name="id" value={project.id} />
@@ -398,11 +414,13 @@ function ProjectDialog({
mode,
project,
clients,
localization,
iconOnly = false,
}: {
mode: "create" | "edit";
project?: ProjectListItem;
clients: ProjectClientOption[];
localization: ProjectsClientProps["localization"];
iconOnly?: boolean;
}) {
const [open, setOpen] = useState(false);
@@ -456,6 +474,7 @@ function ProjectDialog({
<ProjectFormFields
project={project}
clients={clients}
localization={localization}
projectType={projectType}
onProjectTypeChange={setProjectType}
/>
@@ -549,15 +568,6 @@ function CoverImageInput({ project }: { project?: ProjectListItem }) {
className="sr-only"
onChange={handleFileChange}
/>
<div className="grid gap-2">
<Label htmlFor={`cover-alt-${project?.id || "new"}`}>Görsel alt metni</Label>
<Input
id={`cover-alt-${project?.id || "new"}`}
name="cover_image_alt"
defaultValue={project?.cover_image_alt || ""}
placeholder="Görseli kısaca açıkla"
/>
</div>
</div>
);
}
@@ -565,11 +575,13 @@ function CoverImageInput({ project }: { project?: ProjectListItem }) {
function ProjectFormFields({
project,
clients,
localization,
projectType,
onProjectTypeChange,
}: {
project?: ProjectListItem;
clients: ProjectClientOption[];
localization: ProjectsClientProps["localization"];
projectType: ProjectListItem["type"];
onProjectTypeChange: (value: ProjectListItem["type"]) => void;
}) {
@@ -577,16 +589,18 @@ function ProjectFormFields({
<div className="grid gap-4">
<CoverImageInput project={project} />
<div className="grid gap-2">
<Label htmlFor={`name-${project?.id || "new"}`}>Proje adı</Label>
<Input
id={`name-${project?.id || "new"}`}
name="name"
defaultValue={project?.name || ""}
required
placeholder="Örn. Marka web sitesi"
/>
</div>
<LocalizedFields
idPrefix={`project-${project?.id || "new"}`}
defaultLocale={localization.defaultLocale}
locales={localization.locales}
fields={contentTranslationRegistry.project}
values={project?.translations}
fallbackValues={{
name: project?.name,
description: project?.description,
coverImageAlt: project?.cover_image_alt,
}}
/>
<div className="grid gap-4 md:grid-cols-2">
<div className="grid gap-2">
@@ -626,17 +640,6 @@ function ProjectFormFields({
</div>
</div>
<div className="grid gap-2">
<Label htmlFor={`description-${project?.id || "new"}`}>Açıklama</Label>
<Textarea
id={`description-${project?.id || "new"}`}
name="description"
defaultValue={project?.description || ""}
placeholder="Kapsam, hedef veya teslimat notları..."
rows={3}
/>
</div>
<div className="grid gap-4 md:grid-cols-3">
<div className="grid gap-2">
<Label>Durum</Label>
@@ -742,7 +745,7 @@ function EmptyState({ hasQuery }: { hasQuery: boolean }) {
}
function formatDate(value: string) {
return new Intl.DateTimeFormat("tr-TR", {
return new Intl.DateTimeFormat(getDocumentIntlLocale(), {
day: "2-digit",
month: "short",
year: "numeric",
@@ -750,7 +753,7 @@ function formatDate(value: string) {
}
function formatCurrency(value: number) {
return new Intl.NumberFormat("tr-TR", {
return new Intl.NumberFormat(getDocumentIntlLocale(), {
style: "currency",
currency: "USD",
maximumFractionDigits: 0,
app/(dashboard)/tasks/actions.ts
+19 -7
View File
@@ -1,6 +1,11 @@
"use server";
import { revalidatePath } from "next/cache";
import { getSqliteConnection } from "@/server/db/client";
import {
ContentTranslationService,
parseContentTranslationsFromFormData,
} from "@/server/i18n/content";
import { cleanText, optionalDate, requiredText } from "@/server/web/form-data";
import { requireFreelancerBackend } from "@/server/web/freelancer";
@@ -16,11 +21,12 @@ function minutes(value: FormDataEntryValue | null): number | null {
return Number.isFinite(parsed) && parsed >= 0 ? Math.round(parsed) : null;
}
function payload(formData: FormData) {
function payload(formData: FormData, translations?: Record<string, Record<string, string | null>>, defaultLocale = "tr") {
const dueAt = optionalDate(formData.get("due_at"));
const localized = translations?.[defaultLocale] ?? {};
return {
title: requiredText(formData.get("title"), "Görev başlığı zorunludur."),
description: cleanText(formData.get("description")),
title: localized.title ?? requiredText(formData.get("title"), "Görev başlığı zorunludur."),
description: localized.description ?? cleanText(formData.get("description")),
status: enumValue(formData.get("status"), TASK_STATUSES, "todo"),
priority: enumValue(formData.get("priority"), TASK_PRIORITIES, "medium"),
clientId: cleanText(formData.get("client_id")),
@@ -50,17 +56,23 @@ function revalidate(projectId?: string | null) {
export async function createTaskRecord(formData: FormData) {
const { actor, service } = await requireFreelancerBackend();
const value = completeRelations(payload(formData), service, actor);
service.createTask(actor, value);
const i18n = new ContentTranslationService(getSqliteConnection().db);
const context = i18n.getLocalizationContext(actor);
const translations = parseContentTranslationsFromFormData(formData, "task", context);
const value = completeRelations(payload(formData, translations, context.defaultLocale), service, actor);
service.createTask(actor, { ...value, translations });
revalidate(value.projectId);
}
export async function updateTaskRecord(formData: FormData) {
const { actor, service } = await requireFreelancerBackend();
const i18n = new ContentTranslationService(getSqliteConnection().db);
const context = i18n.getLocalizationContext(actor);
const translations = parseContentTranslationsFromFormData(formData, "task", context);
const id = requiredText(formData.get("id"), "Görev kaydı bulunamadı.");
const value = completeRelations(payload(formData), service, actor);
const value = completeRelations(payload(formData, translations, context.defaultLocale), service, actor);
const current = service.listTasks(actor).find((task) => task.id === id);
service.updateTask(actor, id, value);
service.updateTask(actor, id, { ...value, translations });
revalidate(value.projectId);
if (current?.projectId !== value.projectId) revalidate(current?.projectId);
}
app/(dashboard)/tasks/page.tsx
+48 -18
View File
@@ -1,37 +1,67 @@
import { TasksClient, type TaskListItem, type TaskRelationOption } from "@/app/(dashboard)/tasks/tasks-client";
import { getSqliteConnection } from "@/server/db/client";
import { ContentTranslationService, type ContentTranslationRow } from "@/server/i18n/content";
import { resolveRequestLocale } from "@/server/i18n/resolver";
import { requireFreelancerBackend } from "@/server/web/freelancer";
export default async function TasksPage() {
const locale = await resolveRequestLocale();
const { actor, service } = await requireFreelancerBackend();
const content = new ContentTranslationService(getSqliteConnection().db);
const localization = content.getLocalizationContext(actor);
const taskRows = service.listTasks(actor);
const clientRows = service.listClients(actor);
const projectRows = service.listProjects(actor);
const clientNames = new Map(clientRows.map((item) => [item.id, item.name]));
const projectNames = new Map(projectRows.map((item) => [item.id, item.name]));
const projectTranslations = content.listBatch("project", projectRows.map((project) => project.id));
const resolvedProjects = projectRows.map((project) => content.resolveEntity("project", project, {
locale: locale.locale,
defaultLocale: localization.defaultLocale,
translations: projectTranslations.get(project.id) ?? [],
}));
const projectNames = new Map(resolvedProjects.map((item) => [item.id, item.name]));
const taskTranslations = content.listBatch("task", taskRows.map((task) => task.id));
const tasks: TaskListItem[] = taskRows
.filter((task) => task.status !== "cancelled")
.map((task) => ({
id: task.id,
title: task.title,
description: task.description,
status: task.status as TaskListItem["status"],
priority: task.priority,
due_at: task.dueAt?.toISOString() ?? null,
estimated_minutes: task.estimatedMinutes,
actual_minutes: task.actualMinutes,
client_id: task.clientId,
clientName: task.clientId ? clientNames.get(task.clientId) ?? null : null,
project_id: task.projectId,
projectName: task.projectId ? projectNames.get(task.projectId) ?? null : null,
created_at: task.createdAt.toISOString(),
}));
.map((task) => {
const translationRows = taskTranslations.get(task.id) ?? [];
const resolvedTask = content.resolveEntity("task", task, {
locale: locale.locale,
defaultLocale: localization.defaultLocale,
translations: translationRows,
});
return {
id: task.id,
title: resolvedTask.title,
description: resolvedTask.description,
status: task.status as TaskListItem["status"],
priority: task.priority,
due_at: task.dueAt?.toISOString() ?? null,
estimated_minutes: task.estimatedMinutes,
actual_minutes: task.actualMinutes,
client_id: task.clientId,
clientName: task.clientId ? clientNames.get(task.clientId) ?? null : null,
project_id: task.projectId,
projectName: task.projectId ? projectNames.get(task.projectId) ?? null : null,
created_at: task.createdAt.toISOString(),
translations: toLocalizedValues(translationRows),
};
});
const clients: TaskRelationOption[] = clientRows
.filter((client) => client.status !== "archived")
.map(({ id, name }) => ({ id, name }));
const projects: TaskRelationOption[] = projectRows
const projects: TaskRelationOption[] = resolvedProjects
.filter((project) => project.status !== "cancelled")
.map(({ id, name, clientId }) => ({ id, name, client_id: clientId }));
return <TasksClient tasks={tasks} clients={clients} projects={projects} />;
return <TasksClient tasks={tasks} clients={clients} projects={projects} localization={localization} />;
}
function toLocalizedValues(rows: ContentTranslationRow[]) {
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;
}, {});
}
app/(dashboard)/tasks/tasks-client.tsx
+45 -28
View File
@@ -1,12 +1,16 @@
"use client";
import { getDocumentIntlLocale } from "@/lib/i18n/browser";
import { useTranslations } from "@/components/i18n/i18n-provider";
import {
createTaskRecord,
deleteTaskRecord,
updateTaskStatusRecord,
updateTaskRecord,
} from "@/app/(dashboard)/tasks/actions";
import { Badge, Button, Card, CardContent, Input, Label, Textarea } from "poyraz-ui/atoms";
import { LocalizedFields, type LocalizedFieldLocale, type LocalizedFieldValues } from "@/components/i18n/localized-fields";
import { contentTranslationRegistry } from "@/lib/i18n/content";
import { Badge, Button, Card, CardContent, Input, Label } from "poyraz-ui/atoms";
import {
Dialog,
DialogContent,
@@ -53,6 +57,7 @@ export type TaskListItem = {
project_id: string | null;
projectName: string | null;
created_at: string;
translations?: LocalizedFieldValues;
};
const statusLabels = {
@@ -79,9 +84,14 @@ type TasksClientProps = {
tasks: TaskListItem[];
clients: TaskRelationOption[];
projects: TaskRelationOption[];
localization: {
defaultLocale: string;
locales: LocalizedFieldLocale[];
};
};
export function TasksClient({ tasks, clients, projects }: TasksClientProps) {
export function TasksClient({ tasks, clients, projects, localization }: TasksClientProps) {
const t = useTranslations();
const [statusOverrides, setStatusOverrides] = useState<
Partial<Record<string, TaskListItem["status"]>>
>({});
@@ -193,11 +203,11 @@ export function TasksClient({ tasks, clients, projects }: TasksClientProps) {
<div className="flex flex-col gap-4 border-b border-border pb-5 lg:flex-row lg:items-end lg:justify-between">
<div>
<h1 className="text-3xl font-semibold tracking-normal text-foreground">
Görevler
{t("tasks.title")}
</h1>
</div>
<TaskDialog mode="create" clients={clients} projects={projects} />
<TaskDialog mode="create" clients={clients} projects={projects} localization={localization} />
</div>
<div className="grid gap-3 md:grid-cols-4">
@@ -266,6 +276,7 @@ export function TasksClient({ tasks, clients, projects }: TasksClientProps) {
tasks={filteredTasks}
clients={clients}
projects={projects}
localization={localization}
pendingTaskIds={pendingTaskIds}
onTaskDelete={handleTaskDelete}
onTaskStatusChange={handleTaskStatusChange}
@@ -275,6 +286,7 @@ export function TasksClient({ tasks, clients, projects }: TasksClientProps) {
tasks={filteredTasks}
clients={clients}
projects={projects}
localization={localization}
pendingTaskIds={pendingTaskIds}
onTaskDelete={handleTaskDelete}
onTaskStatusChange={handleTaskStatusChange}
@@ -293,6 +305,7 @@ function TaskList({
tasks,
clients,
projects,
localization,
pendingTaskIds,
onTaskDelete,
onTaskStatusChange,
@@ -300,6 +313,7 @@ function TaskList({
tasks: TaskListItem[];
clients: TaskRelationOption[];
projects: TaskRelationOption[];
localization: TasksClientProps["localization"];
pendingTaskIds: Set<string>;
onTaskDelete: (taskId: string) => void;
onTaskStatusChange: (taskId: string, status: TaskListItem["status"]) => void;
@@ -321,6 +335,7 @@ function TaskList({
task={task}
clients={clients}
projects={projects}
localization={localization}
isPending={pendingTaskIds.has(task.id)}
onTaskDelete={onTaskDelete}
onTaskStatusChange={onTaskStatusChange}
@@ -336,6 +351,7 @@ function TaskRow({
task,
clients,
projects,
localization,
isPending,
onTaskDelete,
onTaskStatusChange,
@@ -343,6 +359,7 @@ function TaskRow({
task: TaskListItem;
clients: TaskRelationOption[];
projects: TaskRelationOption[];
localization: TasksClientProps["localization"];
isPending: boolean;
onTaskDelete: (taskId: string) => void;
onTaskStatusChange: (taskId: string, status: TaskListItem["status"]) => void;
@@ -373,6 +390,7 @@ function TaskRow({
task={task}
clients={clients}
projects={projects}
localization={localization}
isPending={isPending}
onTaskDelete={onTaskDelete}
onTaskStatusChange={onTaskStatusChange}
@@ -385,6 +403,7 @@ function TaskKanban({
tasks,
clients,
projects,
localization,
pendingTaskIds,
onTaskDelete,
onTaskStatusChange,
@@ -392,6 +411,7 @@ function TaskKanban({
tasks: TaskListItem[];
clients: TaskRelationOption[];
projects: TaskRelationOption[];
localization: TasksClientProps["localization"];
pendingTaskIds: Set<string>;
onTaskDelete: (taskId: string) => void;
onTaskStatusChange: (taskId: string, status: TaskListItem["status"]) => void;
@@ -460,6 +480,7 @@ function TaskKanban({
task={task}
clients={clients}
projects={projects}
localization={localization}
compact
isPending={pendingTaskIds.has(task.id)}
onTaskDelete={onTaskDelete}
@@ -481,6 +502,7 @@ function TaskActions({
task,
clients,
projects,
localization,
compact = false,
isPending,
onTaskDelete,
@@ -489,6 +511,7 @@ function TaskActions({
task: TaskListItem;
clients: TaskRelationOption[];
projects: TaskRelationOption[];
localization: TasksClientProps["localization"];
compact?: boolean;
isPending: boolean;
onTaskDelete: (taskId: string) => void;
@@ -496,7 +519,7 @@ function TaskActions({
}) {
return (
<div className={compact ? "flex justify-end gap-1" : "flex justify-start gap-2 lg:justify-end"}>
<TaskDialog mode="edit" task={task} clients={clients} projects={projects} />
<TaskDialog mode="edit" task={task} clients={clients} projects={projects} localization={localization} />
{task.status !== "done" ? (
<Button effect="shine"
type="button"
@@ -537,11 +560,13 @@ function TaskDialog({
task,
clients,
projects,
localization,
}: {
mode: "create" | "edit";
task?: TaskListItem;
clients: TaskRelationOption[];
projects: TaskRelationOption[];
localization: TasksClientProps["localization"];
}) {
const [open, setOpen] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
@@ -587,7 +612,7 @@ function TaskDialog({
</DialogHeader>
<div className="tiny-scrollbar min-h-0 flex-1 overflow-y-auto px-5 pb-5">
<TaskFormFields task={task} clients={clients} projects={projects} />
<TaskFormFields task={task} clients={clients} projects={projects} localization={localization} />
</div>
<DialogFooter className="shrink-0 border-t border-border bg-background p-5">
@@ -610,10 +635,12 @@ function TaskFormFields({
task,
clients,
projects,
localization,
}: {
task?: TaskListItem;
clients: TaskRelationOption[];
projects: TaskRelationOption[];
localization: TasksClientProps["localization"];
}) {
const [clientId, setClientId] = useState(task?.client_id || "__none");
const [projectId, setProjectId] = useState(task?.project_id || "__none");
@@ -650,27 +677,17 @@ function TaskFormFields({
return (
<div className="grid gap-4">
<div className="grid gap-2">
<Label htmlFor={`title-${task?.id || "new"}`}>Başlık</Label>
<Input
id={`title-${task?.id || "new"}`}
name="title"
defaultValue={task?.title || ""}
required
placeholder="Örn. Ana sayfa wireframe revizyonu"
/>
</div>
<div className="grid gap-2">
<Label htmlFor={`description-${task?.id || "new"}`}>Açıklama</Label>
<Textarea
id={`description-${task?.id || "new"}`}
name="description"
defaultValue={task?.description || ""}
rows={3}
placeholder="Kapsam, not veya teslim kriterleri..."
/>
</div>
<LocalizedFields
idPrefix={`task-${task?.id || "new"}`}
defaultLocale={localization.defaultLocale}
locales={localization.locales}
fields={contentTranslationRegistry.task}
values={task?.translations}
fallbackValues={{
title: task?.title,
description: task?.description,
}}
/>
<div className="grid gap-4 md:grid-cols-2">
<SelectField name="status" label="Durum" defaultValue={task?.status || "todo"}>
@@ -825,7 +842,7 @@ function isOverdue(task: TaskListItem) {
}
function formatDateTime(value: string) {
return new Intl.DateTimeFormat("tr-TR", {
return new Intl.DateTimeFormat(getDocumentIntlLocale(), {
day: "2-digit",
month: "short",
hour: "2-digit",
scripts/i18n-phase5-smoke.mjs
+28
View File
@@ -0,0 +1,28 @@
import { execFileSync } from "node:child_process";
import fs from "node:fs";
import path from "node:path";
const dataDir = path.join(process.cwd(), ".data", `i18n-phase5-smoke-${Date.now()}`);
const databasePath = path.join(dataDir, "neta.db");
const env = { ...process.env, DATA_DIR: dataDir, DATABASE_PATH: databasePath };
fs.mkdirSync(dataDir, { recursive: true });
execFileSync(process.execPath, ["scripts/migrate.mjs"], {
cwd: process.cwd(),
env,
stdio: "inherit",
});
execFileSync("./node_modules/.bin/tsc", ["-p", "tsconfig.i18n-phase5-smoke.json"], {
cwd: process.cwd(),
stdio: "inherit",
});
const serverOnlyStubDir = path.join(process.cwd(), ".next", "i18n-phase5-smoke-dist", "node_modules", "server-only");
fs.mkdirSync(serverOnlyStubDir, { recursive: true });
fs.writeFileSync(path.join(serverOnlyStubDir, "index.js"), "\n");
execFileSync(
process.execPath,
[path.join(".next", "i18n-phase5-smoke-dist", "scripts", "i18n-phase5-smoke.js")],
{ cwd: process.cwd(), env, stdio: "inherit" },
);
scripts/i18n-phase5-smoke.ts
+118
View File
@@ -0,0 +1,118 @@
import assert from "node:assert/strict";
import { user } from "../server/db/schema";
import { getSqliteConnection } from "../server/db/client";
import type { DomainActor } from "../server/domain/actor";
import { DomainService } from "../server/services/domain";
import { ContentTranslationService } from "../server/i18n/content";
import { I18nService } from "../server/i18n/service";
const { db } = getSqliteConnection();
const owner: DomainActor = {
authUserId: "phase5-owner",
role: "freelancer",
clientId: null,
disabled: false,
};
db.insert(user)
.values({
id: owner.authUserId,
name: "Phase 5 Owner",
email: "phase5-owner@example.com",
emailVerified: true,
createdAt: new Date(),
updatedAt: new Date(),
})
.onConflictDoNothing()
.run();
const i18n = new I18nService(db);
i18n.listLocales(owner);
if (!i18n.listLocales(owner).some((locale) => locale.code === "fr")) {
i18n.createLocale(owner, {
code: "fr",
name: "French",
nativeName: "Français",
fallbackLocale: "en",
status: "active",
});
} else {
i18n.updateLocale(owner, "fr", { status: "active" });
}
const domain = new DomainService(db, (() => {
let next = 0;
return () => `phase5-${++next}`;
})());
const content = new ContentTranslationService(db);
const project = domain.createProject(owner, {
id: "phase5-project",
type: "side_project",
name: "Legacy fallback",
translations: {
tr: {
name: "Çok dilli proje",
description: "Türkçe açıklama",
coverImageAlt: "Türkçe kapak",
},
en: {
name: "Multilingual project",
description: "English description",
coverImageAlt: "English cover",
},
fr: {
name: "Projet multilingue",
description: "Description française",
coverImageAlt: "Couverture française",
},
},
});
assert.equal(project.name, "Çok dilli proje", "Default locale must be projected to legacy project.name.");
assert.equal(project.description, "Türkçe açıklama");
const projectTranslations = content.listEntityTranslations("project", project.id);
assert.equal(projectTranslations.filter((row) => row.field === "name").length, 3);
assert.equal(
content.resolveEntity("project", project, {
locale: "fr",
defaultLocale: "tr",
translations: projectTranslations,
}).name,
"Projet multilingue",
"Project must resolve according to selected locale.",
);
const section = domain.addPlanningSection(owner, {
id: "phase5-section",
projectId: project.id,
category: "overview",
title: "Legacy section",
translations: {
tr: { title: "Planlama", content: "Türkçe içerik" },
en: { title: "Planning", content: "English content" },
fr: { title: "Planification", content: "Contenu français" },
},
});
assert.equal(section.title, "Planlama");
const task = domain.createTask(owner, {
id: "phase5-task",
projectId: project.id,
title: "Legacy task",
translations: {
tr: { title: "Görev başlığı", description: "Türkçe görev" },
en: { title: "Task title", description: "English task" },
fr: { title: "Titre de tâche", description: "Tâche française" },
},
});
assert.equal(task.title, "Görev başlığı");
const batch = content.listBatch("task", [task.id]);
assert.equal(batch.get(task.id)?.some((row) => row.locale === "fr" && row.value === "Titre de tâche"), true);
domain.deleteTask(owner, task.id);
assert.equal(content.listEntityTranslations("task", task.id).length, 0, "Task delete must remove content translations.");
console.log("I18n phase 5 content translation smoke passed.");
server/services/domain.ts
+72 -11
View File
@@ -39,15 +39,19 @@ import {
calendarEventUpdateSchema,
} from "../domain/validation";
import { createDomainRepositories, type DomainRepositories } from "../repositories/domain";
import { ContentTranslationService, projectBaseFromTranslations } from "../i18n/content";
import type { ContentTranslationInput } from "../../lib/i18n/content";
export class DomainService {
readonly repositories: DomainRepositories;
private readonly contentTranslations: ContentTranslationService;
constructor(
private readonly db: DomainDatabase,
private readonly id: IdGenerator = generateId,
) {
this.repositories = createDomainRepositories(db);
this.contentTranslations = new ContentTranslationService(db);
}
listClients(actor: DomainActor) {
@@ -112,17 +116,31 @@ export class DomainService {
createProject(actor: DomainActor, input: unknown) {
const scope = requireOwnerScope(actor);
const value = parseDomainInput(projectCreateSchema, input);
const translations = this.getContentTranslations(input);
const defaultLocale = this.contentTranslations.getLocalizationContext(actor).defaultLocale;
const value = parseDomainInput(
projectCreateSchema,
translations ? projectBaseFromTranslations("project", input as Record<string, unknown>, translations, defaultLocale) : input,
);
this.assertProjectClient(scope, value.type, value.clientId);
return this.repositories.projects.create(scope, { ...value, id: value.id ?? this.id() });
const id = value.id ?? this.id();
const created = this.repositories.projects.create(scope, { ...value, id });
this.contentTranslations.upsertEntityTranslations("project", created.id, translations);
return created;
}
updateProject(actor: DomainActor, projectId: string, input: unknown) {
const scope = requireOwnerScope(actor);
const current = this.repositories.projects.get(scope, projectId) ?? this.throwNotFound("Proje");
const value = parseDomainInput(projectUpdateSchema, input);
const translations = this.getContentTranslations(input);
const defaultLocale = this.contentTranslations.getLocalizationContext(actor).defaultLocale;
const value = parseDomainInput(
projectUpdateSchema,
translations ? projectBaseFromTranslations("project", input as Record<string, unknown>, translations, defaultLocale) : input,
);
this.assertProjectClient(scope, value.type ?? current.type, value.clientId === undefined ? current.clientId : value.clientId);
const updated = this.repositories.projects.update(scope, projectId, value) ?? this.throwNotFound("Proje");
this.contentTranslations.upsertEntityTranslations("project", updated.id, translations);
if (
updated.progressType === "auto"
&& (value.progressType === "auto" || value.progress !== undefined)
@@ -134,7 +152,14 @@ export class DomainService {
}
deleteProject(actor: DomainActor, id: string) {
return this.repositories.projects.remove(requireOwnerScope(actor), id) ?? this.throwNotFound("Proje");
const scope = requireOwnerScope(actor);
const sectionIds = this.repositories.planning.list(scope, id).map((section) => section.id);
const deleted = this.repositories.projects.remove(scope, id) ?? this.throwNotFound("Proje");
this.contentTranslations.deleteEntityTranslations("project", id);
for (const sectionId of sectionIds) {
this.contentTranslations.deleteEntityTranslations("planning_section", sectionId);
}
return deleted;
}
listTasks(actor: DomainActor, projectId?: string) {
@@ -151,9 +176,15 @@ export class DomainService {
createTask(actor: DomainActor, input: unknown) {
const scope = requireOwnerScope(actor);
const value = parseDomainInput(taskCreateSchema, input);
const translations = this.getContentTranslations(input);
const defaultLocale = this.contentTranslations.getLocalizationContext(actor).defaultLocale;
const value = parseDomainInput(
taskCreateSchema,
translations ? projectBaseFromTranslations("task", input as Record<string, unknown>, translations, defaultLocale) : input,
);
this.assertTaskRelations(scope, value);
const task = this.repositories.tasks.create(scope, { ...value, id: value.id ?? this.id() });
this.contentTranslations.upsertEntityTranslations("task", task.id, translations);
if (task.projectId) this.recalculateProjectProgress(scope, task.projectId);
return task;
}
@@ -161,10 +192,16 @@ export class DomainService {
updateTask(actor: DomainActor, taskId: string, input: unknown) {
const scope = requireOwnerScope(actor);
const current = this.repositories.tasks.get(scope, taskId) ?? this.throwNotFound("Görev");
const value = parseDomainInput(taskUpdateSchema, input);
const translations = this.getContentTranslations(input);
const defaultLocale = this.contentTranslations.getLocalizationContext(actor).defaultLocale;
const value = parseDomainInput(
taskUpdateSchema,
translations ? projectBaseFromTranslations("task", input as Record<string, unknown>, translations, defaultLocale) : input,
);
const merged = { ...current, ...value };
this.assertTaskRelations(scope, merged);
const task = this.repositories.tasks.update(scope, taskId, value) ?? this.throwNotFound("Görev");
this.contentTranslations.upsertEntityTranslations("task", task.id, translations);
if (current.projectId) this.recalculateProjectProgress(scope, current.projectId);
if (task.projectId && task.projectId !== current.projectId) this.recalculateProjectProgress(scope, task.projectId);
return task;
@@ -173,6 +210,7 @@ export class DomainService {
deleteTask(actor: DomainActor, taskId: string) {
const scope = requireOwnerScope(actor);
const task = this.repositories.tasks.remove(scope, taskId) ?? this.throwNotFound("Görev");
this.contentTranslations.deleteEntityTranslations("task", taskId);
if (task.projectId) this.recalculateProjectProgress(scope, task.projectId);
return task;
}
@@ -255,20 +293,36 @@ export class DomainService {
addPlanningSection(actor: DomainActor, input: unknown) {
const scope = requireOwnerScope(actor);
const value = parseDomainInput(planningSectionCreateSchema, input);
const translations = this.getContentTranslations(input);
const defaultLocale = this.contentTranslations.getLocalizationContext(actor).defaultLocale;
const value = parseDomainInput(
planningSectionCreateSchema,
translations ? projectBaseFromTranslations("planning_section", input as Record<string, unknown>, translations, defaultLocale) : input,
);
this.requireOwnedProject(scope, value.projectId);
return this.repositories.planning.create(scope, { ...value, id: value.id ?? this.id() });
const section = this.repositories.planning.create(scope, { ...value, id: value.id ?? this.id() });
this.contentTranslations.upsertEntityTranslations("planning_section", section.id, translations);
return section;
}
updatePlanningSection(actor: DomainActor, sectionId: string, input: unknown) {
const scope = requireOwnerScope(actor);
if (!this.repositories.planning.get(scope, sectionId)) throw notFound("Planlama bölümü");
const value = parseDomainInput(planningSectionUpdateSchema, input);
return this.repositories.planning.update(scope, sectionId, value) ?? this.throwNotFound("Planlama bölümü");
const translations = this.getContentTranslations(input);
const defaultLocale = this.contentTranslations.getLocalizationContext(actor).defaultLocale;
const value = parseDomainInput(
planningSectionUpdateSchema,
translations ? projectBaseFromTranslations("planning_section", input as Record<string, unknown>, translations, defaultLocale) : input,
);
const section = this.repositories.planning.update(scope, sectionId, value) ?? this.throwNotFound("Planlama bölümü");
this.contentTranslations.upsertEntityTranslations("planning_section", section.id, translations);
return section;
}
deletePlanningSection(actor: DomainActor, sectionId: string) {
return this.repositories.planning.remove(requireOwnerScope(actor), sectionId) ?? this.throwNotFound("Planlama bölümü");
const section = this.repositories.planning.remove(requireOwnerScope(actor), sectionId) ?? this.throwNotFound("Planlama bölümü");
this.contentTranslations.deleteEntityTranslations("planning_section", sectionId);
return section;
}
listPlanningSections(actor: DomainActor, projectId: string) {
@@ -680,4 +734,11 @@ export class DomainService {
private throwNotFound(resource: string): never {
throw notFound(resource);
}
private getContentTranslations(input: unknown): ContentTranslationInput | undefined {
if (!input || typeof input !== "object") return undefined;
const translations = (input as { translations?: unknown }).translations;
if (!translations || typeof translations !== "object") return undefined;
return translations as ContentTranslationInput;
}
}
tsconfig.i18n-phase5-smoke.json
+23
View File
@@ -0,0 +1,23 @@
{
"extends": "./tsconfig.i18n-phase3-smoke.json",
"compilerOptions": {
"outDir": ".next/i18n-phase5-smoke-dist"
},
"include": [
"scripts/i18n-phase5-smoke.ts",
"lib/i18n/**/*.ts",
"locales/**/*.ts",
"server/auth/types.ts",
"server/db/**/*.ts",
"server/domain/**/*.ts",
"server/i18n/catalog.ts",
"server/i18n/content.ts",
"server/i18n/locale.ts",
"server/i18n/service.ts",
"server/i18n/translator.ts",
"server/repositories/domain.ts",
"server/repositories/i18n.ts",
"server/services/domain.ts"
],
"exclude": ["node_modules"]
}