Part of the implementation of the Compass App for the Architecture
sample.
**Merge to `compass-app`**
This PR introduces the Search Form Screen, in which users can select a
region, a date range and the number of guests.
The feature is split in 5 different widgets, each one depending on the
`SearchFormViewModel`. The architecture follows the same patterns
implemented in the previous PR
https://github.com/flutter/samples/pull/2342
TODO later on:
- Error handling is yet not implemented, we need to introduce a "logger"
and a way to handle error responses.
- All repositories return local data, next steps include creating the
dart server app.
- The search query at the moment only takes the "continent" and not the
dates and number of guests, that would be implemented later on as well.
## Demo
[Screencast from 2024-07-12
14-30-48.webm](https://github.com/user-attachments/assets/afbcdd4e-617a-49cc-894c-8e082748e572)
## Pre-launch Checklist
- [x] I read the [Flutter Style Guide] _recently_, and have followed its
advice.
- [x] I signed the [CLA].
- [x] I read the [Contributors Guide].
- [x] I updated/added relevant documentation (doc comments with `///`).
- [x] All existing and new tests are passing.
If you need help, consider asking for advice on the #hackers-devrel
channel on [Discord].
<!-- Links -->
[Flutter Style Guide]:
https://github.com/flutter/flutter/blob/master/docs/contributing/Style-guide-for-Flutter-repo.md
[CLA]: https://cla.developers.google.com/
[Discord]:
https://github.com/flutter/flutter/blob/master/docs/contributing/Chat.md
[Contributors Guide]:
https://github.com/flutter/samples/blob/main/CONTRIBUTING.md
As part of the work for the compass-app / architecture examples
This PR is considerably large, so apologies for that, but as it contains
the first feature there is a lot of set up work involved.
Could be easier to review by opening the project on the IDE.
**Merge to `compass-app` not `main`**
cc. @ericwindmill
### Details
#### Folder structure
The project follows this folder structure:
- `lib/config/`: Put here any configuration files.
- `lib/config/dependencies.dart`: Configures the dependency tree (i.e.
Provider)
- `lib/data/models/`: Data classes
- `lib/data/repositories/`: Data repositories
- `lib/data/services/`: Data services (e.g. network API client)
- `lib/routing`: Everything related to navigation (could be moved to
`common`)
- `lib/ui/core/themes`: several theming classes are here: colors, text
styles and the app theme.
- `lib/ui/core/ui`: widget components to use across the app
- `lib/ui/<feature>/view_models`: ViewModels for the feature.
- `lib/ui/<feature>/widgets`: Widgets for the feature.
Unit tests also follow the same structure.
#### State Management
Most importantly, the project uses MVVM approach using `ChangeNotifier`
with the help of Provider.
This could be implemented without Provider or using any other way to
inject the VM into the UI classes.
#### Architecture approach
- Data follows a unidirectional flow from Repository -> Usecase ->
ViewModel -> Widgets -> User.
- The provided data Repository is using local data from the `assets`
folder, an abstract class is provided to hide this implementation detail
to the Usecase, and also to allow multiple implementations in the
future.
### Screenshots
### Extra notes:
- Moved the app code to the `app` folder. We need to create a `server`
project eventually.
### TODO:
- Integrate a logging framework instead of using `print()`.
- Do proper error handling.
- Improve image loading and caching.
- Complete tests with edge-cases and errors.
- Better Desktop UI.
## Pre-launch Checklist
- [x] I read the [Flutter Style Guide] _recently_, and have followed its
advice.
- [x] I signed the [CLA].
- [x] I read the [Contributors Guide].
- [x] I updated/added relevant documentation (doc comments with `///`).
- [x] All existing and new tests are passing.
If you need help, consider asking for advice on the #hackers-devrel
channel on [Discord].
<!-- Links -->
[Flutter Style Guide]:
https://github.com/flutter/flutter/blob/master/docs/contributing/Style-guide-for-Flutter-repo.md
[CLA]: https://cla.developers.google.com/
[Discord]:
https://github.com/flutter/flutter/blob/master/docs/contributing/Chat.md
[Contributors Guide]:
https://github.com/flutter/samples/blob/main/CONTRIBUTING.md
Miguel Beltran