Merge branch 'master' into dedupe-upload
This commit is contained in:
commit
4f9e0bd66f
|
@ -1,18 +1,12 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import Container from 'components/Container';
|
||||
import styled from 'styled-components';
|
||||
import Card from 'react-bootstrap/Card';
|
||||
import Form from 'react-bootstrap/Form';
|
||||
import Button from 'react-bootstrap/Button';
|
||||
import constants from 'utils/strings/constants';
|
||||
import { Formik, FormikHelpers } from 'formik';
|
||||
import { getData, LS_KEYS } from 'utils/storage/localStorage';
|
||||
import { useRouter } from 'next/router';
|
||||
import * as Yup from 'yup';
|
||||
import { KeyAttributes } from 'types';
|
||||
import CryptoWorker, { setSessionKeys } from 'utils/crypto';
|
||||
import { Spinner } from 'react-bootstrap';
|
||||
import { propTypes } from 'react-bootstrap/esm/Image';
|
||||
import SubmitButton from './SubmitButton';
|
||||
|
||||
interface formValues {
|
||||
passphrase: string;
|
||||
|
@ -83,13 +77,11 @@ export default function PassPhraseForm(props: Props) {
|
|||
{errors.passphrase}
|
||||
</Form.Control.Feedback>
|
||||
</Form.Group>
|
||||
<Button block type="submit" disabled={loading}>
|
||||
{loading ? (
|
||||
<Spinner animation="border" />
|
||||
) : (
|
||||
props.buttonText
|
||||
)}
|
||||
</Button>
|
||||
<SubmitButton
|
||||
buttonText={props.buttonText}
|
||||
loading={loading}
|
||||
/>
|
||||
|
||||
<br />
|
||||
<div
|
||||
style={{
|
||||
|
|
|
@ -8,6 +8,7 @@ import { Formik, FormikHelpers } from 'formik';
|
|||
import * as Yup from 'yup';
|
||||
import Button from 'react-bootstrap/Button';
|
||||
import { Spinner } from 'react-bootstrap';
|
||||
import SubmitButton from './SubmitButton';
|
||||
|
||||
interface Props {
|
||||
callback: (passphrase: any, setFieldError: any) => Promise<void>;
|
||||
|
@ -80,7 +81,7 @@ function SetPassword(props: Props) {
|
|||
onBlur={handleBlur('passphrase')}
|
||||
isInvalid={Boolean(
|
||||
touched.passphrase &&
|
||||
errors.passphrase
|
||||
errors.passphrase
|
||||
)}
|
||||
autoFocus={true}
|
||||
disabled={loading}
|
||||
|
@ -107,18 +108,10 @@ function SetPassword(props: Props) {
|
|||
{errors.confirm}
|
||||
</Form.Control.Feedback>
|
||||
</Form.Group>
|
||||
<Button
|
||||
type="submit"
|
||||
block
|
||||
disabled={loading}
|
||||
style={{ marginTop: '28px' }}
|
||||
>
|
||||
{loading ? (
|
||||
<Spinner animation="border" />
|
||||
) : (
|
||||
props.buttonText
|
||||
)}
|
||||
</Button>
|
||||
<SubmitButton
|
||||
buttonText={props.buttonText}
|
||||
loading={loading}
|
||||
/>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
|
|
|
@ -165,7 +165,7 @@ export default function Sidebar(props: Props) {
|
|||
style={{
|
||||
cursor: 'pointer',
|
||||
color: '#F96C6C',
|
||||
marginTop: '30px',
|
||||
margin: '30px 0',
|
||||
}}
|
||||
onClick={() => props.setConfirmAction(CONFIRM_ACTION.LOGOUT)}
|
||||
>
|
||||
|
|
31
src/components/SubmitButton.tsx
Normal file
31
src/components/SubmitButton.tsx
Normal file
|
@ -0,0 +1,31 @@
|
|||
import React from 'react';
|
||||
import { Button, Spinner } from 'react-bootstrap';
|
||||
|
||||
interface Props {
|
||||
loading: boolean;
|
||||
buttonText: string;
|
||||
}
|
||||
const SubmitButton = ({ loading, buttonText }: Props) => (
|
||||
<Button
|
||||
variant="success"
|
||||
type="submit"
|
||||
block
|
||||
disabled={loading}
|
||||
style={{ padding: '0', height: '40px' }}
|
||||
>
|
||||
{loading ? (
|
||||
<Spinner
|
||||
as="span"
|
||||
style={{
|
||||
height: '35px',
|
||||
width: '35px',
|
||||
}}
|
||||
animation="border"
|
||||
/>
|
||||
) : (
|
||||
buttonText
|
||||
)}
|
||||
</Button>
|
||||
);
|
||||
|
||||
export default SubmitButton;
|
|
@ -110,15 +110,15 @@ const GlobalStyles = createGlobalStyle`
|
|||
background-size: cover;
|
||||
border: none;
|
||||
}
|
||||
.btn-primary {
|
||||
.btn-success {
|
||||
background: #2dc262;
|
||||
border-color: #29a354;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
.btn-success:hover ,.btn-success:focus .btn-success:active{
|
||||
background-color: #29a354;
|
||||
border-color: #2dc262;
|
||||
}
|
||||
.btn-primary:disabled {
|
||||
.btn-success:disabled {
|
||||
background-color: #69b383;
|
||||
}
|
||||
.btn-outline-success {
|
||||
|
@ -129,13 +129,7 @@ const GlobalStyles = createGlobalStyle`
|
|||
.btn-outline-success:hover {
|
||||
background: #2dc262;
|
||||
}
|
||||
.btn-outline-danger {
|
||||
border-width: 2px;
|
||||
}
|
||||
.btn-outline-secondary {
|
||||
border-width: 2px;
|
||||
}
|
||||
.btn-outline-primary {
|
||||
.btn-outline-danger, .btn-outline-secondary, .btn-outline-primary{
|
||||
border-width: 2px;
|
||||
}
|
||||
.card {
|
||||
|
@ -263,7 +257,7 @@ export default function App({ Component, pageProps, err }) {
|
|||
</Navbar>
|
||||
{loading ? (
|
||||
<Container>
|
||||
<Spinner animation="border" role="status" variant="primary">
|
||||
<Spinner animation="border" role="status" variant="success">
|
||||
<span className="sr-only">Loading...</span>
|
||||
</Spinner>
|
||||
</Container>
|
||||
|
|
|
@ -60,6 +60,7 @@ const Container = styled.div`
|
|||
width: 100%;
|
||||
flex-wrap: wrap;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 40px;
|
||||
|
||||
.pswp-thumbnail {
|
||||
display: inline-block;
|
||||
|
|
|
@ -10,6 +10,7 @@ import * as Yup from 'yup';
|
|||
import { getOtt } from 'services/userService';
|
||||
import Container from 'components/Container';
|
||||
import { setData, LS_KEYS, getData } from 'utils/storage/localStorage';
|
||||
import SubmitButton from 'components/SubmitButton';
|
||||
interface formValues {
|
||||
email: string;
|
||||
}
|
||||
|
@ -88,18 +89,14 @@ export default function Home() {
|
|||
{errors.email}
|
||||
</FormControl.Feedback>
|
||||
</Form.Group>
|
||||
<Button
|
||||
variant="primary"
|
||||
type="submit"
|
||||
block
|
||||
disabled={loading}
|
||||
style={{ marginBottom: '12px' }}
|
||||
>
|
||||
{constants.LOGIN}
|
||||
</Button>
|
||||
<SubmitButton
|
||||
buttonText={constants.LOGIN}
|
||||
loading={loading}
|
||||
/>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
<br />
|
||||
<Card.Link
|
||||
href="#"
|
||||
onClick={register}
|
||||
|
|
|
@ -11,6 +11,7 @@ import { getOtt } from 'services/userService';
|
|||
import Container from 'components/Container';
|
||||
import { setData, LS_KEYS, getData } from 'utils/storage/localStorage';
|
||||
import { DisclaimerContainer } from 'components/Container';
|
||||
import SubmitButton from 'components/SubmitButton';
|
||||
|
||||
interface FormValues {
|
||||
name: string;
|
||||
|
@ -105,14 +106,11 @@ export default function Home() {
|
|||
<DisclaimerContainer>
|
||||
{constants.DATA_DISCLAIMER}
|
||||
</DisclaimerContainer>
|
||||
<Button
|
||||
variant="primary"
|
||||
type="submit"
|
||||
block
|
||||
disabled={loading}
|
||||
>
|
||||
{constants.SUBMIT}
|
||||
</Button>
|
||||
|
||||
<SubmitButton
|
||||
buttonText={constants.SUBMIT}
|
||||
loading={loading}
|
||||
/>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
|
|
|
@ -17,6 +17,7 @@ import {
|
|||
isTokenValid,
|
||||
} from 'services/userService';
|
||||
import { setIsFirstLogin } from 'utils/storage';
|
||||
import SubmitButton from 'components/SubmitButton';
|
||||
|
||||
const Image = styled.img`
|
||||
width: 350px;
|
||||
|
@ -145,9 +146,10 @@ export default function Verify() {
|
|||
{errors.ott}
|
||||
</Form.Control.Feedback>
|
||||
</Form.Group>
|
||||
<Button type="submit" block disabled={loading}>
|
||||
{constants.VERIFY}
|
||||
</Button>
|
||||
<SubmitButton
|
||||
buttonText={constants.VERIFY}
|
||||
loading={loading}
|
||||
/>
|
||||
<br />
|
||||
{resend === 0 && (
|
||||
<a href="#" onClick={resendEmail}>
|
||||
|
|
Loading…
Reference in a new issue