diff --git a/types/src/store/pets.ts b/types/src/store/pets.ts index abbc9bc..6056ec1 100644 --- a/types/src/store/pets.ts +++ b/types/src/store/pets.ts @@ -24,6 +24,7 @@ export type PetDetails = { size: FieldOption; status: FieldOption; }; +export type PetDetailField = keyof PetDetails; export type PetAvatar = { uri?: string; }; @@ -42,44 +43,48 @@ export type PetPersonality = { export interface CatPersonality extends PetPersonality { declawed?: boolean; } +export type CatPersonalityField = keyof CatPersonality; export interface DogPersonality extends PetPersonality { houseTrained?: boolean; } +export type DogPersonalityField = keyof DogPersonality; export type PetCareplan = { feeding?: { activated: boolean; - quantity?: FieldOption; - frequency?: FieldOption; - specialInstructions?: string; + quantity?: FieldOption | null; + frequency?: FieldOption | null; + specialInstructions?: string | null; }; overnight?: { activated: boolean; - specialInstructions?: string; + specialInstructions?: string | null; }; medical?: { activated: boolean; - specialInstructions?: string; + specialInstructions?: string | null; }; specialNeeds?: { activated: boolean; - specialInstructions?: string; + specialInstructions?: string | null; }; additionalNotes?: { activated: boolean; - specialInstructions?: string; + specialInstructions?: string | null; }; }; export interface CatCarePlan extends PetCareplan { harness?: { activated: boolean; - comfortableHarness?: FieldOption; - specialInstructions?: string; + comfortableHarness?: FieldOption | null; + specialInstructions?: string | null; }; } +export type CatCareplanField = keyof CatCarePlan; export interface DogCarePlan extends PetCareplan { houseTraining?: { activated: boolean; - hasAccidents?: FieldOption; - specialInstructions?: string; + hasAccidents?: FieldOption | null; + specialInstructions?: string | null; }; } +export type DogCareplanField = keyof DogCarePlan; diff --git a/types/src/ui/atoms.ts b/types/src/ui/atoms.ts index a9887de..344bc18 100644 --- a/types/src/ui/atoms.ts +++ b/types/src/ui/atoms.ts @@ -20,8 +20,11 @@ import { } from '..'; export interface AccordianProps { + accordionDirty: boolean; + activeSections: number[]; + scrollTracker: (component: React.ReactNode, inputKey: string) => JSX.Element; sections: AccordionSection[]; - activeSection: number[]; + setAccordionDirty: (dirty: boolean) => void; setActiveSections: (indexes: number[]) => void; } @@ -117,11 +120,13 @@ export interface FieldCharacterCountProps { max: number; } -export interface FieldInputProps extends Omit { +export interface FieldInputProps + extends Omit { onChange: (text: string) => void; onSubmit?: () => void; size?: FieldSize; state?: FieldState; + value: string | undefined | null; } export interface LabelProps { @@ -218,5 +223,3 @@ export interface ToggleProps extends Omit { onChange: (value: boolean) => void; switchOn: boolean; } - - diff --git a/types/src/ui/molecules.ts b/types/src/ui/molecules.ts index a8de069..f372d77 100644 --- a/types/src/ui/molecules.ts +++ b/types/src/ui/molecules.ts @@ -54,7 +54,7 @@ export interface RadioGroupProps { label?: string; onBlur?: () => void; onChange: (item: FieldOption) => void; - value?: FieldOption; + value?: FieldOption | null; } export interface SelectProps extends FieldSelectProps { diff --git a/types/src/ui/templates.ts b/types/src/ui/templates.ts index 5e0da87..c5633e2 100644 --- a/types/src/ui/templates.ts +++ b/types/src/ui/templates.ts @@ -1,6 +1,8 @@ +import { ScrollView } from 'react-native'; import { FeatureNavigationProps } from './organisms'; export interface FeatureTemplateProps extends FeatureNavigationProps { bgColor?: string; paddingX?: string; + scrollRef?: (ref: ScrollView | null) => void; } diff --git a/ui/src/components/atoms/accordian/accordian.tsx b/ui/src/components/atoms/accordian/accordian.tsx index 3bae5ff..5dd8d98 100644 --- a/ui/src/components/atoms/accordian/accordian.tsx +++ b/ui/src/components/atoms/accordian/accordian.tsx @@ -12,16 +12,26 @@ import { HorizontalDivider } from '../horizontal-divider/horizontal-divider'; import { Switch } from '../switch/switch'; +import { useCallback } from 'react'; import * as RNCAccordian from 'react-native-collapsible/Accordion'; const CollapsibleAccordion = RNCAccordian.default; export const Accordian = ({ - activeSection, + accordionDirty, + activeSections, + scrollTracker, sections, + setAccordionDirty, setActiveSections, }: AccordianProps) => { + const handleDirty = useCallback(() => { + if (!accordionDirty) { + setAccordionDirty(true); + } + }, [accordionDirty, setAccordionDirty]); + // renders - const renderSectionHeader = (section: AccordionSection) => { + const renderSectionHeader = (section: AccordionSection, index: number) => { return ( {section.switch && ( - - section.switch ? ( - - ) : ( - - ) - } - /> + <> + {scrollTracker( + + section.switch ? ( + + ) : ( + + ) + } + />, + `${section.switch.fieldName}` + )} + )} renderSectionHeader(content, index)} renderContent={renderSectionContent} - onChange={(indexes: number[]) => setActiveSections(indexes)} + // onChange={setActiveSections} + onChange={(indexes) => { + handleDirty(); + setActiveSections(indexes); + }} // BLARG - import from tailwind config electricViolet[700] underlayColor={'#9525CB'} sectionContainerStyle={ruffwind` diff --git a/ui/src/components/atoms/bottomsheet/bottomsheet.tsx b/ui/src/components/atoms/bottomsheet/bottomsheet.tsx index 5e37198..3724956 100644 --- a/ui/src/components/atoms/bottomsheet/bottomsheet.tsx +++ b/ui/src/components/atoms/bottomsheet/bottomsheet.tsx @@ -1,7 +1,7 @@ import BottomSheet, { BottomSheetView } from '@gorhom/bottom-sheet'; import { ruffwind } from '@rufferal/tailwind'; import { BottomsheetProps } from '@rufferal/types'; -import React, { PropsWithChildren, useCallback, useRef } from 'react'; +import { PropsWithChildren, useRef } from 'react'; export const Bottomsheet = ({ animateOnMount = true, @@ -13,16 +13,16 @@ export const Bottomsheet = ({ // ref const bottomSheetRef = useRef(null); - // callbacks - const handleSheetChanges = useCallback((index: number) => { - console.log('handleSheetChanges', index); - }, []); + // // callbacks + // const handleSheetChanges = useCallback((index: number) => { + // console.log('handleSheetChanges', index); + // }, []); // renders return ( { - console.log('handleSheetChanges', index); - }, []); + // // BLARG:TODO: determine best way to replace or remove this + // const handleSheetChanges = useCallback((index: number) => { + // console.log('handleSheetChanges', index); + // }, []); // BLARG:TODO: how can I remove this? useEffect(() => { @@ -111,7 +111,7 @@ export const PhotoModal = ({ }, [handlePresentModalPress, modalPresent]); /* STYLES */ - const cameraPaddingX = `px-${moderateScaleTW(16)}` + const cameraPaddingX = `px-${moderateScaleTW(16)}`; let cameraPaddingY = `py-${verticalScaleTW(16)}`; switch (Platform.OS) { case 'android': @@ -148,15 +148,20 @@ export const PhotoModal = ({ style={ruffwind.style( `flex-1 bg-black`, cameraPaddingX, - cameraPaddingY, + cameraPaddingY )} > {permission?.granted ? ( - + setCameraView(false)} + onPress={toggleCameraFacing} > setCameraView(false)} > - + { const form = useForm({ resolver: yupResolver(petAvatarSchema), mode: 'onBlur', - defaultValues: defaults + defaultValues: defaults, }); const { control, @@ -65,7 +65,7 @@ export const CatAvatar = observer(({ navigation }: PageNavigationProps) => { navigation.navigate('Cat Details')} forwardNavigation={() => navigation.navigate('Cat Personality')} - forwardText="Skip" + forwardText={defaults?.uri ? 'Next' : 'Skip'} > @@ -104,7 +104,7 @@ export const CatAvatar = observer(({ navigation }: PageNavigationProps) => { )} > {error && } -