chore: split string tools ui

src/components/Loading.tsx

@@ -1,7 +1,7 @@
-import Typography from "@mui/material/Typography";
-import {useState} from "react";
-import Box from "@mui/material/Box";
-import {useTimeout} from "../hooks";
+import Typography from '@mui/material/Typography'
+import { useState } from 'react'
+import Box from '@mui/material/Box'
+import { useTimeout } from '../hooks'
 
 export type FuseLoadingProps = {
   delay?: number;
@@ -12,12 +12,12 @@ export type FuseLoadingProps = {
  * FuseLoading displays a loading state with an optional delay
  */
 function FuseLoading(props: FuseLoadingProps) {
-  const {delay = 0, className} = props;
-  const [showLoading, setShowLoading] = useState(!delay);
+  const { delay = 0, className } = props
+  const [showLoading, setShowLoading] = useState(!delay)
 
   useTimeout(() => {
-    setShowLoading(true);
-  }, delay);
+    setShowLoading(true)
+  }, delay)
 
   return (
     <div
@@ -26,22 +26,22 @@ function FuseLoading(props: FuseLoadingProps) {
         className="-mb-16 text-13 font-medium sm:text-20"
         color="text.secondary"
       >
-        Chargement
+        Loading
       </Typography>
       <Box
         id="spinner"
         sx={{
-          "& > div": {
-            backgroundColor: "palette.secondary.main",
-          },
+          '& > div': {
+            backgroundColor: 'palette.secondary.main'
+          }
         }}
       >
-        <div className="bounce1"/>
-        <div className="bounce2"/>
-        <div className="bounce3"/>
+        <div className="bounce1" />
+        <div className="bounce2" />
+        <div className="bounce3" />
       </Box>
     </div>
-  );
+  )
 }
 
-export default FuseLoading;
+export default FuseLoading