feat(i18n): complete portal localized surfaces

This commit is contained in:
poyrazavsever
2026-07-21 13:37:35 +03:00
parent 86a9c79511
commit 1227588320
12 changed files with 163 additions and 47 deletions
+21 -4
View File
@@ -2,6 +2,7 @@ import { Card, CardContent, Badge } from "poyraz-ui/atoms";
import { FolderKanban, CheckCircle2, Clock, BarChart } from "lucide-react";
import Link from "next/link";
import { StatCard } from "@/components/system/stat-card";
import { getPublicBranding } from "@/server/branding/runtime";
import { getSqliteConnection } from "@/server/db/client";
import { ContentTranslationService, getContentFallbackLocale } from "@/server/i18n/content";
import { formatDate } from "@/lib/i18n/format";
@@ -16,6 +17,12 @@ export default async function PortalDashboardPage() {
const content = new ContentTranslationService(getSqliteConnection().db);
const localization = content.getPublicLocalizationContext();
const fallbackLocale = getContentFallbackLocale(locale.locale, localization);
const branding = content.resolveEntity("branding", { id: "default", ...getPublicBranding() }, {
locale: locale.locale,
fallbackLocale,
defaultLocale: locale.defaultLocale,
translations: content.listEntityTranslations("branding", "default"),
});
const projectRows = service.listProjects(actor);
const projectTranslations = content.listBatch("project", projectRows.map((project) => project.id));
const projects = projectRows.map((project) => content.resolveEntity("project", project, {
@@ -29,19 +36,23 @@ export default async function PortalDashboardPage() {
const avgProgress = projects.length
? Math.round(projects.reduce((sum, project) => sum + project.progress, 0) / projects.length)
: 0;
const number = new Intl.NumberFormat(locale.locale);
return (
<div className="mx-auto flex max-w-7xl flex-col gap-6">
<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">{t("portal.dashboard.title")}</h1>
{branding.portalWelcomeText ? (
<p className="mt-2 max-w-3xl text-sm text-muted-foreground">{branding.portalWelcomeText}</p>
) : null}
</div>
</div>
<div className="grid gap-4 md:grid-cols-3">
<StatCard label={t("portal.dashboard.activeProjects")} value={String(activeProjects.length)} icon={FolderKanban} tone="blue" />
<StatCard label={t("portal.dashboard.completed")} value={String(completedProjects.length)} icon={CheckCircle2} tone="green" />
<StatCard label={t("portal.dashboard.averageProgress")} value={`%${avgProgress}`} icon={BarChart} tone="amber" />
<StatCard label={t("portal.dashboard.activeProjects")} value={number.format(activeProjects.length)} icon={FolderKanban} tone="blue" />
<StatCard label={t("portal.dashboard.completed")} value={number.format(completedProjects.length)} icon={CheckCircle2} tone="green" />
<StatCard label={t("portal.dashboard.averageProgress")} value={t("portal.labels.percent", { value: number.format(avgProgress) })} icon={BarChart} tone="amber" />
</div>
<div className="space-y-4">
@@ -62,6 +73,9 @@ export default async function PortalDashboardPage() {
<h3 className="font-semibold text-base line-clamp-2 leading-tight">{project.name}</h3>
</div>
</div>
{project.description ? (
<p className="line-clamp-2 text-sm text-muted-foreground">{project.description}</p>
) : null}
<div className="flex items-center gap-2 flex-wrap">
<Badge variant={project.status === "completed" ? "secondary" : "default"} className="capitalize text-[10px] px-1.5 py-0">
{project.status === "completed" ? t("portal.status.project.completed") : project.status === "active" ? t("portal.status.project.active") : t("portal.status.project.waiting")}
@@ -77,7 +91,7 @@ export default async function PortalDashboardPage() {
<div className="space-y-1.5 mt-2">
<div className="flex items-center justify-between text-xs font-medium">
<span className="text-muted-foreground">{t("portal.labels.progress")}</span>
<span>%{project.progress}</span>
<span>{t("portal.labels.percent", { value: number.format(project.progress) })}</span>
</div>
<div className="h-2 w-full bg-secondary rounded-full overflow-hidden">
<div className="h-full bg-primary transition-all duration-500" style={{ width: `${project.progress}%` }} />
@@ -89,6 +103,9 @@ export default async function PortalDashboardPage() {
))}
</div>
</div>
{branding.portalFooterText ? (
<p className="border-t border-border pt-4 text-sm text-muted-foreground">{branding.portalFooterText}</p>
) : null}
</div>
);
}
+11 -4
View File
@@ -2,21 +2,28 @@
import { revalidatePath } from "next/cache";
import { cleanText } from "@/server/web/form-data";
import { resolvePortalLocale } from "@/server/i18n/resolver";
import { requirePortalBackend } from "@/server/web/portal";
export async function createRevisionRequest(projectId: string, formData: FormData) {
try {
const { actor, service } = await requirePortalBackend();
const { actor, context, service } = await requirePortalBackend();
const locale = await resolvePortalLocale(context);
const description = cleanText(formData.get("description"));
if (!description) return { error: "Revizyon açıklaması boş olamaz." };
if (!description) return { errorKey: "portal.revision.errors.descriptionRequired" };
service.requestRevision(actor, { projectId, description });
service.requestRevision(actor, {
projectId,
description,
sourceLocale: locale.locale,
});
revalidatePath(`/portal/projects/${projectId}`);
revalidatePath("/portal/revisions");
return { success: true };
} catch (error) {
console.error("Portal revision request failed", error);
return {
error: error instanceof Error ? error.message : "Revizyon talebi oluşturulamadı.",
errorKey: "portal.revision.error",
};
}
}
+1
View File
@@ -83,6 +83,7 @@ export default async function PortalProjectPage({ params }: { params: Promise<{
id: revision.id,
description: revision.description,
status: revision.status,
source_locale: revision.sourceLocale,
created_at: revision.createdAt.toISOString(),
})),
};
@@ -48,6 +48,7 @@ export type PortalTask = {
export type PortalRevision = {
id: string;
description: string;
source_locale: string | null;
status: "pending" | "in_progress" | "completed" | "rejected";
created_at: string;
};
@@ -78,11 +79,11 @@ export function PortalProjectClient({
try {
const response = await createRevisionRequest(project.id, formData);
if (response.error) throw new Error(response.error);
if (response.errorKey) throw new Error(response.errorKey);
toast.success(t("portal.revision.success"));
setOpenRevision(false);
} catch (error: unknown) {
toast.error(error instanceof Error ? error.message : t("portal.revision.error"));
toast.error(error instanceof Error ? t(error.message) : t("portal.revision.error"));
} finally {
setIsSubmitting(false);
}
@@ -92,12 +93,16 @@ export function PortalProjectClient({
(revision) => revision.status === "pending" || revision.status === "in_progress",
).length;
const hasRevisionQuota = project.can_request_revision;
const number = new Intl.NumberFormat(locale);
return (
<div className="mx-auto flex max-w-7xl flex-col gap-8 animate-in fade-in slide-in-from-bottom-4 duration-500">
<div className="flex flex-col justify-between gap-4 md:flex-row md:items-start">
<div className="space-y-1">
<h1 className="text-3xl font-bold text-foreground">{project.name}</h1>
{project.description ? (
<p className="max-w-3xl text-sm text-muted-foreground">{project.description}</p>
) : null}
</div>
<div className="flex flex-col gap-2 md:items-end">
<div className="flex gap-2">
@@ -189,7 +194,7 @@ export function PortalProjectClient({
<h3 className="font-semibold">{t("portal.sections.progress")}</h3>
<div className="space-y-2">
<div className="flex items-center justify-between text-3xl font-bold">
<span>%{project.progress}</span>
<span>{t("portal.labels.percent", { value: number.format(project.progress) })}</span>
</div>
<div className="h-3 w-full overflow-hidden rounded-full bg-secondary">
<div className="h-full bg-primary transition-all duration-500" style={{ width: `${project.progress}%` }} />
@@ -248,7 +253,7 @@ export function PortalProjectClient({
<div className="flex items-center justify-between">
<h4 className="font-medium text-foreground">{section.title}</h4>
<Badge variant="secondary" className="text-xs">
{section.type}
{t(`portal.planTypes.${section.type}`)}
</Badge>
</div>
<p className="whitespace-pre-wrap text-sm text-muted-foreground">{section.content}</p>
@@ -264,7 +269,7 @@ export function PortalProjectClient({
<div className="rounded-md bg-muted/50 px-3 py-1.5 text-sm font-medium text-muted-foreground">
{t("portal.labels.remainingQuota")}:
<span className="ml-1 text-foreground">
{project.revision_quota !== null ? project.revision_quota : t("portal.labels.unlimited")}
{project.revision_quota !== null ? number.format(project.revision_quota) : t("portal.labels.unlimited")}
</span>
</div>
</div>
+5 -1
View File
@@ -23,6 +23,7 @@ export default async function PortalProjectsPage() {
defaultLocale: locale.defaultLocale,
translations: projectTranslations.get(project.id) ?? [],
}));
const number = new Intl.NumberFormat(locale.locale);
return (
<div className="mx-auto flex max-w-7xl flex-col gap-8 animate-in fade-in slide-in-from-bottom-4 duration-500">
@@ -47,6 +48,9 @@ export default async function PortalProjectsPage() {
{project.status === "completed" ? t("portal.status.project.completed") : project.status === "active" ? t("portal.status.project.active") : t("portal.status.project.waiting")}
</Badge>
</div>
{project.description ? (
<p className="line-clamp-2 text-sm text-muted-foreground">{project.description}</p>
) : null}
{project.dueDate && (
<div className="flex items-center gap-1.5 text-sm text-muted-foreground">
<Clock className="h-4 w-4" />
@@ -57,7 +61,7 @@ export default async function PortalProjectsPage() {
<div className="space-y-1">
<div className="flex items-center justify-between text-xs font-medium">
<span>{t("portal.labels.progress")}</span>
<span>%{project.progress}</span>
<span>{t("portal.labels.percent", { value: number.format(project.progress) })}</span>
</div>
<div className="h-2 w-full bg-secondary rounded-full overflow-hidden">
<div className="h-full bg-primary transition-all duration-500" style={{ width: `${project.progress}%` }} />
+1 -1
View File
@@ -65,7 +65,7 @@ export default async function PortalRevisionsPage() {
</div>
<div className="flex items-center justify-end border-t border-border pt-4">
<Link href={`/portal/projects/${revision.projectId}`} className="text-xs text-primary font-medium hover:underline">
{t("portal.labels.project")} &rarr;
{t("portal.labels.openProjectCta")}
</Link>
</div>
</CardContent>
+4 -1
View File
@@ -64,11 +64,14 @@ export default async function PortalTasksPage() {
<div className="flex items-center gap-2 text-sm text-muted-foreground bg-muted/30 p-2 rounded-md">
<span className="font-medium truncate">{projectNames.get(task.projectId!)}</span>
</div>
{task.description ? (
<p className="line-clamp-3 text-sm text-muted-foreground">{task.description}</p>
) : null}
</div>
<div className="flex items-center justify-between text-sm text-muted-foreground border-t border-border pt-4">
<div className="flex items-center gap-1.5">
<CalendarDays className="h-4 w-4" />
<span>{date ? formatDate(date, locale.locale) : "-"}</span>
<span>{date ? formatDate(date, locale.locale) : t("portal.labels.noDate")}</span>
</div>
{isDone ? <CheckCircle2 className="h-4 w-4 text-emerald-500" /> : <Clock className="h-4 w-4" />}
</div>
@@ -12,7 +12,7 @@ import {
} from "poyraz-ui/molecules";
type DestructiveConfirmationProps = {
cancelLabel?: string;
cancelLabel: string;
confirmLabel: string;
description: string;
loading?: boolean;
@@ -23,7 +23,7 @@ type DestructiveConfirmationProps = {
};
export function DestructiveConfirmation({
cancelLabel = "Vazgeç",
cancelLabel,
confirmLabel,
description,
loading = false,
+3 -3
View File
@@ -45,7 +45,7 @@ export function FeedbackState({ action, description, title, variant }: FeedbackS
);
}
export function LoadingState({ label = "İçerik yükleniyor" }: { label?: string }) {
export function LoadingState({ label }: { label: string }) {
return (
<div className="space-y-4" aria-busy="true" aria-label={label} role="status">
<span className="sr-only">{label}</span>
@@ -60,10 +60,10 @@ export function LoadingState({ label = "İçerik yükleniyor" }: { label?: strin
);
}
export function RetryAction({ onClick }: { onClick: () => void }) {
export function RetryAction({ label, onClick }: { label: string; onClick: () => void }) {
return (
<Button effect="shine" type="button" variant="secondary" size="sm" onClick={onClick}>
Yeniden dene
{label}
</Button>
);
}
+23 -22
View File
@@ -2,38 +2,39 @@ import { Badge } from "poyraz-ui/atoms";
import type { ComponentProps } from "react";
const statusPresentation = {
accepted: { label: "Kabul edildi", variant: "success" },
active: { label: "Aktif", variant: "success" },
archived: { label: "Arşivlendi", variant: "outline" },
cancelled: { label: "İptal edildi", variant: "outline" },
completed: { label: "Tamamlandı", variant: "success" },
done: { label: "Tamamlandı", variant: "success" },
draft: { label: "Taslak", variant: "secondary" },
expired: { label: "Süresi doldu", variant: "destructive" },
in_progress: { label: "Devam ediyor", variant: "info" },
overdue: { label: "Gecikmiş", variant: "destructive" },
paid: { label: "Ödendi", variant: "success" },
paused: { label: "Duraklatıldı", variant: "warning" },
pending: { label: "Bekliyor", variant: "warning" },
planned: { label: "Planlandı", variant: "secondary" },
planning: { label: "Planlanıyor", variant: "secondary" },
rejected: { label: "Reddedildi", variant: "destructive" },
revoked: { label: "İptal edildi", variant: "destructive" },
sent: { label: "Gönderildi", variant: "info" },
todo: { label: "Yapılacak", variant: "secondary" },
} as const satisfies Record<string, { label: string; variant: NonNullable<ComponentProps<typeof Badge>["variant"]> }>;
accepted: { labelKey: "status.common.accepted", variant: "success" },
active: { labelKey: "status.common.active", variant: "success" },
archived: { labelKey: "status.common.archived", variant: "outline" },
cancelled: { labelKey: "status.common.cancelled", variant: "outline" },
completed: { labelKey: "status.common.completed", variant: "success" },
done: { labelKey: "status.common.done", variant: "success" },
draft: { labelKey: "status.common.draft", variant: "secondary" },
expired: { labelKey: "status.common.expired", variant: "destructive" },
in_progress: { labelKey: "status.common.inProgress", variant: "info" },
overdue: { labelKey: "status.common.overdue", variant: "destructive" },
paid: { labelKey: "status.common.paid", variant: "success" },
paused: { labelKey: "status.common.paused", variant: "warning" },
pending: { labelKey: "status.common.pending", variant: "warning" },
planned: { labelKey: "status.common.planned", variant: "secondary" },
planning: { labelKey: "status.common.planning", variant: "secondary" },
rejected: { labelKey: "status.common.rejected", variant: "destructive" },
revoked: { labelKey: "status.common.revoked", variant: "destructive" },
sent: { labelKey: "status.common.sent", variant: "info" },
todo: { labelKey: "status.common.todo", variant: "secondary" },
} as const satisfies Record<string, { labelKey: string; variant: NonNullable<ComponentProps<typeof Badge>["variant"]> }>;
export type NetaStatus = keyof typeof statusPresentation;
type StatusBadgeProps = Omit<ComponentProps<typeof Badge>, "children" | "variant"> & {
label: string;
status: NetaStatus;
};
export function StatusBadge({ status, ...props }: StatusBadgeProps) {
export function StatusBadge({ label, status, ...props }: StatusBadgeProps) {
const presentation = statusPresentation[status];
return (
<Badge variant={presentation.variant} {...props}>
{presentation.label}
{label}
</Badge>
);
}
+41 -2
View File
@@ -51,6 +51,11 @@ export const enCatalog = {
"invite.expired": "This invitation has expired. Ask the freelancer for a new link.",
"invite.accepted": "This invitation was already used. You can sign in with your account.",
"invite.revoked": "This invitation was revoked. Ask the freelancer for a new link.",
"invite.unavailable": "This invitation is no longer available. Ask the freelancer for a new link.",
"invite.notFound": "The invitation link is invalid or could not be found.",
"invite.invalidInput": "The invitation details are invalid. Check your name and password.",
"invite.emailRegistered": "An account already exists with this email address.",
"invite.clientLinked": "A portal account already exists for this client.",
"invite.success": "Your portal account has been created. You can sign in now.",
"language": "Language",
"marketing.headline": "Manage freelance work, clients and finance in one place.",
@@ -859,9 +864,9 @@ export const enCatalog = {
"portal.appearance.brandingNotice": "Logo, color and brand settings are managed by the freelancer; only your personal theme preference changes here.",
"portal.appearance.autoSave": "Saved automatically on selection",
"portal.profile.title": "Profile",
"portal.profile.description": "Profile editing will be completed in the next phase. This page prepares the route and authorization boundary now.",
"portal.profile.description": "Manage the name and profile photo displayed in your portal account.",
"portal.security.title": "Security",
"portal.security.description": "Password and session security controls will be completed in the next phase. This page is isolated from owner-only security settings.",
"portal.security.description": "Change your portal account password and securely sign out other sessions.",
"languages.title": "Languages",
"languages.description": "Manage instance languages, the default language, completion and usage impact.",
"languages.actions.add": "Add language",
@@ -1117,8 +1122,12 @@ export const enCatalog = {
"actions.newRequest": "Create new request",
"labels.delivery": "Delivery",
"labels.deadline": "Due",
"labels.noDate": "No date",
"labels.openProject": "Open project",
"labels.openProjectCta": "Open project →",
"labels.progress": "Progress",
"labels.project": "Project",
"labels.percent": "{value}%",
"labels.remainingQuota": "Remaining quota",
"labels.unlimited": "Unlimited",
"tabs.overview": "Overview",
@@ -1135,6 +1144,17 @@ export const enCatalog = {
"revision.descriptionPlaceholder": "Could this section be blue? Also, let's update the copy...",
"revision.success": "Your revision request has been sent.",
"revision.error": "Could not create revision request.",
"revision.errors.descriptionRequired": "Revision description is required.",
"planTypes.assets": "Visual assets",
"planTypes.audience": "Target audience",
"planTypes.color_palette": "Color palette",
"planTypes.design_system": "Design system",
"planTypes.goal": "Goal",
"planTypes.notes": "Notes",
"planTypes.overview": "Overview",
"planTypes.problem": "Problem solved",
"planTypes.scope": "Scope",
"planTypes.typography": "Typography",
"status.project.active": "Active",
"status.project.completed": "Completed",
"status.project.waiting": "Waiting",
@@ -1147,6 +1167,25 @@ export const enCatalog = {
"status.revision.rejected": "Rejected",
},
status: {
"common.accepted": "Accepted",
"common.active": "Active",
"common.archived": "Archived",
"common.cancelled": "Cancelled",
"common.completed": "Completed",
"common.done": "Done",
"common.draft": "Draft",
"common.expired": "Expired",
"common.inProgress": "In progress",
"common.overdue": "Overdue",
"common.paid": "Paid",
"common.paused": "Paused",
"common.pending": "Pending",
"common.planned": "Planned",
"common.planning": "Planning",
"common.rejected": "Rejected",
"common.revoked": "Revoked",
"common.sent": "Sent",
"common.todo": "To do",
"project.active": "Active",
"project.completed": "Completed",
"task.todo": "To do",
+41 -2
View File
@@ -51,6 +51,11 @@ export const trCatalog = {
"invite.expired": "Bu davetin süresi dolmuş. Freelancer'dan yeni bir bağlantı istemelisin.",
"invite.accepted": "Bu davet daha önce kullanılmış. Hesabınla giriş yapabilirsin.",
"invite.revoked": "Bu davet iptal edilmiş. Freelancer'dan yeni bir bağlantı istemelisin.",
"invite.unavailable": "Bu davet artık kullanılamıyor. Freelancer'dan yeni bir bağlantı istemelisin.",
"invite.notFound": "Davet bağlantısı geçersiz veya bulunamadı.",
"invite.invalidInput": "Davet bilgileri geçersiz. Lütfen adını ve şifreni kontrol et.",
"invite.emailRegistered": "Bu e-posta adresiyle kayıtlı bir hesap zaten var.",
"invite.clientLinked": "Bu müşteri için portal hesabı zaten mevcut.",
"invite.success": "Portal hesabın oluşturuldu. Şimdi giriş yapabilirsin.",
"language": "Dil",
"marketing.headline": "Freelancer işlerini, müşterilerini ve finansını tek yerde yönet.",
@@ -859,9 +864,9 @@ export const trCatalog = {
"portal.appearance.brandingNotice": "Logo, renk ve marka ayarları freelancer tarafından yönetilir; burada yalnız kişisel tema tercihiniz değişir.",
"portal.appearance.autoSave": "Seçince otomatik kaydedilir",
"portal.profile.title": "Profil",
"portal.profile.description": "Profil düzenleme bir sonraki fazda tamamlanacak. Bu sayfa route ve yetki sınırını şimdiden hazırlar.",
"portal.profile.description": "Portal hesabınızda görünen adınızı ve profil fotoğrafınızı yönetin.",
"portal.security.title": "Güvenlik",
"portal.security.description": "Şifre ve oturum güvenliği kontrolleri bir sonraki fazda tamamlanacak. Bu sayfa owner-only güvenlik ayarlarından izoledir.",
"portal.security.description": "Portal hesabınızın şifresini değiştirin ve diğer oturumları güvenli şekilde kapatın.",
"languages.title": "Diller",
"languages.description": "Instance dillerini, varsayılan dili, tamamlanma durumunu ve kullanım etkilerini yönetin.",
"languages.actions.add": "Dil ekle",
@@ -1117,8 +1122,12 @@ export const trCatalog = {
"actions.newRequest": "Yeni Talep Oluştur",
"labels.delivery": "Teslim",
"labels.deadline": "Son Teslim",
"labels.noDate": "Tarih yok",
"labels.openProject": "Projeyi aç",
"labels.openProjectCta": "Projeyi aç →",
"labels.progress": "İlerleme",
"labels.project": "Proje",
"labels.percent": "%{value}",
"labels.remainingQuota": "Kalan Hak",
"labels.unlimited": "Sınırsız",
"tabs.overview": "Genel Bakış",
@@ -1135,6 +1144,17 @@ export const trCatalog = {
"revision.descriptionPlaceholder": "Şu kısmın rengi mavi olabilir mi? Ayrıca metinleri güncelleyelim...",
"revision.success": "Revizyon talebiniz başarıyla iletildi.",
"revision.error": "Revizyon talebi oluşturulamadı.",
"revision.errors.descriptionRequired": "Revizyon açıklaması zorunludur.",
"planTypes.assets": "Görsel varlıklar",
"planTypes.audience": "Hedef kitle",
"planTypes.color_palette": "Renk paleti",
"planTypes.design_system": "Tasarım sistemi",
"planTypes.goal": "Amaç",
"planTypes.notes": "Notlar",
"planTypes.overview": "Genel bakış",
"planTypes.problem": "Çözdüğü problem",
"planTypes.scope": "Kapsam",
"planTypes.typography": "Tipografi",
"status.project.active": "Aktif",
"status.project.completed": "Tamamlandı",
"status.project.waiting": "Beklemede",
@@ -1147,6 +1167,25 @@ export const trCatalog = {
"status.revision.rejected": "Reddedildi",
},
status: {
"common.accepted": "Kabul edildi",
"common.active": "Aktif",
"common.archived": "Arşivlendi",
"common.cancelled": "İptal edildi",
"common.completed": "Tamamlandı",
"common.done": "Tamamlandı",
"common.draft": "Taslak",
"common.expired": "Süresi doldu",
"common.inProgress": "Devam ediyor",
"common.overdue": "Gecikmiş",
"common.paid": "Ödendi",
"common.paused": "Duraklatıldı",
"common.pending": "Bekliyor",
"common.planned": "Planlandı",
"common.planning": "Planlanıyor",
"common.rejected": "Reddedildi",
"common.revoked": "İptal edildi",
"common.sent": "Gönderildi",
"common.todo": "Yapılacak",
"project.active": "Aktif",
"project.completed": "Tamamlandı",
"task.todo": "Yapılacak",