fix: deliver news modal labels via AJAX so the dashboard widget shows the close label

Author: konradmichalik

Classes/Controller/DateController.php

@@ -18,6 +18,7 @@
 use TYPO3\CMS\Core\Configuration\ExtensionConfiguration;
 use TYPO3\CMS\Core\Http\JsonResponse;
 use TYPO3\CMS\Extbase\Mvc\Controller\ActionController;
+use TYPO3\CMS\Extbase\Utility\LocalizationUtility;
 use Xima\XimaTypo3InternalNews\Configuration;
 use Xima\XimaTypo3InternalNews\Domain\Repository\NewsRepository;
 use Xima\XimaTypo3InternalNews\Service\DateService;
@@ -65,6 +66,7 @@ public function listAction(): JsonResponse
                         'records' => $this->newsRepository->findAllByCurrentUser() ?? [],
                     ],
                 ),
+                'labels' => $this->getModalLabels(),
             ],
         );
     }
@@ -98,7 +100,22 @@ public function newsAction(): ResponseInterface
                         'dateListCount' => (array_key_exists('dateListCount', $this->configuration) ? (int) $this->configuration['dateListCount'] : 20),
                     ],
                 ),
+                'labels' => $this->getModalLabels(),
             ],
         );
     }
+
+    /**
+     * Modal labels resolved server-side so they are available regardless of the
+     * (backend module / iframe) context the request runs in.
+     *
+     * @return array<string, string>
+     */
+    private function getModalLabels(): array
+    {
+        return [
+            'title' => (string) LocalizationUtility::translate('widget.title', 'XimaTypo3InternalNews'),
+            'close' => (string) LocalizationUtility::translate('button.close', 'XimaTypo3InternalNews'),
+        ];
+    }
 }

Resources/Public/JavaScript/utils.js

@@ -8,7 +8,7 @@ class InternalNewsUtils {
       .get()
       .then(async (response) => {
         const resolved = await response.resolve();
-        this.showInternalNews(TYPO3.lang !== undefined ? TYPO3.lang['internal_news.title'] : 'Internal News', resolved.result);
+        this.showInternalNews(this.title(resolved.labels), resolved.result, resolved.labels);
       });
   }
 
@@ -17,12 +17,14 @@ class InternalNewsUtils {
       .get()
       .then(async (response) => {
         const resolved = await response.resolve();
-        this.showInternalNewsList(TYPO3.lang !== undefined ? TYPO3.lang['internal_news.title'] : 'Internal News', resolved.result);
+        this.showInternalNewsList(this.title(resolved.labels), resolved.result, resolved.labels);
       });
   }
 
-  closeButton = () => ({
-    text: TYPO3.lang !== undefined ? TYPO3.lang['internal_news.close'] : 'Close',
+  title = (labels) => labels?.title ?? TYPO3.lang?.['internal_news.title'] ?? 'Internal News';
+
+  closeButton = (labels) => ({
+    text: labels?.close ?? TYPO3.lang?.['internal_news.close'] ?? 'Close',
     name: 'close',
     icon: 'actions-close',
     active: true,
@@ -32,18 +34,18 @@ class InternalNewsUtils {
     }
   })
 
-  showInternalNews = (title, description) => {
+  showInternalNews = (title, description, labels) => {
     Modal.advanced({
       title: title,
       content: document.createRange()
         .createContextualFragment(description),
       size: {width: Modal.sizes.medium, height: Modal.sizes.default},
       staticBackdrop: true,
-      buttons: [this.closeButton()]
+      buttons: [this.closeButton(labels)]
     });
   }
 
-  showInternalNewsList = (title, content) => {
+  showInternalNewsList = (title, content, labels) => {
     Modal.advanced({
       title: title,
       content: document.createRange()
@@ -61,7 +63,7 @@ class InternalNewsUtils {
           });
         });
       },
-      buttons: [this.closeButton()]
+      buttons: [this.closeButton(labels)]
     });
   }
 }