From 69e902ac64ebec2cd9c6fab450dc7a363f22709b Mon Sep 17 00:00:00 2001 From: sshmatrix Date: Thu, 4 Jan 2024 09:27:02 +0530 Subject: [PATCH] v1.3-beta: cleanup --- components/Loading.tsx | 83 ++++++++++++++++++++++++++++++ components/LoadingColors.tsx | 38 -------------- components/LoadingLeaves.tsx | 53 ------------------- components/Preview.tsx | 8 +-- components/Stealth.tsx | 2 +- components/Ticker.tsx | 10 ++-- components/{Gas.tsx => WrapUp.tsx} | 8 +-- pages/account.tsx | 2 +- pages/index.tsx | 11 ++-- public/sw.js | 2 +- 10 files changed, 104 insertions(+), 113 deletions(-) create mode 100644 components/Loading.tsx delete mode 100644 components/LoadingColors.tsx delete mode 100644 components/LoadingLeaves.tsx rename components/{Gas.tsx => WrapUp.tsx} (96%) diff --git a/components/Loading.tsx b/components/Loading.tsx new file mode 100644 index 00000000..1c7b330a --- /dev/null +++ b/components/Loading.tsx @@ -0,0 +1,83 @@ +import React, { useState, useEffect } from "react" + +interface Props { + height: number, + width: number +} + +const ColorsLoadingIcon: React.FC = ({ height, width }) => { + + const svgString = ` + + + + + + + + + + + + + + + + + + + + + + + ` + + return
+} + +export const FlapLoadingIcon: React.FC = ({ height, width }) => { + const [flapStatus, setFlapStatus] = useState>([true, true, true, true]) + + useEffect(() => { + const flapInterval = setInterval(() => { + setFlapStatus((prevStatus) => { + const newStatus = [...prevStatus] + const indexOfFalse = newStatus.indexOf(false) + newStatus[indexOfFalse] = true + newStatus[(indexOfFalse + 1) % newStatus.length] = false + return newStatus + }) + }, 400) + + return () => clearInterval(flapInterval) + }, []) + + const svgString = ` + + + + + + + ` + + return
+} + +export default ColorsLoadingIcon diff --git a/components/LoadingColors.tsx b/components/LoadingColors.tsx deleted file mode 100644 index 324935f2..00000000 --- a/components/LoadingColors.tsx +++ /dev/null @@ -1,38 +0,0 @@ -import React, { useState, useEffect } from "react"; - -interface Props { - height: number, - width: number -} - -const ColorsLoadingIcon: React.FC = ({ height, width }) => { - - const svgString = ` - - - - - - - - - - - - - - - - - - - - - - - `; - - return
; -}; - -export default ColorsLoadingIcon; diff --git a/components/LoadingLeaves.tsx b/components/LoadingLeaves.tsx deleted file mode 100644 index bb7ec8ec..00000000 --- a/components/LoadingLeaves.tsx +++ /dev/null @@ -1,53 +0,0 @@ -import React, { useState, useEffect } from "react"; - -interface Props { - height: number, - width: number -} - -const FlapLoadingIcon: React.FC = ({ height, width }) => { - const [flapStatus, setFlapStatus] = useState>([true, true, true, true]); - - useEffect(() => { - const flapInterval = setInterval(() => { - setFlapStatus((prevStatus) => { - const newStatus = [...prevStatus]; - const indexOfFalse = newStatus.indexOf(false); - newStatus[indexOfFalse] = true; - newStatus[(indexOfFalse + 1) % newStatus.length] = false; - return newStatus; - }); - }, 400); - - return () => clearInterval(flapInterval); - }, []); - - const svgString = ` - - - - - - - `; - - return
; -}; - -export default FlapLoadingIcon; diff --git a/components/Preview.tsx b/components/Preview.tsx index 22aaa484..1abaaea7 100644 --- a/components/Preview.tsx +++ b/components/Preview.tsx @@ -12,8 +12,8 @@ import Gateway from '../components/Gateway' import Options from '../components/Options' import Error from '../components/Error' import Info from '../components/Info' -import Gas from '../components/Gas' -import Loading from '../components/LoadingColors' +import Savings from '../components/WrapUp' +import Loading from './Loading' import Success from '../components/Success' import Confirm from '../components/Confirm' import * as constants from '../utils/constants' @@ -3432,7 +3432,7 @@ const Preview: React.FC = ({ show, onClose, _ENS_, chain, handlePare > {success} - { @@ -3442,7 +3442,7 @@ const Preview: React.FC = ({ show, onClose, _ENS_, chain, handlePare show={gasModal} > {gas} - + = ({ variable, mobile }) => { +const GasTicker: React.FC = ({ variable, mobile }) => { return (