@croacroa/react-native-template 1.0.0

package/.env.example

@@ -0,0 +1,18 @@
+# API Configuration
+API_URL=http://localhost:3000
+
+# App Variant (development | preview | production)
+APP_VARIANT=development
+
+# EAS Project ID (get from expo.dev)
+EAS_PROJECT_ID=your-project-id
+
+# Push Notifications
+# Get these from your push notification service
+
+# Analytics (optional)
+# ANALYTICS_KEY=your-analytics-key
+
+# Sentry (optional - for crash reporting)
+# Get your DSN from: https://sentry.io -> Project Settings -> Client Keys
+EXPO_PUBLIC_SENTRY_DSN=

package/.eslintrc.js

@@ -0,0 +1,55 @@
+module.exports = {
+  root: true,
+  extends: [
+    "expo",
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "prettier",
+  ],
+  parser: "@typescript-eslint/parser",
+  plugins: ["@typescript-eslint", "prettier"],
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: "latest",
+    sourceType: "module",
+  },
+  rules: {
+    // Prettier
+    "prettier/prettier": "error",
+
+    // TypeScript
+    "@typescript-eslint/no-unused-vars": [
+      "error",
+      { argsIgnorePattern: "^_", varsIgnorePattern: "^_" },
+    ],
+    "@typescript-eslint/no-explicit-any": "warn",
+    "@typescript-eslint/explicit-function-return-type": "off",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+
+    // React
+    "react/react-in-jsx-scope": "off",
+    "react/prop-types": "off",
+
+    // General
+    "no-console": ["warn", { allow: ["warn", "error"] }],
+    "prefer-const": "error",
+    "no-var": "error",
+  },
+  ignorePatterns: [
+    "node_modules/",
+    ".expo/",
+    "dist/",
+    "coverage/",
+    "*.config.js",
+    "babel.config.js",
+    "metro.config.js",
+    ".storybook/",
+  ],
+  settings: {
+    react: {
+      version: "detect",
+    },
+  },
+};

package/.github/workflows/ci.yml

@@ -0,0 +1,184 @@
+name: CI
+
+on:
+  push:
+    branches: [main, develop]
+  pull_request:
+    branches: [main, develop]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+env:
+  NODE_VERSION: '18'
+
+jobs:
+  # ============================================
+  # Lint & Type Check
+  # ============================================
+  lint:
+    name: Lint & Type Check
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run ESLint
+        run: npm run lint
+
+      - name: Run TypeScript check
+        run: npm run typecheck
+
+  # ============================================
+  # Unit Tests
+  # ============================================
+  test:
+    name: Unit Tests
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run tests with coverage
+        run: npm run test:coverage
+
+      - name: Upload coverage to Codecov
+        uses: codecov/codecov-action@v4
+        with:
+          token: ${{ secrets.CODECOV_TOKEN }}
+          files: ./coverage/lcov.info
+          fail_ci_if_error: false
+
+  # ============================================
+  # Build Check (Expo)
+  # ============================================
+  build-check:
+    name: Build Check
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'npm'
+
+      - name: Setup Expo
+        uses: expo/expo-github-action@v8
+        with:
+          expo-version: latest
+          eas-version: latest
+          token: ${{ secrets.EXPO_TOKEN }}
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Check Expo config
+        run: npx expo config --type public
+
+      - name: Export for web (validates build)
+        run: npx expo export --platform web
+
+  # ============================================
+  # E2E Tests with Maestro Cloud
+  # ============================================
+  e2e:
+    name: E2E Tests (Maestro)
+    runs-on: ubuntu-latest
+    needs: [lint, test]
+    if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Setup Expo
+        uses: expo/expo-github-action@v8
+        with:
+          expo-version: latest
+          eas-version: latest
+          token: ${{ secrets.EXPO_TOKEN }}
+
+      # Build for Android (or use existing build)
+      - name: Build Android APK
+        run: eas build --platform android --profile preview --non-interactive --local
+        env:
+          EXPO_TOKEN: ${{ secrets.EXPO_TOKEN }}
+        continue-on-error: true
+
+      # Run Maestro Cloud tests
+      - name: Run Maestro Cloud Tests
+        uses: mobile-dev-inc/action-maestro-cloud@v1
+        with:
+          api-key: ${{ secrets.MAESTRO_CLOUD_API_KEY }}
+          app-file: ./build/*.apk
+          flows: ./maestro/flows/
+          env: |
+            APP_ID=com.croacroa.app
+        continue-on-error: true
+
+  # ============================================
+  # Security Audit
+  # ============================================
+  security:
+    name: Security Audit
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run npm audit
+        run: npm audit --audit-level=high
+        continue-on-error: true
+
+  # ============================================
+  # Notify on failure
+  # ============================================
+  notify:
+    name: Notify
+    runs-on: ubuntu-latest
+    needs: [lint, test, build-check]
+    if: failure()
+    steps:
+      - name: Send notification
+        run: |
+          echo "CI failed for ${{ github.repository }}"
+          # Add Slack/Discord webhook notification here if needed

package/.github/workflows/eas-build.yml

@@ -0,0 +1,55 @@
+name: EAS Build
+
+on:
+  workflow_dispatch:
+    inputs:
+      platform:
+        description: 'Platform to build'
+        required: true
+        default: 'all'
+        type: choice
+        options:
+          - all
+          - ios
+          - android
+      profile:
+        description: 'Build profile'
+        required: true
+        default: 'preview'
+        type: choice
+        options:
+          - development
+          - preview
+          - production
+
+jobs:
+  build:
+    name: Build ${{ github.event.inputs.platform }} (${{ github.event.inputs.profile }})
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '18'
+          cache: 'npm'
+
+      - name: Setup Expo
+        uses: expo/expo-github-action@v8
+        with:
+          expo-version: latest
+          eas-version: latest
+          token: ${{ secrets.EXPO_TOKEN }}
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build iOS
+        if: ${{ github.event.inputs.platform == 'ios' || github.event.inputs.platform == 'all' }}
+        run: eas build --platform ios --profile ${{ github.event.inputs.profile }} --non-interactive
+
+      - name: Build Android
+        if: ${{ github.event.inputs.platform == 'android' || github.event.inputs.platform == 'all' }}
+        run: eas build --platform android --profile ${{ github.event.inputs.profile }} --non-interactive

package/.github/workflows/eas-update.yml

@@ -0,0 +1,50 @@
+name: EAS Update (OTA)
+
+on:
+  push:
+    branches: [main]
+    paths-ignore:
+      - '**.md'
+      - '.github/**'
+      - 'maestro/**'
+      - 'docs/**'
+
+jobs:
+  update:
+    name: Publish OTA Update
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '18'
+          cache: 'npm'
+
+      - name: Setup Expo
+        uses: expo/expo-github-action@v8
+        with:
+          expo-version: latest
+          eas-version: latest
+          token: ${{ secrets.EXPO_TOKEN }}
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Publish update
+        run: eas update --auto --non-interactive
+        env:
+          EXPO_TOKEN: ${{ secrets.EXPO_TOKEN }}
+
+      - name: Comment on commit
+        uses: actions/github-script@v7
+        with:
+          script: |
+            github.rest.repos.createCommitComment({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              commit_sha: context.sha,
+              body: '🚀 OTA update published successfully!'
+            })

package/.gitignore

@@ -0,0 +1,62 @@
+# Dependencies
+node_modules/
+
+# Expo
+.expo/
+dist/
+web-build/
+expo-env.d.ts
+
+# Native builds
+*.orig.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+*.orig.*
+android/
+ios/
+
+# Metro
+.metro-health-check*
+
+# Debug
+npm-debug.*
+yarn-debug.*
+yarn-error.*
+
+# macOS
+.DS_Store
+*.pem
+
+# Local env files
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# TypeScript
+*.tsbuildinfo
+
+# Testing
+coverage/
+
+# IDE
+.idea/
+.vscode/
+*.swp
+*.swo
+
+# Storybook
+storybook-static/
+
+# EAS
+.easignore
+
+# Secrets (never commit these!)
+google-services.json
+GoogleService-Info.plist
+*.keystore
+repomix-output.xml

package/.prettierrc

@@ -0,0 +1,11 @@
+{
+  "semi": true,
+  "singleQuote": false,
+  "tabWidth": 2,
+  "trailingComma": "es5",
+  "printWidth": 80,
+  "bracketSpacing": true,
+  "bracketSameLine": false,
+  "arrowParens": "always",
+  "endOfLine": "lf"
+}

package/.storybook/main.ts

@@ -0,0 +1,28 @@
+import type { StorybookConfig } from "@storybook/react-webpack5";
+
+const config: StorybookConfig = {
+  stories: ["../components/**/*.stories.@(js|jsx|ts|tsx)"],
+  addons: [
+    "@storybook/addon-essentials",
+    "@storybook/addon-react-native-web",
+  ],
+  framework: {
+    name: "@storybook/react-webpack5",
+    options: {},
+  },
+  docs: {
+    autodocs: true,
+  },
+  webpackFinal: async (config) => {
+    // Add support for absolute imports
+    if (config.resolve) {
+      config.resolve.alias = {
+        ...config.resolve.alias,
+        "@": require("path").resolve(__dirname, ".."),
+      };
+    }
+    return config;
+  },
+};
+
+export default config;

package/.storybook/preview.tsx

@@ -0,0 +1,30 @@
+import type { Preview } from "@storybook/react";
+import React from "react";
+import { View } from "react-native";
+
+const preview: Preview = {
+  parameters: {
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/,
+      },
+    },
+    backgrounds: {
+      default: "light",
+      values: [
+        { name: "light", value: "#ffffff" },
+        { name: "dark", value: "#0f172a" },
+      ],
+    },
+  },
+  decorators: [
+    (Story) => (
+      <View style={{ padding: 16, flex: 1 }}>
+        <Story />
+      </View>
+    ),
+  ],
+};
+
+export default preview;

package/CHANGELOG.md

@@ -0,0 +1,106 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [Unreleased]
+
+### Added
+
+- Auth adapter pattern for easy provider switching (Supabase, Firebase, etc.)
+- Internationalization (i18n) support with expo-localization and i18next
+  - English and French translations included
+  - Language detection and persistence
+- New UI components:
+  - `Select` - Dropdown/picker component
+  - `Checkbox` and `CheckboxGroup` - Animated checkbox components
+  - `BottomSheet` - Modal bottom sheet with @gorhom/bottom-sheet
+  - `Avatar` and `AvatarGroup` - User avatar components
+  - `Badge`, `Chip`, and `CountBadge` - Label/tag components
+  - `OptimizedImage` - High-performance image component with expo-image
+- Deep linking support with `useDeepLinking` hook
+- Biometric authentication with `useBiometrics` hook
+- Analytics adapter for multiple providers (Mixpanel, Amplitude, etc.)
+- Rate limiting for API calls using Bottleneck
+- E2E testing setup with Maestro
+  - Login, registration, navigation, and offline flow tests
+- Project documentation:
+  - CONTRIBUTING.md
+  - CHANGELOG.md
+  - Architecture Decision Records (ADRs)
+- GitHub Actions CI/CD workflows:
+  - Lint, test, and build checks
+  - Maestro Cloud E2E tests
+  - EAS Build workflow (manual trigger)
+  - EAS Update workflow (OTA on push to main)
+- Onboarding screens with animated pagination
+- OTA updates support with `useUpdates` hook
+- Performance monitoring with `usePerformance` hook
+- Comprehensive accessibility utilities:
+  - Builder functions for all UI patterns (button, input, toggle, etc.)
+  - Hooks for screen reader, reduce motion, and bold text preferences
+  - Utility functions for announcements and focus management
+
+### Changed
+
+- Primary color changed from blue to emerald green (croacroa branding)
+- API client now includes rate limiting protection
+
+### Dependencies Added
+
+- `@gorhom/bottom-sheet` ^4.6.0
+- `bottleneck` ^2.19.5
+- `expo-image` ~2.0.0
+- `expo-local-authentication` ~15.0.0
+- `expo-localization` ~15.0.0
+- `i18next` ^23.0.0
+- `react-i18next` ^14.0.0
+
+## [1.0.0] - 2024-01-01
+
+### Added
+
+- Initial release
+- Expo SDK 52 with React Native 0.76
+- Expo Router for file-based navigation
+- Authentication flow with secure token storage
+- React Query for data fetching with offline support
+- Zustand for state management
+- NativeWind (Tailwind CSS) for styling
+- React Hook Form with Zod validation
+- Push notifications with Expo Notifications
+- Error tracking with Sentry
+- Storybook for component documentation
+- Jest and Testing Library for unit tests
+- Dark mode support
+- Basic UI components (Button, Input, Card, Modal, Skeleton)
+- Animated components with Reanimated
+- Toast notifications with Burnt
+
+### Infrastructure
+
+- EAS Build configuration for dev/preview/production
+- ESLint and Prettier setup
+- Husky pre-commit hooks
+- TypeScript strict mode
+
+---
+
+## Versioning Guide
+
+### Version Format: MAJOR.MINOR.PATCH
+
+- **MAJOR**: Breaking changes
+- **MINOR**: New features (backwards compatible)
+- **PATCH**: Bug fixes (backwards compatible)
+
+### Changelog Categories
+
+- **Added**: New features
+- **Changed**: Changes to existing functionality
+- **Deprecated**: Features to be removed
+- **Removed**: Removed features
+- **Fixed**: Bug fixes
+- **Security**: Security improvements