Awesome
Invoice Ninja
Client application for Invoice Ninja.
Desktop Apps
Mobile Apps
<p align="center"> <img src="https://github.com/invoiceninja/flutter-mobile/blob/master/samples/screenshots/1.png" alt="Dashboard" width="200"/> <img src="https://github.com/invoiceninja/flutter-mobile/blob/master/samples/screenshots/2.png" alt="View Invoice" width="200"/> <img src="https://github.com/invoiceninja/flutter-mobile/blob/master/samples/screenshots/3.png" alt="List Invoice" width="200"/> <img src="https://github.com/invoiceninja/flutter-mobile/blob/master/samples/screenshots/4.png" alt="New Invoice" width="200"/> </p>Table of Contents
- Setting up the app
- Steps to remove non-FOSS code
- Application Architecture
- Code generation
- Tests
- Code signing
- Credits
- Contributions
Setting up the app
-
Initialize the config file
cp lib/.env.dart.example lib/.env.dart
-
Support running the code unsigned on Android
cp android/app/build.gradle.dev android/app/build.gradle
-
Run the app
flutter run
Note: if you don't have an Invoice Ninja backend setup you can test the app with these credentials:
- Email:
demo@invoiceninja.com
- Password:
Password0
- URL:
demo.invoiceninja.com
Steps to remove non-FOSS code
cp android/build.gradle.foss android/build.gradle
cp lib/utils/oauth.dart.foss lib/utils/oauth.dart
cp lib/utils/app_review.dart.foss lib/utils/app_review.dart
cp lib/ui/app/upgrade_dialog.dart.foss lib/ui/app/upgrade_dialog.dart
cp lib/ui/app/pinput.dart.foss lib/ui/app/pinput.dart
cp android/app/src/main/AndroidManifest.foss.xml android/app/src/main/AndroidManifest.xml
cp pubspec.foss.yaml pubspec.yaml
rm pubspec.lock
Application Architecture
The application was created using the Flutter Redux Starter.
The architecture is based off these two projects:
File Structure
A High-level overview of the project structure:
lib/ # Root Package
|
├─ data/ # For data handling
│ ├─ mock/ # sample used for testing
│ ├─ models/ # Objects representing data
│ ├─ repositories/ # Source of data
|
├─ redux/ # manages app state
│ ├─ component/ # app building block
│ ├─ actions # methods to update app state
| ├─ middleware # run in response to actions, execute before reducer
| ├─ reducer # intercepts actions, responsible for updating the state
| ├─ selectors # read data from the state, queries against your 'state database'
| ├─ state # immutable object that lives at the top of the widget hierarchy
|
├─ ui/ # app views
│ ├─ component/ # views for different components
│ ├─ view/ # generel view for component
│ ├─ edit/ # change values on the views fields
|
├─ utils/ # Utility classes
The ui and redux folders contain components that are paired together. Put simply you will find an 'auth' folder in both the ui and redux folders.
For additional information on Redux architecture
Blog Posts
- Intro to Google Flutter
- Using Redux to manage state
- Handling complex forms
- Architectural review
- Additional thoughts
Code generation
- Run
flutter packages pub run build_runner build --delete-conflicting-outputs
to regenerate the model files. It will also remove the old generated files so conflicts are avoided..
Tests
- Run
flutter drive --target=test_driver/all_it.dart
to run the tests
Credits
https://github.com/invoiceninja/invoiceninja#credits
Contributions
We gladly accept contributions! If you'd like to get involved with development please join our Slack group or Discord Server.