diff --git a/frontend/src/app/onboarding/page.tsx b/frontend/src/app/onboarding/page.tsx index 97cf031b..75f59cf3 100644 --- a/frontend/src/app/onboarding/page.tsx +++ b/frontend/src/app/onboarding/page.tsx @@ -1,91 +1,25 @@ 'use client'; -import { Button } from '@headlessui/react'; +import { Button, Checkbox } from '@headlessui/react'; import { useCallback, useState } from 'react'; import { ApiService } from '../../services/api'; -import { Loader } from 'lucide-react'; import Image from 'next/image'; +import { Disclaimer } from '../../components/common/Disclaimer'; +import { CheckIcon } from 'lucide-react'; export default function OnboardingPage() { - const [step, setStep] = useState(0); - const [transitioning, setTransitioning] = useState(false); - const [isLoading, setIsLoading] = useState(false); + const [accepted, setAccepted] = useState(false); const onboardUser = useCallback(async () => { - setIsLoading(true); ApiService.onboardUser() .then(() => { window.location.assign('/drive'); }) .catch((error) => { console.error(error); - }) - .finally(() => { - setIsLoading(false); }); }, []); - const nextStep = useCallback(() => { - setTransitioning(true); - setTimeout(() => { - setStep((a) => a + 1); - setTransitioning(false); - }, 300); // Match this duration with the CSS transition duration - }, []); - - const steps = [ -
- Welcome to Auto Drive - - Auto-Drive is a file storage and sharing service that allows you to - store and share files with others. - - -
, -
- Terms of Service - - Auto-Drive is public by default. - - - You can setup encryption but the encrypted file would - be public. - - -
, -
- Terms of Service - - Auto-Drive saves files in Autonomy's network so files{' '} - won't be able to be deleted by anyone. - - -
, - ]; - - const currentStep = steps[step]; - return (
@@ -94,12 +28,37 @@ export default function OnboardingPage() { Auto Drive
-
- {currentStep} +
+ +
+ setAccepted((e) => !e)} + className='group relative block size-4 rounded border bg-white data-[checked]:bg-blue-500' + > + + + + I have read and I accept the{' '} + + terms and conditions + + +
+
); diff --git a/frontend/src/components/common/Disclaimer.tsx b/frontend/src/components/common/Disclaimer.tsx index 17b75e6f..4424c7f6 100644 --- a/frontend/src/components/common/Disclaimer.tsx +++ b/frontend/src/components/common/Disclaimer.tsx @@ -2,14 +2,15 @@ export const Disclaimer = () => { return (

Please, note:

-
);