Skip to content

Commit

Permalink
self-closing jsx
Browse files Browse the repository at this point in the history
  • Loading branch information
@igormuba
igormuba committed Mar 30, 2024
1 parent 88d25a6 commit e5a7e18
Showing 1 changed file with 183 additions and 126 deletions.
309 changes: 183 additions & 126 deletions src/common/pages/sign-up.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -232,82 +232,101 @@ const SignUpPage = (props: Props | any) => {
Solana
</span>
</div> */}

</div>)}
<div className="account-sign-up">
{accountType === "Hive" &&
</div>
)}
<div className="account-sign-up">
{accountType === "Hive" && (
<>
{step == 1 && (<div className="sign-up">
<div className="the-form">
<div className="form-title">Create a Hive acoount</div>
<div className="form-sub-title">{_t("sign-up.description")}</div>

{(() => {
return (
<div className="form-content">
<Form
ref={form}
onSubmit={(e) => {
e.preventDefault();
e.stopPropagation();
if(error){
return;
}
setStep(2);
}}
>
<Form.Group className="d-flex flex-column">
{error && <span className="text-danger align-self-center mb-3">{error}</span>}
<Form.Control
type="text"
placeholder={_t("sign-up.username")}
value={username}
onChange={usernameChanged}
// autoFocus={true}
required={true}
onInvalid={(e: any) =>
handleInvalid(e, "sign-up.", "validation-username")
}
onInput={handleOnInput}
/>
</Form.Group>
<Form.Group>
<Form.Control
type="email"
placeholder={_t("sign-up.email")}
value={email}
onChange={emailChanged}
required={true}
onInvalid={(e: any) =>
handleInvalid(e, "sign-up.", "validation-email")
}
onInput={handleOnInput}
/>
</Form.Group>
<Form.Group>
<Form.Control
type="text"
placeholder={_t("sign-up.referral")}
value={referral}
onChange={referralChanged}
required={activeUser ? false : true}
onInvalid={(e: any) =>
handleInvalid(e, "sign-up.", "validation-referral")
{step == 1 && (
<div className="sign-up">
<div className="the-form">
<div className="form-title">Create a Hive acoount</div>
<div className="form-sub-title">
{_t("sign-up.description")}
</div>

{(() => {
return (
<div className="form-content">
<Form
ref={form}
onSubmit={(e) => {
e.preventDefault();
e.stopPropagation();
if (error) {
return;
}
onInput={handleOnInput}
/>
</Form.Group>
<div className="d-flex justify-content-center">
<Button
variant="primary"
block={true}
type="submit"
disabled={inProgress}
>
{inProgress && spinner} {_t("sign-up.submit")}
</Button>
</div>
</Form>
setStep(2);
}}
>
<Form.Group className="d-flex flex-column">
{error && (
<span className="text-danger align-self-center mb-3">
{error}
</span>
)}
<Form.Control
type="text"
placeholder={_t("sign-up.username")}
value={username}
onChange={usernameChanged}
// autoFocus={true}
required={true}
onInvalid={(e: any) =>
handleInvalid(
e,
"sign-up.",
"validation-username"
)
}
onInput={handleOnInput}
/>
</Form.Group>
<Form.Group>
<Form.Control
type="email"
placeholder={_t("sign-up.email")}
value={email}
onChange={emailChanged}
required={true}
onInvalid={(e: any) =>
handleInvalid(
e,
"sign-up.",
"validation-email"
)
}
onInput={handleOnInput}
/>
</Form.Group>
<Form.Group>
<Form.Control
type="text"
placeholder={_t("sign-up.referral")}
value={referral}
onChange={referralChanged}
required={activeUser ? false : true}
onInvalid={(e: any) =>
handleInvalid(
e,
"sign-up.",
"validation-referral"
)
}
onInput={handleOnInput}
/>
</Form.Group>
<div className="d-flex justify-content-center">
<Button
variant="primary"
block={true}
type="submit"
disabled={inProgress}
>
{inProgress && spinner} {_t("sign-up.submit")}
</Button>
</div>
</Form>

<div className="text-center">
{_t("sign-up.login-text-1")}
Expand Down Expand Up @@ -346,65 +365,103 @@ const SignUpPage = (props: Props | any) => {
<div className="account-link">
<h3>Step 1</h3>
<span>Download your keys to continue</span>
<Button className="mt-3" onClick={()=> downloadKeys()}>{_t("onboard.download-keys")} {downloadSvg}</Button>
<Button className="mt-3" onClick={() => downloadKeys()}>
{_t("onboard.download-keys")} {downloadSvg}
</Button>
</div>
{isDownloaded &&
<div className="account-link">
<h3>Step 2</h3>
{!activeUser && <h5 className="text-danger">{_t("onboard.copy-info-message")}</h5>}
{activeUser && <h5 className="text-danger">Click link below or scan QR code</h5>}
<div className="link-wrap">
<div>
{!activeUser ? <>
</> : <a href={`${window.origin}/onboard-friend/${urlHash}`}>{_t("onboard.click-link")}</a>}
</div>
<div
onClick={() => {
clipboard(`${window.origin}/onboard-friend/${urlHash}`);
success(_t("onboard.copy-link"))
}}
style={{
background: 'white',
padding: '16px',
cursor: "pointer"
}}
>
<QRCode
size={256}
style={{ height: "auto", maxWidth: "100%", width: "100%" }}
value={`${window.origin}/onboard-friend/${urlHash}`}
viewBox={`0 0 256 256`}
/>
{isDownloaded && (
<div className="account-link">
<h3>Step 2</h3>
{!activeUser && (
<h5 className="text-danger">
{_t("onboard.copy-info-message")}
</h5>
)}
{activeUser && (
<h5 className="text-danger">
Click link below or scan QR code
</h5>
)}
<div className="link-wrap">
<div>
{!activeUser ? (
<></>
) : (
<a
href={`${window.origin}/onboard-friend/${urlHash}`}
>
{_t("onboard.click-link")}
</a>
)}
</div>
<div
onClick={() => {
clipboard(
`${window.origin}/onboard-friend/${urlHash}`
);
success(_t("onboard.copy-link"));
}}
style={{
background: "white",
padding: "16px",
cursor: "pointer",
}}
>
<QRCode
size={256}
style={{
height: "auto",
maxWidth: "100%",
width: "100%",
}}
value={`${window.origin}/onboard-friend/${urlHash}`}
viewBox={`0 0 256 256`}
/>
</div>
</div>
</div>
<div className="account-password">
<h3>Step 3</h3>
<span>Confirm if your friend has created your account, then check your email for instructions on setting up your account and
<a className="ml-1" href="https://hive-keychain.com/" target="_blank" rel="noopener noreferrer">
download keychain extension here
</a>
</span>
<div className="d-flex">
</div>
<div className="d-flex flex-column align-items-center">
<h3>Step 4</h3>
<h4 className="text-danger">Copy your master password below and paste to keychain to set up your account</h4>
<div className="password">
<strong>{accountPassword}</strong>
<span className="icon" onClick={()=> {
clipboard(accountPassword)
success(_t("onboard.key-copied"))
}}>{copyContent}</span>
<div className="account-password">
<h3>Step 3</h3>
<span>
Confirm if your friend has created your account,
then check your email for instructions on setting
up your account and
<a
className="ml-1"
href="https://hive-keychain.com/"
target="_blank"
rel="noopener noreferrer"
>
download keychain extension here
</a>
</span>
<div className="d-flex" />
<div className="d-flex flex-column align-items-center">
<h3>Step 4</h3>
<h4 className="text-danger">
Copy your master password below and paste to
keychain to set up your account
</h4>
<div className="password">
<strong>{accountPassword}</strong>
<span
className="icon"
onClick={() => {
clipboard(accountPassword);
success(_t("onboard.key-copied"));
}}
>
{copyContent}
</span>
</div>
</div>
</div>
</div>
</div>
</div>
}
)}
</div>
</div>
)}
)}
</>
}
)}
{accountType === "Solana" && (
<>
<OffchainUser
Expand Down

0 comments on commit e5a7e18

Please sign in to comment.