updated pages with submitButton

This commit is contained in:
Abhinav-grd 2021-04-11 10:38:06 +05:30
parent 14ce450a16
commit 15ad43f674
6 changed files with 33 additions and 58 deletions

View file

@ -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={{

View file

@ -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>

View file

@ -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>

View file

@ -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,15 +89,10 @@ 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>

View file

@ -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>

View file

@ -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}>