docs,fix,style: Improve README.md, revamp home screen, restructuring home folder with BLoC approach, etc.

Author: a6iyyu

README.md

@@ -3,19 +3,69 @@
 <div align="center">
 
 ![Android](https://img.shields.io/badge/Android-34A853?style=flat&logo=android&logoColor=white)
+![iOS](https://img.shields.io/badge/iOS-000000?style=flat&logo=apple&logoColor=white)
 ![Dart](https://img.shields.io/badge/Dart-0175C2?style=flat&logo=dart&logoColor=white)
 ![Flutter](https://img.shields.io/badge/Flutter-02569B?style=flat&logo=flutter&logoColor=white)
 
 </div>
 
-<p align="center">Monet is a simple application to track your money with NFC banking card.</p>
+<p align="center">Monet is a simple, frictionless personal finance application that tracks your money using NFC banking cards.</p>
+
+## 📖 Overview
+
+Monet is a cross-platform mobile application ecosystem designed to simplify personal finance tracking. By leveraging the built-in Near Field Communication (NFC) hardware on smartphones, Monet provides a unique, frictionless experience. Users can simply tap their physical banking or e-money cards against their device to trigger an automated, zero-touch transaction logging workflow.
+
+> **Disclaimer:** This repository currently contains ONLY the **Flutter Frontend Client** of the Monet application. The Golang backend API (as specified in the SRS) is maintained in a separate repository or is pending implementation.
+
+## 📱 Screenshots
+
+|                           Home Dashboard                           |                          NFC Scanner                           |                         Expense Analytics                          |
+| :----------------------------------------------------------------: | :------------------------------------------------------------: | :----------------------------------------------------------------: |
+| <img src="docs/assets/home.png" width="200" alt="Home Dashboard"/> | <img src="docs/assets/nfc.png" width="200" alt="NFC Scanner"/> | <img src="docs/assets/analytics.png" width="200" alt="Analytics"/> |
+
+_(Note: Replace the image paths with actual screenshots of the application)._
+
+## ✨ Key Features
+
+- **NFC Hardware Integration:** Reads public metadata and UID from physical banking or e-money cards utilizing platform-specific NFC channels (e.g., `nfc_manager`), linking physical assets directly to digital tracking without processing actual financial transactions.
+- **Zero-Touch Expense Routing (Smart Auto-Fill):** Tapping a previously registered card instantly routes the user to a transaction form. The "Payment Method" and "Card Alias" are automatically locked and pre-filled, requiring the user to only input the transaction amount.
+- **Offline-First Caching Mechanism:** Ensures transactions can be logged even in areas with poor cellular reception. Utilizing local SQLite or Hive databases, pending entries are cached and later synchronized securely with the backend API once connectivity is restored via a background isolate.
+- **Budgeting & Analytics Dashboard:** Offers an interactive visualization of financial health, featuring pie charts for category breakdowns and line charts for spending trends, powered by the `fl_chart` library.
+- **Secure Authentication & Session Management:** Implements secure user onboarding using email and password, OTP verification for password recovery, and stateless API access managed via JSON Web Tokens (JWT). JWTs are stored client-side using platform-specific Secure Storage (Keychain for iOS, Keystore for Android).
+- **Manual Financial Management:** Provides traditional capabilities for users to manually input income and expenses, attach notes, and categorize transactions.
 
 ## 💻 Tech Stack
 
 - **Framework**: Flutter
 - **Language**: Dart
-- **Platform**: Android
-- **NFC**: Android NFC API
+- **Architecture Pattern**: Feature-First BLoC (Business Logic Component)
+- **Routing**: GoRouter (Declarative Routing)
+- **Network**: Dio
+- **Platform**: Android (Target API 26+) & iOS (Target iOS 13.0+)
+- **NFC**: Android NFC API & iOS CoreNFC
+- **Data Visualization**: fl_chart
+- **Local Storage**: Flutter Secure Storage (Keystore/Keychain) & SQLite/Hive (for offline caching)
+
+## 📁 Project Architecture
+
+This project follows a **Feature-First Architecture** utilizing the BLoC pattern for predictable state management.
+
+```text
+lib/
+├── core/                   # Global utilities, shared widgets, theme, and constants
+│   ├── constants/          # API endpoints, colors (Palette), routes
+│   ├── services/           # Secure storage, region formatters
+│   ├── utils/              # Loggers and formatters
+│   └── widgets/            # Reusable UI components (Buttons, Inputs)
+├── features/               # Isolated feature modules
+│   ├── auth/               # Login, Register, OTP, Password Reset
+│   ├── expense_tracker/    # Analytics, Charts, History
+│   ├── home/               # Dashboard, Balance Card, Quick Actions
+│   ├── nfc_scanner/        # NFC Hardware Integration
+│   ├── profile/            # User Profile Management
+│   └── settings/           # App Preferences and Configurations
+└── routes/                 # GoRouter configuration and route generation
+```
 
 ## 🌐 Installation for Development
 
@@ -24,35 +74,44 @@
 - Flutter SDK (latest stable version)
 - Dart SDK (included with Flutter)
 - Android Studio or VS Code
-- Android emulator or physical device with NFC capability
+- Android emulator or physical device with **NFC capability** (required for automated card reading features; manual entry fallback is available for non-NFC devices).
 
-### Setup
+### Setup & Environment Configuration
 
-1. Clone the repository:
+1. **Clone the repository:**
 
    ```bash
    git clone https://www.github.com/a6iyyu/monet
    cd monet
    ```
 
-2. Install dependencies:
+2. **Install dependencies:**
 
    ```bash
    flutter pub get
    ```
 
-3. Run the app:
+3. **Run the app with Environment Variables:**
+   The application requires an API Base URL to connect to the backend. You must pass this during runtime using `--dart-define`.
 
    ```bash
-   flutter run
+   flutter run --dart-define=API_BASE_URL=https://your-backend-api.com # Coming Soon
    ```
 
-4. Build release APK:
-
+4. **Build release APK:**
    ```bash
-   flutter build apk --release
+   flutter build apk --release --dart-define=API_BASE_URL=https://your-production-api.com # Coming Soon
    ```
 
+## 🔒 Security & Privacy
+
+Monet handles banking card metadata (UIDs) and adheres strictly to security best practices:
+
+- **No Financial Processing:** Monet does not act as a payment gateway and will not execute or process actual financial transactions (EMV protocols) from scanned cards.
+- **Data Privacy:** The system only reads and stores the public UID and user-assigned alias. It is strictly prohibited from attempting to read, decode, or store sensitive financial elements such as EMV chip cryptograms, CVV, or PIN blocks.
+- **Secure Communication:** All client-server data exchange must be transmitted over HTTPS utilizing TLS 1.2 or TLS 1.3.
+- **Client-Side Storage:** Sensitive session data (JWTs) must be stored using platform-level hardware-backed enclaves (`EncryptedSharedPreferences` / `KeyStore` on Android and `Keychain Services` on iOS).
+
 ---
 
 <p align="center">Made with ♥️ by Rafi Abiyyu Airlangga</p>

assets/icons/login.png

@@ -17,6 +17,8 @@ class ApiEndpoints {
   static const String otp = '$baseUrlPrefix/auth/otp';
   static const String profile = '$baseUrlPrefix/user/profile';
   static const String register = '$baseUrlPrefix/auth/register';
+  static const String resendOtp = '$baseUrlPrefix/auth/resend-otp';
+  static const String notifications = '$baseUrlPrefix/notifications';
   static const String resetPassword = '$baseUrlPrefix/auth/reset-password';
 
   // NFC Banking Card Endpoints

lib/core/constants/api_endpoints.dart

@@ -11,23 +11,22 @@ class Formatters {
     return text[0].toUpperCase() + text.substring(1).toLowerCase();
   }
 
-  /// Formats a double value into a currency string with the specified symbol and locale.
-  static String currency(double amount, {String symbol = 'Rp '}) {
-    return NumberFormat.currency(decimalDigits: 0, locale: 'id_ID', symbol: symbol).format(amount);
-  }
+  /// Formats a double value into a currency string.
+  /// Mendukung format kode mata uang (IDR, USD, EUR) maupun simbol kustom.
+  static String currency(double amount, {String currency = 'IDR', String? symbol, int decimalDigits = 0}) {
+    final effectiveSymbol = symbol ?? (currency.toUpperCase() == 'IDR' ? 'Rp ' : '$currency ');
+    final locale = currency.toUpperCase() == 'IDR' ? 'id_ID' : 'en_US';
 
-  /// Formats a date and time value into a string with the specified format and locale.
-  static String dateTime(DateTime date) {
-    return DateFormat('dd MMM yyyy, HH:mm', 'id_ID').format(date);
+    return NumberFormat.currency(locale: locale, symbol: effectiveSymbol, decimalDigits: decimalDigits).format(amount);
   }
 
   /// Masks a card number by replacing all but the last four digits with asterisks.
   static String maskCardNumber(String cardNumber) {
     if (cardNumber.length <= 4) {
-      return cardNumber; // Return the original number if it's too short to mask
+      return cardNumber;
     }
 
     final String lastFour = cardNumber.substring(cardNumber.length - 4);
-    return '**** **** **** $lastFour'; // Mask all but the last four digits
+    return '•••• •••• •••• $lastFour';
   }
 }

lib/core/utils/formatters.dart

@@ -11,6 +11,7 @@ class AuthBloc extends Bloc<AuthEvent, AuthState> {
     on<LoginSubmitted>(_onLoginSubmitted);
     on<OtpVerified>(_onOtpVerified);
     on<RegisterSubmitted>(_onRegisterSubmitted);
+    on<ResendOtpSubmitted>(_onResendOtpSubmitted);
     on<ResetPasswordSubmitted>(_onResetPasswordSubmitted);
   }
 
@@ -41,7 +42,18 @@ class AuthBloc extends Bloc<AuthEvent, AuthState> {
 
     try {
       await authRepository.verifyOtp(event.request);
-      emit(AuthSuccess(message: 'OTP Verified Successfully!'));
+      emit(OtpVerificationSuccess(message: 'OTP Verified Successfully!'));
+    } catch (e) {
+      emit(AuthError(e.toString().replaceAll('Exception: ', '')));
+    }
+  }
+
+  Future<void> _onResendOtpSubmitted(ResendOtpSubmitted event, Emitter<AuthState> emit) async {
+    emit(AuthLoading());
+
+    try {
+      await authRepository.resendOtp(event.email);
+      emit(OtpResendSuccess(message: 'Verification code resent successfully!'));
     } catch (e) {
       emit(AuthError(e.toString().replaceAll('Exception: ', '')));
     }

lib/features/auth/bloc/auth_bloc.dart

@@ -26,6 +26,11 @@ class ForgotPasswordSubmitted extends AuthEvent {
   ForgotPasswordSubmitted(this.email);
 }
 
+class ResendOtpSubmitted extends AuthEvent {
+  final String email;
+  ResendOtpSubmitted(this.email);
+}
+
 class ResetPasswordSubmitted extends AuthEvent {
   final String token;
   final String newPassword;

lib/features/auth/bloc/auth_event.dart

@@ -3,6 +3,11 @@ import 'package:flutter/foundation.dart';
 @immutable
 sealed class AuthState {}
 
+class AuthError extends AuthState {
+  final String errorMessage;
+  AuthError(this.errorMessage);
+}
+
 class AuthInitial extends AuthState {}
 
 class AuthLoading extends AuthState {}
@@ -14,7 +19,12 @@ class AuthSuccess extends AuthState {
   AuthSuccess({required this.message, this.emailContext});
 }
 
-class AuthError extends AuthState {
-  final String errorMessage;
-  AuthError(this.errorMessage);
+class OtpVerificationSuccess extends AuthState {
+  final String message;
+  OtpVerificationSuccess({this.message = 'OTP Verified Successfully!'});
+}
+
+class OtpResendSuccess extends AuthState {
+  final String message;
+  OtpResendSuccess({this.message = 'A new verification code has been sent.'});
 }

lib/features/auth/bloc/auth_state.dart

@@ -0,0 +1,4 @@
+enum OtpPurpose {
+  forgotPassword,
+  registration,
+}

lib/features/auth/data/models/otp_purpose.dart

@@ -85,6 +85,20 @@ class AuthRepository {
     }
   }
 
+  Future<void> resendOtp(String email) async {
+    try {
+      final response = await _dio.post(ApiEndpoints.resendOtp, data: {'email': email});
+
+      if (response.statusCode != 200 && response.statusCode != 201) {
+        throw Exception('Failed to resend OTP code.');
+      }
+    } on DioException catch (e) {
+      throw Exception(_handleDioError(e, context: 'resend_otp'));
+    } catch (e) {
+      throw Exception(e.toString().replaceAll('Exception: ', ''));
+    }
+  }
+
   Future<void> resetPassword(String token, String newPassword) async {
     try {
       final response = await _dio.post(
@@ -133,6 +147,7 @@ class AuthRepository {
       (404, 'forgot_password')    => 'Email address not found.',
       (409, 'register')           => 'This email is already registered. Try logging in instead.',
       (400 || 422 || 401, 'otp')  => 'Invalid OTP code. Please try again.',
+      (429, 'resend_otp')         => 'Too many requests. Please wait before requesting another OTP.',
       (400 || 422, _)             => 'Invalid data provided. Please check your input fields.',
       _                           => 'An unexpected error occurred.',
     };

lib/features/auth/data/repositories/auth_repository.dart

@@ -10,16 +10,8 @@ class OtpScreen extends StatelessWidget {
   Widget build(BuildContext context) {
     return Scaffold(
       backgroundColor: Palette.background,
-      appBar: AppBar(
-        backgroundColor: Colors.transparent,
-        elevation: 0,
-        iconTheme: const IconThemeData(color: Palette.textPrimary),
-      ),
       body: SafeArea(
-        child: SingleChildScrollView(
-          padding: const EdgeInsets.symmetric(horizontal: 24.0),
-          child: OtpForm(email: email),
-        ),
+        child: SingleChildScrollView(child: OtpForm(email: email)),
       ),
     );
   }