feat(example): add macOS application

.github/workflows/update-lockfiles.yml

@@ -46,10 +46,12 @@ jobs:
           cd example
           bundle install
           bun pods
+          bun pods:macos
           cd ..
 
           git add bun.lock
           git add example/ios/Podfile.lock
+          git add example/macos/Podfile.lock
           git add example/Gemfile.lock
 
           git config --global user.name 'dependabot[bot]'

README.md

@@ -50,6 +50,14 @@ For a React Native macOS app, run CocoaPods from the `macos` directory:
 cd macos && pod install
 ```
 
+## Run the macOS example
+
+The example targets macOS 14 or later with React Native macOS 0.81. This is the tested example configuration, not a guarantee that every older macOS version allowed by the podspec is supported.
+
+Install the workspace dependencies and the example's Ruby dependencies, then run its `pods:macos` and `macos` scripts. The desktop app shares the mobile example's SQLite, TypeORM, sqlite-vec, SQL console, and benchmark screens.
+
+To keep Metro in a separate terminal, run the `start` script in `example/macos` and launch the `macos` script with `--no-packager`. Use `--mode Release --no-packager` to build and launch the embedded production bundle.
+
 ---
 
 # API overview

example/.eslintrc.js

@@ -5,4 +5,15 @@ module.exports = {
     project: true,
     tsconfigRootDir: __dirname,
   },
+  overrides: [
+    {
+      files: ['babel.config.shared.js', 'macos/**/*.{js,mjs}'],
+      parserOptions: {
+        project: null,
+      },
+      rules: {
+        '@typescript-eslint/no-require-imports': 'off',
+      },
+    },
+  ],
 }

example/babel.config.js

@@ -1,31 +1,3 @@
-const path = require('path')
-const pak = require('../packages/react-native-nitro-sqlite/package.json')
+const createExampleBabelConfig = require('./babel.config.shared')
 
-module.exports = {
-  presets: ['module:@react-native/babel-preset'],
-  plugins: [
-    [
-      'module-resolver',
-      {
-        extensions: ['.tsx', '.ts', '.js', '.json'],
-        alias: {
-          [pak.name]: path.join(
-            __dirname,
-            '../packages/react-native-nitro-sqlite',
-            pak.source,
-          ),
-          'crypto': 'react-native-quick-crypto',
-          'stream': 'readable-stream',
-          'buffer': 'react-native-quick-crypto',
-          'react-native-sqlite-storage': 'react-native-nitro-sqlite',
-          '^@nitro-sqlite/(.+)':
-            '../packages/react-native-nitro-sqlite/src/\\1',
-          '^@/(.+)': './src/\\1',
-          '^@tests/(.+)': './tests/\\1',
-        },
-      },
-    ],
-    'babel-plugin-transform-typescript-metadata',
-    ['@babel/plugin-proposal-decorators', { legacy: true }],
-  ],
-}
+module.exports = createExampleBabelConfig(__dirname)

example/babel.config.shared.js

@@ -0,0 +1,47 @@
+const path = require('path')
+const libraryPackage = require('../packages/react-native-nitro-sqlite/package.json')
+
+function createExampleBabelConfig(projectRoot, { buffer, crypto } = {}) {
+  const sourceDirectory = path.join(projectRoot, 'src')
+  const testsDirectory = path.join(projectRoot, 'tests')
+  const aliases = {
+    [libraryPackage.name]: path.join(
+      __dirname,
+      '../packages/react-native-nitro-sqlite',
+      libraryPackage.source,
+    ),
+    'stream': 'readable-stream',
+    'react-native-sqlite-storage': libraryPackage.name,
+    '^@nitro-sqlite/(.+)': path.join(
+      __dirname,
+      '../packages/react-native-nitro-sqlite/src/\\1',
+    ),
+    '^@/(.+)': `${sourceDirectory}/\\1`,
+    '^@tests/(.+)': `${testsDirectory}/\\1`,
+  }
+
+  if (buffer !== false) {
+    aliases.buffer = buffer ?? 'react-native-quick-crypto'
+  }
+
+  if (crypto !== false) {
+    aliases.crypto = crypto ?? 'react-native-quick-crypto'
+  }
+
+  return {
+    presets: ['module:@react-native/babel-preset'],
+    plugins: [
+      [
+        'module-resolver',
+        {
+          extensions: ['.tsx', '.ts', '.js', '.json'],
+          alias: aliases,
+        },
+      ],
+      'babel-plugin-transform-typescript-metadata',
+      ['@babel/plugin-proposal-decorators', { legacy: true }],
+    ],
+  }
+}
+
+module.exports = createExampleBabelConfig

example/macos/.gitignore

@@ -0,0 +1,2 @@
+# CocoaPods
+Pods/

example/macos/.xcode.env

@@ -0,0 +1 @@
+export NODE_BINARY=$(command -v node)

example/macos/NitroSQLiteExample-macOS/AppDelegate.h

@@ -0,0 +1,6 @@
+#import <RCTAppDelegate.h>
+#import <Cocoa/Cocoa.h>
+
+@interface AppDelegate : RCTAppDelegate
+
+@end

example/macos/NitroSQLiteExample-macOS/AppDelegate.mm

@@ -0,0 +1,45 @@
+#import "AppDelegate.h"
+
+#import <React/RCTBundleURLProvider.h>
+#import <ReactAppDependencyProvider/RCTAppDependencyProvider.h>
+
+@implementation AppDelegate
+
+- (void)applicationDidFinishLaunching:(NSNotification *)notification
+{
+  self.moduleName = @"NitroSQLiteExample";
+  self.initialProps = @{};
+  self.dependencyProvider = [RCTAppDependencyProvider new];
+
+  return [super applicationDidFinishLaunching:notification];
+}
+
+- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
+{
+  return [self bundleURL];
+}
+
+- (NSURL *)bundleURL
+{
+#if DEBUG
+  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
+#else
+  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
+#endif
+}
+
+/// This method controls whether the `concurrentRoot`feature of React18 is turned on or off.
+///
+/// @see: https://reactjs.org/blog/2022/03/29/react-v18.html
+/// @note: This requires to be rendering on Fabric (i.e. on the New Architecture).
+/// @return: `true` if the `concurrentRoot` feature is enabled. Otherwise, it returns `false`.
+- (BOOL)concurrentRootEnabled
+{
+#ifdef RN_FABRIC_ENABLED
+  return true;
+#else
+  return false;
+#endif
+}
+
+@end

example/macos/NitroSQLiteExample-macOS/Assets.xcassets/AppIcon.appiconset/Contents.json

@@ -0,0 +1,58 @@
+{
+  "images" : [
+    {
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "16x16"
+    },
+    {
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "16x16"
+    },
+    {
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "32x32"
+    },
+    {
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "32x32"
+    },
+    {
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "128x128"
+    },
+    {
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "128x128"
+    },
+    {
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "256x256"
+    },
+    {
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "256x256"
+    },
+    {
+      "idiom" : "mac",
+      "scale" : "1x",
+      "size" : "512x512"
+    },
+    {
+      "idiom" : "mac",
+      "scale" : "2x",
+      "size" : "512x512"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

example/macos/NitroSQLiteExample-macOS/Assets.xcassets/Contents.json

@@ -0,0 +1,6 @@
+{
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}