fix minor styling, allow custom translations and prepare for release

riofriz · riofriz · commit 1b6f5b6e34c8 · 2025-11-13T15:11:49.000Z
diff --git a/app/_consts/global.ts b/app/_consts/global.ts
diff --git a/app/_server/actions/translations/index.ts b/app/_server/actions/translations/index.ts
@@ -0,0 +1,63 @@
+import fs from "fs";
+import path from "path";
+import "server-only";
+
+/**
+ * Load translation messages for a given locale.
+ * First checks for custom translations in ./data/translations/,
+ * then falls back to built-in translations in app/_translations/.
+ *
+ * This function is server-only and should only be called from server components
+ * or server actions.
+ */
+export const loadTranslationMessages = async (locale: string): Promise<any> => {
+  const customTranslationPath = path.join(
+    process.cwd(),
+    "data",
+    "translations",
+    `${locale}.json`
+  );
+
+  try {
+    if (fs.existsSync(customTranslationPath)) {
+      const customMessages = JSON.parse(
+        fs.readFileSync(customTranslationPath, "utf8")
+      );
+      return customMessages;
+    }
+  } catch (error) {
+    console.warn(`Failed to load custom translation for ${locale}:`, error);
+  }
+
+  try {
+    const messages = (await import(`../../../_translations/${locale}.json`))
+      .default;
+    return messages;
+  } catch (error) {
+    const fallbackMessages = (await import("../../../_translations/en.json"))
+      .default;
+    return fallbackMessages;
+  }
+};
+
+type TranslationFunction = (key: string) => string;
+
+/**
+ * Get a translation function for a given locale.
+ * This function is server-only and should only be called from server components
+ * or server actions.
+ */
+export const getTranslations = async (
+  locale: string = process.env.LOCALE || "en"
+): Promise<TranslationFunction> => {
+  const messages = await loadTranslationMessages(locale);
+
+  return (key: string) => {
+    const keys = key.split(".");
+    let value: any = messages;
+    for (const k of keys) {
+      value = value?.[k];
+    }
+    return value || key;
+  };
+};
diff --git a/app/_utils/global-utils.ts b/app/_utils/global-utils.ts
@@ -5,23 +5,6 @@ export const cn = (...inputs: ClassValue[]) => {
   return twMerge(clsx(inputs));
 };
 
-type TranslationFunction = (key: string) => string;
-
-export const getTranslations = async (
-  locale: string = process.env.LOCALE || "en"
-): Promise<TranslationFunction> => {
-  const messages = (await import(`../_translations/${locale}.json`)).default;
-
-  return (key: string) => {
-    const keys = key.split(".");
-    let value: any = messages;
-    for (const k of keys) {
-      value = value?.[k];
-    }
-    return value || key;
-  };
-};
-
 export const copyToClipboard = async (text: string): Promise<boolean> => {
   try {
     if (navigator?.clipboard?.writeText) {
diff --git a/app/api/system-stats/route.ts b/app/api/system-stats/route.ts
@@ -1,5 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import { getTranslations } from "@/app/_utils/global-utils";
+import { getTranslations } from "@/app/_server/actions/translations";
 import * as si from "systeminformation";
 import {
   getPing,
diff --git a/app/i18n.ts b/app/i18n.ts
@@ -1,24 +1,24 @@
 import { getRequestConfig } from "next-intl/server";
-import { Locales } from "@/app/_consts/global";
-
-const validLocales = Locales.map((item) => item.locale);
+import { loadTranslationMessages } from "@/app/_server/actions/translations";
 
 export default getRequestConfig(async ({ locale }) => {
-    const safeLocale = locale && validLocales.includes(locale) ? locale : "en";
+  const safeLocale = locale || "en";
 
-    try {
-        return {
-            locale: safeLocale,
-            messages: (await import(`./_translations/${safeLocale}.json`)).default,
-        };
-    } catch (error) {
-        console.error(
-            `Failed to load translations for locale: ${safeLocale}`,
-            error
-        );
-        return {
-            locale: "en",
-            messages: (await import("./_translations/en.json")).default,
-        };
-    }
-});
+  try {
+    const messages = await loadTranslationMessages(safeLocale);
+    return {
+      locale: safeLocale,
+      messages,
+    };
+  } catch (error) {
+    console.error(
+      `Failed to load translations for locale: ${safeLocale}`,
+      error
+    );
+    const fallbackMessages = await loadTranslationMessages("en");
+    return {
+      locale: "en",
+      messages: fallbackMessages,
+    };
+  }
+});
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -3,7 +3,7 @@ import { JetBrains_Mono, Inter } from "next/font/google";
 import "@/app/globals.css";
 import { ThemeProvider } from "@/app/_providers/ThemeProvider";
 import { ServiceWorkerRegister } from "@/app/_components/FeatureComponents/PWA/ServiceWorkerRegister";
-import { Locales } from "@/app/_consts/global";
+import { loadTranslationMessages } from "@/app/_server/actions/translations";
 
 import { NextIntlClientProvider } from "next-intl";
 
@@ -21,7 +21,8 @@ const inter = Inter({
 
 export const metadata: Metadata = {
   title: "Cr*nMaster - Cron Management made easy",
-  description: "The ultimate cron job management platform with intelligent scheduling, real-time monitoring, and powerful automation tools",
+  description:
+    "The ultimate cron job management platform with intelligent scheduling, real-time monitoring, and powerful automation tools",
   manifest: "/manifest.json",
   appleWebApp: {
     capable: true,
@@ -54,12 +55,7 @@ export default async function RootLayout({
   let locale = process.env.LOCALE || "en";
   let messages;
 
-
-  if (!Locales.some((item) => item.locale === locale)) {
-    locale = "en";
-  }
-
-  messages = (await import(`./_translations/${locale}.json`)).default;
+  messages = await loadTranslationMessages(locale);
 
   return (
     <html lang="en" suppressHydrationWarning>
@@ -72,7 +68,6 @@ export default async function RootLayout({
         <link rel="apple-touch-icon" href="/logo.png" />
       </head>
       <body className={`${inter.variable} ${jetbrainsMono.variable} font-sans`}>
-
         <NextIntlClientProvider locale={locale} messages={messages}>
           <ThemeProvider
             attribute="class"
diff --git a/app/page.tsx b/app/page.tsx
@@ -6,15 +6,18 @@ import { ThemeToggle } from "@/app/_components/FeatureComponents/Theme/ThemeTogg
 import { LogoutButton } from "@/app/_components/FeatureComponents/LoginForm/LogoutButton";
 import { ToastContainer } from "@/app/_components/GlobalComponents/UIElements/Toast";
 import { PWAInstallPrompt } from "@/app/_components/FeatureComponents/PWA/PWAInstallPrompt";
-import { getTranslations } from "@/app/_utils/global-utils";
+import { getTranslations } from "@/app/_server/actions/translations";
 import { SSEProvider } from "@/app/_contexts/SSEContext";
 
 export const dynamic = "force-dynamic";
 export const maxDuration = 300;
 
 export default async function Home() {
   const t = await getTranslations();
-  const liveUpdatesEnabled = (typeof process.env.LIVE_UPDATES === "boolean" && process.env.LIVE_UPDATES === true) || process.env.LIVE_UPDATES !== "false";
+  const liveUpdatesEnabled =
+    (typeof process.env.LIVE_UPDATES === "boolean" &&
+      process.env.LIVE_UPDATES === true) ||
+    process.env.LIVE_UPDATES !== "false";
 
   const [cronJobs, scripts] = await Promise.all([
     getCronJobs(),
diff --git a/howto/DOCKER.md b/howto/DOCKER.md
@@ -52,7 +52,7 @@ environment:
 #### Localization
 
 ```yaml
-- LOCALE=en # or other supported locales (see /app/_translations/)
+- LOCALE=en # or any locale code (supports custom translations in ./data/translations/)
 ```
 
 #### Logging Configuration
diff --git a/howto/ENV_VARIABLES.md b/howto/ENV_VARIABLES.md
@@ -15,10 +15,35 @@ This document provides a comprehensive reference for all environment variables u
 | Variable        | Default       | Description                                                                  |
 | --------------- | ------------- | ---------------------------------------------------------------------------- |
 | `APP_URL`       | Auto-detected | Public URL of your Cronmaster instance (e.g., `https://cron.yourdomain.com`) |
-| `LOCALE`        | `en`          | Application locale/language setting                                          |
+| `LOCALE`        | `en`          | Application locale/language setting (supports custom translations)           |
 | `HOME`          | `/home`       | Path to home directory (optional override)                                   |
 | `AUTH_PASSWORD` | `N/A`         | Password for authentication (can be used alone or with SSO)                  |
 
+## Custom Translations
+
+CronMaster supports custom user-made translations. You can create your own translation files and use them by setting the `LOCALE` environment variable.
+
+**For detailed instructions on creating custom translations or contributing official translations, see [TRANSLATIONS.md](TRANSLATIONS.md).**
+
+### Quick Setup for Custom Translations
+
+```bash
+# Create translations directory
+mkdir -p ./data/translations
+
+# Copy template and customize
+cp app/_translations/en.json ./data/translations/your-locale.json
+
+# Set locale and restart
+export LOCALE=your-locale
+```
+
+Translation loading priority:
+
+1. Custom: `./data/translations/{locale}.json`
+2. Built-in: `app/_translations/{locale}.json`
+3. Fallback: `app/_translations/en.json`
+
 ## Docker Configuration
 
 | Variable            | Default | Description                                                                     |
@@ -34,11 +59,11 @@ This document provides a comprehensive reference for all environment variables u
 
 ## Logging Configuration
 
-| Variable                        | Default | Description                                                          |
-| ------------------------------- | ------- | -------------------------------------------------------------------- |
-| `MAX_LOG_AGE_DAYS`              | `30`    | Days to keep job execution logs before cleanup                       |
-| `NEXT_PUBLIC_MAX_LOG_AGE_DAYS`  | `30`    | Days to keep error history in browser localStorage (client-side)     |
-| `MAX_LOGS_PER_JOB`              | `50`    | Maximum number of log files to keep per job                          |
+| Variable                       | Default | Description                                                      |
+| ------------------------------ | ------- | ---------------------------------------------------------------- |
+| `MAX_LOG_AGE_DAYS`             | `30`    | Days to keep job execution logs before cleanup                   |
+| `NEXT_PUBLIC_MAX_LOG_AGE_DAYS` | `30`    | Days to keep error history in browser localStorage (client-side) |
+| `MAX_LOGS_PER_JOB`             | `50`    | Maximum number of log files to keep per job                      |
 
 ## Authentication & Security
 
@@ -109,7 +134,7 @@ services:
       - AUTH_PASSWORD=your_secure_password
       - HOST_CRONTAB_USER=root
       - APP_URL=https://cron.yourdomain.com
-      - LOCALE=en
+      - LOCALE=en # Can be any locale code, including custom ones
       - NEXT_PUBLIC_CLOCK_UPDATE_INTERVAL=30000
       - LIVE_UPDATES=true
       - MAX_LOG_AGE_DAYS=30
diff --git a/howto/TRANSLATIONS.md b/howto/TRANSLATIONS.md
