Bug 1920677: Fix for i18n for dev console guided tour

frontend/packages/console-app/src/components/cloud-shell/cloudShellConfirmationModal.ts

@@ -1,15 +1,17 @@
-import i18n from '@console/internal/i18n';
 import { confirmModal } from '@console/internal/components/modals/confirm-modal';
 
 const cloudShellConfirmationModal = (action) => {
   return confirmModal({
-    title: i18n.t('cloudshell~Close terminal?'),
-    message: i18n.t(
+    // t('cloudshell~Close terminal?')
+    // t('cloudshell~This will close the terminal session. Content in the terminal will not be restored on next session.')
+    // t('cloudshell~Yes')
+    // t('cloudshell~No')
+    titleKey: 'cloudshell~Close terminal?',
+    messageKey:
       'cloudshell~This will close the terminal session. Content in the terminal will not be restored on next session.',
-    ),
-    btnText: i18n.t('cloudshell~Yes'),
+    btnTextKey: 'cloudshell~Yes',
     submitDanger: true,
-    cancelText: i18n.t('cloudshell~No'),
+    cancelTextKey: 'cloudshell~No',
     executeFn: () => Promise.resolve(action()),
   });
 };

frontend/packages/dev-console/src/components/guided-tour/index.ts

@@ -1,5 +1,4 @@
 import { TourDataType } from '@console/app/src/components/tour';
-import i18n from '@console/internal/i18n';
 import {
   perspectiveSwitcherTourText,
   searchTourText,
@@ -11,50 +10,57 @@ const getSelector = (id: string): string => `[data-tour-id="${id}"]`;
 
 export const getGuidedTour = (): TourDataType => ({
   intro: {
-    heading: i18n.t('devconsole~Welcome to the Developer Perspective!'),
+    // t('devconsole~Welcome to the Developer Perspective!')
+    heading: '%devconsole~Welcome to the Developer Perspective!%',
     content: devPerspectiveTourText,
   },
   steps: [
     {
       placement: 'right',
-      heading: i18n.t('devconsole~Perspective Switcher'),
+      // t('devconsole~Perspective Switcher')
+      heading: '%devconsole~Perspective Switcher%',
       content: perspectiveSwitcherTourText,
       selector: getSelector('tour-perspective-dropdown'),
     },
     {
       placement: 'right',
-      heading: i18n.t('devconsole~Monitoring'),
-      content: i18n.t(
-        'devconsole~Monitor application metrics, create custom metrics queries and view and silence alerts in your project.',
-      ),
+      // t('devconsole~Monitoring')
+      heading: '%devconsole~Monitoring%',
+      // t('devconsole~Monitor application metrics, create custom metrics queries and view and silence alerts in your project.')
+      content:
+        '%devconsole~Monitor application metrics, create custom metrics queries and view and silence alerts in your project.%',
       selector: getSelector('tour-monitoring-nav'),
     },
     {
       placement: 'right',
-      heading: i18n.t('devconsole~Search'),
+      // t('devconsole~Search')
+      heading: '%devconsole~Search%',
       content: searchTourText,
       selector: getSelector('tour-search-nav'),
     },
     {
       flags: ['DEVWORKSPACE'],
       placement: 'bottom',
-      heading: i18n.t('devconsole~Web Terminal'),
-      content: i18n.t(
-        'devconsole~Use command line tools directly from the Console. CLIs are pre-installed and fully authenticated when you need them.',
-      ),
+      // t('devconsole~Web Terminal')
+      heading: '%devconsole~Web Terminal%',
+      // t('devconsole~Use command line tools directly from the Console. CLIs are pre-installed and fully authenticated when you need them.')
+      content:
+        '%devconsole~Use command line tools directly from the Console. CLIs are pre-installed and fully authenticated when you need them.%',
       selector: getSelector('tour-cloud-shell-button'),
     },
     {
       placement: 'bottom',
-      heading: i18n.t('devconsole~Help'),
-      content: i18n.t(
-        'devconsole~Restart this tour or access our new quick starts where you can learn more about creating or deploying an application using OpenShift Developer Console.',
-      ),
+      // t('devconsole~Help')
+      heading: '%devconsole~Help%',
+      // t('devconsole~Restart this tour or access our new quick starts where you can learn more about creating or deploying an application using OpenShift Developer Console.')
+      content:
+        '%devconsole~Restart this tour or access our new quick starts where you can learn more about creating or deploying an application using OpenShift Developer Console.%',
       selector: getSelector('tour-help-button'),
     },
   ],
   end: {
-    heading: i18n.t('devconsole~You’re ready to go!'),
+    // t('devconsole~You’re ready to go!')
+    heading: '%devconsole~You’re ready to go!%',
     content: finishTourText,
   },
 });