From 2146d5ea03eef8ec21ac35bc527290fdeb24122f Mon Sep 17 00:00:00 2001 From: danidfra Date: Thu, 15 Aug 2024 14:16:37 -0300 Subject: [PATCH] Delete onboarding-wizard --- src/features/onboarding/onboarding-wizard.tsx | 119 -------------- .../steps/avatar-selection-step.tsx | 125 --------------- src/features/onboarding/steps/bio-step.tsx | 99 ------------ .../onboarding/steps/completed-step.tsx | 39 ----- .../steps/cover-photo-selection-step.tsx | 149 ------------------ .../onboarding/steps/display-name-step.tsx | 107 ------------- .../onboarding/steps/fediverse-step.tsx | 88 ----------- .../steps/suggested-accounts-step.tsx | 103 ------------ 8 files changed, 829 deletions(-) delete mode 100644 src/features/onboarding/onboarding-wizard.tsx delete mode 100644 src/features/onboarding/steps/avatar-selection-step.tsx delete mode 100644 src/features/onboarding/steps/bio-step.tsx delete mode 100644 src/features/onboarding/steps/completed-step.tsx delete mode 100644 src/features/onboarding/steps/cover-photo-selection-step.tsx delete mode 100644 src/features/onboarding/steps/display-name-step.tsx delete mode 100644 src/features/onboarding/steps/fediverse-step.tsx delete mode 100644 src/features/onboarding/steps/suggested-accounts-step.tsx diff --git a/src/features/onboarding/onboarding-wizard.tsx b/src/features/onboarding/onboarding-wizard.tsx deleted file mode 100644 index 43255894e..000000000 --- a/src/features/onboarding/onboarding-wizard.tsx +++ /dev/null @@ -1,119 +0,0 @@ -import clsx from 'clsx'; -import React from 'react'; -import ReactSwipeableViews from 'react-swipeable-views'; - -import { endOnboarding } from 'soapbox/actions/onboarding'; -import LandingGradient from 'soapbox/components/landing-gradient'; -import { HStack } from 'soapbox/components/ui'; -import { useAppDispatch, useFeatures } from 'soapbox/hooks'; - -import AvatarSelectionStep from './steps/avatar-selection-step'; -import BioStep from './steps/bio-step'; -import CompletedStep from './steps/completed-step'; -import CoverPhotoSelectionStep from './steps/cover-photo-selection-step'; -import DisplayNameStep from './steps/display-name-step'; -import FediverseStep from './steps/fediverse-step'; -import SuggestedAccountsStep from './steps/suggested-accounts-step'; - -const OnboardingWizard = () => { - const dispatch = useAppDispatch(); - const features = useFeatures(); - - const [currentStep, setCurrentStep] = React.useState(0); - - const handleSwipe = (nextStep: number) => { - setCurrentStep(nextStep); - }; - - const handlePreviousStep = () => { - setCurrentStep((prevStep) => Math.max(0, prevStep - 1)); - }; - - const handleNextStep = () => { - setCurrentStep((prevStep) => Math.min(prevStep + 1, steps.length - 1)); - }; - - const handleComplete = () => { - dispatch(endOnboarding()); - }; - - const steps = [ - , - , - , - , - , - ]; - - if (features.federating && !features.nostr) { - steps.push(); - } - - steps.push(); - - const handleKeyUp = ({ key }: KeyboardEvent): void => { - switch (key) { - case 'ArrowLeft': - handlePreviousStep(); - break; - case 'ArrowRight': - handleNextStep(); - break; - } - }; - - const handleDotClick = (nextStep: number) => { - setCurrentStep(nextStep); - }; - - React.useEffect(() => { - document.addEventListener('keyup', handleKeyUp); - - return () => { - document.removeEventListener('keyup', handleKeyUp); - }; - }, []); - - return ( -
- - -
-
- - {steps.map((step, i) => ( -
-
- {step} -
-
- ))} -
- - - {steps.map((_, i) => ( -
-
-
- ); -}; - -export default OnboardingWizard; diff --git a/src/features/onboarding/steps/avatar-selection-step.tsx b/src/features/onboarding/steps/avatar-selection-step.tsx deleted file mode 100644 index 785288014..000000000 --- a/src/features/onboarding/steps/avatar-selection-step.tsx +++ /dev/null @@ -1,125 +0,0 @@ -import clsx from 'clsx'; -import React from 'react'; -import { defineMessages, FormattedMessage } from 'react-intl'; - -import { patchMe } from 'soapbox/actions/me'; -import { endOnboarding } from 'soapbox/actions/onboarding'; -import { BigCard } from 'soapbox/components/big-card'; -import { Avatar, Button, Icon, Spinner, Stack } from 'soapbox/components/ui'; -import { useAppDispatch, useOwnAccount } from 'soapbox/hooks'; -import toast from 'soapbox/toast'; -import { isDefaultAvatar } from 'soapbox/utils/accounts'; -import resizeImage from 'soapbox/utils/resize-image'; - -import type { AxiosError } from 'axios'; - -const messages = defineMessages({ - error: { id: 'onboarding.error', defaultMessage: 'An unexpected error occurred. Please try again or skip this step.' }, -}); - -const AvatarSelectionStep = ({ onNext }: { onNext: () => void }) => { - const dispatch = useAppDispatch(); - const { account } = useOwnAccount(); - - const fileInput = React.useRef(null); - const [selectedFile, setSelectedFile] = React.useState(); - const [isSubmitting, setSubmitting] = React.useState(false); - const [isDisabled, setDisabled] = React.useState(true); - const isDefault = account ? isDefaultAvatar(account.avatar) : false; - - const openFilePicker = () => { - fileInput.current?.click(); - }; - - const handleFileChange = (event: React.ChangeEvent) => { - const maxPixels = 400 * 400; - const rawFile = event.target.files?.item(0); - - if (!rawFile) return; - - resizeImage(rawFile, maxPixels).then((file) => { - const url = file ? URL.createObjectURL(file) : account?.avatar as string; - - setSelectedFile(url); - setSubmitting(true); - - const formData = new FormData(); - formData.append('avatar', rawFile); - const credentials = dispatch(patchMe(formData)); - - Promise.all([credentials]).then(() => { - setDisabled(false); - setSubmitting(false); - onNext(); - }).catch((error: AxiosError) => { - setSubmitting(false); - setDisabled(false); - setSelectedFile(null); - - if (error.response?.status === 422) { - toast.error((error.response.data as any).error.replace('Validation failed: ', '')); - } else { - toast.error(messages.error); - } - }); - }).catch(console.error); - }; - - const handleComplete = () => { - dispatch(endOnboarding()); - }; - - return ( - } - subtitle={} - onClose={handleComplete} - > - -
- {account && ( - - )} - - {isSubmitting && ( -
- -
- )} - - - - -
- - - - - {isDisabled && ( - - )} - -
-
- ); -}; - -export default AvatarSelectionStep; diff --git a/src/features/onboarding/steps/bio-step.tsx b/src/features/onboarding/steps/bio-step.tsx deleted file mode 100644 index 30f9eb41b..000000000 --- a/src/features/onboarding/steps/bio-step.tsx +++ /dev/null @@ -1,99 +0,0 @@ -import React from 'react'; -import { defineMessages, FormattedMessage, useIntl } from 'react-intl'; - -import { patchMe } from 'soapbox/actions/me'; -import { endOnboarding } from 'soapbox/actions/onboarding'; -import { BigCard } from 'soapbox/components/big-card'; -import { Button, FormGroup, Stack, Textarea } from 'soapbox/components/ui'; -import { useAppDispatch, useOwnAccount } from 'soapbox/hooks'; -import toast from 'soapbox/toast'; - -import type { AxiosError } from 'axios'; - -const messages = defineMessages({ - bioPlaceholder: { id: 'onboarding.bio.placeholder', defaultMessage: 'Tell the world a little about yourself…' }, - error: { id: 'onboarding.error', defaultMessage: 'An unexpected error occurred. Please try again or skip this step.' }, -}); - -const BioStep = ({ onNext }: { onNext: () => void }) => { - const intl = useIntl(); - const dispatch = useAppDispatch(); - - const { account } = useOwnAccount(); - const [value, setValue] = React.useState(account?.source?.note ?? ''); - const [isSubmitting, setSubmitting] = React.useState(false); - const [errors, setErrors] = React.useState([]); - - const handleSubmit = () => { - setSubmitting(true); - - const credentials = dispatch(patchMe({ note: value })); - - Promise.all([credentials]) - .then(() => { - setSubmitting(false); - onNext(); - }).catch((error: AxiosError) => { - setSubmitting(false); - - if (error.response?.status === 422) { - setErrors([(error.response.data as any).error.replace('Validation failed: ', '')]); - } else { - toast.error(messages.error); - } - }); - }; - - const handleComplete = () => { - dispatch(endOnboarding()); - }; - - return ( - } - subtitle={} - onClose={handleComplete} - > - -
- } - labelText={} - errors={errors} - > -