added start over button
This commit is contained in:
parent
79fcb20d5a
commit
c745820922
|
@ -5,6 +5,7 @@ import { motion } from 'framer-motion'
|
|||
import Image from 'next/image'
|
||||
import Axios from 'helpers/Axios'
|
||||
import { Alert, Button, Collapse, IconButton } from '@mui/material'
|
||||
import ReplayIcon from '@mui/icons-material/Replay';
|
||||
import CloseIcon from '@mui/icons-material/Close'
|
||||
import ContentCopyIcon from '@mui/icons-material/ContentCopy'
|
||||
import QRCode from 'qrcode'
|
||||
|
@ -67,8 +68,7 @@ function HomeSection(props) {
|
|||
}
|
||||
else {
|
||||
setdisabled(true)
|
||||
setTimeout(() => { setdisabled(false) }, 6000)
|
||||
setOpen(false)
|
||||
setTimeout(() => { setdisabled(false) }, 5000)
|
||||
let res
|
||||
try {
|
||||
res = await Axios.post(`/minify/add`, {
|
||||
|
@ -107,6 +107,11 @@ function HomeSection(props) {
|
|||
toast.success("URL copied to clipboard !!")
|
||||
}
|
||||
|
||||
const handleResponse = async () => {
|
||||
setOpen(false)
|
||||
props.setLongUrl('')
|
||||
}
|
||||
|
||||
const text1 = "Url";
|
||||
const text2 = "MiniFy";
|
||||
|
||||
|
@ -163,7 +168,7 @@ function HomeSection(props) {
|
|||
{
|
||||
// show QR code if a url is generated
|
||||
props.showQrCode && open ? (
|
||||
<motion.div initial={{ y: -20, opacity: 0 }} animate={{ y: 0, opacity: 1, transition: { ease: 'easeInOut', duration: 1 } }} style={QR}>
|
||||
<motion.div initial={{ y: -20, opacity: 0 }} animate={{ y: 0, opacity: 1, transition: { ease: 'easeInOut', duration: 0.7 } }} style={QR}>
|
||||
<Image
|
||||
src={props.qrData}
|
||||
placeholder="blur"
|
||||
|
@ -204,6 +209,15 @@ function HomeSection(props) {
|
|||
<ContentCopyIcon />
|
||||
</IconButton>
|
||||
</Alert>
|
||||
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
||||
<Button
|
||||
variant="contained"
|
||||
component={motion.div}
|
||||
whileHover={{ scale: 1.1, transition: { ease: 'easeOut' } }}
|
||||
whileTap={{ scale: 0.8, transition: { ease: 'easeOut' } }}
|
||||
sx={{ background: '#D82148', boxShadow: 'inset 0 -5px 0 0 #470D21', marginTop: '10px', gap: '10px', borderRadius: '20px', padding: '10px 25px 13px', '&:hover': { background: '#F90716', boxShadow: 'inset 0 -5px 0 0 #470D21' } }}
|
||||
onClick={handleResponse}><ReplayIcon />Start Over</Button>
|
||||
</div>
|
||||
</Collapse>
|
||||
<Toaster position="bottom-right" toastOptions={{ duration: 2500, style: { padding: '5px 10px', borderRadius: '30px', fontWeight: 'bold', fontSize: '14px' } }} />
|
||||
</HomeSectionStyle>
|
||||
|
|
|
@ -31,6 +31,7 @@
|
|||
"react-bootstrap": "^2.2.0",
|
||||
"react-dom": "17.0.2",
|
||||
"react-hot-toast": "^2.2.0",
|
||||
"react-icons": "^4.3.1",
|
||||
"react-page-loading": "^1.0.2",
|
||||
"styled-components": "^5.3.3",
|
||||
"styled-jsx": "^5.0.0"
|
||||
|
@ -2033,6 +2034,14 @@
|
|||
"react-dom": ">=16"
|
||||
}
|
||||
},
|
||||
"node_modules/react-icons": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.3.1.tgz",
|
||||
"integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ==",
|
||||
"peerDependencies": {
|
||||
"react": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/react-is": {
|
||||
"version": "17.0.2",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
|
||||
|
@ -3981,6 +3990,12 @@
|
|||
"goober": "^2.1.1"
|
||||
}
|
||||
},
|
||||
"react-icons": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.3.1.tgz",
|
||||
"integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ==",
|
||||
"requires": {}
|
||||
},
|
||||
"react-is": {
|
||||
"version": "17.0.2",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
|
||||
|
|
|
@ -32,6 +32,7 @@
|
|||
"react-bootstrap": "^2.2.0",
|
||||
"react-dom": "17.0.2",
|
||||
"react-hot-toast": "^2.2.0",
|
||||
"react-icons": "^4.3.1",
|
||||
"react-page-loading": "^1.0.2",
|
||||
"styled-components": "^5.3.3",
|
||||
"styled-jsx": "^5.0.0"
|
||||
|
|
|
@ -3,7 +3,7 @@ import Head from 'next/head'
|
|||
import HomeSection from 'components/HomeSection/HomeSection'
|
||||
import NavBar from 'components/NavBar'
|
||||
import Features from 'components/Features'
|
||||
import Toaster from 'react-hot-toast'
|
||||
|
||||
|
||||
export default function Home() {
|
||||
const [shortUrl, setShortUrl] = useState(null)
|
||||
|
|
|
@ -1208,6 +1208,11 @@
|
|||
dependencies:
|
||||
"goober" "^2.1.1"
|
||||
|
||||
"react-icons@^4.3.1":
|
||||
"integrity" "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ=="
|
||||
"resolved" "https://registry.npmjs.org/react-icons/-/react-icons-4.3.1.tgz"
|
||||
"version" "4.3.1"
|
||||
|
||||
"react-is@^16.13.1":
|
||||
"integrity" "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
|
||||
"resolved" "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
|
||||
|
@ -1258,6 +1263,14 @@
|
|||
"loose-envify" "^1.4.0"
|
||||
"prop-types" "^15.6.2"
|
||||
|
||||
"react@*", "react@^16.8.0 || ^17.0.0", "react@^16.8.0 || ^17.0.0-rc.1", "react@^17.0.0", "react@^17.0.2 || ^18.0.0-0", "react@>= 16.8.0", "react@>= 16.8.0 || 17.x.x || 18.x.x", "react@>=0.13", "react@>=0.14.0", "react@>=15.0.0", "react@>=16", "react@>=16.14.0", "react@>=16.6.0", "react@>=16.8 || ^17.0.0 || ^18.0.0", "react@>=16.8.0", "react@>=16.x", "react@17.0.2":
|
||||
"integrity" "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA=="
|
||||
"resolved" "https://registry.npmjs.org/react/-/react-17.0.2.tgz"
|
||||
"version" "17.0.2"
|
||||
dependencies:
|
||||
"loose-envify" "^1.1.0"
|
||||
"object-assign" "^4.1.1"
|
||||
|
||||
"react@^15.5.4", "react@^15.7.0", "react@>= 0.14.0 < 17.0.0-0":
|
||||
"integrity" "sha512-5/MMRYmpmM0sMTHGLossnJCrmXQIiJilD6y3YN3TzAwGFj6zdnMtFv6xmi65PHKRV+pehIHpT7oy67Sr6s9AHA=="
|
||||
"resolved" "https://registry.npmjs.org/react/-/react-15.7.0.tgz"
|
||||
|
@ -1269,14 +1282,6 @@
|
|||
"object-assign" "^4.1.0"
|
||||
"prop-types" "^15.5.10"
|
||||
|
||||
"react@^16.8.0 || ^17.0.0", "react@^16.8.0 || ^17.0.0-rc.1", "react@^17.0.0", "react@^17.0.2 || ^18.0.0-0", "react@>= 16.8.0", "react@>= 16.8.0 || 17.x.x || 18.x.x", "react@>=0.13", "react@>=0.14.0", "react@>=15.0.0", "react@>=16", "react@>=16.14.0", "react@>=16.6.0", "react@>=16.8 || ^17.0.0 || ^18.0.0", "react@>=16.8.0", "react@>=16.x", "react@17.0.2":
|
||||
"integrity" "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA=="
|
||||
"resolved" "https://registry.npmjs.org/react/-/react-17.0.2.tgz"
|
||||
"version" "17.0.2"
|
||||
dependencies:
|
||||
"loose-envify" "^1.1.0"
|
||||
"object-assign" "^4.1.1"
|
||||
|
||||
"regenerator-runtime@^0.13.4":
|
||||
"integrity" "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
|
||||
"resolved" "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz"
|
||||
|
|
Loading…
Reference in New Issue