React-Native & Expo support for alternative workspace.packages folders (

#4)

* new wrapper bp-request

* removed expo/metro-config from rnative

* minor refactor in metro.config.js

* support for extra folder

* update xpo project to use simiilar config

apps/rnative/App.tsx

@@ -19,7 +19,7 @@ import {
   View,
 } from 'react-native';
 import {Button} from 'ui-native';
-import axios from 'axios';
+import * as requestWrapper from 'bp-request';
 import {
   Colors,
   DebugInstructions,
@@ -63,9 +63,13 @@ const App = () => {
     backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
   };
   React.useEffect(() => {
-    axios.get('https://pokeapi.co/api/v2/pokemon/ditto').then(result => {
-      console.log('result', result?.data?.abilities);
-    });
+    requestWrapper
+      .get<{}, {data: {abilities: any}}>(
+        'https://pokeapi.co/api/v2/pokemon/ditto',
+      )
+      .then(result => {
+        console.log('result', result?.data?.abilities);
+      });
   }, []);
 
   return (

apps/rnative/metro.config.js

@@ -1,36 +1,45 @@
-const {getDefaultConfig} = require('@expo/metro-config');
 const path = require('path');
 const {readdirSync} = require('fs');
-const config = getDefaultConfig(__dirname);
 const projectRoot = __dirname;
 const workspaceRoot = path.resolve(__dirname, '../..');
 const rootPackage = require('./package.json');
+const workspacePackage = require('../../package.json');
 
 function findSharedPackages(workspaceRoot, sharedPackagesFolder) {
   const sharedPackageRoots = sharedPackagesFolder.map(packageFolder =>
     path.resolve(workspaceRoot, packageFolder),
   );
 
-  const hey = sharedPackageRoots.map(sharedPackageRoot =>
-    readdirSync(sharedPackageRoot, {
-      withFileTypes: true,
-    })
-      .filter(dir => dir.isDirectory() && !dir.name.startsWith('.'))
-      .map(dir => dir.name)
-      .map(packageFolder => {
-        const packagePath = path.resolve(sharedPackageRoot, packageFolder);
-
-        const packageName = require(`${packagePath}/package.json`).name;
-
-        return {packageName, packagePath};
-      }),
-  );
-  return hey.flat();
+  return sharedPackageRoots
+    .map(sharedPackageRoot =>
+      readdirSync(sharedPackageRoot, {
+        withFileTypes: true,
+      })
+        .filter(dir => dir.isDirectory() && !dir.name.startsWith('.'))
+        .map(dir => dir.name)
+        .map(packageFolder => {
+          const packagePath = path.resolve(sharedPackageRoot, packageFolder);
+
+          const packageName = require(`${packagePath}/package.json`).name;
+
+          return {packageName, packagePath};
+        }),
+    )
+    .flat();
 }
 
+const config = {
+  resolver: {},
+};
+
 /**
  * Get monorepo depencies, flagged by a "*"
  */
+
+const monoRepoFolders = workspacePackage.workspaces.packages.map(pkg =>
+  pkg.substring(0, pkg.search(RegExp('\\/\\*'))),
+);
+
 const dependencies = {
   ...rootPackage.dependencies,
   ...rootPackage.devDependencies,
@@ -40,10 +49,10 @@ const usedDeps = Object.keys(dependencies).filter(
   dep => dependencies[dep] === '*',
 );
 
-const allRepoPackages = findSharedPackages(path.resolve(workspaceRoot), [
-  'packages',
-  'apps',
-]);
+const allRepoPackages = findSharedPackages(
+  path.resolve(workspaceRoot),
+  monoRepoFolders,
+);
 
 /**
  * We don't need to watch the whole repo as it can get pretty large over time.

apps/rnative/package.json

@@ -12,15 +12,14 @@
     "clean": "rm -rf .turbo && rm -rf node_modules"
   },
   "dependencies": {
-    "axios": "^0.24.0",
+    "bp-request": "*",
     "react": "17.0.2",
     "react-native": "0.66.4",
     "ui-native": "*"
   },
   "devDependencies": {
     "@babel/core": "^7.12.9",
     "@babel/runtime": "^7.12.5",
-    "@expo/metro-config": "^0.3.8",
     "@react-native-community/eslint-config": "^2.0.0",
     "@types/jest": "^26.0.23",
     "@types/react-native": "^0.66.4",

apps/xpo/metro.config.js

@@ -5,6 +5,13 @@ const config = getDefaultConfig(__dirname);
 const projectRoot = __dirname;
 const workspaceRoot = path.resolve(__dirname, '../..');
 const rootPackage = require('./package.json');
+const workspacePackage = require('../../package.json');
+
+
+const monoRepoFolders = workspacePackage.workspaces.packages.map(pkg =>
+  pkg.substring(0, pkg.search(RegExp('\\/\\*'))),
+);
+
 
 function findSharedPackages(workspaceRoot, sharedPackagesFolder) {
   const sharedPackageRoots = sharedPackagesFolder.map(packageFolder =>
@@ -40,10 +47,7 @@ const usedDeps = Object.keys(dependencies).filter(
   dep => dependencies[dep] === '*',
 );
 
-const allRepoPackages = findSharedPackages(path.resolve(workspaceRoot), [
-  'packages',
-  'apps',
-]);
+const allRepoPackages = findSharedPackages(path.resolve(workspaceRoot), monoRepoFolders);
 
 /**
  * We don't need to watch the whole repo as it can get pretty large over time.

apps/xpo/package.json

@@ -17,7 +17,8 @@
     "react-dom": "17.0.2",
     "react-native": "0.64.3",
     "react-native-web": "0.17.1",
-    "ui-native": "*"
+    "ui-native": "*",
+    "bp-request":"*"
   },
   "devDependencies": {
     "@babel/core": "^7.12.9",

package.json

@@ -1,11 +1,12 @@
 {
   "name": "turbo-boilerplate",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "private": true,
   "workspaces": {
     "packages": [
       "packages/*",
-      "apps/*"
+      "apps/*",
+      "wrappers/*"
     ],
     "nohoist": [
       "**/react-native",

packages/README.md

@@ -0,0 +1,3 @@
+## Purpose
+
+This folder in the monorepo contains libraries which are to be built before being used.

wrappers/README.md

@@ -0,0 +1,6 @@
+## Wrappers
+
+- This folder in the monorepo contains libraries which do not need to be built before being used.
+- Wrapper libraries are libraries that "wrap" around a third party library like stripe, sendGrid, twilio, axios, etc.
+- This is so that if the third party library requirements change, you only need to change the third party library in a few places as opposed to all your mono repo applications.
+- These libraries should have no other monorepo package dependencies.

wrappers/bp-request/.eslintrc.js

@@ -0,0 +1 @@
+module.exports = require("scripts/eslint-preset");

wrappers/bp-request/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "bp-request",
+  "version": "1.0.0",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
+  "private": true,
+  "license": "MIT",
+  "files": [
+    "dist/**"
+  ],
+  "scripts": {
+    "test": "jest -u",
+    "build": "tsup src/index.ts --format esm,cjs --dts --external axios",
+    "dev": "tsup src/index.ts --format esm,cjs --watch --dts --external axios",
+    "lint": "TIMING=1 eslint src --fix",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist"
+  },
+  "devDependencies": {
+    "axios": "0.24.0",
+    "tsup": "^5.10.1",
+    "typescript": "^4.2.4"
+  },
+  "jest": {
+    "preset": "scripts/jest/node"
+  }
+}

wrappers/bp-request/prettier.config.js

@@ -0,0 +1 @@
+module.exports = {}

wrappers/bp-request/src/index.ts

@@ -0,0 +1,14 @@
+import axios from "axios";
+
+const get = async <P = null, T = any>(
+  url: string,
+  headers?: { [key: string]: string }
+): Promise<T> => {
+  const result = await axios.get<P, T>(url, {
+    headers,
+  });
+
+  return result;
+};
+
+export { get };

wrappers/bp-request/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "tsconfig/base.json",
+  "compilerOptions": {
+    "moduleResolution": "node",
+    "jsx": "react-jsx",
+    "lib": ["ES2015"],
+    "target": "ES6",
+    "module": "ESNext",
+    "outDir": "./dist",
+    "rootDir": "./src"
+  },
+  "include": ["src"],
+  "exclude": ["node_modules", "src/__test__/**/*"]
+}

yarn.lock

@@ -1142,7 +1142,7 @@
     xcode "^3.0.1"
     xml2js "^0.4.23"
 
-"@expo/config-plugins@4.0.15", "@expo/config-plugins@^4.0.2":
+"@expo/config-plugins@^4.0.2":
   version "4.0.15"
   resolved "https://registry.yarnpkg.com/@expo/config-plugins/-/config-plugins-4.0.15.tgz#cc170a0cf890973b6491cf357540e9955296019c"
   integrity sha512-QqxVEt2bFu3ZuI1soULRJv7i0Zrg/FMZ0IxNV7Y3AjH7fhtUJH3pPo9f6MURvqNr+PLxhBlkofkWfunrVejSkw==
@@ -1191,23 +1191,6 @@
     slugify "^1.3.4"
     sucrase "^3.20.0"
 
-"@expo/config@6.0.15":
-  version "6.0.15"
-  resolved "https://registry.yarnpkg.com/@expo/config/-/config-6.0.15.tgz#aa610f8b714e0b1103e13c8210059519479d11d6"
-  integrity sha512-nrG+OUe/2n3ulNSgHRs9V70zXu3lpkuzJ6F0VmCuhjyHqT7UYimkgSCJGqaE3N+AayBTK+YffOT6bTWH17wxjQ==
-  dependencies:
-    "@babel/code-frame" "~7.10.4"
-    "@expo/config-plugins" "4.0.15"
-    "@expo/config-types" "^43.0.1"
-    "@expo/json-file" "8.2.34"
-    getenv "^1.0.0"
-    glob "7.1.6"
-    require-from-string "^2.0.2"
-    resolve-from "^5.0.0"
-    semver "7.3.2"
-    slugify "^1.3.4"
-    sucrase "^3.20.0"
-
 "@expo/json-file@8.2.33":
   version "8.2.33"
   resolved "https://registry.yarnpkg.com/@expo/json-file/-/json-file-8.2.33.tgz#78f56f33a2cfb807b23c81e00237a33159aa1f32"
@@ -1226,19 +1209,6 @@
     json5 "^1.0.1"
     write-file-atomic "^2.3.0"
 
-"@expo/metro-config@^0.3.8":
-  version "0.3.8"
-  resolved "https://registry.yarnpkg.com/@expo/metro-config/-/metro-config-0.3.8.tgz#e784f96ad9d182e7177c191b82471a6c8c9e6704"
-  integrity sha512-dDjd5wFlw0t/UEjYvT6atDPEUYI8GyCX0unnRowRCe2V67NMmwZ2FkUBapwOy12HhkdlRJqfp+XdHgj2LiXzdg==
-  dependencies:
-    "@expo/config" "6.0.15"
-    "@expo/json-file" "8.2.34"
-    chalk "^4.1.0"
-    debug "^4.3.2"
-    find-yarn-workspace-root "~2.0.0"
-    getenv "^1.0.0"
-    sucrase "^3.20.0"
-
 "@expo/metro-config@~0.1.84":
   version "0.1.84"
   resolved "https://registry.yarnpkg.com/@expo/metro-config/-/metro-config-0.1.84.tgz#ddcc7b4f1087c29f86bc9d916933d29bacd2c726"
@@ -3020,7 +2990,7 @@ axe-core@^4.3.5:
   resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.3.5.tgz#78d6911ba317a8262bfee292aeafcc1e04b49cc5"
   integrity sha512-WKTW1+xAzhMS5dJsxWkliixlO/PqC4VhmO9T4juNYcaTg9jzWiJsou6m5pxWYGfigWbwzJWeFY6z47a+4neRXA==
 
-axios@^0.24.0:
+axios@0.24.0:
   version "0.24.0"
   resolved "https://registry.yarnpkg.com/axios/-/axios-0.24.0.tgz#804e6fa1e4b9c5288501dd9dff56a7a0940d20d6"
   integrity sha512-Q6cWsys88HoPgAaFAVUb0WpPk0O8iTeisR9IMqy9G8AbO4NlpVknrnQS03zzF9PGAWgO3cgletO3VjV/P7VztA==
@@ -5662,13 +5632,6 @@ find-up@~5.0.0:
     locate-path "^6.0.0"
     path-exists "^4.0.0"
 
-find-yarn-workspace-root@~2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/find-yarn-workspace-root/-/find-yarn-workspace-root-2.0.0.tgz#f47fb8d239c900eb78179aa81b66673eac88f7bd"
-  integrity sha512-1IMnbjt4KzsQfnhnzNd8wUEgXZ44IzZaZmnLYx7D5FZlaHt2gW20Cri8Q+E/t5tIj4+epTBub+2Zxu/vNILzqQ==
-  dependencies:
-    micromatch "^4.0.2"
-
 flat-cache@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-3.0.4.tgz#61b0338302b2fe9f957dcc32fc2a87f1c3048b11"