SDA-4430_4431: Adding final factor to fix About us (#2044)

This commit is contained in:
NguyenTranHoangSym 2023-12-29 16:15:18 +07:00 committed by GitHub
parent 59cf248c80
commit 0dc3518793
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 106 additions and 62 deletions

View File

@ -113,7 +113,6 @@ export default class AboutApp extends React.Component<{}, IState> {
sdaVersion,
sdaBuildNumber,
client,
didUpdateHostname,
isValidHostname,
} = this.state;
@ -146,12 +145,17 @@ export default class AboutApp extends React.Component<{}, IState> {
value: `${formattedSfeVersion} ${client}`,
},
];
const closeButtonText =
isValidHostname &&
didUpdateHostname &&
!this.state.finalConfig.url.includes(this.state.updatedHostname ?? '')
? i18n.t('Save and Restart', ABOUT_SYMPHONY_NAMESPACE)()
: i18n.t('Close', ABOUT_SYMPHONY_NAMESPACE)();
const finalConfig = this.state.finalConfig?.url
?.replace(/https:\/\//g, '')
?.split('/')[0];
const updatedHostname = this.state.updatedHostname
?.replace(/https:\/\//g, '')
?.split('/')[0];
const isHostNamechanged =
finalConfig && updatedHostname && finalConfig !== updatedHostname;
const closeButtonText = isHostNamechanged
? i18n.t('Save and Restart', ABOUT_SYMPHONY_NAMESPACE)()
: i18n.t('Close', ABOUT_SYMPHONY_NAMESPACE)();
const cancelText = i18n.t('Cancel', ABOUT_SYMPHONY_NAMESPACE)();
return (
@ -192,7 +196,11 @@ export default class AboutApp extends React.Component<{}, IState> {
<div className='AboutApp-close-container'>
{this.state.isPodEditing && (
<button
className='AboutApp-cancel-button'
className={
isHostNamechanged
? 'AboutApp-cancel-button-save-restart'
: 'AboutApp-cancel-button'
}
onMouseDown={this.eventHandlers.onCancel}
title={cancelText}
data-testid={'CANCEL_BUTTON'}
@ -202,9 +210,11 @@ export default class AboutApp extends React.Component<{}, IState> {
)}
<button
className={
isValidHostname
? 'AboutApp-close-button'
: 'AboutApp-close-button-disabled'
isHostNamechanged && isValidHostname
? 'AboutApp-button-save-restart'
: !isValidHostname
? 'AboutApp-button-save-restart-disabled'
: 'AboutApp-close-button'
}
onClick={this.eventHandlers.onClose}
title={closeButtonText}
@ -264,7 +274,16 @@ export default class AboutApp extends React.Component<{}, IState> {
*/
public close(): void {
const { isValidHostname, didUpdateHostname, hostname } = this.state;
if (isValidHostname && didUpdateHostname) {
const finalConfig = this.state.finalConfig?.url
.replace(/https:\/\//g, '')
?.split('/')[0];
const updatedHostname = this.state.updatedHostname
?.replace(/https:\/\//g, '')
?.split('/')[0];
const compareHostName =
finalConfig && updatedHostname && finalConfig !== updatedHostname;
if (isValidHostname && didUpdateHostname && compareHostName) {
ipcRenderer.send('user-pod-updated', hostname);
}
ipcRenderer.send('close-about-app');

View File

@ -179,55 +179,7 @@ body {
box-sizing: border-box;
text-transform: uppercase;
font-weight: 600;
width: 100%;
height: 36px;
&:focus {
box-shadow: 0 0 10px rgba(61, 162, 253, 1);
outline: none;
}
}
&-close-button-disabled {
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: @graphite-50;
color: @electricity-ui-05;
cursor: pointer;
box-sizing: border-box;
text-transform: uppercase;
font-weight: 600;
width: 100%;
height: 36px;
&:focus {
box-shadow: 0 0 10px rgba(61, 162, 253, 1);
outline: none;
}
}
&-save-button {
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: 120px;
flex: 1;
height: 36px;
&:focus {
@ -251,7 +203,7 @@ body {
box-sizing: border-box;
text-transform: uppercase;
font-weight: 600;
width: 120px;
width: 50%;
margin-right: 8px;
height: 36px;
@ -261,6 +213,79 @@ body {
}
}
&-cancel-button-save-restart {
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: 30%;
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;
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;
flex: 1;
height: 36px;
&:focus {
box-shadow: 0 0 10px rgba(61, 162, 253, 1);
outline: none;
}
}
&-button-save-restart-disabled {
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: @graphite-50;
color: @electricity-ui-05;
cursor: pointer;
box-sizing: border-box;
text-transform: uppercase;
font-weight: 600;
flex: 1;
height: 36px;
&:focus {
box-shadow: 0 0 10px rgba(61, 162, 253, 1);
outline: none;
}
}
&-version-container {
width: 100%;
}