feat: add expo plugin and update docs

tschoffelen · Apr 12, 2024 · ceb7cbd · ceb7cbd
1 parent d28a2a9
commit ceb7cbd
Show file tree

Hide file tree

Showing 5 changed files with 306 additions and 87 deletions.
diff --git a/docs/expo.md b/docs/expo.md
@@ -2,95 +2,33 @@
 
 These instructions are provided to help you configure your Expo app to work with this library. When using Expo there are two workflows: managed and bare. The instructions for each are slightly different.
 
-# IOS
-
 ## Bare Workflow
 
-See [iOS directions](https://github.com/includable/react-native-map-link#iOSPostInstall).
-
-## Managed Workflow
-
-Add the following to your Expo app's config file. This file is typically named `app.json`, `app.config.js`, or `app.config.ts`.
+### IOS
 
-```js
-"ios": {
-   "infoPlist": {
-      "LSApplicationQueriesSchemes": [
-        "comgooglemaps",
-        "citymapper",
-        "uber",
-        "lyft",
-        "transit",
-        "truckmap",
-        "waze",
-        "yandexnavi",
-        "moovit",
-        "yandextaxi",
-        "yandexmaps",
-        "kakaomap",
-        "tmap",
-        "szn-mapy",
-        "mapsme",
-        "osmandmaps",
-        "gett",
-        "nmap",
-        "dgis",
-        "lftgpas"
-      ]
-   }
-}
-```
+- See [iOS directions](https://github.com/includable/react-native-map-link#iOSPostInstall).
 
-# Android
-
-## Bare Workflow
+### Android
 
-See [Android directions](https://github.com/includable/react-native-map-link#androidPostInstall).
+- See [Android directions](https://github.com/includable/react-native-map-link#androidPostInstall).
 
 ## Managed Workflow
 
-Utilize the plugin system to add app `intent`s to Expo `prebuild` step.
-
-### 1. Create a plugin under `src/plugins` named `android-manifest.plugin.js`.
-
-### 2. Add the following code to the plugin file.
-
-```js
-const {withAndroidManifest} = require('@expo/config-plugins');
-
-const supportedApps = ['geo', 'waze'];
-const mapAppIntents = supportedApps.map((app) => {
-  return {
-    action: {
-      $: {'android:name': 'android.intent.action.VIEW'},
-    },
-    data: {
-      $: {'android:scheme': app},
-    },
-  };
-});
-
-module.exports = function androidManifestPlugin(config) {
-  return withAndroidManifest(config, async (config) => {
-    const androidManifest = config.modResults.manifest;
-    const existingIntent = androidManifest.queries[0].intent;
-
-    androidManifest.queries[0].intent = existingIntent.concat(mapAppIntents);
-
-    return config;
-  });
-};
-```
-
-### 3. Add the plugin to your app's config file to have it run during prebuild.
+Add the plugin to your app's config file (`app.json`, `app.config.js`, or `app.config.ts`) to have it run during prebuild.
 
 ```json
 {
-  "plugins": ["./src/plugins/android-manifest.plugin.js"]
+  "plugins": ["react-native-map-link"]
 }
 ```
 
-### 4. Confirm AndroidManifest.xml has been updated.
+## Rebuild your app
+
+**Don't forget to rebuild your app after making these changes.**
+
+You can usually do so by running `expo build`.
+
+Confirm AndroidManifest.xml has been updated.
 
 ```xml
 <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.example.app">
@@ -108,12 +46,6 @@ module.exports = function androidManifestPlugin(config) {
 </manifest>
 ```
 
-## Rebuild your app
-
-**Don't forget to rebuild your app after making these changes.**
-
-You can usually do so by running `expo build`.
-
 Also note that this will only work when building your
 own [standalone app](https://docs.expo.io/versions/latest/distribution/building-standalone-apps), not when starting your
 app through the Expo app in the App Store.
diff --git a/package.json b/package.json
@@ -44,6 +44,7 @@
     "@babel/eslint-parser": "^7.23.10",
     "@babel/eslint-plugin": "^7.23.5",
     "@babel/runtime": "^7.23.9",
+    "@expo/config-plugins": "^7.8.4",
     "@react-native-community/eslint-config": "^3.2.0",
     "@types/jest": "^29.5.12",
     "@types/react": "^18.2.55",

diff --git a/src/app.plugin.js b/src/app.plugin.js
@@ -0,0 +1,52 @@
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const {withAndroidManifest, withInfoPlist} = require('@expo/config-plugins');
+
+const schemes = [
+  'comgooglemaps',
+  'citymapper',
+  'uber',
+  'lyft',
+  'transit',
+  'truckmap',
+  'waze',
+  'yandexnavi',
+  'moovit',
+  'yandextaxi',
+  'yandexmaps',
+  'kakaomap',
+  'tmap',
+  'szn-mapy',
+  'mapsme',
+  'osmandmaps',
+  'gett',
+  'nmap',
+  'dgis',
+  'lftgpas',
+];
+
+const intents = ['geo', 'waze'].map((app) => {
+  return {
+    action: {$: {'android:name': 'android.intent.action.VIEW'}},
+    data: {$: {'android:scheme': app}},
+  };
+});
+
+/**
+ * @type {import('@expo/config-plugins').ConfigPlugin}
+ */
+module.exports = function withReactNativeMapLink(config) {
+  // eslint-disable-next-line no-shadow
+  config = withAndroidManifest(config, async (config) => {
+    let intent = config.modResults.manifest.queries[0].intent ?? [];
+    // @ts-expect-error unnecessary type gymnastics
+    config.modResults.manifest.queries[0].intent = intent.concat(intents);
+    return config;
+  });
+
+  // eslint-disable-next-line no-shadow
+  return withInfoPlist(config, (config) => {
+    config.modResults.LSApplicationQueriesSchemes =
+      config.modResults.LSApplicationQueriesSchemes?.concat(schemes) ?? schemes;
+    return config;
+  });
+};
diff --git a/tsconfig.json b/tsconfig.json
@@ -3,6 +3,7 @@
     "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
     "allowJs": true,
+    "checkJs": true,
     "allowSyntheticDefaultImports": true,
     "declaration": true,
     "isolatedModules": true,