Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit a9e7ef1

Browse files
jryansdbkr
authored andcommitted
Add visible guest warning to encourage login
If you happen to get logged out, it might not be very clear what has happened visually. This adds a visible warning to the top of the home page to suggest logging in. Fixes element-hq/element-web#7629. Signed-off-by: J. Ryan Stinnett <[email protected]>
1 parent 3f8a3f7 commit a9e7ef1

File tree

4 files changed

+61
-0
lines changed

4 files changed

+61
-0
lines changed

res/css/structures/_HomePage.scss

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,3 +33,16 @@ limitations under the License.
3333
.mx_HomePage_body {
3434
// margin-left: 63px;
3535
}
36+
37+
.mx_HomePage_guest_warning {
38+
display: flex;
39+
background-color: $secondary-accent-color;
40+
border: 1px solid $accent-color;
41+
margin: 20px;
42+
padding: 20px 40px;
43+
border-radius: 5px;
44+
}
45+
46+
.mx_HomePage_guest_warning img {
47+
padding-right: 10px;
48+
}

src/components/structures/HomePage.js

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,8 @@ import request from 'browser-request';
2323
import { _t } from '../../languageHandler';
2424
import sanitizeHtml from 'sanitize-html';
2525
import sdk from '../../index';
26+
import { MatrixClient } from 'matrix-js-sdk';
27+
import dis from '../../dispatcher';
2628

2729
class HomePage extends React.Component {
2830
static displayName = 'HomePage';
@@ -37,6 +39,10 @@ class HomePage extends React.Component {
3739
homePageUrl: PropTypes.string,
3840
};
3941

42+
static contextTypes = {
43+
matrixClient: PropTypes.instanceOf(MatrixClient),
44+
};
45+
4046
state = {
4147
iframeSrc: '',
4248
page: '',
@@ -86,10 +92,47 @@ class HomePage extends React.Component {
8692
this._unmounted = true;
8793
}
8894

95+
onLoginClick() {
96+
dis.dispatch({ action: 'start_login' });
97+
}
98+
99+
onRegisterClick() {
100+
dis.dispatch({ action: 'start_registration' });
101+
}
102+
89103
render() {
104+
let guestWarning = "";
105+
if (this.context.matrixClient.isGuest()) {
106+
guestWarning = (
107+
<div className="mx_HomePage_guest_warning">
108+
<img src="img/warning.svg" width="24" height="23" />
109+
<div>
110+
<div>
111+
{ _t("You are currently using Riot anonymously as a guest.") }
112+
</div>
113+
<div>
114+
{ _t(
115+
'If you would like to create a Matrix account you can <a>register</a> now.',
116+
{},
117+
{ 'a': (sub) => <a href="#" onClick={this.onRegisterClick}>{ sub }</a> },
118+
) }
119+
</div>
120+
<div>
121+
{ _t(
122+
'If you already have a Matrix account you can <a>log in</a> instead.',
123+
{},
124+
{ 'a': (sub) => <a href="#" onClick={this.onLoginClick}>{ sub }</a> },
125+
) }
126+
</div>
127+
</div>
128+
</div>
129+
);
130+
}
131+
90132
if (this.state.iframeSrc) {
91133
return (
92134
<div className="mx_HomePage">
135+
{ guestWarning }
93136
<iframe src={ this.state.iframeSrc } />
94137
</div>
95138
);
@@ -98,6 +141,7 @@ class HomePage extends React.Component {
98141
const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper");
99142
return (
100143
<GeminiScrollbarWrapper autoshow={true} className="mx_HomePage">
144+
{ guestWarning }
101145
<div className="mx_HomePage_body" dangerouslySetInnerHTML={{ __html: this.state.page }}>
102146
</div>
103147
</GeminiScrollbarWrapper>

src/i18n/strings/en_EN.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -922,7 +922,9 @@
922922
"Username available": "Username available",
923923
"To get started, please pick a username!": "To get started, please pick a username!",
924924
"This will be your account name on the <span></span> homeserver, or you can pick a <a>different server</a>.": "This will be your account name on the <span></span> homeserver, or you can pick a <a>different server</a>.",
925+
"If you would like to create a Matrix account you can <a>register</a> now.": "If you would like to create a Matrix account you can <a>register</a> now.",
925926
"If you already have a Matrix account you can <a>log in</a> instead.": "If you already have a Matrix account you can <a>log in</a> instead.",
927+
"You are currently using Riot anonymously as a guest.": "You are currently using Riot anonymously as a guest.",
926928
"You have successfully set a password!": "You have successfully set a password!",
927929
"You have successfully set a password and an email address!": "You have successfully set a password and an email address!",
928930
"You can now return to your account after signing out, and sign in on other devices.": "You can now return to your account after signing out, and sign in on other devices.",

src/i18n/strings/en_US.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -644,7 +644,9 @@
644644
"Username not available": "Username not available",
645645
"Something went wrong!": "Something went wrong!",
646646
"This will be your account name on the <span></span> homeserver, or you can pick a <a>different server</a>.": "This will be your account name on the <span></span> homeserver, or you can pick a <a>different server</a>.",
647+
"If you would like to create a Matrix account you can <a>register</a> now.": "If you would like to create a Matrix account you can <a>register</a> now.",
647648
"If you already have a Matrix account you can <a>log in</a> instead.": "If you already have a Matrix account you can <a>log in</a> instead.",
649+
"You are currently using Riot anonymously as a guest.": "You are currently using Riot anonymously as a guest.",
648650
"Your browser does not support the required cryptography extensions": "Your browser does not support the required cryptography extensions",
649651
"Not a valid Riot keyfile": "Not a valid Riot keyfile",
650652
"Authentication check failed: incorrect password?": "Authentication check failed: incorrect password?",

0 commit comments

Comments
 (0)