Merge pull request #214 from Resgrid/develop

Develop

Author: ucswift

.eslintignore

@@ -1,4 +1,4 @@
-.eslintignorenode_modules
+node_modules
 __tests__/
 .vscode/
 android/
@@ -7,4 +7,9 @@ ios/
 .expo
 .expo-shared
 docs/
-cli/
+cli/
+electron/
+fastlane/
+patches/
+public/
+scripts/

.eslintrc.js

@@ -1,11 +1,11 @@
 const path = require('path');
 
 module.exports = {
-  extends: ['expo', 'plugin:tailwindcss/recommended', 'prettier'],
-  plugins: ['prettier', 'unicorn', '@typescript-eslint', 'unused-imports', 'tailwindcss', 'simple-import-sort', 'eslint-plugin-react-compiler'],
-  parserOptions: {
-    project: './tsconfig.json',
-  },
+  extends: ['expo', 'prettier'],
+  plugins: ['prettier', 'unicorn', '@typescript-eslint', 'unused-imports', 'simple-import-sort', 'eslint-plugin-react-compiler'],
+  // parserOptions: {
+  //   project: './tsconfig.json',
+  // },
   rules: {
     'prettier/prettier': 'warn',
     'max-params': ['error', 10], // Limit the number of parameters in a function to use object instead
@@ -24,17 +24,10 @@ module.exports = {
       },
     ], // Ensure `import type` is used when it's necessary
     'import/prefer-default-export': 'off', // Named export is easier to refactor automatically
-    'import/no-cycle': ['error', { maxDepth: '∞' }],
-    'tailwindcss/classnames-order': [
-      'warn',
-      {
-        officialSorting: true,
-      },
-    ], // Follow the same ordering as the official plugin `prettier-plugin-tailwindcss`
+    'import/no-cycle': 'off', // Disabled due to performance issues
     'simple-import-sort/imports': 'error', // Import configuration for `eslint-plugin-simple-import-sort`
     'simple-import-sort/exports': 'error', // Export configuration for `eslint-plugin-simple-import-sort`
     '@typescript-eslint/no-unused-vars': 'off',
-    'tailwindcss/no-custom-classname': 'off',
     'unused-imports/no-unused-imports': 'off',
     'unused-imports/no-unused-vars': [
       'off',

Dockerfile

@@ -15,9 +15,10 @@ RUN yarn install --frozen-lockfile
 # Copy source files
 COPY . .
 
-# Build the web application without environment variables
-# Environment variables will be injected at runtime via docker-entrypoint.sh
-RUN yarn web:build
+# Build the web application with production defaults
+# Runtime environment variables will be injected at startup via docker-entrypoint.sh
+# APP_ENV=production ensures the build uses production defaults and no .env suffix on IDs
+RUN APP_ENV=production yarn web:build
 
 ### STAGE 2: Run ###
 FROM nginx:1.25-alpine
@@ -42,6 +43,8 @@ EXPOSE 80
 ENV APP_ENV=production \
     UNIT_NAME="Resgrid Unit" \
     UNIT_SCHEME="ResgridUnit" \
+    UNIT_BUNDLE_ID="com.resgrid.unit" \
+    UNIT_PACKAGE="com.resgrid.unit" \
     UNIT_VERSION="0.0.1" \
     UNIT_BASE_API_URL="https://api.resgrid.com" \
     UNIT_API_VERSION="v4" \

__mocks__/react-native-svg.ts

@@ -0,0 +1,43 @@
+import React from 'react';
+
+const createMockComponent = (name: string) => {
+  const Component = React.forwardRef((props: any, ref: any) =>
+    React.createElement(name, { ...props, ref })
+  );
+  Component.displayName = name;
+  return Component;
+};
+
+export const Svg = createMockComponent('Svg');
+export const Circle = createMockComponent('Circle');
+export const Ellipse = createMockComponent('Ellipse');
+export const G = createMockComponent('G');
+export const Text = createMockComponent('SvgText');
+export const TSpan = createMockComponent('TSpan');
+export const TextPath = createMockComponent('TextPath');
+export const Path = createMockComponent('Path');
+export const Polygon = createMockComponent('Polygon');
+export const Polyline = createMockComponent('Polyline');
+export const Line = createMockComponent('Line');
+export const Rect = createMockComponent('Rect');
+export const Use = createMockComponent('Use');
+export const Image = createMockComponent('SvgImage');
+export const Symbol = createMockComponent('SvgSymbol');
+export const Defs = createMockComponent('Defs');
+export const LinearGradient = createMockComponent('LinearGradient');
+export const RadialGradient = createMockComponent('RadialGradient');
+export const Stop = createMockComponent('Stop');
+export const ClipPath = createMockComponent('ClipPath');
+export const Pattern = createMockComponent('Pattern');
+export const Mask = createMockComponent('Mask');
+export const ForeignObject = createMockComponent('ForeignObject');
+export const Marker = createMockComponent('Marker');
+export const SvgFromUri = createMockComponent('SvgFromUri');
+export const SvgFromXml = createMockComponent('SvgFromXml');
+export const SvgXml = createMockComponent('SvgXml');
+export const SvgUri = createMockComponent('SvgUri');
+export const SvgCss = createMockComponent('SvgCss');
+export const SvgCssUri = createMockComponent('SvgCssUri');
+export const parse = jest.fn();
+
+export default Svg;

app.config.ts

@@ -78,9 +78,11 @@ export default ({ config }: ConfigContext): ExpoConfig => ({
       'android.permission.POST_NOTIFICATIONS',
       'android.permission.FOREGROUND_SERVICE',
       'android.permission.FOREGROUND_SERVICE_MICROPHONE',
+      'android.permission.FOREGROUND_SERVICE_PHONE_CALL',
       'android.permission.FOREGROUND_SERVICE_CONNECTED_DEVICE',
       'android.permission.FOREGROUND_SERVICE_MEDIA_PLAYBACK',
       'android.permission.READ_PHONE_STATE',
+      'android.permission.READ_PHONE_NUMBERS',
       'android.permission.MANAGE_OWN_CALLS',
     ],
   },

babel.config.js

@@ -25,6 +25,7 @@ module.exports = function (api) {
           extensions: ['.ios.ts', '.android.ts', '.ts', '.ios.tsx', '.android.tsx', '.tsx', '.jsx', '.js', '.json'],
         },
       ],
+      'babel-plugin-transform-import-meta',
       'react-native-reanimated/plugin',
     ],
   };

docker-compose.yml

@@ -12,6 +12,8 @@ services:
       - APP_ENV=production
       - UNIT_NAME=Resgrid Unit
       - UNIT_SCHEME=ResgridUnit
+      - UNIT_BUNDLE_ID=com.resgrid.unit
+      - UNIT_PACKAGE=com.resgrid.unit
       - UNIT_VERSION=0.0.1
       - UNIT_BASE_API_URL=https://api.resgrid.com
       - UNIT_API_VERSION=v4

docker/docker-entrypoint.sh

@@ -11,14 +11,18 @@ js_escape() {
 }
 
 # Create the env-config.js file with environment variables
+# Includes ALL fields expected by the client env schema in env.js
 cat > "${HTML_DIR}/env-config.js" << EOF
 // Runtime environment configuration - generated by docker-entrypoint.sh
 // This file is generated at container startup and injects environment variables
 window.__ENV__ = {
   APP_ENV: "$(js_escape "${APP_ENV:-production}")",
   NAME: "$(js_escape "${UNIT_NAME:-Resgrid Unit}")",
   SCHEME: "$(js_escape "${UNIT_SCHEME:-ResgridUnit}")",
+  BUNDLE_ID: "$(js_escape "${UNIT_BUNDLE_ID:-com.resgrid.unit}")",
+  PACKAGE: "$(js_escape "${UNIT_PACKAGE:-com.resgrid.unit}")",
   VERSION: "$(js_escape "${UNIT_VERSION:-0.0.1}")",
+  ANDROID_VERSION_CODE: 1,
   BASE_API_URL: "$(js_escape "${UNIT_BASE_API_URL:-https://api.resgrid.com}")",
   API_VERSION: "$(js_escape "${UNIT_API_VERSION:-v4}")",
   RESGRID_API_URL: "$(js_escape "${UNIT_RESGRID_API_URL:-/api/v4}")",

electron/main.js

@@ -1,6 +1,24 @@
 /* eslint-disable no-undef */
-const { app, BrowserWindow, ipcMain, Notification, nativeTheme, Menu } = require('electron');
+const { app, BrowserWindow, ipcMain, Notification, nativeTheme, Menu, protocol, net } = require('electron');
 const path = require('path');
+const fs = require('fs');
+const { pathToFileURL } = require('url');
+
+// Register custom protocol scheme before app is ready
+// This allows serving the Expo web export with absolute paths (/_expo/static/...)
+// via a custom protocol instead of file://, which breaks absolute path resolution.
+protocol.registerSchemesAsPrivileged([
+  {
+    scheme: 'app',
+    privileges: {
+      standard: true,
+      secure: true,
+      supportFetchAPI: true,
+      corsEnabled: true,
+      stream: true,
+    },
+  },
+]);
 
 // Handle creating/removing shortcuts on Windows when installing/uninstalling.
 if (require('electron-squirrel-startup')) {
@@ -33,9 +51,14 @@ function createWindow() {
   });
 
   // Load the app
-  const startUrl = isDev ? 'http://localhost:8081' : `file://${path.join(__dirname, '../dist/index.html')}`;
-
-  mainWindow.loadURL(startUrl);
+  if (isDev) {
+    // In development, load from the Expo dev server
+    mainWindow.loadURL('http://localhost:8081');
+  } else {
+    // In production, load via the custom app:// protocol
+    // which correctly resolves absolute paths (/_expo/static/...) from the dist directory
+    mainWindow.loadURL('app://bundle/index.html');
+  }
 
   // Show window when ready
   mainWindow.once('ready-to-show', () => {
@@ -154,6 +177,41 @@ ipcMain.handle('get-platform', () => {
 
 // Handle app ready
 app.whenReady().then(() => {
+  // Register custom protocol handler for serving the Expo web export
+  // This resolves absolute paths like /_expo/static/js/... from the dist directory
+  const distPath = path.join(__dirname, '..', 'dist');
+  const resolvedDist = path.resolve(distPath);
+
+  protocol.handle('app', (request) => {
+    const url = new URL(request.url);
+    // Decode the pathname, join with base path, then canonicalize to prevent directory traversal
+    const joinedPath = path.join(distPath, decodeURIComponent(url.pathname));
+    const resolvedPath = path.resolve(joinedPath);
+
+    // Security check: ensure resolved path is within distPath to prevent directory traversal
+    let filePath;
+    if (!resolvedPath.startsWith(resolvedDist + path.sep) && resolvedPath !== resolvedDist) {
+      // Path escapes distPath - fall back to index.html
+      filePath = path.join(resolvedDist, 'index.html');
+    } else {
+      filePath = resolvedPath;
+
+      // If the path points to a directory or file doesn't exist, fall back to index.html
+      // This supports SPA client-side routing
+      try {
+        const stat = fs.statSync(filePath);
+        if (stat.isDirectory()) {
+          filePath = path.join(resolvedDist, 'index.html');
+        }
+      } catch {
+        // File not found - serve index.html for client-side routing
+        filePath = path.join(resolvedDist, 'index.html');
+      }
+    }
+
+    return net.fetch(pathToFileURL(filePath).toString());
+  });
+
   createMenu();
   createWindow();
 

global.css

@@ -1,3 +1,25 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+/* Web-only pulse animation for user location marker on map */
+@keyframes pulse-ring {
+  0%, 100% {
+    transform: scale(1);
+    opacity: 0.3;
+  }
+  50% {
+    transform: scale(1.2);
+    opacity: 0.15;
+  }
+}
+
+/* Web-only skeleton loading animation */
+@keyframes skeleton-pulse {
+  0%, 100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.75;
+  }
+}