typing

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';

src/components/Dropdown/Dropdown.tsx

@@ -6,7 +6,7 @@ import styles from './styles';
 
 type DropdownProps<T extends string[]> = {
   options: T;
-  setValue: (value: T[number]) => any;
+  setValue: (value: T[number]) => unknown;
   value: string;
   displayValue?: (s: string) => string;
 };

src/components/SpeciesDisplay/SpeciesDisplay.tsx

@@ -97,7 +97,7 @@ export default function SpeciesDisplay({
           </View>
         )}
 
-        {speciesData.evegreen && (
+        {speciesData.evergreen && (
           <View style={styles.property}>
             <SvgLeaf />
             <Text style={styles.propertyText}>Evegreen</Text>

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);

src/components/TreeDisplay/TreeDisplay.tsx

@@ -113,7 +113,7 @@ export default function TreeDisplay({
           </View>
         )}
 
-        {treeData.species?.evegreen && (
+        {treeData.species?.evergreen && (
           <View style={styles.property}>
             <SvgLeaf />
             <Text style={styles.propertyText}>Evegreen</Text>

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) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={18}
-    height={18}
-    fill="none"
-    {...props}
-  >
+const SvgArrowRight = (props: SvgProps) => (
+  <Svg width={18} height={18} fill="none" {...props}>
     <Path
       stroke="#446127"
       strokeLinecap="round"

src/icons/Back.tsx

@@ -1,21 +1,15 @@
-import type { SVGProps } from 'react';
 import * as React from 'react';
+import Svg, { Path, SvgProps } from 'react-native-svg';
 
-const SvgBack = (props: SVGProps<SVGSVGElement>) => (
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={18}
-    height={16}
-    fill="none"
-    {...props}
-  >
-    <path
+const SvgBack = (props: SvgProps) => (
+  <Svg width={18} height={16} fill="none" {...props}>
+    <Path
       stroke="#fff"
       strokeLinecap="round"
       strokeLinejoin="round"
       strokeWidth={2.5}
       d="M7.442 14.69 1.33 8.087m0 0 6.113-6.603M1.33 8.087H16"
     />
-  </svg>
+  </Svg>
 );
 export default SvgBack;

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) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={34}
-    height={34}
-    fill="none"
-    {...props}
-  >
+const SvgBackArrow = (props: SvgProps) => (
+  <Svg width={34} height={34} fill="none" {...props}>
     <Circle
       cx={16.665}
       cy={17.087}

src/icons/Call.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 SvgCall = (props: any) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={29}
-    height={29}
-    fill="none"
-    {...props}
-  >
+const SvgCall = (props: SvgProps) => (
+  <Svg width={29} height={29} fill="none" {...props}>
     <Path
       fill="#446127"
       d="M26.068 22.361c0 .42-.093.852-.289 1.272s-.45.817-.784 1.19c-.566.63-1.189 1.085-1.893 1.377a5.7 5.7 0 0 1-2.25.443c-1.177 0-2.434-.28-3.761-.852s-2.654-1.341-3.97-2.31a33 33 0 0 1-3.784-3.267 33 33 0 0 1-3.22-3.814c-.945-1.33-1.707-2.66-2.26-3.979q-.832-1.995-.832-3.815c0-.793.139-1.552.416-2.252a5.4 5.4 0 0 1 1.327-1.948c.738-.735 1.546-1.097 2.4-1.097.323 0 .646.07.934.21.3.14.566.35.773.654l2.677 3.815c.208.291.358.56.462.816.104.245.161.49.161.712 0 .28-.08.56-.242.829a4 4 0 0 1-.646.828l-.877.922a.63.63 0 0 0-.185.466c0 .094.012.175.035.268.035.094.07.164.092.234.208.385.566.886 1.073 1.493.52.607 1.073 1.225 1.673 1.844.624.618 1.223 1.19 1.835 1.715.6.513 1.096.863 1.489 1.073.057.023.127.058.207.093a.8.8 0 0 0 .289.047c.196 0 .346-.07.473-.198l.877-.875c.288-.292.565-.514.83-.654.266-.163.531-.245.82-.245.219 0 .45.047.704.152s.519.257.807.455l3.82 2.741c.3.21.507.456.634.747.116.292.185.584.185.91"

src/icons/CallBig.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 SvgCallBig = (props: any) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={56}
-    height={55}
-    fill="none"
-    {...props}
-  >
+const SvgCallBig = (props: SvgProps) => (
+  <Svg width={56} height={55} fill="none" {...props}>
     <Path
       fill="#446127"
       d="M51.263 42.008c0 .816-.186 1.654-.583 2.47a9.3 9.3 0 0 1-1.587 2.31c-1.143 1.225-2.403 2.108-3.827 2.675-1.4.566-2.916.86-4.55.86-2.38 0-4.923-.543-7.606-1.653s-5.367-2.606-8.027-4.487a66.6 66.6 0 0 1-7.653-6.345 65 65 0 0 1-6.51-7.41c-1.913-2.582-3.453-5.166-4.573-7.726q-1.68-3.875-1.68-7.41c0-1.54.28-3.013.84-4.373.56-1.382 1.446-2.651 2.683-3.784 1.493-1.428 3.127-2.13 4.853-2.13.654 0 1.307.136 1.89.408a3.8 3.8 0 0 1 1.564 1.269l5.413 7.41c.42.566.723 1.087.933 1.585.21.476.327.952.327 1.383 0 .544-.164 1.087-.49 1.609-.303.52-.747 1.064-1.307 1.608l-1.773 1.79c-.257.25-.373.544-.373.907a2 2 0 0 0 .07.521c.07.181.14.317.186.453.42.748 1.143 1.722 2.17 2.9a78 78 0 0 0 3.384 3.58c1.26 1.202 2.473 2.312 3.71 3.332 1.213.997 2.216 1.677 3.01 2.084.116.046.256.114.42.182.186.068.373.09.583.09.397 0 .7-.136.957-.385l1.773-1.7c.583-.566 1.143-.996 1.68-1.268.536-.318 1.073-.476 1.657-.476.443 0 .91.09 1.423.294s1.05.499 1.633.884l7.723 5.325c.607.408 1.027.884 1.284 1.45.233.567.373 1.133.373 1.768"

src/icons/ContactSelected.tsx

@@ -1,13 +1,12 @@
 import * as React from 'react';
-import Svg, { Path } from 'react-native-svg';
+import Svg, { Path, SvgProps } from 'react-native-svg';
 
-const SvgContactSelected = (props: any) => (
+const SvgContactSelected = (props: SvgProps) => (
   <Svg width={30} height={31} fill="none" {...props}>
     <Path
       fill="#446127"
       d="M15 15.422a6.25 6.25 0 1 0 0-12.5 6.25 6.25 0 0 0 0 12.5M15 18.547c-6.262 0-11.362 4.2-11.362 9.375 0 .35.275.625.625.625h21.475c.35 0 .625-.275.625-.625 0-5.175-5.1-9.375-11.363-9.375"
     />
   </Svg>
 );
-
 export default SvgContactSelected;

src/icons/ContactUnselected.tsx

@@ -9,5 +9,4 @@ const SvgContactUnselected = (props: SvgProps) => (
     />
   </Svg>
 );
-
 export default SvgContactUnselected;

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) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={28}
-    height={28}
-    fill="none"
-    {...props}
-  >
+const SvgFacebook = (props: SvgProps) => (
+  <Svg width={28} height={28} fill="none" {...props}>
     <Path
       fill="#fff"
       d="M26.46 19.914c0 4.398-2.532 7.02-6.779 7.02h-1.388c-.642 0-1.166-.543-1.166-1.208v-6.972c0-.326.256-.604.571-.604l2.053-.037a.376.376 0 0 0 .339-.302l.408-2.307a.362.362 0 0 0-.35-.423l-2.485.036a.603.603 0 0 1-.595-.592l-.047-2.96c0-.194.152-.363.35-.363l2.8-.049a.35.35 0 0 0 .35-.362l-.046-2.9a.35.35 0 0 0-.35-.362l-3.15.048c-1.937.036-3.477 1.68-3.442 3.685l.059 3.323a.59.59 0 0 1-.572.616l-1.4.025a.35.35 0 0 0-.35.362l.035 2.296a.35.35 0 0 0 .35.362l1.4-.024c.327 0 .583.266.595.592l.105 6.888c.011.676-.514 1.232-1.167 1.232H9.905c-4.247 0-6.779-2.622-6.779-7.032V9.788c0-4.398 2.532-7.02 6.779-7.02h9.777c4.246 0 6.778 2.622 6.778 7.02z"

src/icons/HomeSelected.tsx

@@ -1,13 +1,12 @@
 import React from 'react';
-import Svg, { Path } from 'react-native-svg';
+import Svg, { Path, SvgProps } from 'react-native-svg';
 
-const SvgHomeSelected = (props: any) => (
+const SvgHomeSelected = (props: SvgProps) => (
   <Svg width={31} height={31} fill="none" {...props}>
     <Path
       fill="#446127"
       d="M15.769.662a1 1 0 0 0-1.3 0l-14.35 12.3v14.46a3 3 0 0 0 3 3h8a1 1 0 0 0 1-1v-6a3 3 0 1 1 6 0v6a1 1 0 0 0 1 1h8a3 3 0 0 0 3-3v-14.46z"
     />
   </Svg>
 );
-
 export default SvgHomeSelected;

src/icons/HomeUnselected.tsx

@@ -1,13 +1,12 @@
 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) => (
   <Svg width={30} height={31} fill="none" {...props}>
     <Path
       fill="#446127"
       d="m15 1.422.65-.76a1 1 0 0 0-1.3 0zm-14 12-.65-.76-.35.3v.46zm10 16v1a1 1 0 0 0 1-1zm8 0h-1a1 1 0 0 0 1 1zm10-16h1v-.46l-.35-.3zm-26 17h8v-2H3zm26.65-17.76-14-12-1.3 1.52 14 12zm-15.3-12-14 12 1.3 1.52 14-12zM12 29.422v-6h-2v6zm6-6v6h2v-6zm1 7h8v-2h-8zm11-3v-14h-2v14zm-30-14v14h2v-14zm15 7a3 3 0 0 1 3 3h2a5 5 0 0 0-5-5zm0-2a5 5 0 0 0-5 5h2a3 3 0 0 1 3-3zm12 12a3 3 0 0 0 3-3h-2a1 1 0 0 1-1 1zm-24-2a1 1 0 0 1-1-1H0a3 3 0 0 0 3 3z"
     />
   </Svg>
 );
-
 export default SvgHomeUnselected;

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) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={28}
-    height={28}
-    fill="none"
-    {...props}
-  >
+const SvgInstagram = (props: SvgProps) => (
+  <Svg width={28} height={28} fill="none" {...props}>
     <Path
       fill="#fff"
       d="M19.007 2.768H9.579c-4.095 0-6.536 2.622-6.536 7.02v10.114c0 4.41 2.441 7.032 6.536 7.032h9.417c4.095 0 6.536-2.622 6.536-7.02V9.788c.011-4.398-2.43-7.02-6.525-7.02m-4.714 16.771c-2.407 0-4.365-2.102-4.365-4.688s1.957-4.688 4.365-4.688 4.365 2.102 4.365 4.688-1.957 4.688-4.365 4.688m6.66-10.875a1.4 1.4 0 0 1-.236.4 1.3 1.3 0 0 1-.371.253 1.055 1.055 0 0 1-1.227-.254 1.4 1.4 0 0 1-.236-.399 1.3 1.3 0 0 1-.09-.459c0-.157.034-.314.09-.459.056-.157.135-.278.236-.399.259-.278.653-.41 1.013-.326a.7.7 0 0 1 .213.073.8.8 0 0 1 .203.108c.056.037.113.097.169.145.101.121.18.242.236.399.056.145.09.302.09.46 0 .156-.034.313-.09.458"

src/icons/Location.tsx

@@ -1,14 +1,8 @@
 import * as React from 'react';
-import Svg, { ClipPath, Defs, G, Path } from 'react-native-svg';
+import Svg, { ClipPath, Defs, G, Path, SvgProps } from 'react-native-svg';
 
-const SvgLocation = (props: any) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={29}
-    height={29}
-    fill="none"
-    {...props}
-  >
+const SvgLocation = (props: SvgProps) => (
+  <Svg width={29} height={29} fill="none" {...props}>
     <G clipPath="url(#location_svg__a)">
       <Path
         fill="#446127"

src/icons/LogOut.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 SvgLogOut = (props: any) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={24}
-    height={21}
-    fill="none"
-    {...props}
-  >
+const SvgLogOut = (props: SvgProps) => (
+  <Svg width={24} height={21} fill="none" {...props}>
     <Path
       stroke="#446127"
       strokeLinecap="round"

src/icons/Scanner.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 SvgScanBarcode = (props: any) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={37}
-    height={37}
-    fill="#446127"
-    {...props}
-  >
+const SvgScanBarcode = (props: SvgProps) => (
+  <Svg width={37} height={37} fill="#446127" {...props}>
     <Path
       fill="#446127"
       d="M3.083 15.031a1.165 1.165 0 0 1-1.156-1.156v-3.854c0-4.471 3.638-8.094 8.094-8.094h3.854c.632 0 1.156.524 1.156 1.156s-.524 1.157-1.156 1.157H10.02a5.783 5.783 0 0 0-5.782 5.78v3.855c0 .632-.524 1.156-1.156 1.156M33.917 15.031a1.165 1.165 0 0 1-1.157-1.156v-3.854a5.783 5.783 0 0 0-5.78-5.781h-3.855a1.165 1.165 0 0 1-1.156-1.157c0-.632.524-1.156 1.156-1.156h3.854c4.456 0 8.094 3.623 8.094 8.094v3.854c0 .632-.524 1.156-1.156 1.156M26.98 35.073h-2.313a1.165 1.165 0 0 1-1.157-1.156c0-.632.525-1.157 1.157-1.157h2.312a5.783 5.783 0 0 0 5.782-5.78v-2.313c0-.632.524-1.157 1.156-1.157s1.156.525 1.156 1.157v2.312c0 4.471-3.638 8.094-8.094 8.094M13.875 35.073H10.02c-4.456 0-8.094-3.623-8.094-8.094v-3.854c0-.632.524-1.156 1.156-1.156s1.156.524 1.156 1.156v3.854a5.783 5.783 0 0 0 5.782 5.781h3.854c.632 0 1.156.525 1.156 1.157s-.524 1.156-1.156 1.156"

src/icons/Search.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 SvgSearch = (props: any) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={30}
-    height={30}
-    fill="none"
-    {...props}
-  >
+const SvgSearch = (props: SvgProps) => (
+  <Svg width={30} height={30} fill="none" {...props}>
     <Path
       stroke="#4F4F4F"
       strokeLinecap="round"

src/icons/Sort.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 SvgSort = (props: any) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={23}
-    height={22}
-    fill="none"
-    {...props}
-  >
+const SvgSort = (props: SvgProps) => (
+  <Svg width={23} height={22} fill="none" {...props}>
     <Path
       stroke="#171717"
       strokeLinecap="round"

src/icons/Website.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 SvgGlobal = (props: any) => (
-  <Svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={29}
-    height={29}
-    fill="none"
-    {...props}
-  >
+const SvgGlobal = (props: SvgProps) => (
+  <Svg width={29} height={29} fill="none" {...props}>
     <Path
       fill="#446127"
       d="M14.564 27.518c-6.842 0-12.404-5.623-12.404-12.542S7.722 2.434 14.564 2.434s12.404 5.624 12.404 12.542-5.562 12.542-12.404 12.542m0-23.334c-5.885 0-10.673 4.842-10.673 10.792s4.788 10.792 10.673 10.792 10.673-4.842 10.673-10.792S20.45 4.184 14.564 4.184"