Page MenuHomePhabricator
Files F3296040

D3322.id10076.diff
No OneTemporary
Actions

D3322.id10076.diff
View Options

diff --git a/web/settings/account-settings.css b/web/settings/account-settings.css
--- a/web/settings/account-settings.css
+++ b/web/settings/account-settings.css
@@ -18,6 +18,9 @@
color: var(--account-settings-label);
border-bottom: 1px solid var(--border-color);
padding: 24px 16px 16px;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
}
.logoutContainer {
@@ -34,3 +37,13 @@
.username {
color: var(--fg);
}
+
+.button {
+ color: var(--account-button-color);
+ background-color: transparent;
+ font-size: var(--m-font-16);
+ border: none;
+ cursor: pointer;
+ line-height: var(--line-height-text);
+ white-space: nowrap;
+}
diff --git a/web/settings/account-settings.react.js b/web/settings/account-settings.react.js
--- a/web/settings/account-settings.react.js
+++ b/web/settings/account-settings.react.js
@@ -2,10 +2,20 @@
import * as React from 'react';
+import { logOut } from 'lib/actions/user-actions';
+import { preRequestUserStateSelector } from 'lib/selectors/account-selectors';
+import { useServerCall } from 'lib/utils/action-utils';
+
import { useSelector } from '../redux/redux-utils';
import css from './account-settings.css';
function AccountSettings(): React.Node {
+ const sendLogoutRequest = useServerCall(logOut);
+ const preRequestUserState = useSelector(preRequestUserStateSelector);
+ const logOutUser = React.useCallback(() => {
+ sendLogoutRequest(preRequestUserState);
+ }, [sendLogoutRequest, preRequestUserState]);
+
const currentUserInfo = useSelector(state => state.currentUserInfo);
if (!currentUserInfo || currentUserInfo.anonymous) {
return null;
@@ -22,6 +32,9 @@
<span className={css.logoutLabel}>{'Logged in as '}</span>
<span className={css.username}>{username}</span>
</p>
+ <button className={css.button} onClick={logOutUser}>
+ Log out
+ </button>
</li>
</ul>
</div>
diff --git a/web/theme.css b/web/theme.css
--- a/web/theme.css
+++ b/web/theme.css
@@ -109,4 +109,5 @@
--thread-menu-color-dangerous: var(--error-primary);
--thread-menu-color-dangerous-hover: var(--error-light-50);
--account-settings-label: var(--shades-black-60);
+ --account-button-color: var(--violet-dark-100);
}

File Metadata

Mime Type
text/plain
Expires
Mon, Nov 18, 12:33 AM (22 h, 6 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2532447
Default Alt Text
D3322.id10076.diff (2 KB)

Event Timeline