IntenseWebs/mattermost
3
0
Fork 0
mirror of https://github.com/mattermost/mattermost.git synced 2025-02-25 18:55:24 -06:00
Code Issues Packages Projects Releases Wiki Activity

[GH-26702] Clicking on "remember my preference" in landing page does not tick the associated checkbox (#26703)

Browse Source
This commit is contained in:
Antonin Delpeuch 2024-04-24 22:30:34 +02:00 committed by GitHub
parent d9aed02f57
commit 542e84b140
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 19 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
webapp/channels/src/components/linking_landing_page/linking_landing_page.tsx
View File

@ -7,7 +7,6 @@ import {FormattedMessage} from 'react-intl';
import BrowserStore from 'stores/browser_store';
import FormattedMarkdownMessage from 'components/formatted_markdown_message';
import CheckboxCheckedIcon from 'components/widgets/icons/checkbox_checked_icon';
import desktopImg from 'images/deep-linking/deeplinking-desktop-img.png';
import mobileImg from 'images/deep-linking/deeplinking-mobile-img.png';
@ -99,12 +98,13 @@ export default class LinkingLandingPage extends PureComponent<Props, State> {
return landingPreference && landingPreference === LandingPreferenceTypes.MATTERMOSTAPP;
};
handleChecked = () => {
handleChecked = (e: React.ChangeEvent<HTMLInputElement>) => {
this.setState({rememberChecked: e.target.checked});
// If it was checked, and now we're unchecking it, clear the preference
if (this.state.rememberChecked) {
if (!e.target.checked) {
BrowserStore.clearLandingPreference(this.props.siteUrl);
}
this.setState({rememberChecked: !this.state.rememberChecked});
};
setPreference = (pref: string, clearIfNotChecked?: boolean) => {
@ -201,16 +201,6 @@ export default class LinkingLandingPage extends PureComponent<Props, State> {
this.setState({brandImageError: true});
};
renderCheckboxIcon = () => {
if (this.state.rememberChecked) {
return (
<CheckboxCheckedIcon/>
);
}
return null;
};
renderGraphic = () => {
const isMobile = UserAgent.isMobile();
@ -392,18 +382,18 @@ export default class LinkingLandingPage extends PureComponent<Props, State> {
/>
</a>
</div>
<div className='get-app__preference'>
<button
className={`get-app__checkbox ${this.state.rememberChecked ? 'checked' : ''}`}
onClick={this.handleChecked}
>
{this.renderCheckboxIcon()}
</button>
<label className='get-app__preference'>
<input
type='checkbox'
checked={this.state.rememberChecked}
className='get-app__checkbox'
onChange={this.handleChecked}
/>
<FormattedMessage
id='get_app.rememberMyPreference'
defaultMessage='Remember my preference'
/>
</div>
</label>
{this.renderDownloadLinkSection()}
</div>
);

20
webapp/channels/src/sass/routes/_get-app.scss
View File

@ -126,9 +126,10 @@
.get-app__preference {
display: flex;
margin-top: 23px;
cursor: pointer;
> span {
margin-top: -2px;
margin-top: 1px;
color: #000;
font-family: "Open Sans";
font-size: 16px;
@ -136,27 +137,12 @@
line-height: 22px;
opacity: 0.8;
}
}
.get-app__checkbox {
.get-app__checkbox {
width: 18px;
height: 18px;
padding: 0;
border: 2px solid $dark-gray;
border-radius: 3px;
margin-right: 7px;
background: none;
> * {
pointer-events: none;
}
&.checked {
border: 0;
svg {
fill: #145dbf;
}
}
}