From a1fc240b8f484e0727918ae146ba62ab5901fac9 Mon Sep 17 00:00:00 2001 From: Chris Torres Date: Wed, 1 Jan 2025 20:42:15 -0800 Subject: [PATCH] typing --- App.tsx | 1 + src/components/Dropdown/Dropdown.tsx | 2 +- .../SpeciesDisplay/SpeciesDisplay.tsx | 2 +- src/components/ToggleSwitch/ToggleSwitch.tsx | 39 ++++++++++--------- src/components/TreeDisplay/TreeDisplay.tsx | 2 +- src/icons/ArrowRight.tsx | 12 ++---- src/icons/Back.tsx | 16 +++----- src/icons/BackArrow.tsx | 12 ++---- src/icons/Call.tsx | 12 ++---- src/icons/CallBig.tsx | 12 ++---- src/icons/ContactSelected.tsx | 5 +-- src/icons/ContactUnselected.tsx | 1 - src/icons/Facebook.tsx | 12 ++---- src/icons/HomeSelected.tsx | 5 +-- src/icons/HomeUnselected.tsx | 5 +-- src/icons/Instagram.tsx | 12 ++---- src/icons/Location.tsx | 12 ++---- src/icons/LogOut.tsx | 12 ++---- src/icons/Scanner.tsx | 12 ++---- src/icons/Search.tsx | 12 ++---- src/icons/Sort.tsx | 12 ++---- src/icons/Website.tsx | 12 ++---- src/icons/X.tsx | 12 ++---- src/icons/Youtube.tsx | 12 ++---- src/icons/index.ts | 4 -- src/screens/TreeSearch/TreeSearch.tsx | 31 ++++++++------- src/supabase/queries/trees.ts | 2 +- src/types/species.ts | 2 +- 28 files changed, 97 insertions(+), 188 deletions(-) delete mode 100644 src/icons/index.ts diff --git a/App.tsx b/App.tsx index 2514071..4e7deaa 100644 --- a/App.tsx +++ b/App.tsx @@ -1,3 +1,4 @@ +/* eslint-disable @typescript-eslint/no-explicit-any */ import React from 'react'; import { Text } from 'react-native'; import { GestureHandlerRootView } from 'react-native-gesture-handler'; diff --git a/src/components/Dropdown/Dropdown.tsx b/src/components/Dropdown/Dropdown.tsx index 5efbca8..1813034 100644 --- a/src/components/Dropdown/Dropdown.tsx +++ b/src/components/Dropdown/Dropdown.tsx @@ -6,7 +6,7 @@ import styles from './styles'; type DropdownProps = { options: T; - setValue: (value: T[number]) => any; + setValue: (value: T[number]) => unknown; value: string; displayValue?: (s: string) => string; }; diff --git a/src/components/SpeciesDisplay/SpeciesDisplay.tsx b/src/components/SpeciesDisplay/SpeciesDisplay.tsx index 756198b..8bd0e10 100644 --- a/src/components/SpeciesDisplay/SpeciesDisplay.tsx +++ b/src/components/SpeciesDisplay/SpeciesDisplay.tsx @@ -97,7 +97,7 @@ export default function SpeciesDisplay({ )} - {speciesData.evegreen && ( + {speciesData.evergreen && ( Evegreen diff --git a/src/components/ToggleSwitch/ToggleSwitch.tsx b/src/components/ToggleSwitch/ToggleSwitch.tsx index 8d362bf..dc0e2be 100644 --- a/src/components/ToggleSwitch/ToggleSwitch.tsx +++ b/src/components/ToggleSwitch/ToggleSwitch.tsx @@ -1,4 +1,4 @@ -import { useEffect, useRef, useState } from 'react'; +import { useCallback, useEffect, useRef, useState } from 'react'; import { Animated, LayoutRectangle, @@ -38,27 +38,30 @@ export default function ToggleSwitch({ const translateAnimation = useRef(new Animated.Value(40)).current; const scaleAnimation = useRef(new Animated.Value(0)).current; - const runAnimations = (newValue: boolean) => { - if (!trueLabelLayout || !falseLabelLayout) return; + const runAnimations = useCallback( + (newValue: boolean) => { + if (!trueLabelLayout || !falseLabelLayout) return; - Animated.timing(translateAnimation, { - duration: 100, - toValue: newValue - ? trueLabelLayout.x + trueLabelLayout.width / 2 - 2 - : falseLabelLayout.x + falseLabelLayout.width / 2 + 2, - useNativeDriver: true, - }).start(); - - Animated.timing(scaleAnimation, { - duration: 100, - toValue: (newValue ? trueLabelLayout.width : falseLabelLayout.width) ?? 0, - useNativeDriver: true, - }).start(); - }; + Animated.timing(translateAnimation, { + duration: 100, + toValue: newValue + ? trueLabelLayout.x + trueLabelLayout.width / 2 - 2 + : falseLabelLayout.x + falseLabelLayout.width / 2 + 2, + useNativeDriver: true, + }).start(); + Animated.timing(scaleAnimation, { + duration: 100, + toValue: + (newValue ? trueLabelLayout.width : falseLabelLayout.width) ?? 0, + useNativeDriver: true, + }).start(); + }, + [trueLabelLayout, falseLabelLayout, translateAnimation, scaleAnimation], + ); useEffect(() => { runAnimations(value); - }, [trueLabelLayout, falseLabelLayout]); + }, [trueLabelLayout, falseLabelLayout, value, runAnimations]); const handlePress = (newValue: boolean) => { runAnimations(newValue); diff --git a/src/components/TreeDisplay/TreeDisplay.tsx b/src/components/TreeDisplay/TreeDisplay.tsx index ad7483b..9c56bcc 100644 --- a/src/components/TreeDisplay/TreeDisplay.tsx +++ b/src/components/TreeDisplay/TreeDisplay.tsx @@ -113,7 +113,7 @@ export default function TreeDisplay({ )} - {treeData.species?.evegreen && ( + {treeData.species?.evergreen && ( Evegreen diff --git a/src/icons/ArrowRight.tsx b/src/icons/ArrowRight.tsx index 4b385c1..e14a0cc 100644 --- a/src/icons/ArrowRight.tsx +++ b/src/icons/ArrowRight.tsx @@ -1,14 +1,8 @@ import * as React from 'react'; -import Svg, { Path } from 'react-native-svg'; +import Svg, { Path, SvgProps } from 'react-native-svg'; -const SvgArrowRight = (props: any) => ( - +const SvgArrowRight = (props: SvgProps) => ( + ) => ( - - ( + + - + ); export default SvgBack; diff --git a/src/icons/BackArrow.tsx b/src/icons/BackArrow.tsx index c98ad47..958c21a 100644 --- a/src/icons/BackArrow.tsx +++ b/src/icons/BackArrow.tsx @@ -1,14 +1,8 @@ import * as React from 'react'; -import Svg, { Circle, Path } from 'react-native-svg'; +import Svg, { Circle, Path, SvgProps } from 'react-native-svg'; -const SvgBackArrow = (props: any) => ( - +const SvgBackArrow = (props: SvgProps) => ( + ( - +const SvgCall = (props: SvgProps) => ( + ( - +const SvgCallBig = (props: SvgProps) => ( + ( +const SvgContactSelected = (props: SvgProps) => ( ( /> ); - export default SvgContactSelected; diff --git a/src/icons/ContactUnselected.tsx b/src/icons/ContactUnselected.tsx index fb5631e..58656d7 100644 --- a/src/icons/ContactUnselected.tsx +++ b/src/icons/ContactUnselected.tsx @@ -9,5 +9,4 @@ const SvgContactUnselected = (props: SvgProps) => ( /> ); - export default SvgContactUnselected; diff --git a/src/icons/Facebook.tsx b/src/icons/Facebook.tsx index a141b7f..e137800 100644 --- a/src/icons/Facebook.tsx +++ b/src/icons/Facebook.tsx @@ -1,14 +1,8 @@ import * as React from 'react'; -import Svg, { Path } from 'react-native-svg'; +import Svg, { Path, SvgProps } from 'react-native-svg'; -const SvgFacebook = (props: any) => ( - +const SvgFacebook = (props: SvgProps) => ( + ( +const SvgHomeSelected = (props: SvgProps) => ( ( /> ); - export default SvgHomeSelected; diff --git a/src/icons/HomeUnselected.tsx b/src/icons/HomeUnselected.tsx index c5bf6f8..c43765b 100644 --- a/src/icons/HomeUnselected.tsx +++ b/src/icons/HomeUnselected.tsx @@ -1,7 +1,7 @@ import React from 'react'; -import Svg, { Path } from 'react-native-svg'; +import Svg, { Path, SvgProps } from 'react-native-svg'; -const SvgHomeUnselected = (props: any) => ( +const SvgHomeUnselected = (props: SvgProps) => ( ( /> ); - export default SvgHomeUnselected; diff --git a/src/icons/Instagram.tsx b/src/icons/Instagram.tsx index 991a800..7da9ca1 100644 --- a/src/icons/Instagram.tsx +++ b/src/icons/Instagram.tsx @@ -1,14 +1,8 @@ import * as React from 'react'; -import Svg, { Path } from 'react-native-svg'; +import Svg, { Path, SvgProps } from 'react-native-svg'; -const SvgInstagram = (props: any) => ( - +const SvgInstagram = (props: SvgProps) => ( + ( - +const SvgLocation = (props: SvgProps) => ( + ( - +const SvgLogOut = (props: SvgProps) => ( + ( - +const SvgScanBarcode = (props: SvgProps) => ( + ( - +const SvgSearch = (props: SvgProps) => ( + ( - +const SvgSort = (props: SvgProps) => ( + ( - +const SvgGlobal = (props: SvgProps) => ( + ( - +const SvgX = (props: SvgProps) => ( + ( - +const SvgYoutube = (props: SvgProps) => ( + ({ - species: item.species_name, - image_link: - item.image_link || 'https://example.com/placeholder.jpg', - stockCount: item.count, - height: item.height_ft, - shape: item.tree_shape, - litter: item.fruit_type, - water: item.water_amount, - california_native: item.ca_native, - evergreen: item.evergreen, - powerline_friendly: item.powerline_friendly, - root_damage_potential: item.root_damage_potential, - })); + const formattedData: TreeItem[] = data.map( + (item: Species & { count: number }) => ({ + species: item.name, + image_link: + item.image_link || 'https://example.com/placeholder.jpg', + stockCount: item.count, + height: item.height_ft, + shape: item.tree_shape, + litter: item.fruit_type, + water: item.water_amount, + california_native: item.ca_native, + evergreen: item.evergreen, + powerline_friendly: item.powerline_friendly, + root_damage_potential: item.root_damage_potential, + }), + ); setTrees(formattedData); } })(); diff --git a/src/supabase/queries/trees.ts b/src/supabase/queries/trees.ts index f891c23..8dce1a7 100644 --- a/src/supabase/queries/trees.ts +++ b/src/supabase/queries/trees.ts @@ -56,7 +56,7 @@ export async function removeMultipleTrees(treeIds: string[]) { } // Retrieves a JSON array of available tree species in the format: -// [{ "species_name": "Oak", "image_link": "https://example.com/oak.jpg", "count": 10 }, ...] +// [{ "name": "Oak", "image_link": "https://example.com/oak.jpg", "count": 10 }, ...] export async function getAvailableTreeSpecies() { const { data, error } = await supabase.rpc('get_available_tree_species'); diff --git a/src/types/species.ts b/src/types/species.ts index 4667b01..2e6827f 100644 --- a/src/types/species.ts +++ b/src/types/species.ts @@ -14,7 +14,7 @@ export type Species = { flower_color?: string; fruit_type?: TreeFruitType; water_amount?: TreeWaterAmount; - evegreen?: boolean; + evergreen?: boolean; powerline_friendly?: boolean; };