@imksh/create 1.0.24 → 1.0.26

package/templates/mern-react-native/mobile/docs/components/data-display.md

@@ -1,44 +0,0 @@
-# Data Display Components
-
-These components are used to display data visually, such as lists, images, and accordions.
-
-## `SwipeableRow`
-A highly complex component that wraps list items, allowing them to be swiped left or right to reveal action buttons.
-
-### Usage Example
-```tsx
-import { SwipeableRow, SwipeAction } from '@/components/ui/data-display/SwipeableRow';
-import { MaterialIcons } from '@expo/vector-icons';
-
-export default function ItemList() {
-  const rightActions: SwipeAction[] = [
-    {
-      icon: <MaterialIcons name="archive" size={24} color="white" />,
-      backgroundColor: '#3B82F6', // Blue
-      onPress: () => console.log('Archived!'),
-    },
-    {
-      icon: <MaterialIcons name="delete" size={24} color="white" />,
-      backgroundColor: '#EF4444', // Red
-      onPress: () => console.log('Deleted!'),
-    },
-  ];
-
-  return (
-    <SwipeableRow rightActions={rightActions}>
-      <View className="p-4 bg-white dark:bg-gray-800">
-        <Text className="text-lg text-black dark:text-white">Swipe me left!</Text>
-      </View>
-    </SwipeableRow>
-  );
-}
-```
-
-## `Accordion`
-An expandable section to hide/show details.
-
-## `Avatar`
-Displays a user profile image or their initials if the image is missing.
-
-## `Badge`
-A small visual indicator, often used for unread counts or status indicators.

package/templates/mern-react-native/mobile/docs/components/feedback.md

@@ -1,36 +0,0 @@
-# Feedback Components
-
-Components designed to provide visual or physical feedback to the user, including loading states and gesture wrappers.
-
-## `GestureWrapper`
-A powerful utility component that simplifies `react-native-gesture-handler`. It abstracts the boilerplate of the `GestureDetector` API.
-
-### Usage Example
-```tsx
-import { GestureWrapper } from '@/components/ui/feedback/GestureWrapper';
-import { View, Text } from 'react-native';
-
-export default function InteractiveCard() {
-  return (
-    <GestureWrapper
-      onTap={() => console.log("Card Tapped")}
-      onDoubleTap={() => console.log("Card Liked (Double Tap)")}
-      onSwipeLeft={() => console.log("Dismissed to the left")}
-      onPanUpdate={(e) => console.log(`Dragging at X: ${e.translationX}`)}
-    >
-      <View className="p-8 bg-blue-500 rounded-xl">
-        <Text className="text-white text-xl">Interact with me!</Text>
-      </View>
-    </GestureWrapper>
-  );
-}
-```
-
-## `CircularProgress` & `ProgressBar`
-Used to indicate loading progress or task completion.
-
-## `Skeleton`
-Used as a placeholder while data is loading.
-
-## `Spinner`
-An infinite spinning loading indicator.

package/templates/mern-react-native/mobile/docs/components/gestures.md

@@ -1,60 +0,0 @@
-# Gesture Control Components
-
-Handling touch events and gestures natively in React Native can be complex, but this template provides highly abstracted, easy-to-use gesture wrappers powered by `react-native-gesture-handler` and `react-native-reanimated`.
-
-## `GestureWrapper`
-The most versatile component for gesture handling. It abstracts away the boilerplate of the `GestureDetector` API, allowing you to easily handle taps, double-taps, drags, and directional swipes.
-
-### Supported Events
-- **Taps**: `onTap`, `onDoubleTap`
-- **Directional Swipes**: `onSwipeLeft`, `onSwipeRight`, `onSwipeUp`, `onSwipeDown` (fires when a quick fling exceeds the velocity threshold).
-- **Pan / Dragging**: `onPanStart`, `onPanUpdate`, `onPanEnd` (provides the raw `translationX`/`translationY` event data).
-
-### Usage Example
-```tsx
-import { GestureWrapper } from '@/components/ui/feedback/GestureWrapper';
-import { View, Text } from 'react-native';
-
-export default function InteractiveCard() {
-  return (
-    <GestureWrapper
-      // Simple Taps
-      onTap={() => console.log("Card Tapped")}
-      onDoubleTap={() => console.log("Card Liked (Double Tap)")}
-      
-      // Swipes
-      onSwipeLeft={() => console.log("Dismissed to the left")}
-      onSwipeRight={() => console.log("Dismissed to the right")}
-      onSwipeUp={() => console.log("Swiped up")}
-      
-      // Continuous Dragging
-      onPanUpdate={(e) => console.log(`Dragging at X: ${e.translationX}`)}
-    >
-      <View className="p-8 bg-blue-500 rounded-xl">
-        <Text className="text-white text-xl">Interact with me!</Text>
-      </View>
-    </GestureWrapper>
-  );
-}
-```
-
-## `SwipeableRow` (Data Display)
-While `GestureWrapper` is great for generic components, if you need a classic "Swipe to reveal actions" row (commonly seen in lists or emails), use the `SwipeableRow` component.
-
-### Usage Example
-```tsx
-import { SwipeableRow, SwipeAction } from '@/components/ui/data-display/SwipeableRow';
-
-// Define the actions revealed when swiping
-const rightActions: SwipeAction[] = [
-  {
-    icon: <Icon name="delete" />,
-    backgroundColor: '#EF4444',
-    onPress: () => console.log('Delete tapped'),
-  },
-];
-
-<SwipeableRow rightActions={rightActions}>
-  <ListItem content="Swipe me!" />
-</SwipeableRow>
-```

package/templates/mern-react-native/mobile/docs/components/inputs.md

@@ -1,41 +0,0 @@
-# Input Components
-
-Inputs are used to collect data from the user. They are highly styled, accessible, and integrate cleanly with form libraries like React Hook Form.
-
-## `Input` (Text Input)
-The core text input component.
-
-### Usage Example
-```tsx
-import { Input } from '@/components/ui/inputs/Input';
-import { useState } from 'react';
-
-export default function Form() {
-  const [email, setEmail] = useState('');
-
-  return (
-    <Input
-      label="Email Address"
-      placeholder="Enter your email"
-      value={email}
-      onChangeText={setEmail}
-      error={email.includes('@') ? '' : 'Invalid email'}
-    />
-  );
-}
-```
-
-## `OTPInput`
-A component optimized for handling multi-digit verification codes.
-- Usage: `<OTPInput length={6} onComplete={(code) => console.log(code)} />`
-
-## `PasswordInput`
-An extension of the `Input` component that includes a toggle to show/hide the password text.
-
-## Other Inputs
-- `Checkbox`: Boolean selection.
-- `Radio`: Select one from a list.
-- `Switch`: A modern iOS/Android style toggle.
-- `Slider`: Choose a numeric value on a track.
-- `SearchBar`: A specialized text input for searching with a clear button.
-- `TextArea`: A multiline text input.

package/templates/mern-react-native/mobile/docs/components/layout.md

@@ -1,34 +0,0 @@
-# Layout Components
-
-Layout components provide the foundational structure of the application screens, ensuring consistent padding, spacing, and structural organization.
-
-## `Container`
-Wraps main content to ensure consistent margins across all screens.
-
-## `ScrollContainer`
-Similar to `Container`, but uses a `ScrollView`. Essential for screens whose content exceeds the device height.
-
-## `KeyboardAvoidingViewWrapper`
-An extremely helpful utility that wraps the screen and automatically adjusts the layout padding when the virtual keyboard appears, preventing inputs from being hidden by the keyboard.
-
-### Usage Example
-```tsx
-import { KeyboardAvoidingViewWrapper } from '@/components/ui/layout/KeyboardAvoidingViewWrapper';
-import { Input } from '@/components/ui/inputs/Input';
-
-export default function LoginScreen() {
-  return (
-    <KeyboardAvoidingViewWrapper>
-      {/* Content won't be blocked by the keyboard here! */}
-      <Input placeholder="Username" />
-      <Input placeholder="Password" />
-    </KeyboardAvoidingViewWrapper>
-  );
-}
-```
-
-## `Divider`
-A simple horizontal or vertical line to separate content sections visually.
-
-## `Grid` & `Stack`
-Utility components for quickly aligning children items using flexbox properties, saving you from writing repetitive nativewind classes.

package/templates/mern-react-native/mobile/docs/components/navigation.md

@@ -1,31 +0,0 @@
-# Navigation Components
-
-These components are used to guide the user between different views or show their current position within a multi-step process.
-
-## `Tabs`
-A highly complex, customizable top tab bar component, typically used for switching views horizontally (e.g., inside a profile or feed).
-
-### Usage Example
-```tsx
-import { Tabs } from '@/components/ui/navigation/Tabs';
-import { useState } from 'react';
-
-export default function Profile() {
-  const [activeTab, setActiveTab] = useState(0);
-  const tabs = ["Posts", "Followers", "Following"];
-
-  return (
-    <Tabs 
-      tabs={tabs} 
-      activeIndex={activeTab} 
-      onChange={setActiveTab} 
-    />
-  );
-}
-```
-
-## `ProgressStepper`
-Used for multi-step wizards, such as an onboarding flow or a multi-page checkout, clearly displaying the completed, current, and upcoming steps.
-
-## `Pagination`
-Displays a series of dots to indicate the current page in a carousel or swipeable view.

package/templates/mern-react-native/mobile/docs/features.md

@@ -1,85 +0,0 @@
-# 🌟 Starter Kit Features
-
-This starter kit is packed with a robust set of features, prebuilt components, and essential services designed to eliminate setup time so you can focus entirely on building your product.
-
----
-
-## 🧩 UI Components
-
-Our custom UI library is built entirely from atomic elements, fully typed, beautifully styled with NativeWind, and ready for gesture-driven interactions.
-
-### 📐 Layout
-- **`Container`**: A responsive wrapper for consistent screen margins.
-- **`Section`**: A structured block for grouping related components with headers.
-- **`ScrollContainer`**: An optimized scrolling view that natively handles keyboard avoidance and safe area insets.
-- **`HStack` / `VStack`**: Flexbox utility components for rapid horizontal and vertical alignment.
-
-### 🔘 Buttons
-- **`Button`**: The core interactive element supporting multiple variants (`primary`, `secondary`, `accent`, `outline`, `ghost`), sizing (`sm`, `md`, `lg`), and a dynamic `soft` prop for pale translucent styling.
-- **`IconButton`**: Icon-only circular buttons for compact interactions.
-- **`FloatingActionButton`**: A prominent, elevated CTA button, typically anchored at the bottom of the screen.
-
-### 📊 Data Display
-- **`Avatar`**: Display user profile images with automatic fallbacks and size variants.
-- **`Badge`**: Small status indicators supporting all semantic theme colors and the `soft` prop.
-- **`Accordion`**: Collapsible vertical panels for FAQs or dense information.
-- **`Card`**: Elevated, rounded containers for grouping information.
-- **`SwipeableRow`**: Natively gesture-driven list items that reveal hidden actions (e.g., delete, archive) upon swiping left or right.
-
-### 📝 Inputs & Controls
-- **`Input`**: A highly styled text input supporting left/right icons, error states, and secure text entry.
-- **`SearchBar`**: A dedicated input variant tailored for real-time search filtering.
-- **`Switch`**: A native-feeling toggle switch for boolean states.
-- **`Checkbox` & `Radio`**: Accessible selection controls for forms and settings.
-- **`Slider`**: A continuous drag slider for numeric value selection.
-
-### ⏳ Feedback & Loading
-- **`Spinner`**: A minimal, rotating activity indicator.
-- **`ProgressBar`**: A linear progress bar for uploading/downloading tasks.
-- **`CircularProgress`**: An SVG-based circular indicator for data syncing or completion rates.
-- **`Skeleton`**: Animated placeholder blocks for loading states before data is fetched.
-- **`GestureWrapper`**: A powerful higher-order component that wraps any view to easily handle double-taps, long-presses, and directional swipes using `react-native-reanimated`.
-
-### 🧭 Navigation & Overlays
-- **`Tabs`**: Clean, customizable local tab navigation (supports `underline` and `button` pill styles).
-- **`BottomModal`**: A gesture-driven, highly responsive bottom sheet that slides up and can be dismissed interactively via drag gestures.
-
----
-
-## 🔌 Core Services
-
-Pre-configured, strongly-typed service wrappers handle complex background logic so you don't have to write boilerplate.
-
-### 🔐 Authentication (`auth.service.ts`)
-Fully integrated Axios endpoints for standard auth flows:
-- `sendOtp`: Dispatch sign-up verification codes.
-- `signup`: Register a new user with OTP verification.
-- `login`: Authenticate existing users.
-- `updateMe`: Sync profile updates to the backend.
-- `logout`: Clear session data securely.
-- `savePushToken`: Send device push tokens to the server.
-
-### 📱 Hardware Permissions (`permission.service.ts`)
-A centralized, cross-platform handler that abstracts away iOS/Android permission complexity:
-- `requirePermission`: Request camera, location, photo library, or microphone access gracefully.
-- `openSettingsForApp`: Deep-link users to system settings if they previously blocked a permission.
-- `registerForPushNotificationsAsync`: Automatically negotiate with Apple APNs / Firebase FCM, configure local Android channels, and return the Expo Push Token.
-
----
-
-## 🏗 System Architecture
-
-### 🚀 Tech Stack
-- **Framework**: Expo / React Native
-- **Styling**: NativeWind (Tailwind v3) & `react-native-reanimated`
-- **Routing**: `expo-router`
-- **Global State**: `zustand`
-- **Storage**: `@react-native-async-storage/async-storage`
-- **API**: `axios`
-
-### 🎨 Theming
-- **Dynamic Light/Dark Mode**: The entire UI responds instantly to the system appearance.
-- **Semantic Colors**: Colors are defined centrally (e.g., `primary`, `base100`, `error`) via CSS variables, making global restyling effortless.
-
-### ⚡ Build Pipeline
-- Pre-configured `eas.json` and local `npm` scripts to instantly compile Cloud or Local `.apk`, `.aab`, and `.ipa` artifacts.

package/templates/mern-react-native/mobile/docs/getting-started.md

@@ -1,47 +0,0 @@
-# Getting Started
-
-This mobile app is built on **Expo Router**, **NativeWind**, and **Zustand**. 
-
-## App Architecture
-
-- **`src/app/`**: This is the routing directory. Expo Router uses file-based routing similar to Next.js.
-  - `_layout.tsx`: The root wrapper. This is where providers (`GestureHandlerRootView`, `PaperProvider`, `StatusBar`) are initialized.
-  - `(tabs)/`: A route group that shares a bottom tab bar layout.
-  - `login.tsx`: The login screen route.
-- **`src/components/`**: Reusable React components. The `ui/` folder contains our custom design system.
-- **`src/store/`**: Global state management using `Zustand`. `useAuthStore.ts` handles the authentication lifecycle.
-- **`src/services/`**: Abstracts API calls and device native capabilities (e.g., `permission.service.ts` for unified hardware permissions).
-
-## Managing Theme
-
-The app uses **NativeWind** to handle styling. 
-By default, the theme is bound to the device OS theme, but it can be overridden and saved using `AsyncStorage`.
-
-```tsx
-import { useColorScheme } from 'nativewind';
-
-export default function MyComponent() {
-  const { colorScheme, toggleColorScheme } = useColorScheme();
-  
-  return (
-    <View className="bg-white dark:bg-gray-900">
-      <Text className="text-black dark:text-white">Current theme: {colorScheme}</Text>
-    </View>
-  );
-}
-```
-
-## Hardware Permissions
-
-Never install a separate `expo-*` permission library manually. Use the `PermissionService`:
-
-```typescript
-import { permissionService } from '@/services/permission.service';
-
-const requestCamera = async () => {
-  const granted = await permissionService.requirePermission('camera');
-  if (granted) {
-    console.log('Camera ready!');
-  }
-}
-```

package/templates/mern-react-native/mobile/src/components/common/HomeHeader.tsx

@@ -1,43 +0,0 @@
-import { View, TouchableOpacity, Pressable } from "react-native";
-import React, { useState } from "react";
-import { Txt } from "./Typography";
-import { useColorScheme } from "nativewind";
-import { Colors } from "../../constants/Colors";
-import { Ionicons } from "@expo/vector-icons";
-import Sidebar from "../ui/Sidebar";
-
-export default function HomeHeader({
-  title,
-  icon,
-  fun,
-}: {
-  title?: string;
-  icon?: keyof typeof Ionicons.glyphMap;
-  fun?: () => void;
-}) {
-  const { colorScheme } = useColorScheme();
-  const [isSidebarOpen, setIsSidebarOpen] = useState<boolean>(false);
-  const colors = Colors[colorScheme ?? "light"];
-  return (
-    <>
-      <View
-        className="h-28 pb-4 px-6 flex-row items-end justify-between border-b border-base-300 w-full"
-        style={{
-          backgroundColor: colors.base200,
-          // elevation: 1,
-        }}
-      >
-        <Pressable onPress={() => setIsSidebarOpen(true)}>
-          <Txt variant="xl" className="text-primary font-bold">
-            {title}
-          </Txt>
-        </Pressable>
-        <TouchableOpacity onPress={fun}>
-          <Ionicons name={icon} color={colors.baseContent} size={28} />
-        </TouchableOpacity>
-      </View>
-
-      <Sidebar isOpen={isSidebarOpen} onClose={() => setIsSidebarOpen(false)} />
-    </>
-  );
-}

package/templates/mern-react-native/mobile/src/components/settings/SettingToggle.tsx

@@ -1,26 +0,0 @@
-import { View, Switch } from "react-native";
-import { Txt } from "../common/Typography";
-import { Ionicons } from "@expo/vector-icons";
-
-export default function SettingToggle({ check, fun, icon, name }) {
-  return (
-    <View className="flex-row justify-between items-center my-4">
-      <View className="flex-row justify-center items-center">
-        <View className="p-4 bg-blue-600 rounded-2xl mr-5 justify-center items-center">
-          <Ionicons name={icon} size={18} color="#fff" />
-        </View>
-        <Txt variant="mid">{name}</Txt>
-      </View>
-      <Switch
-        trackColor={{ false: "#767577", true: "#81b0ff" }}
-        thumbColor={check ? "#2196F3" : "#f4f3f4"}
-        ios_backgroundColor="#3e3e3e"
-        onValueChange={fun}
-        value={check}
-        style={{
-          transform: [{ scaleX: 1.5 }, { scaleY: 1.5 }],
-        }}
-      />
-    </View>
-  );
-}

package/templates/mern-react-native/mobile/src/components/settings/SettingsOptions.tsx

@@ -1,47 +0,0 @@
-import { View, TouchableOpacity } from "react-native";
-import { useState } from "react";
-import { Txt } from "../common/Typography";
-import { Ionicons } from "@expo/vector-icons";
-import ConfirmationToast from "../common/ConfirmationToast";
-import { Portal } from "react-native-paper";
-import { useColorScheme } from "nativewind";
-import { Colors } from "../../constants/Colors";
-
-export default function SettingsOptins({ check, icon, fun, name, message }) {
-  const [show, setShow] = useState(false);
-  const { colorScheme } = useColorScheme();
-  const colors = Colors[colorScheme ?? "light"];
-  return (
-    <>
-      <TouchableOpacity
-        className="flex-row justify-between items-center my-4"
-        onPress={() => setShow(!show)}
-      >
-        <View className="flex-row justify-center items-center">
-          <View className="p-4 bg-blue-600 rounded-2xl mr-5 justify-center items-center">
-            <Ionicons name={icon} size={18} color="#fff" />
-          </View>
-          <Txt variant="mid">{name}</Txt>
-        </View>
-        <TouchableOpacity onPress={() => setShow(!show)}>
-          <Ionicons
-            name="chevron-forward-outline"
-            size={25}
-            color={colors.baseContent}
-          />
-        </TouchableOpacity>
-      </TouchableOpacity>
-      <Portal>
-        {show && (
-          <ConfirmationToast
-            fun={fun}
-            icon={icon}
-            setShow={setShow}
-            name={name}
-            message={message}
-          />
-        )}
-      </Portal>
-    </>
-  );
-}

package/templates/react-native/.env.example

@@ -1,2 +0,0 @@
-EXPO_PUBLIC_API_URL=your_api
-EXPO_PUBLIC_APP_NAME=MyApp

package/templates/react-native/.vscode/extensions.json

@@ -1 +0,0 @@
-{ "recommendations": ["expo.vscode-expo-tools"] }

package/templates/react-native/.vscode/settings.json

@@ -1,7 +0,0 @@
-{
-  "editor.codeActionsOnSave": {
-    "source.fixAll": "explicit",
-    "source.organizeImports": "explicit",
-    "source.sortMembers": "explicit"
-  }
-}

package/templates/react-native/README.md

@@ -1,159 +0,0 @@
-# 📱 Mobile App (React Native + Expo)
-
-This is the mobile application of the starter template, built entirely with **React Native** and **Expo**. It is designed to be a highly scalable boilerplate featuring a modern tech stack, a unified permissions system, and a robust custom UI component library.
-
-## ✨ Key Features
-
-- **Expo Router**: File-based routing that makes navigation predictable and deeply linkable.
-- **NativeWind (Tailwind CSS)**: Styling is powered by Tailwind CSS classes, complete with dynamic Light/Dark mode support.
-- **Custom UI Library**: Beautiful, highly-reusable components built from scratch (e.g., `Tabs`, `Button`, `Image`, `ScrollContainer`, `Input`) designed to work perfectly across both themes.
-- **Zustand State Management**: Lightweight and fast global state management, used to handle the user's auth session securely.
-- **Unified Permission Service**: A centralized handler for iOS and Android hardware permissions using `react-native-permissions`.
-- **Push Notification Pipeline**: Built-in support for generating Expo Push Tokens on physical devices and syncing them to your backend.
-
-## 🧩 Included UI Components
-
-The starter kit comes with a massive, completely customizable, and gesture-driven UI library built from scratch out of atomic elements.
-
-- **Layout**: `Container`, `Section`, `ScrollContainer`, `HStack`, `VStack`
-- **Buttons**: `Button` (with variants, sizes, and soft props), `IconButton`, `FloatingActionButton`
-- **Data Display**: `Avatar`, `Badge`, `Accordion`, `SwipeableRow`, `Card`
-- **Inputs**: `Input`, `Checkbox`, `Radio`, `Switch`, `Slider`, `SearchBar`
-- **Feedback & Loading**: `Spinner`, `ProgressBar`, `CircularProgress`, `Skeleton`, `GestureWrapper`
-- **Navigation**: `Tabs` (Underline & Button variants)
-- **Overlay & Modals**: `BottomModal` (Gesture-driven bottom sheet)
-
-## 🔌 Included Services
-
-Pre-configured service wrappers allow you to focus on logic rather than boilerplate:
-
-- **`auth.service.ts`**: Prebuilt Axios integrations for `sendOtp`, `signup`, `login`, `updateMe`, `logout`, and `savePushToken`.
-- **`permission.service.ts`**: A unified permissions handler exposing `requirePermission`, `openSettingsForApp`, and `registerForPushNotificationsAsync`.
-
----
-
-## 🛠 Tech Stack
-
-- **Framework**: Expo / React Native
-- **Styling**: NativeWind (Tailwind v3) & `react-native-reanimated`
-- **Routing**: `expo-router`
-- **State**: `zustand`
-- **Storage**: `@react-native-async-storage/async-storage`
-- **API**: `axios`
-
----
-
-## 🚀 Getting Started
-
-### Prerequisites
-
-Make sure you have the following installed on your machine:
-
-- Node.js (v18+)
-- [EAS CLI](https://docs.expo.dev/build/setup/) (`npm install -g eas-cli`)
-- iOS Simulator (macOS only) or Android Emulator
-
-### Installation
-
-1. Navigate to the `mobile` directory:
-   ```bash
-   cd mobile
-   ```
-2. Install dependencies:
-   ```bash
-   npm install
-   ```
-3. Start the development server:
-   ```bash
-   npm run dev
-   ```
-4. Press `i` to open the app on an iOS Simulator, or `a` to open it on an Android Emulator.
-
----
-
-## 🏗 Project Structure
-
-```bash
-src/
-├── app/                  # Expo Router screens (e.g., _layout.tsx, login.tsx, (tabs)/)
-├── components/           # Reusable UI components
-│   ├── common/           # Generic components (Loading, etc.)
-│   └── ui/               # Custom UI library (Button, Tabs, Image, Input)
-├── constants/            # Theme tokens (Colors, Typography)
-├── services/             # API and business logic wrappers
-│   ├── auth.service.ts   # Axios API calls for authentication
-│   └── permission.service.ts # Unified hardware permission logic
-├── store/                # Zustand global stores (useAuthStore.ts)
-└── utils/                # Helper functions (storage.ts, api.ts)
-```
-
----
-
-## 📦 Build Instructions
-
-This template is configured for both cloud-based builds (via EAS) and fast local compilations using standard Gradle scripts.
-
-### Cloud Builds (Expo Application Services)
-
-If you don't have Android Studio or Xcode configured, you can build directly in the cloud:
-
-```bash
-# Build an Android APK (Uses the "preview" profile in eas.json)
-npm run build:eas:apk
-
-# Build an Android App Bundle (.aab) for the Play Store (Uses "production" profile)
-npm run build:eas:aab
-
-# Build an iOS app
-npm run build:ios
-```
-
-### Local Builds (Requires Android Studio/SDK)
-
-If you have your local SDK set up, you can compile extremely fast on your own machine:
-
-```bash
-# Compile a local .apk
-npm run build:apk
-
-# Compile a local .aab
-npm run build:aab
-```
-
-_(Note: Rebuilding natively is required whenever you add new npm packages containing native code, or modify the `app.json` plugins!)_
-
----
-
-## 🔒 Handling Permissions
-
-Rather than installing different disjointed `expo-*` libraries every time you need hardware access, this template centralizes all permission requests using the `PermissionService`.
-
-To check or request access:
-
-```typescript
-import { permissionService } from "@/services/permission.service";
-
-// Calling requirePermission() will automatically prompt the user if they haven't been asked yet
-const hasCameraAccess = await permissionService.requirePermission("camera");
-
-if (!hasCameraAccess) {
-  // Deep link the user to the OS settings if they permanently blocked the permission
-  permissionService.openSettingsForApp();
-}
-```
-
-## 🔔 Push Notifications
-
-To request push notifications, just call the utility function. It will automatically detect if it is running on a physical device, set up the required Android notification channels, fetch the token from Apple/Google, and return it:
-
-```typescript
-import { permissionService } from "@/services/permission.service";
-import { authService } from "@/services/auth.service";
-
-const token = await permissionService.registerForPushNotificationsAsync();
-
-// Send it to the backend!
-if (token) {
-  await authService.savePushToken(token);
-}
-```