🌐(frontend) add dutch

docs/env.md

@@ -230,7 +230,7 @@ The application uses a new environment file structure with `.defaults` and `.loc
 | `FRONTEND_THEME` | `dsfr` | Frontend theme identifier | Optional |
 | `NEXT_PUBLIC_API_ORIGIN` | `http://localhost:8901` | Frontend API origin | Dev |
 | `NEXT_PUBLIC_S3_DOMAIN_REPLACE` | `http://localhost:9000` | S3 domain replacement for frontend | Dev |
-| `NEXT_PUBLIC_LANGUAGES` | `[["en-US","English"],["fr-FR","Français"]]` | Languages available for frontend | Optional |
+| `NEXT_PUBLIC_LANGUAGES` | `[["en-US","English"],["fr-FR","Français"],["nl-NL","Nederlands"]]` | Languages available for frontend | Optional |
 | `NEXT_PUBLIC_DEFAULT_LANGUAGE` | `en-US` | Default language for frontend | Optional |
 
 ## Development Tools

env.d/development/frontend.defaults

@@ -4,7 +4,7 @@ NEXT_TELEMETRY_DISABLED=1
 NEXT_PUBLIC_FEEDBACK_WIDGET_API_URL=http://localhost:8901/api/v1.0/inbound/widget/
 NEXT_PUBLIC_FEEDBACK_WIDGET_PATH=http://localhost:8905/dist/
 NEXT_PUBLIC_FEEDBACK_WIDGET_CHANNEL=
-NEXT_PUBLIC_LANGUAGES=[["en-US","English"],["fr-FR","Français"]]
+NEXT_PUBLIC_LANGUAGES=[["en-US","English"],["fr-FR","Français"],["nl-NL","Nederlands"]]
 NEXT_PUBLIC_DEFAULT_LANGUAGE=en-US
 # Chunk size for multipart upload in MB
 NEXT_PUBLIC_MULTIPART_UPLOAD_CHUNK_SIZE=100

src/frontend/src/features/forms/components/search-filters-form/index.tsx

@@ -73,7 +73,7 @@ export const SearchFiltersForm = ({ query, onChange }: SearchFiltersFormProps) =
                 value={parsedQuery.in as string ?? 'all_messages'}
                 showLabelWhenSelected={false}
                 onChange={handleChange}
-                options={MAILBOX_FOLDERS.filter((folder) => folder.searchable).map((folder) => ({
+                options={MAILBOX_FOLDERS().filter((folder) => folder.searchable).map((folder) => ({
                     label: t(folder.name),
                     render: () => <FolderOption label={t(folder.name)} icon={folder.icon} />,
                     value: folder.id

src/frontend/src/features/forms/components/search-input/index.tsx

@@ -34,7 +34,7 @@ export const SearchInput = () => {
 
         let newSearchParams: URLSearchParams;
         if (query) newSearchParams = new URLSearchParams({'search': query});
-        else newSearchParams = new URLSearchParams(MAILBOX_FOLDERS[0].filter);
+        else newSearchParams = new URLSearchParams(MAILBOX_FOLDERS()[0].filter);
 
         if (submit) {
             closeLeftPanel();

src/frontend/src/features/i18n/conf.ts

@@ -1,6 +1,6 @@
 import { APP_STORAGE_PREFIX } from "../config/constants";
 
-const DEFAULT_LANGUAGES = [["en-US","English"],["fr-FR","Français"]];
+const DEFAULT_LANGUAGES = [["en-US","English"],["fr-FR","Français"],["nl-NL","Nederlands"]];
 
 // TODO: Tackle async loading of languages from backend
 // to avoid declaring languages in multiple places (backend and frontend)

src/frontend/src/features/i18n/search-filters-map.json

@@ -14,7 +14,7 @@
     "fr-FR": {
         "from": ["de"],
         "to": ["a"],
-        "subject": ["sujet"],
+        "subject": ["objet", "sujet"],
         "text": ["text"],
         "in_trash": ["dans:corbeille"],
         "in_archives": ["dans:archives", "dans:archivés"],
@@ -22,5 +22,17 @@
         "in_drafts": ["dans:brouillons"],
         "is_read": ["est:lu"],
         "is_unread": ["est:nonlu"]
+    },
+    "nl-NL": {
+        "from": ["van"],
+        "to": ["aan"],
+        "subject": ["onderwerp"],
+        "text": ["tekst"],
+        "in_trash": ["in:prullenbak"],
+        "in_archives": ["in:archief"],
+        "in_sent": ["in:verzonden"],
+        "in_drafts": ["in:concepten"],
+        "is_read": ["is:gelezen"],
+        "is_unread": ["is:ongelezen"]
     }
 }

src/frontend/src/features/layouts/components/mailbox-panel/components/mailbox-labels/components/label-item/index.tsx

@@ -58,7 +58,7 @@ export const LabelItem = ({ level = 0, onEdit, canManage, defaultFoldState, ...l
   const { isFolded, toggle } = useFold(foldKey, isFoldedByDefault);
   const foldTimeoutRef = useRef<NodeJS.Timeout | null>(null);
   const goToDefaultFolder = () => {
-    const defaultFolder = MAILBOX_FOLDERS[0];
+    const defaultFolder = MAILBOX_FOLDERS()[0];
     router.push(pathname + `?${new URLSearchParams(defaultFolder.filter).toString()}`);
   }
   const moveLabelMutation = useLabelsPartialUpdate();

src/frontend/src/features/layouts/components/mailbox-panel/components/mailbox-list/index.tsx

@@ -18,7 +18,7 @@ type Folder = {
     searchable?: boolean;
 }
 
-export const MAILBOX_FOLDERS: Folder[] = [
+export const MAILBOX_FOLDERS = (): Folder[] => [
     {
         id: "inbox",
         name: i18n.t("Inbox"),
@@ -81,12 +81,13 @@ export const MAILBOX_FOLDERS: Folder[] = [
     //         is_spam: "1",
     //     },
     // },
-]
+];
 
 export const MailboxList = () => {
+
     return (
         <div className="mailbox-list">
-            {MAILBOX_FOLDERS.map((folder) => (
+            {MAILBOX_FOLDERS().map((folder) => (
                 <FolderItem
                     key={folder.icon}
                     folder={folder}

src/frontend/src/features/layouts/components/thread-panel/index.tsx

@@ -23,7 +23,7 @@ export const ThreadPanel = () => {
         // Only show import button if there are no threads in inbox or all messages folders and user has ability to import messages
         if (!canImportMessages) return false;
         if (threads?.results.length) return false;
-        const importableMessageFolders = MAILBOX_FOLDERS.filter((folder) => ['inbox', 'all_messages'].includes(folder.id));
+        const importableMessageFolders = MAILBOX_FOLDERS().filter((folder) => ['inbox', 'all_messages'].includes(folder.id));
         return importableMessageFolders.some((folder) => searchParams.toString() === new URLSearchParams(folder.filter).toString());
     }, [canImportMessages, threads?.results, searchParams]);
 

src/frontend/src/features/providers/mailbox.tsx

@@ -318,7 +318,7 @@ export const MailboxProvider = ({ children }: PropsWithChildren) => {
     useEffect(() => {
         if (selectedMailbox) {
             if (router.pathname === '/' ||  (selectedMailbox.id !== router.query.mailboxId && !router.pathname.includes('new'))) {
-                const defaultFolder = MAILBOX_FOLDERS[0];
+                const defaultFolder = MAILBOX_FOLDERS()[0];
                 const hash = window.location.hash;
                 if (router.query.threadId) {
                     router.replace(`/mailbox/${selectedMailbox.id}/thread/${router.query.threadId}?${router.query.search}${hash}`);

src/frontend/src/pages/mailbox/[mailboxId]/new/index.tsx

@@ -21,7 +21,7 @@ const NewMessageFormPage = () => {
         } else if (!selectedMailbox) {
             router.push('/');
         } else {
-            const defaultFolder = MAILBOX_FOLDERS[0];
+            const defaultFolder = MAILBOX_FOLDERS()[0];
             router.push(`/mailbox/${selectedMailbox.id}` + `?${new URLSearchParams(defaultFolder.filter).toString()}`);
         }
     }