More i18n for vm details page

openshift · Nov 18, 2020 · e24dffd · e24dffd
1 parent bf96e10
commit e24dffd
Show file tree

Hide file tree

Showing 10 changed files with 104 additions and 87 deletions.
diff --git a/...kubevirt-plugin/src/components/modals/scheduling-modals/affinity-modal/affinity-modal.tsx b/...kubevirt-plugin/src/components/modals/scheduling-modals/affinity-modal/affinity-modal.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { useTranslation } from 'react-i18next';
 import * as _ from 'lodash';
 import {
   withHandlePromise,
@@ -29,7 +30,6 @@ import { getVMLikeAffinity } from '../../../../selectors/vm-like/selectors';
 import { getLoadedData, isLoaded, getLoadError } from '../../../../utils';
 import { useCollisionChecker } from '../../../../hooks/use-collision-checker';
 import { ModalFooter } from '../../modal/modal-footer';
-import { AFFINITY_MODAL_TITLE, AFFINITY_CREATE, AFFINITY_EDITING } from '../shared/consts';
 import { AffinityTable } from './components/affinity-table/affinity-table';
 import { AffinityRow } from './components/affinity-table/affinity-row';
 import { AffinityEdit } from './components/affinity-edit/affinity-edit';
@@ -56,6 +56,7 @@ export const AffinityModal = withHandlePromise<AffinityModalProps>(
     inProgress,
     errorMessage,
   }) => {
+    const { t } = useTranslation();
     const vmLikeFinal = getLoadedData(vmLikeEntityLoading, vmLikeEntity);
     const loadError = getLoadError(nodes, NodeModel);
     const currentAffinity = getVMLikeAffinity(vmLikeFinal);
@@ -177,10 +178,10 @@ export const AffinityModal = withHandlePromise<AffinityModalProps>(
     };
 
     const modalTitle = !isEditing
-      ? AFFINITY_MODAL_TITLE
+      ? t('kubevirt-plugin~Affinity Rules')
       : isCreating
-      ? AFFINITY_CREATE
-      : AFFINITY_EDITING;
+      ? t('kubevirt-plugin~New Affinity')
+      : t('kubevirt-plugin~Edit Affinity');
 
     return (
       <div className="modal-content">
@@ -192,7 +193,7 @@ export const AffinityModal = withHandlePromise<AffinityModalProps>(
           <SplitItem className="scheduling-modals__add-btn">
             {!isEditing && affinities.length > 0 && (
               <Button onClick={() => onAffinityClickAdd()} variant="secondary">
-                Add Affinity rule
+                {t('kubevirt-plugin~Add Affinity rule')}
               </Button>
             )}
           </SplitItem>
@@ -210,20 +211,20 @@ export const AffinityModal = withHandlePromise<AffinityModalProps>(
               {affinities.length > 0 && (
                 <div className="scheduling-modals__desc-container">
                   <Text className="scheduling-modals__desc" component={TextVariants.small}>
-                    {
-                      'Set scheduling requirements and affect the ranking of the nodes candidate for scheduling.'
-                    }
+                    {t(
+                      'kubevirt-plugin~Set scheduling requirements and affect the ranking of the nodes candidate for scheduling.',
+                    )}
                   </Text>
                   <Text className="scheduling-modals__desc" component={TextVariants.small}>
-                    {
-                      "Rules with 'Preferred' condition will stack with an 'AND' relation between them."
-                    }
+                    {t(
+                      "kubevirt-plugin~Rules with 'Preferred' condition will stack with an 'AND' relation between them.",
+                    )}
                   </Text>
 
                   <Text className="scheduling-modals__desc" component={TextVariants.small}>
-                    {
-                      "Rules with 'Required' condition will stack with an 'OR' relation between them."
-                    }
+                    {t(
+                      "kubevirt-plugin~Rules with 'Required' condition will stack with an 'OR' relation between them.",
+                    )}
                   </Text>
                 </div>
               )}
@@ -254,30 +255,30 @@ export const AffinityModal = withHandlePromise<AffinityModalProps>(
               ) : (
                 <EmptyState variant={EmptyStateVariant.full}>
                   <Title headingLevel="h5" size="lg">
-                    No Affinity rules found
+                    {t('kubevirt-plugin~No Affinity rules found')}
                   </Title>
                   <EmptyStateBody>
                     <div className="scheduling-modals__desc-container">
                       <Text className="scheduling-modals__desc" component={TextVariants.small}>
-                        {
-                          'Set scheduling requirements and affect the ranking of the nodes candidate for scheduling.'
-                        }
+                        {t(
+                          'kubevirt-plugin~Set scheduling requirements and affect the ranking of the nodes candidate for scheduling.',
+                        )}
                       </Text>
                       <Text className="scheduling-modals__desc" component={TextVariants.small}>
-                        {
-                          "Rules with 'Preferred' condition will stack with an 'AND' relation between them."
-                        }
+                        {t(
+                          "kubevirt-plugin~Rules with 'Preferred' condition will stack with an 'AND' relation between them.",
+                        )}
                       </Text>
 
                       <Text className="scheduling-modals__desc" component={TextVariants.small}>
-                        {
-                          "Rules with 'Required' condition will stack with an 'OR' relation between them."
-                        }
+                        {t(
+                          "kubevirt-plugin~Rules with 'Required' condition will stack with an 'OR' relation between them.",
+                        )}
                       </Text>
                     </div>
                   </EmptyStateBody>
                   <Button variant="secondary" onClick={() => onAffinityClickAdd()}>
-                    Add Affinity rule
+                    {t('kubevirt-plugin~Add Affinity rule')}
                   </Button>
                 </EmptyState>
               )}
@@ -290,14 +291,19 @@ export const AffinityModal = withHandlePromise<AffinityModalProps>(
               isSimpleError={!!loadError}
               onSubmit={submit}
               onCancel={onCancel}
-              submitButtonText={'Save'}
-              infoTitle={showCollisionAlert && 'Affinity has been updated outside this flow.'}
+              submitButtonText={t('kubevirt-plugin~Save')}
+              infoTitle={
+                showCollisionAlert &&
+                t('kubevirt-plugin~Affinity has been updated outside this flow.')
+              }
               infoMessage={
                 <>
-                  Saving these changes will override any Affinity previously saved.
+                  {t(
+                    'kubevirt-plugin~Saving these changes will override any Affinity previously saved.',
+                  )}
                   <br />
                   <Button variant={ButtonVariant.link} isInline onClick={onReload}>
-                    Reload Affinity
+                    {t('kubevirt-plugin~Reload Affinity')}
                   </Button>
                   .
                 </>

diff --git a/...mponents/modals/scheduling-modals/dedicated-resources-modal/dedicated-resources-modal.tsx b/...mponents/modals/scheduling-modals/dedicated-resources-modal/dedicated-resources-modal.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { useTranslation } from 'react-i18next';
 import { Button, ButtonVariant, Checkbox, Text, TextVariants } from '@patternfly/react-core';
 import { ModalTitle, ModalBody, ModalComponentProps } from '@console/internal/components/factory';
 import { NodeModel } from '@console/internal/models';
@@ -17,7 +18,7 @@ import { useCollisionChecker } from '../../../../hooks/use-collision-checker';
 import { useNodeQualifier } from '../shared/hooks';
 import { ModalFooter } from '../../modal/modal-footer';
 import { NodeChecker } from '../shared/NodeChecker/node-checker';
-import { DEDICATED_RESOURCES_MODAL_TITLE, DEDICATED_RESOURCES_LABELS } from '../shared/consts';
+import { DEDICATED_RESOURCES_LABELS } from '../shared/consts';
 import './dedicated-resources-modal.scss';
 
 export const DedicatedResourcesModal = withHandlePromise<DedicatedResourcesModalProps>(
@@ -30,6 +31,7 @@ export const DedicatedResourcesModal = withHandlePromise<DedicatedResourcesModal
     inProgress,
     errorMessage,
   }) => {
+    const { t } = useTranslation();
     const vmLikeFinal = getLoadedData(vmLikeEntityLoading, vmLikeEntity);
     const loadError = getLoadError(nodes, NodeModel);
     const isCurrentCPUPinned = isDedicatedCPUPlacement(asVM(vmLikeFinal));
@@ -66,7 +68,7 @@ export const DedicatedResourcesModal = withHandlePromise<DedicatedResourcesModal
 
     return (
       <div className="modal-content">
-        <ModalTitle>{DEDICATED_RESOURCES_MODAL_TITLE}</ModalTitle>
+        <ModalTitle>{t('kubevirt-plugin~Dedicated Resources')}</ModalTitle>
         <ModalBody>
           <Checkbox
             className="kubevirt-dedicated-resources__checkbox"

diff --git a/...lugin/src/components/modals/scheduling-modals/node-selector-modal/node-selector-modal.tsx b/...lugin/src/components/modals/scheduling-modals/node-selector-modal/node-selector-modal.tsx
@@ -1,5 +1,6 @@
-import * as React from 'react';
 import * as _ from 'lodash';
+import * as React from 'react';
+import { useTranslation } from 'react-i18next';
 import { ModalTitle, ModalBody, ModalComponentProps } from '@console/internal/components/factory';
 import { Button, ButtonVariant } from '@patternfly/react-core';
 import {
@@ -19,7 +20,6 @@ import { NodeChecker } from '../shared/NodeChecker/node-checker';
 import { useNodeQualifier } from '../shared/hooks';
 import { LabelsList } from '../../../LabelsList/labels-list';
 import { LabelRow } from '../../../LabelsList/LabelRow/label-row';
-import { NODE_SELECTOR_MODAL_TITLE } from '../shared/consts';
 import { nodeSelectorToIDLabels } from './helpers';
 import { useIDEntities } from '../../../../hooks/use-id-entities';
 import { IDLabel } from '../../../LabelsList/types';
@@ -36,6 +36,7 @@ export const NSModal = withHandlePromise(
     vmLikeEntity,
     vmLikeEntityLoading,
   }: NSModalProps) => {
+    const { t } = useTranslation();
     const vmLikeFinal = getLoadedData(vmLikeEntityLoading, vmLikeEntity);
     const loadError = getLoadError(nodes, NodeModel);
 
@@ -83,7 +84,7 @@ export const NSModal = withHandlePromise(
 
     return (
       <div className="modal-content">
-        <ModalTitle>{NODE_SELECTOR_MODAL_TITLE}</ModalTitle>
+        <ModalTitle>{t('kubevirt-plugin~Node Selector')}</ModalTitle>
         <ModalBody>
           <LabelsList
             isEmpty={selectorLabels.length === 0}

diff --git a/frontend/packages/kubevirt-plugin/src/components/modals/scheduling-modals/shared/consts.ts b/frontend/packages/kubevirt-plugin/src/components/modals/scheduling-modals/shared/consts.ts
@@ -18,25 +18,12 @@ export const SCHEDULING_NO_NODES_TAINTED_MATCH_BUTTON_TEXT =
 export const SCHEDULING_NO_NODES_MATCH_TEXT = 'No matching nodes found for the labels';
 export const SCHEDULING_NO_NODES_TAINTED_MATCH_TEXT = 'No matching tainted nodes found';
 
-// Node Selector
-export const NODE_SELECTOR_MODAL_TITLE = 'Node Selector';
-
 // Dedicated Resources
 export const DEDICATED_RESOURCES_LABELS = [{ id: null, key: 'cpumanager', value: 'true' }];
-export const DEDICATED_RESOURCES_MODAL_TITLE = 'Dedicated Resources';
-export const DEDICATED_RESOURCES_NOT_PINNED = 'No Dedicated resources applied';
-export const DEDICATED_RESOURCES_PINNED =
-  'Workload scheduled with dedicated resources (guaranteed policy)';
 
 // Tolerations Modal
-export const TOLERATIONS_MODAL_TITLE = 'Tolerations';
 export const TOLERATIONS_EFFECTS = ['NoSchedule', 'PreferNoSchedule', 'NoExecute'];
 
-// Affinity Modal
-export const AFFINITY_MODAL_TITLE = 'Affinity Rules';
-export const AFFINITY_CREATE = 'New Affinity';
-export const AFFINITY_EDITING = 'Edit Affinity';
-
 export const AFFINITY_CONDITION_LABELS = {
   [AffinityCondition.preferred]: 'Preferred during scheduling',
   [AffinityCondition.required]: 'Required during scheduling',

diff --git a/...rt-plugin/src/components/modals/scheduling-modals/tolerations-modal/tolerations-modal.tsx b/...rt-plugin/src/components/modals/scheduling-modals/tolerations-modal/tolerations-modal.tsx
@@ -1,5 +1,6 @@
-import * as React from 'react';
 import * as _ from 'lodash';
+import * as React from 'react';
+import { useTranslation } from 'react-i18next';
 import { ModalTitle, ModalBody, ModalComponentProps } from '@console/internal/components/factory';
 import { Button, ButtonVariant, Text, TextVariants } from '@patternfly/react-core';
 import {
@@ -20,7 +21,6 @@ import { useNodeQualifier } from '../shared/hooks';
 import { getTolerationsPatch } from '../../../../k8s/patches/vm/vm-scheduling-patches';
 import { LabelsList } from '../../../LabelsList/labels-list';
 import {
-  TOLERATIONS_MODAL_TITLE,
   TOLERATIONS_EFFECTS,
   SCHEDULING_NO_NODES_TAINTED_MATCH_TEXT,
   SCHEDULING_NO_NODES_TAINTED_MATCH_BUTTON_TEXT,
@@ -44,6 +44,7 @@ export const TModal = withHandlePromise(
     vmLikeEntity,
     vmLikeEntityLoading,
   }: TModalProps) => {
+    const { t } = useTranslation();
     const vmLikeFinal = getLoadedData(vmLikeEntityLoading, vmLikeEntity);
     const loadError = getLoadError(nodes, NodeModel);
 
@@ -102,7 +103,7 @@ export const TModal = withHandlePromise(
 
     return (
       <div className="modal-content">
-        <ModalTitle>{TOLERATIONS_MODAL_TITLE}</ModalTitle>
+        <ModalTitle>{t('kubevirt-plugin~Tolerations')}</ModalTitle>
         <ModalBody>
           <div className="scheduling-modals__desc-container">
             <Text className="scheduling-modals__desc" component={TextVariants.small}>

diff --git a/frontend/packages/kubevirt-plugin/src/components/vm-templates/vm-template-resource.tsx b/frontend/packages/kubevirt-plugin/src/components/vm-templates/vm-template-resource.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { useTranslation } from 'react-i18next';
 import { ResourceSummary, LabelList } from '@console/internal/components/utils';
 import { TemplateKind } from '@console/internal/module/k8s';
 import { K8sEntityMap } from '@console/shared/src';
@@ -27,14 +28,6 @@ import { VMTemplateLink } from './vm-template-link';
 import { TemplateSource } from './vm-template-source';
 import { VMWrapper } from '../../k8s/wrapper/vm/vm-wrapper';
 import { getVMTemplateNamespacedName } from '../../selectors/vm-template/selectors';
-import {
-  NODE_SELECTOR_MODAL_TITLE,
-  DEDICATED_RESOURCES_PINNED,
-  DEDICATED_RESOURCES_NOT_PINNED,
-  DEDICATED_RESOURCES_MODAL_TITLE,
-  TOLERATIONS_MODAL_TITLE,
-  AFFINITY_MODAL_TITLE,
-} from '../modals/scheduling-modals/shared/consts';
 import './_vm-template-resource.scss';
 import { getFlavorText } from '../../selectors/vm/flavor-text';
 
@@ -118,6 +111,7 @@ export const VMTemplateSchedulingList: React.FC<VMTemplateResourceSummaryProps>
   template,
   canUpdateTemplate,
 }) => {
+  const { t } = useTranslation();
   const id = getBasicID(template);
   const vm = asVM(template);
   const vmWrapper = new VMWrapper(vm);
@@ -141,7 +135,7 @@ export const VMTemplateSchedulingList: React.FC<VMTemplateResourceSummaryProps>
         <dl className="co-m-pane__details">
           <VMDetailsItem
             canEdit={canUpdateTemplate}
-            title={NODE_SELECTOR_MODAL_TITLE}
+            title={t('kubevirt-plugin~Node Selector')}
             idValue={prefixedID(id, 'node-selector')}
             editButtonId={prefixedID(id, 'node-selector-edit')}
             onEditClick={() => nodeSelectorModal({ vmLikeEntity: template, blocking: true })}
@@ -151,7 +145,7 @@ export const VMTemplateSchedulingList: React.FC<VMTemplateResourceSummaryProps>
 
           <VMDetailsItem
             canEdit={canUpdateTemplate}
-            title={TOLERATIONS_MODAL_TITLE}
+            title={t('kubevirt-plugin~Tolerations')}
             idValue={prefixedID(id, 'tolerations')}
             editButtonId={prefixedID(id, 'tolerations-edit')}
             onEditClick={() =>
@@ -167,7 +161,7 @@ export const VMTemplateSchedulingList: React.FC<VMTemplateResourceSummaryProps>
 
           <VMDetailsItem
             canEdit={canUpdateTemplate}
-            title={AFFINITY_MODAL_TITLE}
+            title={t('kubevirt-plugin~Affinity Rules')}
             idValue={prefixedID(id, 'affinity')}
             editButtonId={prefixedID(id, 'affinity-edit')}
             onEditClick={() =>
@@ -196,7 +190,7 @@ export const VMTemplateSchedulingList: React.FC<VMTemplateResourceSummaryProps>
           </VMDetailsItem>
 
           <VMDetailsItem
-            title={DEDICATED_RESOURCES_MODAL_TITLE}
+            title={t('kubevirt-plugin~Dedicated Resources')}
             idValue={prefixedID(id, 'dedicated-resources')}
             canEdit={canUpdateTemplate}
             onEditClick={() =>
@@ -207,7 +201,9 @@ export const VMTemplateSchedulingList: React.FC<VMTemplateResourceSummaryProps>
             }
             editButtonId={prefixedID(id, 'dedicated-resources-edit')}
           >
-            {isCPUPinned ? DEDICATED_RESOURCES_PINNED : DEDICATED_RESOURCES_NOT_PINNED}
+            {isCPUPinned
+              ? t('kubevirt-plugin~Workload scheduled with dedicated resources (guaranteed policy)')
+              : t('kubevirt-plugin~No Dedicated resources applied')}
           </VMDetailsItem>
         </dl>
       </div>