diff --git a/lib/utils/url-utils.js b/lib/utils/url-utils.js --- a/lib/utils/url-utils.js +++ b/lib/utils/url-utils.js @@ -14,6 +14,7 @@ +threadCreation?: boolean, +selectedUserList?: $ReadOnlyArray, +inviteSecret?: string, + +qrCode?: boolean, ... }; @@ -39,6 +40,7 @@ '(/|^)handle/invite/([a-zA-Z0-9]+)(/|$)', 'i', ); +const qrCodeLoginRegex = new RegExp('(/|^)qr-code(/|$)', 'i'); function infoFromURL(url: string): URLInfo { const yearMatches = yearRegex.exec(url); @@ -52,6 +54,7 @@ const threadPendingMatches = threadPendingRegex.exec(url); const threadCreateMatches = threadCreationRegex.exec(url); const inviteLinkMatches = inviteLinkRegex.exec(url); + const qrCodeLoginMatches = qrCodeLoginRegex.exec(url); const returnObj = {}; if (yearMatches) { @@ -88,6 +91,8 @@ returnObj.settings = 'account'; } else if (dangerZoneTest) { returnObj.settings = 'danger-zone'; + } else if (qrCodeLoginMatches) { + returnObj.qrCode = true; } return returnObj; } diff --git a/web/account/log-in-form.react.js b/web/account/log-in-form.react.js --- a/web/account/log-in-form.react.js +++ b/web/account/log-in-form.react.js @@ -16,6 +16,7 @@ import Button from '../components/button.react.js'; import OrBreak from '../components/or-break.react.js'; import { initOlm } from '../olm/olm-utils.js'; +import { updateNavInfoActionType } from '../redux/action-types.js'; import { setPrimaryIdentityKeys, setNotificationIdentityKeys, @@ -101,7 +102,14 @@ })(); }, [dispatch, notificationIdentityPublicKeys, primaryIdentityPublicKeys]); - const onQRCodeLoginButtonClick = React.useCallback(() => {}, []); + const onQRCodeLoginButtonClick = React.useCallback(() => { + dispatch({ + type: updateNavInfoActionType, + payload: { + loginMethod: 'qr-code', + }, + }); + }, [dispatch]); const QRCodeLoginButton = React.useMemo(() => { if (!isDev) { diff --git a/web/account/qr-code-login.react.js b/web/account/qr-code-login.react.js new file mode 100644 --- /dev/null +++ b/web/account/qr-code-login.react.js @@ -0,0 +1,9 @@ +// @flow + +import * as React from 'react'; + +function QrCodeLogin(): React.Node { + return
; +} + +export default QrCodeLogin; diff --git a/web/app.react.js b/web/app.react.js --- a/web/app.react.js +++ b/web/app.react.js @@ -32,6 +32,7 @@ import { infoFromURL } from 'lib/utils/url-utils.js'; import { WagmiENSCacheProvider, wagmiClient } from 'lib/utils/wagmi-utils.js'; +import QrCodeLogin from './account/qr-code-login.react.js'; import Calendar from './calendar/calendar.react.js'; import Chat from './chat/chat.react.js'; import { EditModalProvider } from './chat/edit-message-provider.js'; @@ -176,7 +177,7 @@ } else { content = ( <> - + {this.renderLoginPage()} {this.props.modals} ); @@ -210,6 +211,20 @@ onHeaderDoubleClick = () => electron?.doubleClickTopBar(); stopDoubleClickPropagation = electron ? e => e.stopPropagation() : null; + renderLoginPage() { + const { loginMethod } = this.props.navInfo; + + let loginPage; + + if (!loginMethod || loginMethod === 'form') { + loginPage = ; + } else if (loginMethod === 'qr-code') { + loginPage = ; + } + + return loginPage; + } + renderMainContent() { const mainContent = this.getMainContentWithSwitcher(); diff --git a/web/types/nav-types.js b/web/types/nav-types.js --- a/web/types/nav-types.js +++ b/web/types/nav-types.js @@ -14,6 +14,7 @@ import { tID, tShape } from 'lib/utils/validation-utils.js'; export type NavigationTab = 'calendar' | 'chat' | 'settings'; +export type LoginMethod = 'form' | 'qr-code'; const navigationTabValidator = t.enums.of(['calendar', 'chat', 'settings']); export type NavigationSettingsSection = 'account' | 'danger-zone'; @@ -34,6 +35,7 @@ +selectedUserList?: $ReadOnlyArray, +chatMode?: NavigationChatMode, +inviteSecret?: ?string, + +loginMethod?: LoginMethod, }; export const navInfoValidator: TInterface = tShape<$Exact>({ diff --git a/web/url-utils.js b/web/url-utils.js --- a/web/url-utils.js +++ b/web/url-utils.js @@ -72,6 +72,10 @@ } } + if (!loggedIn && navInfo.loginMethod === 'qr-code') { + newURL += `qr-code`; + } + return newURL; } @@ -147,6 +151,12 @@ newNavInfo.inviteSecret = urlInfo.inviteSecret; } + if (urlInfo.qrCode) { + newNavInfo.loginMethod = 'qr-code'; + } else { + newNavInfo.loginMethod = 'form'; + } + return newNavInfo; }