blob: cb818a709ddf1fca351dd2a2810841427279d62f (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
|
# Makima Mobile
A React Native mobile application for Makima, built with Expo and expo-router.
## Overview
This mobile app allows users to:
- View and manage tasks created from contracts
- Monitor task progress in real-time
- Answer pending questions from running tasks
- Track task status (running, completed, failed, blocked)
- Authenticate via Supabase
## Prerequisites
- Node.js 18+
- npm or yarn
- Expo CLI (`npm install -g expo-cli`)
- iOS Simulator (macOS) or Android Emulator
- Expo Go app (for physical device testing)
## Getting Started
### 1. Install dependencies
```bash
npm install
```
### 2. Set up environment variables
Copy the example environment file and fill in your values:
```bash
cp .env.example .env
```
Edit `.env` with your actual credentials:
```env
EXPO_PUBLIC_SUPABASE_URL=https://ynxyjytytmfwxjqxljzm.supabase.co
EXPO_PUBLIC_SUPABASE_ANON_KEY=your_actual_anon_key
EXPO_PUBLIC_API_URL=https://api.makima.jp
```
### 3. Start the development server
```bash
npm start
```
This will open the Expo Dev Tools in your browser.
## Available Commands
| Command | Description |
|---------|-------------|
| `npm start` | Start the Expo development server |
| `npm run ios` | Start on iOS simulator |
| `npm run android` | Start on Android emulator |
| `npm run web` | Start web version |
| `npm run lint` | Run ESLint |
| `npm run typecheck` | Run TypeScript type checking |
## Project Structure
```
apps/mobile/
├── app/ # Expo Router screens
│ ├── (auth)/ # Authentication screens
│ │ ├── _layout.tsx # Auth layout
│ │ └── login.tsx # Login screen
│ ├── (tabs)/ # Tab navigation screens
│ │ ├── _layout.tsx # Tab layout
│ │ ├── index.tsx # Dashboard
│ │ ├── tasks.tsx # Task list
│ │ └── settings.tsx # Settings
│ ├── task/ # Task detail screens
│ │ ├── _layout.tsx # Task layout
│ │ └── [id].tsx # Task detail by ID
│ └── _layout.tsx # Root layout
├── components/ # Reusable components
├── constants/ # App constants (colors, etc.)
├── contexts/ # React contexts
├── hooks/ # Custom React hooks
├── lib/ # Utility libraries
│ ├── api.ts # API client
│ ├── auth.ts # Auth utilities
│ ├── config.ts # App configuration
│ └── supabase.ts # Supabase client
└── stores/ # Zustand stores
```
## Features
### Authentication
- Email/password sign-in via Supabase
- Secure token storage using expo-secure-store
- Automatic session refresh
### Dashboard
- Overview of running tasks
- Pending questions alert
- Quick access to tasks needing attention
- Task counts by status
### Tasks
- List all tasks with status filtering
- Search tasks by name
- Pull-to-refresh
- Navigate to task details
### Task Details
- View task status and progress
- See subtasks
- View error messages if failed
- Task metadata (created, started, completed times)
### Settings
- Sign out functionality
- Environment indicator
- Links to support/legal pages
## Technology Stack
- **Framework**: React Native with Expo
- **Navigation**: expo-router (file-based routing)
- **State Management**: Zustand
- **Data Fetching**: TanStack React Query
- **Auth**: Supabase Auth
- **Styling**: React Native StyleSheet
- **Icons**: @expo/vector-icons (Ionicons)
## Development Notes
### Environment Configuration
The app automatically detects development vs production mode:
- In development on iOS: Uses `localhost:8080`
- In development on Android: Uses `10.0.2.2:8080` (Android emulator's host)
- In production: Uses `https://api.makima.jp`
You can override this by setting `EXPO_PUBLIC_API_URL`.
### TypeScript
Run type checking before committing:
```bash
npm run typecheck
```
### Building for Production
Export for all platforms:
```bash
npx expo export --platform all
```
## License
MIT
|
