Skip to content

Commit cd16a92

Browse files
authored
Merge pull request #66 from Resgrid/rn-main
Rn main
2 parents 70defd5 + 0f61631 commit cd16a92

1,334 files changed

Lines changed: 111140 additions & 121737 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

.cursorrules

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
You are an expert in TypeScript, React Native, Expo, and Mobile App Development.
2+
3+
Code Style and Structure:
4+
5+
- Write concise, type-safe TypeScript code.
6+
- Use functional components and hooks over class components.
7+
- Ensure components are modular, reusable, and maintainable.
8+
- Organize files by feature, grouping related components, hooks, and styles.
9+
- This is a mobile application, so ensure all components are mobile friendly and responsive and support both iOS and Android platforms and ensure that the app is optimized for both platforms.
10+
11+
Naming Conventions:
12+
13+
- Use camelCase for variable and function names (e.g., `isFetchingData`, `handleUserInput`).
14+
- Use PascalCase for component names (e.g., `UserProfile`, `ChatScreen`).
15+
- Directory and File names should be lowercase and hyphenated (e.g., `user-profile`, `chat-screen`).
16+
17+
TypeScript Usage:
18+
19+
- Use TypeScript for all components, favoring interfaces for props and state.
20+
- Enable strict typing in `tsconfig.json`.
21+
- Avoid using `any`; strive for precise types.
22+
- Utilize `React.FC` for defining functional components with props.
23+
24+
Performance Optimization:
25+
26+
- Minimize `useEffect`, `useState`, and heavy computations inside render methods.
27+
- Use `React.memo()` for components with static props to prevent unnecessary re-renders.
28+
- Optimize FlatLists with props like `removeClippedSubviews`, `maxToRenderPerBatch`, and `windowSize`.
29+
- Use `getItemLayout` for FlatLists when items have a consistent size to improve performance.
30+
- Avoid anonymous functions in `renderItem` or event handlers to prevent re-renders.
31+
32+
UI and Styling:
33+
34+
- Use consistent styling leveraging `gluestack-ui`. If there isn't a Gluestack component in the `components/ui` directory for the component you are trying to use consistently style it either through `StyleSheet.create()` or Styled Components.
35+
- Ensure responsive design by considering different screen sizes and orientations.
36+
- Optimize image handling using libraries designed for React Native, like `react-native-fast-image`.
37+
38+
Best Practices:
39+
40+
- Follow React Native's threading model to ensure smooth UI performance.
41+
- Use React Navigation for handling navigation and deep linking with best practices.
42+
- Create and use Jest to test to validate all generated components
43+
- Generate tests for all components, services and logic generated. Ensure tests run without errors and fix any issues.
44+
- The app is multi-lingual, so ensure all text is wrapped in `t()` from `react-i18next` for translations with the dictionary files stored in `src/translations`.
45+
- Ensure support for dark mode and light mode.
46+
- Ensure the app is accessible, following WCAG guidelines for mobile applications.
47+
- Make sure the app is optimized for performance, especially for low-end devices.
48+
- Handle errors gracefully and provide user feedback.
49+
- Implement proper offline support.
50+
- Ensure the user interface is intuitive and user-friendly and works seamlessly across different devices and screen sizes.
51+
52+
Additional Rules:
53+
54+
- Use `yarn` as the package manager.
55+
- Use Expo's secure store for sensitive data
56+
- Implement proper offline support
57+
- Use `zustand` for state management
58+
- Use `react-hook-form` for form handling
59+
- Use `react-query` for data fetching
60+
- Use `react-i18next` for internationalization
61+
- Use `react-native-mmkv` for local storage
62+
- Use `axios` for API requests
63+
- Use `@rnmapbox/maps` for maps, mapping or vehicle navigation
64+
- Use `lucide-react-native` for icons and use those components directly in the markup and don't use the gluestack-ui icon component
65+
- Use ? : for conditional rendering and not &&

.deepsource.toml

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,5 @@ version = 1
44
name = "javascript"
55
enabled = true
66

7-
[analyzers.meta]
8-
environment = ["browser"]
9-
plugins = ["angular"]
10-
11-
[[transformers]]
12-
name = "prettier"
13-
enabled = true
7+
[analyzers.meta]
8+
plugins = ["react"]

.dockerignore

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
# Dependencies
2+
node_modules/
3+
.pnp/
4+
.pnp.js
5+
6+
# Build outputs
7+
dist/
8+
build/
9+
.expo/
10+
web-build/
11+
android/
12+
ios/
13+
14+
# Testing
15+
coverage/
16+
.nyc_output/
17+
*.test.js
18+
*.spec.js
19+
__tests__/
20+
__mocks__/
21+
22+
# IDE and editors
23+
.idea/
24+
.vscode/
25+
*.swp
26+
*.swo
27+
*~
28+
29+
# OS files
30+
.DS_Store
31+
Thumbs.db
32+
*.log
33+
34+
# Git
35+
.git/
36+
.gitignore
37+
38+
# Environment files (build time only, runtime injected)
39+
.env
40+
.env.*
41+
!.env.docker.example
42+
43+
# Documentation
44+
docs/
45+
*.md
46+
!README.md
47+
48+
# Docker files (don't need to copy into build context)
49+
docker-compose*.yml
50+
51+
# Expo/EAS
52+
eas.json
53+
.easignore
54+
55+
# CI/CD
56+
.github/
57+
.gitlab-ci.yml
58+
.circleci/
59+
Jenkinsfile
60+
61+
# Misc
62+
*.log
63+
npm-debug.log*
64+
yarn-debug.log*
65+
yarn-error.log*
66+
.maestro/

.easignore

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
node_modules/
2+
.expo/
3+
dist/
4+
npm-debug.*
5+
*.jks
6+
*.p8
7+
*.p12
8+
*.key
9+
*.mobileprovision
10+
*.orig.*
11+
web-build/
12+
yarn-error.log
13+
/coverage
14+
# macOS
15+
.DS_Store
16+
/android
17+
/ios
18+
/web
19+
/apps
20+
21+
# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
22+
# The following patterns were generated by expo-cli
23+
24+
expo-env.d.ts
25+
# @end expo-cli
26+
27+
# Include a file not in source control
28+
!google-services.json
29+
!credentials.json

.editorconfig

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,9 @@ indent_size = 2
88
insert_final_newline = true
99
trim_trailing_whitespace = true
1010

11+
[*.ts]
12+
quote_type = single
13+
1114
[*.md]
1215
max_line_length = off
1316
trim_trailing_whitespace = false

.env.docker.example

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
# Docker Environment Configuration for Resgrid Dispatch Web
2+
# Copy this file to .env.docker and fill in your values
3+
4+
# API Configuration
5+
DISPATCH_BASE_API_URL=https://api.resgrid.com
6+
DISPATCH_API_VERSION=v4
7+
DISPATCH_RESGRID_API_URL=/api/v4
8+
9+
# SignalR Hub Configuration
10+
DISPATCH_CHANNEL_HUB_NAME=eventingHub
11+
DISPATCH_REALTIME_GEO_HUB_NAME=geolocationHub
12+
13+
# Logging and App Keys
14+
DISPATCH_LOGGING_KEY=
15+
DISPATCH_APP_KEY=
16+
17+
# Mapbox Configuration
18+
DISPATCH_MAPBOX_PUBKEY=
19+
20+
# Sentry Error Tracking
21+
DISPATCH_SENTRY_DSN=
22+
23+
# Countly Analytics
24+
DISPATCH_COUNTLY_APP_KEY=
25+
DISPATCH_COUNTLY_SERVER_URL=
26+
27+
# Feature Flags
28+
DISPATCH_MAINTENANCE_MODE=false

.eslintignore

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
.eslintignorenode_modules
2+
__tests__/
3+
.vscode/
4+
android/
5+
coverage/
6+
ios/
7+
.expo
8+
.expo-shared
9+
docs/
10+
cli/

.eslintrc.js

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
const path = require('path');
2+
3+
module.exports = {
4+
extends: ['expo', 'plugin:tailwindcss/recommended', 'prettier'],
5+
plugins: ['prettier', 'unicorn', '@typescript-eslint', 'unused-imports', 'tailwindcss', 'simple-import-sort', 'eslint-plugin-react-compiler'],
6+
parserOptions: {
7+
project: './tsconfig.json',
8+
},
9+
rules: {
10+
'prettier/prettier': 'warn',
11+
'max-params': ['error', 10], // Limit the number of parameters in a function to use object instead
12+
'max-lines-per-function': ['error', 1500],
13+
'react/display-name': 'off',
14+
'react/no-inline-styles': 'off',
15+
'react/destructuring-assignment': 'off', // Vscode doesn't support automatically destructuring, it's a pain to add a new variable
16+
'react/require-default-props': 'off', // Allow non-defined react props as undefined
17+
'@typescript-eslint/comma-dangle': 'off', // Avoid conflict rule between Eslint and Prettier
18+
'@typescript-eslint/consistent-type-imports': [
19+
'warn',
20+
{
21+
prefer: 'type-imports',
22+
fixStyle: 'inline-type-imports',
23+
disallowTypeAnnotations: true,
24+
},
25+
], // Ensure `import type` is used when it's necessary
26+
'import/prefer-default-export': 'off', // Named export is easier to refactor automatically
27+
'import/no-cycle': ['error', { maxDepth: '∞' }],
28+
'tailwindcss/classnames-order': [
29+
'warn',
30+
{
31+
officialSorting: true,
32+
},
33+
], // Follow the same ordering as the official plugin `prettier-plugin-tailwindcss`
34+
'simple-import-sort/imports': 'error', // Import configuration for `eslint-plugin-simple-import-sort`
35+
'simple-import-sort/exports': 'error', // Export configuration for `eslint-plugin-simple-import-sort`
36+
'@typescript-eslint/no-unused-vars': 'off',
37+
'tailwindcss/no-custom-classname': 'off',
38+
'unused-imports/no-unused-imports': 'off',
39+
'unused-imports/no-unused-vars': [
40+
'off',
41+
{
42+
argsIgnorePattern: '^_',
43+
varsIgnorePattern: '^_',
44+
caughtErrorsIgnorePattern: '^_',
45+
},
46+
],
47+
},
48+
overrides: [
49+
// Configuration for translations files (i18next)
50+
{
51+
files: ['src/translations/*.json'],
52+
extends: ['plugin:i18n-json/recommended'],
53+
rules: {
54+
'i18n-json/valid-message-syntax': [
55+
2,
56+
{
57+
syntax: path.resolve('./scripts/i18next-syntax-validation.js'),
58+
},
59+
],
60+
'i18n-json/valid-json': 2,
61+
'i18n-json/sorted-keys': [
62+
2,
63+
{
64+
order: 'asc',
65+
indentSpaces: 2,
66+
},
67+
],
68+
'i18n-json/identical-keys': [
69+
2,
70+
{
71+
filePath: path.resolve('./src/translations/en.json'),
72+
},
73+
],
74+
'prettier/prettier': [
75+
0,
76+
{
77+
singleQuote: true,
78+
endOfLine: 'auto',
79+
},
80+
],
81+
},
82+
},
83+
{
84+
// Configuration for testing files
85+
files: ['**/__tests__/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[jt]s?(x)'],
86+
extends: ['plugin:testing-library/react'],
87+
},
88+
],
89+
};

.github/copilot-instructions.md

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
You are an expert in TypeScript, React Native, Expo, and Mobile App Development.
2+
3+
Code Style and Structure:
4+
5+
- Write concise, type-safe TypeScript code.
6+
- Use functional components and hooks over class components.
7+
- Ensure components are modular, reusable, and maintainable.
8+
- Organize files by feature, grouping related components, hooks, and styles.
9+
- This is a mobile application, so ensure all components are mobile friendly and responsive and support both iOS and Android platforms and ensure that the app is optimized for both platforms.
10+
11+
Naming Conventions:
12+
13+
- Use camelCase for variable and function names (e.g., `isFetchingData`, `handleUserInput`).
14+
- Use PascalCase for component names (e.g., `UserProfile`, `ChatScreen`).
15+
- Directory and File names should be lowercase and hyphenated (e.g., `user-profile`, `chat-screen`).
16+
17+
TypeScript Usage:
18+
19+
- Use TypeScript for all components, favoring interfaces for props and state.
20+
- Enable strict typing in `tsconfig.json`.
21+
- Avoid using `any`; strive for precise types.
22+
- Utilize `React.FC` for defining functional components with props.
23+
24+
Performance Optimization:
25+
26+
- Minimize `useEffect`, `useState`, and heavy computations inside render methods.
27+
- Use `React.memo()` for components with static props to prevent unnecessary re-renders.
28+
- Optimize FlatLists with props like `removeClippedSubviews`, `maxToRenderPerBatch`, and `windowSize`.
29+
- Use `getItemLayout` for FlatLists when items have a consistent size to improve performance.
30+
- Avoid anonymous functions in `renderItem` or event handlers to prevent re-renders.
31+
32+
UI and Styling:
33+
34+
- Use consistent styling leveraging `gluestack-ui`. If there isn't a Gluestack component in the `components/ui` directory for the component you are trying to use consistently style it either through `StyleSheet.create()` or Styled Components.
35+
- Ensure responsive design by considering different screen sizes and orientations.
36+
- Optimize image handling using libraries designed for React Native, like `react-native-fast-image`.
37+
38+
Web Platform Compatibility (React Native Web):
39+
40+
- When combining styles (e.g., `[styles.base, { color: dynamicColor }]`), always use `StyleSheet.flatten()` to merge them into a single object. Passing style arrays directly causes "Failed to set an indexed property on CSSStyleDeclaration" errors on web.
41+
- For components that need dynamic styles, use: `style={StyleSheet.flatten([styles.myStyle, { color: dynamicValue }])}`
42+
- Do not pass `style` props directly to lucide-react-native icons. Wrap icons in a `View` and apply styles to the wrapper instead.
43+
- Avoid using the `gap` property in StyleSheet styles as it has inconsistent support on web. Use `marginLeft`, `marginRight`, `marginTop`, or `marginBottom` on child elements instead.
44+
- When creating custom components that will render on web, prefer using React Native's core `Text` and `View` components (imported from 'react-native') over gluestack-ui wrappers for better style handling compatibility.
45+
46+
Best Practices:
47+
48+
- Follow React Native's threading model to ensure smooth UI performance.
49+
- Use React Navigation for handling navigation and deep linking with best practices.
50+
- Create and use Jest to test to validate all generated components
51+
- Generate tests for all components, services and logic generated. Ensure tests run without errors and fix any issues.
52+
- The app is multi-lingual, so ensure all text is wrapped in `t()` from `react-i18next` for translations with the dictonary files stored in `src/translations`.
53+
- Ensure support for dark mode and light mode.
54+
- Ensure the app is accessible, following WCAG guidelines for mobile applications.
55+
- Make sure the app is optimized for performance, especially for low-end devices.
56+
- Handle errors gracefully and provide user feedback.
57+
- Implement proper offline support.
58+
- Ensure the user interface is intuitive and user-friendly and works seamlessly across different devices and screen sizes.
59+
60+
Additional Rules:
61+
62+
- Use `yarn` as the package manager.
63+
- Use Expo's secure store for sensitive data
64+
- Implement proper offline support
65+
- Use `zustand` for state management
66+
- Use `react-hook-form` for form handling
67+
- Use `react-query` for data fetching
68+
- Use `react-i18next` for internationalization
69+
- Use `react-native-mmkv` for local storage
70+
- Use `axios` for API requests
71+
- Use `@rnmapbox/maps` for maps, mapping or vehicle navigation
72+
- Use `lucide-react-native` for icons and use those components directly in the markup and don't use the gluestack-ui icon component
73+
- Use ? : for conditional rendering and not &&

.github/dependabot.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,5 +7,6 @@ version: 2
77
updates:
88
- package-ecosystem: "npm" # See documentation for possible values
99
directory: "/" # Location of package manifests
10+
open-pull-requests-limit: 0
1011
schedule:
1112
interval: "weekly"

0 commit comments

Comments
 (0)