Changing shadow lib in searchable picker and increasing height

src/app/components/SearchablePicker.js

@@ -6,6 +6,7 @@ import DropDownPicker from "react-native-dropdown-picker";
 import { Shadow } from "react-native-shadow-2";
 import { useFormikContext } from "formik";
 import { ErrorMessage } from "./forms";
+import defaultStyles from "../config/styles";
 
 function DropDown({
   value,
@@ -39,6 +40,8 @@ function DropDown({
         borderRadius: 6,
         borderColor: colors.grayBG,
         borderWidth: 1,
+        ...defaultStyles.shadow,
+        height: 58,
       }}
       textStyle={{
         color: colors.medium,
@@ -66,17 +69,15 @@ function SearchablePicker({
   marginRight = 2,
   marginLeft = 16,
 }) {
-
-  const { values, setFieldValue, errors, touched } = name ?  useFormikContext() : [1,1,1,1];
-  
+  const { values, setFieldValue, errors, touched } = name
+    ? useFormikContext()
+    : [1, 1, 1, 1];
 
   const [value, setValue] = useState(name ? values[name] : "");
 
   useEffect(() => {
-    if (name)
-      setFieldValue(name, value, true);
-    else
-      setSelected(value)
+    if (name) setFieldValue(name, value, true);
+    else setSelected(value);
   }, [value]);
 
   return (
@@ -86,25 +87,17 @@ function SearchablePicker({
         { marginLeft: marginLeft, marginRight: marginRight },
       ]}
     >
-      <Shadow
-        offset={[0, 3]}
-        distance={3}
-        radius={4}
-        startColor="rgba(0, 0, 0, 0.15)"
-        paintInside={true}
-      >
-        <DropDown
-          value={value}
-          setValue={setValue}
-          items={items}
-          setItems={setItems}
-          formPlaceholder={formPlaceholder}
-          searchPlaceholder={searchPlaceholder}
-          nothingToShow={nothingToShow}
-        />
-      </Shadow>
+      <DropDown
+        value={value}
+        setValue={setValue}
+        items={items}
+        setItems={setItems}
+        formPlaceholder={formPlaceholder}
+        searchPlaceholder={searchPlaceholder}
+        nothingToShow={nothingToShow}
+      />
 
-      {name && (<ErrorMessage error={errors[name]} visible={touched[name]} />)}
+      {name && <ErrorMessage error={errors[name]} visible={touched[name]} />}
     </View>
   );
 }