Add croatian translation for AAI@Edu features

ItKlubBozoLagan · Dec 28, 2024 · 5193897 · 5193897
1 parent 2258b71
commit 5193897
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 14 deletions.
diff --git a/apps/frontend/src/components/AaiEduButton.tsx b/apps/frontend/src/components/AaiEduButton.tsx
@@ -4,15 +4,17 @@ import tw from "twin.macro";
 import aaiEduLogo from "/aai-edu.png";
 
 import { http, ServerData } from "../api/http";
+import { useTranslation } from "../hooks/useTranslation";
 
 type Properties = {
-    text?: string;
     purpose: "login" | "link";
 };
 
-export const AaiEduButton: FC<Properties> = ({ text, purpose }) => {
+export const AaiEduButton: FC<Properties> = ({ purpose }) => {
     const [aaiEduUrl, setAaiEduUrl] = useState<string>();
 
+    const { t } = useTranslation();
+
     useEffect(() => {
         http.get<ServerData<{ url: string }>>(`auth/aai-edu/url?purpose=${purpose}`)
             .then((data) => data.data)
@@ -34,7 +36,11 @@ export const AaiEduButton: FC<Properties> = ({ text, purpose }) => {
             onClick={onAaiEduClick}
         >
             <img src={aaiEduLogo} alt="AAI@EduHR" tw={"w-24"} />
-            <span tw={"font-bold"}>{text ?? "Login"}</span>
+            <span tw={"font-bold"}>
+                {purpose === "login"
+                    ? t("aaieduButton.purposeLogin")
+                    : t("aaieduButton.purposeLink")}
+            </span>
         </div>
     );
 };
diff --git a/apps/frontend/src/i18n/languages/en.ts b/apps/frontend/src/i18n/languages/en.ts
@@ -34,6 +34,10 @@ const I18nEn = {
             },
         },
     },
+    aaieduButton: {
+        purposeLogin: "Log in",
+        purposeLink: "Link",
+    },
     notifications: {
         "contest-start": "Contest %1 has started!",
         "contest-end": "Contest %1 has ended!",
@@ -428,13 +432,23 @@ const I18nEn = {
     account: {
         label: "Account information",
         fullName: "Full Name",
-        email: "E-mail",
+        email: "E-Mail",
         breadcrumbs: {
             creator: "Creator",
             admin: "Admin",
             organisationAdmin: "Org. Admin",
             owner: "Owner",
         },
+        aaiedu: {
+            title: "Linked AAI@Edu account",
+            userId: "User ID",
+            fullName: "Full name",
+            email: "E-Mail address",
+            associatedOrg: "Associated organisation",
+            dob: "Date of birth",
+            studentCategory: "Student category",
+            professionalStatus: "Professional status",
+        },
         stats: {
             submissions: {
                 title: "Submissions",

diff --git a/apps/frontend/src/i18n/languages/hr.ts b/apps/frontend/src/i18n/languages/hr.ts
@@ -34,6 +34,10 @@ export default {
             },
         },
     },
+    aaieduButton: {
+        purposeLogin: "Prijava",
+        purposeLink: "Poveži račun",
+    },
     notifications: {
         "contest-start": "Natjecanje %1 je počelo!",
         "contest-end": "Natjecanje %1 je završilo!",
@@ -435,6 +439,16 @@ export default {
             organisationAdmin: "Org. Administrator",
             owner: "Vlasnik",
         },
+        aaiedu: {
+            title: "Povezan AAI@Edu račun",
+            userId: "ID korisnika",
+            fullName: "Ime i prezime",
+            email: "Adresa E-pošte",
+            associatedOrg: "Povezana organizacija",
+            dob: "Datum rođenja",
+            studentCategory: "Kategorija studenta",
+            professionalStatus: "Profesionalni status",
+        },
         stats: {
             submissions: {
                 title: "Poslana rješenja",

diff --git a/apps/frontend/src/pages/account/EduDetails.tsx b/apps/frontend/src/pages/account/EduDetails.tsx
@@ -5,15 +5,18 @@ import tw from "twin.macro";
 import { AaiEduButton } from "../../components/AaiEduButton";
 import { TitledInput } from "../../components/TitledInput";
 import { TitledSection } from "../../components/TitledSection";
+import { useTranslation } from "../../hooks/useTranslation";
 import { useAuthStore } from "../../state/auth";
 
 export const EduDetails: FC = () => {
     const { user } = useAuthStore();
 
+    const { t } = useTranslation();
+
     if (!user.is_edu)
         return (
             <div tw={"w-full flex justify-center mt-6 mb-8"}>
-                <AaiEduButton text={"Link"} purpose={"link"} />{" "}
+                <AaiEduButton purpose={"link"} />
             </div>
         );
 
@@ -23,49 +26,53 @@ export const EduDetails: FC = () => {
         <div tw={"w-full px-12 pt-6 pb-12"}>
             <TitledSection
                 parentStyle={tw`w-full flex flex-col gap-4`}
-                title={"Linked AAI@Edu account"}
+                title={t("account.aaiedu.title")}
             >
-                {/* TODO: relja*/}
                 <div tw={"w-full grid grid-cols-2 justify-center items-center gap-4 mb-4"}>
-                    <TitledInput tw={"m-auto"} label={"User ID:"} value={eduUser.uid} readOnly />
                     <TitledInput
                         tw={"m-auto"}
-                        label={"Full name:"}
+                        label={t("account.aaiedu.userId")}
+                        value={eduUser.uid}
+                        readOnly
+                    />
+                    <TitledInput
+                        tw={"m-auto"}
+                        label={t("account.aaiedu.fullName")}
                         value={eduUser.full_name}
                         readOnly
                     />
                     <TitledInput
                         tw={"m-auto"}
-                        label={"Electronic mail address:"}
+                        label={t("account.aaiedu.email")}
                         value={eduUser.email}
                         readOnly
                     />
                     <TitledInput
                         tw={"m-auto"}
-                        label={"Associated organisation:"}
+                        label={t("account.aaiedu.associatedOrg")}
                         value={eduUser.associated_org}
                         readOnly
                     />
                     {eduUser.dob && (
                         <TitledInput
                             tw={"m-auto"}
-                            label={"Date of birth:"}
+                            label={t("account.aaiedu.dob")}
                             value={toCroatianLocale(eduUser.dob)}
                             readOnly
                         />
                     )}
                     {eduUser.student_category && (
                         <TitledInput
                             tw={"m-auto"}
-                            label={"Student category:"}
+                            label={t("account.aaiedu.studentCategory")}
                             value={eduUser.student_category}
                             readOnly
                         />
                     )}
                     {eduUser.professional_status && (
                         <TitledInput
                             tw={"m-auto"}
-                            label={"Professional status:"}
+                            label={t("account.aaiedu.professionalStatus")}
                             value={eduUser.professional_status}
                             readOnly
                         />