✨Update to Expo SDK 47 (#37)

* update expo with `expo upgrade` * update to use new `routes/settings/EditProfile.tsx` types
bnussman · Nov 11, 2022 · b358e3b · b358e3b
1 parent c7edfab
commit b358e3b
Show file tree

Hide file tree

Showing 7 changed files with 1,079 additions and 660 deletions.
diff --git a/app/babel.config.js b/app/babel.config.js
@@ -2,6 +2,9 @@ module.exports = function (api) {
   api.cache(true);
   return {
     presets: ["babel-preset-expo"],
-    plugins: ["react-native-reanimated/plugin"],
+    plugins: [
+      "@babel/plugin-proposal-export-namespace-from",
+      "react-native-reanimated/plugin",
+    ],
   };
 };
diff --git a/app/package.json b/app/package.json
@@ -20,48 +20,49 @@
     "@react-navigation/native": "^6.0.11",
     "@react-navigation/stack": "^6.2.2",
     "apollo-upload-client": "^17.0.0",
-    "expo": "^46.0.0",
-    "expo-device": "~4.3.0",
-    "expo-image-picker": "~13.3.1",
-    "expo-linear-gradient": "~11.4.0",
-    "expo-linking": "~3.2.2",
-    "expo-location": "~14.3.0",
-    "expo-notifications": "~0.16.1",
-    "expo-splash-screen": "~0.16.1",
-    "expo-status-bar": "~1.4.0",
-    "expo-task-manager": "~10.3.0",
-    "expo-updates": "~0.14.4",
+    "expo": "^47.0.0",
+    "expo-device": "~5.0.0",
+    "expo-image-picker": "~14.0.1",
+    "expo-linear-gradient": "~12.0.1",
+    "expo-linking": "~3.2.3",
+    "expo-location": "~15.0.1",
+    "expo-notifications": "~0.17.0",
+    "expo-splash-screen": "~0.17.4",
+    "expo-status-bar": "~1.4.2",
+    "expo-task-manager": "~11.0.1",
+    "expo-updates": "~0.15.4",
     "graphql": "^15.6.1",
     "graphql-ws": "^5.11.2",
     "native-base": "3.4.12-alpha.1",
-    "react": "18.0.0",
-    "react-dom": "18.0.0",
+    "react": "18.1.0",
+    "react-dom": "18.1.0",
     "react-hook-form": "^7.39.1",
-    "react-native": "0.69.4",
-    "react-native-gesture-handler": "~2.5.0",
+    "react-native": "0.70.5",
+    "react-native-gesture-handler": "~2.8.0",
     "react-native-keyboard-aware-scroll-view": "^0.9.5",
     "react-native-maps": "0.31.1",
     "react-native-mime-types": "^2.3.0",
-    "react-native-reanimated": "~2.9.1",
-    "react-native-safe-area-context": "4.3.1",
-    "react-native-screens": "~3.15.0",
-    "react-native-svg": "12.3.0",
+    "react-native-reanimated": "~2.12.0",
+    "react-native-safe-area-context": "4.4.1",
+    "react-native-screens": "~3.18.0",
+    "react-native-svg": "13.4.0",
     "react-native-web": "~0.18.7",
     "sentry-expo": "~5.0.0",
     "styled-components": "^5.3.3",
     "styled-system": "^5.1.5"
   },
   "devDependencies": {
-    "@babel/core": "^7.18.6",
-    "@expo/webpack-config": "^0.17.0",
+    "@babel/core": "^7.19.3",
+    "@babel/plugin-proposal-export-namespace-from": "^7.18.9",
+    "@expo/webpack-config": "^0.17.2",
     "@graphql-codegen/cli": "^2.13.11",
     "@graphql-codegen/typescript": "^2.8.1",
     "@graphql-codegen/typescript-operations": "^2.5.6",
     "@graphql-codegen/typescript-react-apollo": "^3.3.6",
     "@types/apollo-upload-client": "^17.0.2",
-    "@types/react": "~18.0.20",
-    "@types/react-dom": "~18.0.0",
-    "@types/react-native": "~0.69.1",
+    "@types/react": "~18.0.24",
+    "@types/react-dom": "~18.0.8",
+    "@types/react-native": "~0.70.6",
     "@types/uuid": "^8.3.3",
     "@typescript-eslint/eslint-plugin": "^5.42.1",
     "@typescript-eslint/parser": "^5.42.1",

diff --git a/app/routes/auth/SignUp.tsx b/app/routes/auth/SignUp.tsx
@@ -13,6 +13,7 @@ import { Container } from "../../components/Container";
 import { Alert } from "../../utils/Alert";
 import { UserData } from "../../utils/useUser";
 import { Controller, useForm } from "react-hook-form";
+import { Avatar } from "../../components/Avatar";
 import {
   isValidationError,
   useValidationErrors,
@@ -30,7 +31,6 @@ import {
   InputGroup,
   InputLeftAddon,
 } from "native-base";
-import { Avatar } from "../../components/Avatar";
 
 const SignUp = gql`
   mutation SignUp($input: SignUpInput!) {
@@ -112,21 +112,21 @@ export function SignUpScreen() {
       base64: false,
     });
 
-    if (result.cancelled) {
+    if (result.canceled) {
       return;
     }
 
     if (!isMobile) {
-      const res = await fetch(result.uri);
+      const res = await fetch(result.assets[0].uri);
       const blob = await res.blob();
       const fileType = blob.type.split("/")[1];
       const file = new File([blob], "photo." + fileType);
       picture = file;
-      setPhoto(result);
+      setPhoto(result.assets[0]);
     } else {
-      if (!result.cancelled) {
-        setPhoto(result);
-        const file = generateRNFile(result.uri, "file.jpg");
+      if (!result.canceled) {
+        setPhoto(result.assets[0]);
+        const file = generateRNFile(result.assets[0].uri, "file.jpg");
         picture = file;
       }
     }

diff --git a/app/routes/cars/AddCar.tsx b/app/routes/cars/AddCar.tsx
@@ -86,20 +86,20 @@ export function AddCar() {
       base64: false,
     });
 
-    if (result.cancelled) {
+    if (result.canceled) {
       return;
     }
 
-    setValue("photo", result);
+    setValue("photo", result.assets[0]);
 
     if (!isMobile) {
-      const res = await fetch(result.uri);
+      const res = await fetch(result.assets[0].uri);
       const blob = await res.blob();
       const fileType = blob.type.split("/")[1];
       const file = new File([blob], "photo." + fileType);
       picture = file;
     } else {
-      const file = generateRNFile(result.uri, "file.jpg");
+      const file = generateRNFile(result.assets[0].uri, "file.jpg");
       picture = file;
     }
   };

diff --git a/app/routes/settings/EditProfile.tsx b/app/routes/settings/EditProfile.tsx
@@ -199,24 +199,24 @@ export function EditProfileScreen() {
       base64: false,
     });
 
-    if (result.cancelled) {
+    if (result.canceled) {
       return;
     }
 
     let picture;
 
     if (!isMobile) {
-      const res = await fetch(result.uri);
+      const res = await fetch(result.assets[0].uri);
       const blob = await res.blob();
       const fileType = blob.type.split("/")[1];
       const file = new File([blob], "photo." + fileType);
       picture = file;
-      setPhoto(result);
+      setPhoto(result.assets[0]);
     } else {
-      if (!result.cancelled) {
-        setPhoto(result);
-        const fileType = result.uri.split(".")[1];
-        const file = generateRNFile(result.uri, `file.${fileType}`);
+      if (!result.canceled) {
+        setPhoto(result.assets[0]);
+        const fileType = result.assets[0].uri.split(".")[1];
+        const file = generateRNFile(result.assets[0].uri, `file.${fileType}`);
         picture = file;
       }
     }

diff --git a/app/utils/Apollo.ts b/app/utils/Apollo.ts
@@ -13,7 +13,7 @@ import {
   split,
 } from "@apollo/client";
 
-const ip = "192.168.1.181";
+const ip = "localhost";
 
 const wsUrl = __DEV__
   ? `ws://${ip}:3001/subscriptions`