diff --git a/src/views/entry/login/Login.tsx b/src/views/entry/login/Login.tsx index a2556ea5..d1d3d090 100644 --- a/src/views/entry/login/Login.tsx +++ b/src/views/entry/login/Login.tsx @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { Card } from '../../../components/generic/Styled'; +import { Card, Separation } from '../../../components/generic/Styled'; import styled from 'styled-components'; import { LoginForm } from '../../../components/auth/NormalLogin'; import { ConnectLoginForm } from '../../../components/auth/ConnectLogin'; @@ -10,6 +10,8 @@ import { MultiButton, SingleButton, } from 'components/buttons/multiButton/MultiButton'; +import { Text } from 'views/other/OtherViews.styled'; +import { Link } from 'components/link/Link'; const ConnectTitle = styled.h1` width: 100%; @@ -44,20 +46,74 @@ export const LoginView = () => { ); + + const renderView = () => { + switch (isType) { + case 'login': + return ; + case 'connect': + return ( + + ); + default: + return ; + } + }; + + const renderText = () => { + switch (isType) { + case 'login': + return null; + case 'connect': + return ( + <> + + + To connect via LNDConnect paste the LNDConnectUrl + down below. + {' Find the url format specification '} + + here. + + + + + ); + default: + return ( + <> + + + To connect with your BTCPayServer instance you need + the connection JSON that they provide. + + + To access this JSON in your BPS instance, go to: + + + Server Settings > Services > gRPC server > Show QR + Code > QR Code Information > Open Config file + + + Then copy the complete JSON and paste it below. + + + + ); + } + }; + return (
{'How do you want to connect?'} {renderButtons()} - {isType === 'login' && ( - - )} - {isType === 'connect' && ( - - )} - {isType === 'btcpay' && ( - - )} + {renderText()} + {renderView()}
);