beenull/ente
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

updated pages with submitButton

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/components/PassphraseForm.tsx
View file

@ -1,18 +1,12 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import Container from 'components/Container'; import Container from 'components/Container';
import styled from 'styled-components';
import Card from 'react-bootstrap/Card'; import Card from 'react-bootstrap/Card';
import Form from 'react-bootstrap/Form'; import Form from 'react-bootstrap/Form';
import Button from 'react-bootstrap/Button'; import Button from 'react-bootstrap/Button';
import constants from 'utils/strings/constants'; import constants from 'utils/strings/constants';
import { Formik, FormikHelpers } from 'formik'; import { Formik, FormikHelpers } from 'formik';
import { getData, LS_KEYS } from 'utils/storage/localStorage';
import { useRouter } from 'next/router';
import * as Yup from 'yup'; import * as Yup from 'yup';
import { KeyAttributes } from 'types'; import SubmitButton from './SubmitButton';
import CryptoWorker, { setSessionKeys } from 'utils/crypto';
import { Spinner } from 'react-bootstrap';
import { propTypes } from 'react-bootstrap/esm/Image';
interface formValues { interface formValues {
passphrase: string; passphrase: string;
@ -83,13 +77,11 @@ export default function PassPhraseForm(props: Props) {
{errors.passphrase} {errors.passphrase}
</Form.Control.Feedback> </Form.Control.Feedback>
</Form.Group> </Form.Group>
<Button block type="submit" disabled={loading}> <SubmitButton
{loading ? ( buttonText={props.buttonText}
<Spinner animation="border" /> loading={loading}
) : ( />
props.buttonText
)}
</Button>
<br /> <br />
<div <div
style={{ style={{

19
src/components/PasswordForm.tsx
View file

@ -8,6 +8,7 @@ import { Formik, FormikHelpers } from 'formik';
import * as Yup from 'yup'; import * as Yup from 'yup';
import Button from 'react-bootstrap/Button'; import Button from 'react-bootstrap/Button';
import { Spinner } from 'react-bootstrap'; import { Spinner } from 'react-bootstrap';
import SubmitButton from './SubmitButton';
interface Props { interface Props {
callback: (passphrase: any, setFieldError: any) => Promise<void>; callback: (passphrase: any, setFieldError: any) => Promise<void>;
@ -80,7 +81,7 @@ function SetPassword(props: Props) {
onBlur={handleBlur('passphrase')} onBlur={handleBlur('passphrase')}
isInvalid={Boolean( isInvalid={Boolean(
touched.passphrase && touched.passphrase &&
errors.passphrase errors.passphrase
)} )}
autoFocus={true} autoFocus={true}
disabled={loading} disabled={loading}
@ -107,18 +108,10 @@ function SetPassword(props: Props) {
{errors.confirm} {errors.confirm}
</Form.Control.Feedback> </Form.Control.Feedback>
</Form.Group> </Form.Group>
<Button <SubmitButton
type="submit" buttonText={props.buttonText}
block loading={loading}
disabled={loading} />
style={{ marginTop: '28px' }}
>
{loading ? (
<Spinner animation="border" />
) : (
props.buttonText
)}
</Button>
</Form> </Form>
)} )}
</Formik> </Formik>

16
src/pages/_app.tsx
View file

@ -110,15 +110,15 @@ const GlobalStyles = createGlobalStyle`
background-size: cover; background-size: cover;
border: none; border: none;
} }
.btn-primary { .btn-success {
background: #2dc262; background: #2dc262;
border-color: #29a354; border-color: #29a354;
} }
.btn-primary:hover { .btn-success:hover ,.btn-success:focus .btn-success:active{
background-color: #29a354; background-color: #29a354;
border-color: #2dc262; border-color: #2dc262;
} }
.btn-primary:disabled { .btn-success:disabled {
background-color: #69b383; background-color: #69b383;
} }
.btn-outline-success { .btn-outline-success {
@ -129,13 +129,7 @@ const GlobalStyles = createGlobalStyle`
.btn-outline-success:hover { .btn-outline-success:hover {
background: #2dc262; background: #2dc262;
} }
.btn-outline-danger { .btn-outline-danger, .btn-outline-secondary, .btn-outline-primary{
border-width: 2px;
}
.btn-outline-secondary {
border-width: 2px;
}
.btn-outline-primary {
border-width: 2px; border-width: 2px;
} }
.card { .card {
@ -263,7 +257,7 @@ export default function App({ Component, pageProps, err }) {
</Navbar> </Navbar>
{loading ? ( {loading ? (
<Container> <Container>
<Spinner animation="border" role="status" variant="primary"> <Spinner animation="border" role="status" variant="success">
<span className="sr-only">Loading...</span> <span className="sr-only">Loading...</span>
</Spinner> </Spinner>
</Container> </Container>

14
src/pages/index.tsx
View file

@ -10,6 +10,7 @@ import * as Yup from 'yup';
import { getOtt } from 'services/userService'; import { getOtt } from 'services/userService';
import Container from 'components/Container'; import Container from 'components/Container';
import { setData, LS_KEYS, getData } from 'utils/storage/localStorage'; import { setData, LS_KEYS, getData } from 'utils/storage/localStorage';
import SubmitButton from 'components/SubmitButton';
interface formValues { interface formValues {
email: string; email: string;
} }
@ -88,15 +89,10 @@ export default function Home() {
{errors.email} {errors.email}
</FormControl.Feedback> </FormControl.Feedback>
</Form.Group> </Form.Group>
<Button <SubmitButton
variant="primary" buttonText={constants.LOGIN}
type="submit" loading={loading}
block />
disabled={loading}
style={{ marginBottom: '12px' }}
>
{constants.LOGIN}
</Button>
</Form> </Form>
)} )}
</Formik> </Formik>

14
src/pages/signup/index.tsx
View file

@ -11,6 +11,7 @@ import { getOtt } from 'services/userService';
import Container from 'components/Container'; import Container from 'components/Container';
import { setData, LS_KEYS, getData } from 'utils/storage/localStorage'; import { setData, LS_KEYS, getData } from 'utils/storage/localStorage';
import { DisclaimerContainer } from 'components/Container'; import { DisclaimerContainer } from 'components/Container';
import SubmitButton from 'components/SubmitButton';
interface FormValues { interface FormValues {
name: string; name: string;
@ -105,14 +106,11 @@ export default function Home() {
<DisclaimerContainer> <DisclaimerContainer>
{constants.DATA_DISCLAIMER} {constants.DATA_DISCLAIMER}
</DisclaimerContainer> </DisclaimerContainer>
<Button
variant="primary" <SubmitButton
type="submit" buttonText={constants.SUBMIT}
block loading={loading}
disabled={loading} />
>
{constants.SUBMIT}
</Button>
</Form> </Form>
)} )}
</Formik> </Formik>

8
src/pages/verify/index.tsx
View file

@ -17,6 +17,7 @@ import {
isTokenValid, isTokenValid,
} from 'services/userService'; } from 'services/userService';
import { setIsFirstLogin } from 'utils/storage'; import { setIsFirstLogin } from 'utils/storage';
import SubmitButton from 'components/SubmitButton';
const Image = styled.img` const Image = styled.img`
width: 350px; width: 350px;
@ -145,9 +146,10 @@ export default function Verify() {
{errors.ott} {errors.ott}
</Form.Control.Feedback> </Form.Control.Feedback>
</Form.Group> </Form.Group>
<Button type="submit" block disabled={loading}> <SubmitButton
{constants.VERIFY} buttonText={constants.VERIFY}
</Button> loading={loading}
/>
<br /> <br />
{resend === 0 && ( {resend === 0 && (
<a href="#" onClick={resendEmail}> <a href="#" onClick={resendEmail}>