🌐 Add missing translations

2023-08-05 23:06:40 +02:00
parent cdb88ff941
commit 14c366bddd
9 changed files with 161 additions and 60 deletions
--- a/src/pages/manage/users/invites.tsx
+++ b/src/pages/manage/users/invites.tsx
@@ -14,11 +14,12 @@ import { IconPlus, IconTrash } from '@tabler/icons-react';
 import dayjs from 'dayjs';
 import { GetServerSideProps } from 'next';
 import Head from 'next/head';
-import { useRouter } from 'next/router';
 import { useState } from 'react';
+import { useTranslation } from 'next-i18next';
 import { ManageLayout } from '~/components/layout/Templates/ManageLayout';
 import { getServerAuthSession } from '~/server/auth';
 import { getServerSideTranslations } from '~/tools/server/getServerSideTranslations';
+import { manageNamespaces } from '~/tools/server/translation-namespaces';
 import { api } from '~/utils/api';

 const ManageUserInvitesPage = () => {
@@ -26,7 +27,6 @@ const ManageUserInvitesPage = () => {
  const { data } = api.invites.all.useQuery({
    page: activePage,
  });
-  const router = useRouter();

  const { classes } = useStyles();

@@ -38,17 +38,15 @@ const ManageUserInvitesPage = () => {
    setActivePage((prev) => prev - 1);
  };

+  const { t } = useTranslation('user/invites');
+
  return (
    <ManageLayout>
      <Head>
        <title>User invites • Homarr</title>
      </Head>
-      <Title mb="md">Manage user invites</Title>
-      <Text mb="xl">
-        Using invites, you can invite users to your Homarr instance. An invitation will only be
-        valid for a certain time-span and can be used once. The expiration must be between 5 minutes
-        and 12 months upon creation.
-      </Text>
+      <Title mb="md">{t('title')}</Title>
+      <Text mb="xl">{t('text')}</Text>

      <Flex justify="end" mb="md">
        <Button
@@ -62,7 +60,7 @@ const ManageUserInvitesPage = () => {
          leftIcon={<IconPlus size="1rem" />}
          variant="default"
        >
-          Create invitation
+          {t('button.createInvite')}
        </Button>
      </Flex>

@@ -71,10 +69,10 @@ const ManageUserInvitesPage = () => {
          <Table mb="md" withBorder highlightOnHover>
            <thead>
              <tr>
-                <th>ID</th>
-                <th>Creator</th>
-                <th>Expires</th>
-                <th>Actions</th>
+                <th>{t('table.header.id')}</th>
+                <th>{t('table.header.creator')}</th>
+                <th>{t('table.header.expires')}</th>
+                <th>{t('table.header.action')}</th>
              </tr>
            </thead>
            <tbody>
@@ -88,9 +86,13 @@ const ManageUserInvitesPage = () => {
                  </td>
                  <td className={classes.tableCell}>
                    {dayjs(dayjs()).isAfter(invite.expires) ? (
-                      <Text>expired {dayjs(invite.expires).fromNow()}</Text>
+                      <Text>
+                        {t('table.data.expiresAt', { at: dayjs(invite.expires).fromNow() })}
+                      </Text>
                    ) : (
-                      <Text>in {dayjs(invite.expires).fromNow(true)}</Text>
+                      <Text>
+                        {t('table.data.expiresIn', { in: dayjs(invite.expires).fromNow(true) })}
+                      </Text>
                    )}
                  </td>
                  <td className={classes.tableCell}>
@@ -98,7 +100,7 @@ const ManageUserInvitesPage = () => {
                      onClick={() => {
                        modals.openContextModal({
                          modal: 'deleteInviteModal',
-                          title: <Text weight="bold">Delete invite</Text>,
+                          title: <Text weight="bold">{t('button.deleteInvite')}</Text>,
                          innerProps: {
                            tokenId: invite.id,
                          },
@@ -116,7 +118,7 @@ const ManageUserInvitesPage = () => {
                <tr>
                  <td colSpan={3}>
                    <Center p="md">
-                      <Text color="dimmed">There are no invitations yet.</Text>
+                      <Text color="dimmed">{t('noInvites')}</Text>
                    </Center>
                  </td>
                </tr>
@@ -164,7 +166,7 @@ export const getServerSideProps: GetServerSideProps = async (ctx) => {
  }

  const translations = await getServerSideTranslations(
-    ['common'],
+    manageNamespaces,
    ctx.locale,
    undefined,
    undefined