From febb56f6e9e14246f5bc4ffe96207966ee7be956 Mon Sep 17 00:00:00 2001 From: amaliadwiy Date: Thu, 29 Jan 2026 11:57:58 +0800 Subject: [PATCH] fix: document division Deskripsi: - update menu bottom pada saat select file atau dokumen No Issues --- QWEN.md | 153 ++++++++++++++++++ README.md | 124 ++++++++++---- .../[id]/(fitur-division)/document/index.tsx | 3 +- constants/Styles.ts | 1 - 4 files changed, 248 insertions(+), 33 deletions(-) create mode 100644 QWEN.md diff --git a/QWEN.md b/QWEN.md new file mode 100644 index 0000000..aa15d4a --- /dev/null +++ b/QWEN.md @@ -0,0 +1,153 @@ +# Desa+ Mobile Application - Project Overview + +## Project Summary +Desa+ is a comprehensive village/desa management mobile application built with React Native and Expo. The application serves as a digital platform for village administration, community communication, and information management. It provides various features to facilitate village governance, resident communication, and administrative tasks. + +## Architecture & Technology Stack +- **Framework**: React Native with Expo (SDK 53) +- **State Management**: Redux Toolkit with React-Redux +- **Navigation**: Expo Router with React Navigation +- **Backend Services**: Firebase (Authentication, Realtime Database, Cloud Messaging) +- **UI Components**: Custom-built components with React Native elements +- **Language**: TypeScript for type safety +- **Build System**: EAS (Expo Application Service) for builds and deployments + +## Key Features +- Announcement and village information system +- Community discussion forums +- Village event calendar +- Document management and archiving +- Project and task management +- Member and organizational structure management +- Push notifications for important updates +- Verification and authentication features + +## Project Structure +``` +├── app/ # Application routes and pages (Expo Router) +│ ├── (application)/ # Main application screens +│ │ ├── announcement/ +│ │ ├── banner/ +│ │ ├── discussion/ +│ │ ├── division/ +│ │ ├── group/ +│ │ ├── member/ +│ │ ├── position/ +│ │ ├── project/ +│ │ ├── _layout.tsx +│ │ ├── edit-profile.tsx +│ │ ├── feature.tsx +│ │ ├── home.tsx +│ │ ├── notification.tsx +│ │ ├── profile.tsx +│ │ └── search.tsx +│ ├── _layout.tsx # Root layout +│ ├── index.tsx # Splash/login screen +│ ├── verification.tsx # OTP verification screen +├── components/ # Reusable UI components +│ ├── announcement/ +│ ├── auth/ +│ ├── banner/ +│ ├── calendar/ +│ ├── discussion/ +│ ├── division/ +│ ├── document/ +│ ├── group/ +│ ├── home/ +│ ├── member/ +│ ├── position/ +│ ├── project/ +│ ├── task/ +│ ├── alertKonfirmasi.ts +│ ├── AppHeader.tsx +│ ├── Text.tsx +│ └── ... (many more components) +├── constants/ # Constants and styles +│ ├── Colors.ts +│ ├── ColorsStatus.ts +│ ├── ConstEnv.ts +│ ├── Headers.ts +│ ├── RoleUser.ts +│ ├── Styles.ts +│ └── ... (other constants) +├── assets/ # Static assets (images, fonts) +├── lib/ # Business logic and API utilities +├── providers/ # Context providers (AuthProvider) +├── android/ # Android native code +├── ios/ # iOS native code +├── scripts/ # Build and utility scripts +├── index.js # Entry point +├── app.config.js # Expo configuration +├── package.json # Dependencies and scripts +└── eas.json # EAS build configuration +``` + +## Environment Configuration +The application uses environment variables defined in a `.env` file: +- `URL_API` - API endpoint +- `URL_OTP` - OTP service endpoint +- `URL_STORAGE` - Storage endpoint +- `URL_FIREBASE_DB` - Firebase database URL +- `PASS_ENC` - Encryption password +- `WA_SERVER_TOKEN` - WhatsApp server token +- `IOS_GOOGLE_SERVICES_FILE` - Path to iOS Google services file + +## Building and Running + +### Development +1. Install dependencies: + ```bash + npm install + ``` + +2. Run the development server: + ```bash + npx expo start + ``` + +3. For platform-specific builds: + - Android: `npm run android` + - iOS: `npm run ios` + - Web: `npm run web` + +### Production Builds +- Android: `npm run build:android` (uses EAS to build an app bundle) + +### Testing +- Run tests: `npm run test` + +### Linting +- Check code quality: `npm run lint` + +## Key Dependencies +- `@react-native-firebase/*` - Firebase integration +- `@react-navigation/*` - Navigation solutions +- `@reduxjs/toolkit` - State management +- `expo-router` - File-based routing +- `react-native-gesture-handler` - Touch gesture support +- `react-native-reanimated` - Advanced animations +- `react-native-svg` - SVG rendering support + +## Development Conventions +- Uses TypeScript for type safety +- Implements custom styling through the Styles.ts constant file +- Follows Expo's file-based routing convention +- Uses Redux Toolkit for centralized state management +- Implements custom components in the components directory +- Uses absolute imports with @/ alias (e.g., "@/components/...") +- Implements Firebase for authentication and real-time data + +## Deployment +- Uses EAS for building and submitting to app stores +- Supports both Android (APK and App Bundle) and iOS (TestFlight/App Store) +- Configured for internal testing, preview, and production distributions + +## Special Features +- Background message handling for push notifications +- Biometric authentication support +- Image picking and media library access +- Document picker functionality +- Date/time pickers with localization +- Custom toast notifications +- Carousel components for featured content +- Data visualization with charts \ No newline at end of file diff --git a/README.md b/README.md index cd4feb8..edcf945 100644 --- a/README.md +++ b/README.md @@ -1,50 +1,114 @@ -# Welcome to your Expo app 👋 +# Desa+ -This is an [Expo](https://expo.dev) project created with [`create-expo-app`](https://www.npmjs.com/package/create-expo-app). +Desa+ adalah aplikasi mobile berbasis React Native yang dikembangkan dengan Expo untuk membantu pengelolaan dan komunikasi di lingkungan desa/kelurahan. Aplikasi ini menyediakan berbagai fitur untuk memudahkan administrasi desa, komunikasi antar warga, dan pengelolaan informasi penting. -## Get started +## Fitur Utama -1. Install dependencies +- 📢 Pengumuman dan informasi desa +- 💬 Forum diskusi komunitas +- 📅 Kalender kegiatan desa +- 📄 Dokumentasi dan arsip desa +- 📊 Pengelolaan proyek dan tugas desa +- 👥 Manajemen anggota dan struktur organisasi +- 📱 Notifikasi push untuk informasi penting +- 🎯 Fitur verifikasi dan otentikasi +## Teknologi yang Digunakan + +- [React Native](https://reactnative.dev/) - Framework mobile cross-platform +- [Expo](https://expo.dev/) - Platform pengembangan aplikasi React Native +- [Firebase](https://firebase.google.com/) - Backend services (Authentication, Realtime Database, Cloud Messaging) +- [Redux Toolkit](https://redux-toolkit.js.org/) - State management +- [React Navigation](https://reactnavigation.org/) - Navigasi aplikasi +- [TypeScript](https://www.typescriptlang.org/) - Type safety + +## Instalasi + +1. Clone repository ini + ```bash + git clone + cd mobile-darmasaba + ``` + +2. Install dependencies ```bash npm install ``` -2. Start the app - - ```bash - npx expo start +3. Konfigurasi environment variables + Buat file `.env` di root direktori dan tambahkan variabel berikut: + ``` + URL_API= + URL_OTP= + URL_STORAGE= + URL_FIREBASE_DB= + PASS_ENC= + WA_SERVER_TOKEN= + IOS_GOOGLE_SERVICES_FILE= ``` -In the output, you'll find options to open the app in a +4. Jalankan aplikasi + ```bash + npx expo start + ``` -- [development build](https://docs.expo.dev/develop/development-builds/introduction/) -- [Android emulator](https://docs.expo.dev/workflow/android-studio-emulator/) -- [iOS simulator](https://docs.expo.dev/workflow/ios-simulator/) -- [Expo Go](https://expo.dev/go), a limited sandbox for trying out app development with Expo +## Struktur Proyek -You can start developing by editing the files inside the **app** directory. This project uses [file-based routing](https://docs.expo.dev/router/introduction). - -## Get a fresh project - -When you're ready, run: - -```bash -npm run reset-project +``` +├── app/ # File-file halaman utama +├── components/ # Komponen reusable +│ ├── announcement/ # Komponen pengumuman +│ ├── auth/ # Komponen otentikasi +│ ├── discussion/ # Komponen forum diskusi +│ ├── document/ # Komponen dokumentasi +│ ├── project/ # Komponen pengelolaan proyek +│ └── ... +├── assets/ # Gambar dan aset statis +├── constants/ # Konstanta global +├── lib/ # Library dan utilitas +└── ... ``` -This command will move the starter code to the **app-example** directory and create a blank **app** directory where you can start developing. +## Platform Support -## Learn more +Aplikasi ini didukung untuk: +- ✅ Android +- ✅ iOS +- ❌ Web (belum dioptimalkan) -To learn more about developing your project with Expo, look at the following resources: +## Development -- [Expo documentation](https://docs.expo.dev/): Learn fundamentals, or go into advanced topics with our [guides](https://docs.expo.dev/guides). -- [Learn Expo tutorial](https://docs.expo.dev/tutorial/introduction/): Follow a step-by-step tutorial where you'll create a project that runs on Android, iOS, and the web. +Untuk menjalankan aplikasi di masing-masing platform: -## Join the community +### Android +```bash +npm run android +``` -Join our community of developers creating universal apps. +### iOS +```bash +npm run ios +``` -- [Expo on GitHub](https://github.com/expo/expo): View our open source platform and contribute. -- [Discord community](https://chat.expo.dev): Chat with Expo users and ask questions. +### Build Production + +Untuk membuat build production Android: +```bash +npm run build:android +``` + +## Kontribusi + +1. Fork repository ini +2. Buat branch fitur baru (`git checkout -b fitur/NamaFitur`) +3. Commit perubahan Anda (`git commit -m 'Tambahkan fitur NamaFitur'`) +4. Push ke branch (`git push origin fitur/NamaFitur`) +5. Buat pull request + +## Lisensi + +Proyek ini dilisensikan di bawah lisensi MIT - lihat file [LICENSE](LICENSE) untuk detail selengkapnya. + +## Dukungan + +Jika Anda menemukan masalah atau memiliki pertanyaan, silakan buka issue di repository ini. diff --git a/app/(application)/division/[id]/(fitur-division)/document/index.tsx b/app/(application)/division/[id]/(fitur-division)/document/index.tsx index 1faea53..27a02f6 100644 --- a/app/(application)/division/[id]/(fitur-division)/document/index.tsx +++ b/app/(application)/division/[id]/(fitur-division)/document/index.tsx @@ -334,7 +334,7 @@ export default function DocumentDivision() { }, [path]); return ( - + @@ -409,7 +409,6 @@ export default function DocumentDivision() { />