SDA-4434: Update Fr/Jp text

sbenmoussati · Jan 3, 2024 · 07681f4 · 07681f4
1 parent b28e896
commit 07681f4
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 10 deletions.
diff --git a/spec/__snapshots__/aboutApp.spec.ts.snap b/spec/__snapshots__/aboutApp.spec.ts.snap
@@ -52,7 +52,11 @@ exports[`about app should render correctly 1`] = `
         onMouseDown={[Function]}
         title="Close"
       >
-        Close
+        <span
+          className="AboutApp-button-save-restart-text"
+        >
+          Close
+        </span>
       </button>
     </div>
   </div>

diff --git a/src/renderer/components/about-app.tsx b/src/renderer/components/about-app.tsx
@@ -40,7 +40,6 @@ interface IState {
   updatedHostname?: string;
   isPodEditing: boolean;
   isValidHostname: boolean;
-  didUpdateHostname: boolean;
 }
 
 const ABOUT_SYMPHONY_NAMESPACE = 'AboutSymphony';
@@ -96,7 +95,6 @@ export default class AboutApp extends React.Component<{}, IState> {
       updatedHostname: '',
       isPodEditing: false,
       isValidHostname: true,
-      didUpdateHostname: false,
     };
     this.updateState = this.updateState.bind(this);
   }
@@ -222,7 +220,9 @@ export default class AboutApp extends React.Component<{}, IState> {
               ref={this.closeButtonRef}
               disabled={!isValidHostname}
             >
-              {closeButtonText}
+              <span className='AboutApp-button-save-restart-text'>
+                {closeButtonText}
+              </span>
             </button>
           </div>
         </div>
@@ -255,7 +255,7 @@ export default class AboutApp extends React.Component<{}, IState> {
    */
   public copy(): void {
     const { clientVersion, ...rest } = this.state;
-    const { isPodEditing, isValidHostname, didUpdateHostname, ...data } = {
+    const { isPodEditing, isValidHostname, ...data } = {
       ...{ sbeVersion: clientVersion },
       ...rest,
     };
@@ -273,7 +273,7 @@ export default class AboutApp extends React.Component<{}, IState> {
    * Close modal
    */
   public close(): void {
-    const { isValidHostname, didUpdateHostname, hostname } = this.state;
+    const { isValidHostname } = this.state;
     const finalConfig = this.state.finalConfig?.url
       .replace(/https:\/\//g, '')
       ?.split('/')[0];
@@ -283,8 +283,8 @@ export default class AboutApp extends React.Component<{}, IState> {
     const compareHostName =
       finalConfig && updatedHostname && finalConfig !== updatedHostname;
 
-    if (isValidHostname && didUpdateHostname && compareHostName) {
-      ipcRenderer.send('user-pod-updated', hostname);
+    if (isValidHostname && compareHostName) {
+      ipcRenderer.send('user-pod-updated', this.state.updatedHostname);
     }
     ipcRenderer.send('close-about-app');
   }
@@ -308,8 +308,6 @@ export default class AboutApp extends React.Component<{}, IState> {
     if (e.detail === 3) {
       this.setState({
         isPodEditing: !!(this.state.globalConfig as IConfig)?.isPodUrlEditable,
-        didUpdateHostname: !!(this.state.globalConfig as IConfig)
-          ?.isPodUrlEditable,
       });
     }
   }

diff --git a/src/renderer/styles/about-app.less b/src/renderer/styles/about-app.less
@@ -238,6 +238,31 @@ body {
     }
   }
 
+  &-cancel-button-save-restart:lang(ja-JP) {
+    box-shadow: none;
+    border: none;
+    border-radius: 20px;
+    font-size: 0.875rem;
+    text-align: center;
+    display: inline-block;
+    text-decoration: none;
+    line-height: 12px;
+    background-color: @electricity-ui-50;
+    color: @electricity-ui-05;
+    cursor: pointer;
+    box-sizing: border-box;
+    text-transform: uppercase;
+    font-weight: 600;
+    width: 35%;
+    margin-right: 8px;
+    height: 36px;
+
+    &:focus {
+      box-shadow: 0 0 10px rgba(61, 162, 253, 1);
+      outline: none;
+    }
+  }
+
   &-button-save-restart {
     box-shadow: none;
     border: none;
@@ -262,6 +287,11 @@ body {
     }
   }
 
+  &-button-save-restart-text:lang(fr-FR) {
+    font-size: 0.75rem;
+    line-height: 1rem;
+  }
+
   &-button-save-restart-disabled {
     box-shadow: none;
     border: none;