From dac977ff5299c91c1d5690183611620042869852 Mon Sep 17 00:00:00 2001 From: npcdazai Date: Wed, 9 Oct 2024 12:12:27 +0530 Subject: [PATCH] SideBar Fix --- src/Components/DataTable/NormalTable.jsx | 6 +- src/Layout/DefaultLayout.jsx | 7 +- src/Pages/Dashboard/Dashbaord.jsx | 1 - src/Pages/Onboarding/OnboardingFrame.jsx | 503 +++++++++++++---------- src/assets/company.png | Bin 0 -> 330 bytes src/assets/pfp.png | Bin 0 -> 588 bytes 6 files changed, 301 insertions(+), 216 deletions(-) create mode 100644 src/assets/company.png create mode 100644 src/assets/pfp.png diff --git a/src/Components/DataTable/NormalTable.jsx b/src/Components/DataTable/NormalTable.jsx index 43843c2..bf57644 100644 --- a/src/Components/DataTable/NormalTable.jsx +++ b/src/Components/DataTable/NormalTable.jsx @@ -63,9 +63,9 @@ const NormalTable = ({ ) : ( - - {total ? total : "Tanami v1.0.0"} - + {/* + {total ? total : "Optifii v1.0.0"} + */} {showRadioButton && ( diff --git a/src/Layout/DefaultLayout.jsx b/src/Layout/DefaultLayout.jsx index fbeaddf..d9e3c66 100644 --- a/src/Layout/DefaultLayout.jsx +++ b/src/Layout/DefaultLayout.jsx @@ -346,13 +346,12 @@ const DashboardLayout = ({ isOnline }) => { > {({ isActive }) => ( <> - {SubIcon && ( + {/* {SubIcon && ( - )} - {/* Blue Dot when submenu is active */} + )} */} {isActive && ( { - // Create a searchParams instance const [searchParams] = useSearchParams(); - const [ corpData, setCorpData ] = useState({}) + const [corpData, setCorpData] = useState({}); useEffect(() => { // Extract specific parameters if (searchParams) { - const codeCorporate = searchParams.get("code_corporate"); - const codeCorporateId = searchParams.get("code_corporateId"); - localStorage?.setItem('codeCorporate', codeCorporate) - localStorage?.setItem('codeCorporateId', codeCorporateId) + const codeCorporate = searchParams.get("code_corporate"); + const codeCorporateId = searchParams.get("code_corporateId"); + localStorage?.setItem("codeCorporate", codeCorporate); + localStorage?.setItem("codeCorporateId", codeCorporateId); } - }, [searchParams]) + }, [searchParams]); useEffect(() => { localStorage.setItem("corpData", JSON.stringify(corpData)); console.log(corpData); - }, [corpData]) + }, [corpData]); - // Modal state and disclosure hook - const { isOpen, onOpen, onClose } = useDisclosure(); + // Modal state and disclosure hook + const { isOpen, onOpen, onClose } = useDisclosure(); + const steps = [ + { + title: "Your details", + description: "Lorem ipsum dolor sit amet dolor", + icon: FaUser, + img: company, + }, + { + title: "About Company", + description: "Lorem ipsum dolor sit amet dolor", + icon: FaBuilding, + img: company, + }, + { + title: "Company details", + description: "Lorem ipsum dolor sit amet dolor", + icon: FaClipboard, + img: company, + }, + { + title: "Director details", + description: "Lorem ipsum dolor sit amet dolor", + icon: FaUserTie, + img: pfp, + }, + { + title: "Select package", + description: "Lorem ipsum dolor sit amet dolor", + icon: FaBoxOpen, + img: company, + }, + ]; - - const steps = [ - { title: 'Your details', description: 'Lorem ipsum dolor sit amet dolor', icon: FaUser }, - { title: 'About Company', description: 'Lorem ipsum dolor sit amet dolor', icon: FaBuilding }, - { title: 'Company details', description: 'Lorem ipsum dolor sit amet dolor', icon: FaClipboard }, - { title: 'Director details', description: 'Lorem ipsum dolor sit amet dolor', icon: FaUserTie }, - { title: 'Select package', description: 'Lorem ipsum dolor sit amet dolor', icon: FaBoxOpen }, - ]; - - -// Stepper configuration -const { activeStep, setActiveStep } = useSteps({ + // Stepper configuration + const { activeStep, setActiveStep } = useSteps({ index: 0, // Initialize the active step from localStorage or 0 count: steps.length, }); -// Function to handle the "Next" button click -const handleNext = () => { + // Function to handle the "Next" button click + const handleNext = () => { if (activeStep === steps.length - 1) { // If it's the last step, open the modal onOpen(); @@ -71,175 +117,216 @@ const handleNext = () => { // Otherwise, go to the next step const nextStep = activeStep + 1; setActiveStep(nextStep); - + // Store the new active step in localStorage localStorage.setItem("activeStep", nextStep); } }; - + // Array of components for each step + const stepComponents = [ + , + , + , + , + , + ]; - // Array of components for each step - const stepComponents = [ - , - , - , - , - - ]; - - - - return ( - - {/* Onboarding content */} - -
- + {/* Onboarding content */} + +
+ + {/* Stepper Box */} + + + + Lorem ipsum dolor sit amet, adipiscing elit. + + + + - {/* Stepper Box */} - - - - Lorem ipsum dolor sit amet, adipiscing elit. - - - - - {steps.map((step, index) => ( - - - } - incomplete={} - active={} - /> - - - - {step.title} - - - {step.description} - - - index ? "purple.500" : "purple.300"} - borderWidth={1} - /> - - ))} - - - - + {steps.map((step, index) => ( + + + } + incomplete={ + + } + active={ + + } + /> + + + + {step.title} + + + {step.description} + + + index ? "purple.500" : "purple.300" + } + borderWidth={1} + /> + + ))} + + + + - {/* Content Box */} - - + {/* Content Box */} + + + {/* Step Indicator (Horizontal) */} + + {steps.map((_, index) => ( + + ))} + + - {/* Step Indicator (Horizontal) */} - - {steps.map((_, index) => ( - - ))} - - + + + {/* Render the current step component */} + {stepComponents[activeStep]} - - - {/* Render the current step component */} - {stepComponents[activeStep]} - - {/* + {/* } @@ -267,16 +354,16 @@ const handleNext = () => { {activeStep === steps.length - 1 ? 'Next step' : 'Next step'} */} - - - - + - - {/* Modal for final step */} - + - ); + + + {/* Modal for final step */} + + + ); }; export default OnboardingFrame; diff --git a/src/assets/company.png b/src/assets/company.png new file mode 100644 index 0000000000000000000000000000000000000000..1bb6e745b17e1cfd09c189999e76952208824f0e GIT binary patch literal 330 zcmV-Q0k!^#P)Px$1W80eR5%fxlHqN_Fc5_q;cY-SXf_}llnr_~LF&IULYG5;9VIJOpN_*yL_sBz zm9y{e`Q7tdtsZ=)(_2!uq;l{@oUK0@hI&uWFKX`I$AxCO{Yg5SoaCL8sx93xZkn&Hnd5D5yfe$Ruv90YZX-~7Px%21!IgR7efARnc+6FbvHIiWg`{U<5|!2q8|t%LZhFW&_xOZon5;uySRDj=&1N z=R~Pu;$ZGt?u>0omfn*UIm_<+3c65fcw=)uSW+YBLrJc!G6yz4Mg9uX6X&uu?_QjHGfV#^0Qebb|E#%s6b`8`ih!DIaUV{OG z%{mpO&pDkxWS=_Q9Bjvx7CnngO*ZbmfOXVir~vIp>boS~q@;8dM?SETaAH#sFD8%p>Yh)?=i< zP0Ui;KnGj7SRYuG=qq{{x!tJM_~@o>roLRrTuJHk8+Jo=NV7CG#`g+pQ^%^KJgo&^cM%q@dhx7?Tt<-CAC;_0u znXVy@--@Yo-dHQ9)^MobU8FUo{{Teh|E9bu8L9)6MHKEu9?qV1@=Fw+PS^{BDk&Nw literal 0 HcmV?d00001