I18n components (#27)

* New translation keys in en-US locale

* New translation keys in de-DE locale

* New translation keys in fr-FR locale

* New translation keys in it-IT locale

* New translation keys in pl-PL locale

* New translation keys in pt-PT locale

* New translation keys in tr-TR locale

* Move into function

* Replace string matching to boolean check

* Add FIXIT in UsersTable

* Use localization for size units

* Missed and restored translation keys

* fixup! New translation keys in tr-TR locale

* Add translation keys in components
This commit is contained in:
vlalx
2025-05-25 17:41:38 +03:00
committed by GitHub
parent af3694da34
commit ea24759bb3
42 changed files with 1419 additions and 329 deletions

View File

@@ -39,11 +39,6 @@ type CreateRoleFormProps = {
afterCreate?: (res: CreateRoleResponse) => Promise<void>;
};
const formSchema = z.object({
name: z.string({ message: "Name is required" }).max(32),
description: z.string().max(255).optional()
});
export default function CreateRoleForm({
open,
setOpen,
@@ -52,6 +47,11 @@ export default function CreateRoleForm({
const { org } = useOrgContext();
const t = useTranslations();
const formSchema = z.object({
name: z.string({ message: t('nameRequired') }).max(32),
description: z.string().max(255).optional()
});
const [loading, setLoading] = useState(false);
const api = createApiClient(useEnvContext());

View File

@@ -47,10 +47,6 @@ type CreateRoleFormProps = {
afterDelete?: () => void;
};
const formSchema = z.object({
newRoleId: z.string({ message: "New role is required" })
});
export default function DeleteRoleForm({
open,
roleToDelete,
@@ -65,6 +61,10 @@ export default function DeleteRoleForm({
const api = createApiClient(useEnvContext());
const formSchema = z.object({
newRoleId: z.string({ message: t('accessRoleErrorNewRequired') })
});
useEffect(() => {
async function fetchRoles() {
const res = await api

View File

@@ -24,7 +24,7 @@ export function RolesDataTable<TData, TValue>({
<DataTable
columns={columns}
data={data}
title="Roles"
title={t('roles')}
searchPlaceholder={t('accessRolesSearch')}
searchColumn="name"
onAdd={createRole}

View File

@@ -222,7 +222,7 @@ export default function UsersTable({ users: u }: UsersTableProps) {
toast({
variant: "default",
title: t('userOrgRemoved'),
description: t('userOrgRemovedDescription', {email: selectedUser.email})
description: t('userOrgRemovedDescription', {email: selectedUser.email}) // FIXME
});
setUsers((prev) =>
@@ -244,7 +244,7 @@ export default function UsersTable({ users: u }: UsersTableProps) {
dialog={
<div className="space-y-4">
<p>
{t('userQuestionOrgRemove', {email: selectedUser?.email || selectedUser?.name || selectedUser?.username})}
{t('userQuestionOrgRemove', {email: selectedUser?.email || selectedUser?.name || selectedUser?.username})} // FIXME
</p>
<p>

View File

@@ -42,11 +42,6 @@ import { createApiClient } from "@app/lib/api";
import { useEnvContext } from "@app/hooks/useEnvContext";
import { useTranslations } from "next-intl";
const formSchema = z.object({
username: z.string(),
roleId: z.string().min(1, { message: "Please select a role" })
});
export default function AccessControlsPage() {
const { orgUser: user } = userOrgUserContext();
@@ -57,6 +52,13 @@ export default function AccessControlsPage() {
const [loading, setLoading] = useState(false);
const [roles, setRoles] = useState<{ roleId: number; name: string }[]>([]);
const t = useTranslations();
const formSchema = z.object({
username: z.string(),
roleId: z.string().min(1, { message: t('accessRoleSelectPlease') })
});
const form = useForm<z.infer<typeof formSchema>>({
resolver: zodResolver(formSchema),
defaultValues: {
@@ -65,8 +67,6 @@ export default function AccessControlsPage() {
}
});
const t = useTranslations();
useEffect(() => {
async function fetchRoles() {
const res = await api

View File

@@ -60,24 +60,6 @@ interface IdpOption {
type: string;
}
const internalFormSchema = z.object({
email: z.string().email({ message: "Invalid email address" }),
validForHours: z.string().min(1, { message: "Please select a duration" }),
roleId: z.string().min(1, { message: "Please select a role" })
});
const externalFormSchema = z.object({
username: z.string().min(1, { message: "Username is required" }),
email: z
.string()
.email({ message: "Invalid email address" })
.optional()
.or(z.literal("")),
name: z.string().optional(),
roleId: z.string().min(1, { message: "Please select a role" }),
idpId: z.string().min(1, { message: "Please select an identity provider" })
});
const formatIdpType = (type: string) => {
switch (type.toLowerCase()) {
case "oidc":
@@ -104,6 +86,24 @@ export default function Page() {
const [selectedIdp, setSelectedIdp] = useState<IdpOption | null>(null);
const [dataLoaded, setDataLoaded] = useState(false);
const internalFormSchema = z.object({
email: z.string().email({ message: t('emailInvalid') }),
validForHours: z.string().min(1, { message: t('inviteValidityDuration') }),
roleId: z.string().min(1, { message: t('accessRoleSelectPlease') })
});
const externalFormSchema = z.object({
username: z.string().min(1, { message: t('usernameRequired') }),
email: z
.string()
.email({ message: t('emailInvalid') })
.optional()
.or(z.literal("")),
name: z.string().optional(),
roleId: z.string().min(1, { message: t('accessRoleSelectPlease') }),
idpId: z.string().min(1, { message: t('idpSelectPlease') })
});
const validFor = [
{ hours: 24, name: t('day', {count: 1}) },
{ hours: 48, name: t('day', {count: 2}) },