fix: add interationalization to added changes

splunk · Mar 22, 2021 · cf70a0f · cf70a0f
1 parent f1c2545
commit cf70a0f
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 8 deletions.
diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/ConfigurationFormView.jsx b/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/ConfigurationFormView.jsx
@@ -1,6 +1,7 @@
 import React, { useRef, useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 
+import { _ } from '@splunk/ui-utils/i18n';
 import Button from '@splunk/react-ui/Button';
 import ControlGroup from '@splunk/react-ui/ControlGroup';
 
@@ -50,7 +51,7 @@ function ConfigurationFormView({ serviceName }) {
             />
             <ControlGroup label="">
                 <div style={{ flexGrow: 0 }}>
-                    <Button appearance="primary" label="Save" />
+                    <Button appearance="primary" label={_('Save')} />
                 </div>
             </ControlGroup>
         </>

diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/table/TableHeader.jsx b/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/components/table/TableHeader.jsx
@@ -40,7 +40,7 @@ function TableHeader({ page, services, totalElement, handleRequestModalOpen }) {
                     setSearchType(value);
                 }}
             >
-                arr
+                {arr}
             </Select>
         );
     };
@@ -73,9 +73,21 @@ function TableHeader({ page, services, totalElement, handleRequestModalOpen }) {
                                             setPageSize(value);
                                         }}
                                     >
-                                        <Select.Option key="10" label="10 Per Page" value={10} />
-                                        <Select.Option key="25" label="25 Per Page" value={25} />
-                                        <Select.Option key="50" label="50 Per Page" value={50} />
+                                        <Select.Option
+                                            key="10"
+                                            label={_('10 Per Page')}
+                                            value={10}
+                                        />
+                                        <Select.Option
+                                            key="25"
+                                            label={_('25 Per Page')}
+                                            value={25}
+                                        />
+                                        <Select.Option
+                                            key="50"
+                                            label={_('50 Per Page')}
+                                            value={50}
+                                        />
                                     </Select>
                                     {getSearchTypeDropdown()}
                                 </TableSelectBoxWrapper>
@@ -107,7 +119,11 @@ function TableHeader({ page, services, totalElement, handleRequestModalOpen }) {
                         }}
                     />
                     {page === 'inputs' ? null : (
-                        <Button label="Add" appearance="primary" onClick={handleRequestModalOpen} />
+                        <Button
+                            label={_('Add')}
+                            appearance="primary"
+                            onClick={handleRequestModalOpen}
+                        />
                     )}
                 </ColumnLayout.Column>
             </ColumnLayout.Row>

diff --git a/...add_on_ucc_framework/ucc_ui_lib/src/main/webapp/pages/Configuration/ConfigurationPage.jsx b/...add_on_ucc_framework/ucc_ui_lib/src/main/webapp/pages/Configuration/ConfigurationPage.jsx
@@ -32,7 +32,7 @@ function ConfigurationPage() {
             </ColumnLayout>
             <TabBar activeTabId={activeTabId} onChange={handleChange}>
                 {tabs.map((tab) => (
-                    <TabBar.Tab key={tab.name} label={tab.title} tabId={tab.name} />
+                    <TabBar.Tab key={tab.name} label={_(tab.title)} tabId={tab.name} />
                 ))}
             </TabBar>
             {tabs.map((tab) => {

diff --git a/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/pages/Input/InputPage.jsx b/splunk_add_on_ucc_framework/ucc_ui_lib/src/main/webapp/pages/Input/InputPage.jsx
@@ -20,7 +20,7 @@ function InputPage() {
     const [serviceLabel, setserviceLabel] = useState(null);
     const unifiedConfigs = getUnifiedConfigs();
     const { services, title, description } = unifiedConfigs.pages.inputs;
-    const toggle = <Button appearance="primary" label="Create New Input" isMenu />;
+    const toggle = <Button appearance="primary" label={_('Create New Input')} isMenu />;
 
     const getInputMenu = () => {
         let arr = [];