Change and add localizations

.devcontainer/devcontainer.json

@@ -32,7 +32,9 @@
 				"i18n-ally.localesPaths": "src/locales",
 				"i18n-ally.namespace": true,
 				"i18n-ally.pathMatcher": "{locale}/{namespaces}.json",
-				"i18n-ally.localeCountryMap": { "sv": "se" }
+				"i18n-ally.localeCountryMap": { "sv": "se" },
+				"i18n-ally.indent": 4,
+				"i18n-ally.tabStyle": "tab"
 			}
 		}
 	},

.gitattributes

@@ -0,0 +1,8 @@
+*.json text eol=lf whitespace=-indent-with-non-tab
+
+*.ts   whitespace=-indent-with-non-tab
+*.tsx  whitespace=-indent-with-non-tab
+*.js   whitespace=-indent-with-non-tab
+*.jsx  whitespace=-indent-with-non-tab
+
+bun.lock   merge=union -text -whitespace

i18next.config.ts

@@ -0,0 +1,12 @@
+import { defineConfig } from 'i18next-cli';
+
+export default defineConfig({
+  locales: [
+    "en",
+    "sv"
+  ],
+  extract: {
+    input: "src/**/*.{js,jsx,ts,tsx}",
+    output: "src/locales/{{language}}/{{namespace}}.json"
+  }
+});

openapi-ts.config.ts

@@ -3,7 +3,7 @@ import { defineConfig } from "@hey-api/openapi-ts";
 export default defineConfig({
 	input: "openapi.cleaned.json",
 	//input: "http://127.0.0.1:8000",
-	//input: "http://localhost:8000/openapi.json",
+	input: "http://127.0.0.1:8000/openapi.json",
 	output: { path: "src/api", lint: "biome", format: "biome" },
 	parser: {
 		transforms: {

src/app/(public)/councils/[slug]/ClientCouncilPage.tsx

@@ -119,7 +119,7 @@ export default function ClientCouncilPage({ slug }: { slug: string }) {
 									<p className="mt-4 font-semibold">
 										{t("utskott:vemhar")}:{" "}
 										{usersLoading ? (
-											<span className="italic">{t("loading")}</span>
+											<span className="italic">{t("admin:loading")}</span>
 										) : users.length > 0 ? (
 											users.map((u) => (
 												<span
@@ -143,12 +143,6 @@ export default function ClientCouncilPage({ slug }: { slug: string }) {
 											)}
 										</span>
 									</p>
-									<p className="mt-4 font-semibold">
-										{t("utskott:user_limits")}:{" "}
-										<span className="italic text-muted-foreground">
-											{`${post.elected_user_recommended_limit !== 0 ? post.elected_user_recommended_limit : "N/A"} ${t("utskott:recommended")} (${post.elected_user_max_limit !== 0 ? post.elected_user_max_limit : "N/A"} max)`}
-										</span>
-									</p>
 								</div>
 							);
 						})

src/app/(public)/election/CandidationForm.tsx

@@ -207,7 +207,7 @@ export default function CandidationForm({
 								name="election_post_id"
 								render={({ field }) => (
 									<FormItem className="lg:col-span-2">
-										<FormLabel>{t("admin:post")}</FormLabel>
+										<FormLabel>{t("post")}</FormLabel>
 										<FormControl>
 											<SelectFromOptions
 												isDisabled={singleMode || disabled}

src/app/(public)/election/ElectionPostDetails.tsx

@@ -47,7 +47,7 @@ export default function ElectionPostDetails({
 	myCandidations,
 	electionId,
 }: ElectionPostDetailsProps) {
-	const { t, i18n } = useTranslation();
+	const { t, i18n } = useTranslation("main");
 	const queryClient = useQueryClient();
 	const [candidationOpen, setCandidationOpen] = useState(false);
 	const [nominationOpen, setNominationOpen] = useState(false);

src/app/(public)/election/candidations/page.tsx

@@ -21,7 +21,7 @@ import { useRouter } from "next/navigation";
 import type { CandidatePostRead } from "@/api";
 
 export default function CandidationsPage() {
-	const { t, i18n } = useTranslation();
+	const { t, i18n } = useTranslation("main");
 	const queryClient = useQueryClient();
 	const router = useRouter();
 

src/app/(public)/election/page.tsx

@@ -50,7 +50,7 @@ export interface JoinedElectionPost {
 }
 
 export default function PublicElectionPage() {
-	const { i18n, t } = useTranslation();
+	const { i18n, t } = useTranslation("main");
 	const [search, setSearch] = useState("");
 	const [candidationOpen, setCandidationOpen] = useState(false);
 	const [nominationOpen, setNominationOpen] = useState(false);

src/app/(public)/gallery/page.tsx

@@ -15,7 +15,7 @@ import { useTranslation } from "react-i18next";
 import { LoadingErrorCard } from "@/components/LoadingErrorCard";
 
 export default function GalleryIndexPage() {
-	const { i18n, t } = useTranslation();
+	const { i18n, t } = useTranslation("main");
 	const { data: unsortedAlbums, isLoading } = useQuery({
 		...getAlbumsOptions(),
 		refetchOnWindowFocus: false,

src/app/(public)/guild-meeting/page.tsx

@@ -9,7 +9,7 @@ import Markdown from "react-markdown";
 import CustomTitle from "@/components/CustomTitle";
 
 export default function GuildMeetingPage() {
-	const { t, i18n } = useTranslation();
+	const { t, i18n } = useTranslation("main");
 	const { data, error, isPending } = useQuery({
 		...getGuildMeetingOptions(),
 		refetchOnWindowFocus: false,

src/app/(public)/home/page.tsx

@@ -19,7 +19,7 @@ import {
 } from "@/components/ui/accordion";
 
 export default function MainLanding() {
-	const { t } = useTranslation();
+	const { t } = useTranslation("main");
 
 	type FaqItem = { question: string; answer: string };
 	type FaqTranslation = { self?: string } & Record<string, FaqItem>;

src/app/admin/cafe-shifts/CafeShiftsFormFields.tsx

@@ -136,7 +136,7 @@ export default function CafeShiftFormFields<T extends ShiftFormCompatible>({
 												<Input
 													className="bg-white"
 													placeholder={t(
-														"nollning.group_members.search_user_placeholder",
+														"admin:nollning.group_members.search_user_placeholder",
 													)}
 													value={nameFilter}
 													onChange={(e) => {
@@ -189,7 +189,7 @@ export default function CafeShiftFormFields<T extends ShiftFormCompatible>({
 															className="w-full justify-start"
 															disabled
 														>
-															{t("nollning.group_members.searching")}
+															{t("admin:nollning.group_members.searching")}
 														</Button>
 													</div>
 												}

src/app/admin/elections/ElectionsEditForm.tsx

@@ -249,10 +249,10 @@ export default function ElectionsEditForm({
 							name="description_sv"
 							render={({ field }) => (
 								<FormItem>
-									<FormLabel>{t("elections.description_sv")}</FormLabel>
+									<FormLabel>{t("description_sv")}</FormLabel>
 									<FormControl>
 										<Textarea
-											placeholder={t("elections.description")}
+											placeholder={t("description")}
 											{...field}
 											value={field.value ?? ""}
 										/>
@@ -266,10 +266,10 @@ export default function ElectionsEditForm({
 							name="description_en"
 							render={({ field }) => (
 								<FormItem>
-									<FormLabel>{t("elections.description_en")}</FormLabel>
+									<FormLabel>{t("description_en")}</FormLabel>
 									<FormControl>
 										<Textarea
-											placeholder={t("elections.description")}
+											placeholder={t("description")}
 											{...field}
 											value={field.value ?? ""}
 										/>

src/app/admin/members/MemberEditForm.tsx

@@ -116,7 +116,7 @@ export default function UserPostsEditForm({
 		},
 		onError: (e) => {
 			toast.error(
-				t("member.delete_error", "Failed to delete selectedUser: {details}", {
+				t("member.delete_error", "Failed to delete selected user: {details}", {
 					details: e.detail,
 				}),
 			);
@@ -177,7 +177,7 @@ export default function UserPostsEditForm({
 							<div className="grid gap-6">
 								<Card>
 									<CardHeader>
-										<CardTitle>{t("personal-info")}</CardTitle>
+										<CardTitle>{t("user-settings:personal-info")}</CardTitle>
 									</CardHeader>
 									<CardContent className="space-y-4">
 										<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
@@ -186,7 +186,7 @@ export default function UserPostsEditForm({
 												name="first_name"
 												render={({ field }) => (
 													<FormItem>
-														<FormLabel>{t("first-name")}</FormLabel>
+														<FormLabel>{t("user-settings:first-name")}</FormLabel>
 														{isEditing ? (
 															<FormControl>
 																<Input
@@ -213,7 +213,7 @@ export default function UserPostsEditForm({
 												name="last_name"
 												render={({ field }) => (
 													<FormItem>
-														<FormLabel>{t("last-name")}</FormLabel>
+														<FormLabel>{t("user-settings:last-name")}</FormLabel>
 														{isEditing ? (
 															<FormControl>
 																<Input
@@ -239,14 +239,14 @@ export default function UserPostsEditForm({
 												name="telephone_number"
 												render={({ field }) => (
 													<FormItem>
-														<FormLabel>{t("phone")}</FormLabel>
+														<FormLabel>{t("user-settings:phone")}</FormLabel>
 														{isEditing ? (
 															<FormControl>
 																<Input
 																	type="tel"
 																	{...field}
 																	value={field.value ?? ""}
-																	placeholder={t("phone")}
+																	placeholder={t("user-settings:phone")}
 																	className={
 																		errors.telephone_number
 																			? "border-destructive"
@@ -269,7 +269,7 @@ export default function UserPostsEditForm({
 																	} catch {
 																		return (
 																			selectedUser.telephone_number ||
-																			t("not-provided")
+																			t("user-settings:not-provided")
 																		);
 																	}
 																})()}
@@ -287,7 +287,7 @@ export default function UserPostsEditForm({
 												name="start_year"
 												render={({ field }) => (
 													<FormItem>
-														<FormLabel>{t("start-year")}</FormLabel>
+														<FormLabel>{t("user-settings:start-year")}</FormLabel>
 														{isEditing ? (
 															<FormControl>
 																<Input
@@ -329,7 +329,7 @@ export default function UserPostsEditForm({
 															>
 																<SelectTrigger>
 																	<SelectValue
-																		placeholder={t("select-program")}
+																		placeholder={t("user-settings:select-program")}
 																	/>
 																</SelectTrigger>
 																<SelectContent>
@@ -345,7 +345,7 @@ export default function UserPostsEditForm({
 															</Select>
 														) : (
 															<p className="text-sm font-medium mt-1">
-																{selectedUser.program || t("not-specified")}
+																{selectedUser.program || t("user-settings:not-specified")}
 															</p>
 														)}
 														<FormMessage />
@@ -359,23 +359,23 @@ export default function UserPostsEditForm({
 											name="stil_id"
 											render={({ field }) => (
 												<FormItem>
-													<FormLabel>{t("stil-id")}</FormLabel>
+													<FormLabel>{t("user-settings:stil-id")}</FormLabel>
 													{isEditing ? (
 														<>
 															<FormControl>
 																<Input
 																	{...field}
 																	value={field.value ?? ""}
-																	placeholder={t("optional")}
+																	placeholder={t("user-settings:optional")}
 																/>
 															</FormControl>
 															<span className="text-sm text-muted-foreground">
-																{t("stil-id_subtitle")}
+																{t("user-settings:stil-id_subtitle")}
 															</span>
 														</>
 													) : (
 														<p className="text-sm font-medium mt-1">
-															{selectedUser.stil_id || t("not-provided")}
+															{selectedUser.stil_id || t("user-settings:not-provided")}
 														</p>
 													)}
 													<FormMessage />
@@ -420,7 +420,7 @@ export default function UserPostsEditForm({
 										onOpenChange={setConfirmOpen}
 										onConfirm={handleDeleteUser}
 										triggerText={t("member.remove")}
-										title={t("member.confirm_remove")}
+										title={t("member.confirm_remove", {user: `${selectedUser.first_name} ${selectedUser.last_name}`})}
 										description={t("member.confirm_remove_text")}
 										confirmText={t("member.remove")}
 										cancelText={t("cancel", "Cancel")}

src/components/LoginForm.tsx

@@ -30,7 +30,7 @@ const emailPasswordSchema = z.object({
 });
 
 export default function LoginForm() {
-	const { t } = useTranslation();
+	const { t } = useTranslation("main");
 	const router = useRouter();
 	const searchParams = useSearchParams();
 	const [submitEnabled, setSubmitEnabled] = useState(true);

src/components/NavBar.tsx

@@ -65,7 +65,7 @@ type NavSection = {
 } & Record<string, NavItem>;
 
 export function NavBar() {
-	const { t } = useTranslation();
+	const { t } = useTranslation("main");
 	const router = useRouter();
 	const { data: user } = useQuery({
 		...getMeOptions(),