Merge pull request #7 from leandro-mancini/feat/shared/widgets

Feat/shared/widgets

Author: leandro-mancini

apps/flutter/suflex/project.json

@@ -3,6 +3,7 @@
   "name": "flutter-suflex",
   "sourceRoot": "apps/flutter/suflex/src",
   "projectType": "application",
+  "implicitDependencies": ["flutter-characters", "flutter-episodes"],
   "targets": {
     "analyze": {
       "executor": "@nrwl/workspace:run-commands",

apps/flutter/suflex/pubspec.lock

@@ -84,7 +84,7 @@ packages:
     source: sdk
     version: "0.0.0"
   flutter_api:
-    dependency: "direct main"
+    dependency: transitive
     description:
       path: "../../../libs/flutter/api"
       relative: true
@@ -132,6 +132,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "0.0.2"
+  flutter_shared:
+    dependency: "direct main"
+    description:
+      path: "../../../libs/flutter/shared"
+      relative: true
+    source: path
+    version: "0.0.1"
   flutter_svg:
     dependency: transitive
     description:
@@ -345,6 +352,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.1.1"
+  skeletons:
+    dependency: "direct main"
+    description:
+      name: skeletons
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.0.3"
   sky_engine:
     dependency: transitive
     description: flutter

apps/flutter/suflex/pubspec.yaml

@@ -34,12 +34,13 @@ dependencies:
   mobx: ^2.1.1
   intl: ^0.17.0
   shared_preferences: ^2.0.15
+  skeletons: ^0.0.3
   flutter_characters:
     path: ../../../libs/flutter/characters
   flutter_episodes:
     path: ../../../libs/flutter/episodes
-  flutter_api:
-    path: ../../../libs/flutter/api
+  flutter_shared:
+    path: ../../../libs/flutter/shared
 
 
   # The following adds the Cupertino Icons font to your application.

libs/flutter/api/lib/src/shared/shared_pref.dart

@@ -37,38 +37,3 @@ class SharedPref {
     prefs.setString(key, s);
   }
 }
-
-// import 'dart:convert';
-
-// import 'package:flutter_api/flutter_api.dart';
-// import 'package:shared_preferences/shared_preferences.dart';
-
-// class SharedPref {
-//   read(String key) async {
-//     SharedPreferences prefs = await SharedPreferences.getInstance();
-
-//     Map<String, dynamic> json = prefs.getString(key);
-//     var user = Character.fromJson(json);
-
-//     // Map json = jsonDecode(prefs.getString(key));
-
-//     print(user);
-
-//     // jsonDecode(prefs.getString(key))
-
-//     // json.decode();
-
-//     return prefs.getString(key);
-//   }
-
-//   save(String key, value) async {
-//     SharedPreferences prefs = await SharedPreferences.getInstance();
-    
-//     prefs.setString(key, json.encode(value));  
-//   }
-
-//   remove(String key) async {
-//     final prefs = await SharedPreferences.getInstance();
-//     prefs.remove(key);
-//   }
-// }

libs/flutter/characters/.flutter-plugins-dependencies

@@ -1 +1 @@
-{"info":"This is a generated file; do not edit or check into version control.","plugins":{"ios":[{"name":"shared_preferences_ios","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_ios-2.1.1\\\\","native_build":true,"dependencies":[]}],"android":[{"name":"shared_preferences_android","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_android-2.0.14\\\\","native_build":true,"dependencies":[]}],"macos":[{"name":"shared_preferences_macos","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_macos-2.0.4\\\\","native_build":true,"dependencies":[]}],"linux":[{"name":"path_provider_linux","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\path_provider_linux-2.1.7\\\\","native_build":false,"dependencies":[]},{"name":"shared_preferences_linux","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_linux-2.1.1\\\\","native_build":false,"dependencies":["path_provider_linux"]}],"windows":[{"name":"path_provider_windows","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\path_provider_windows-2.1.3\\\\","native_build":false,"dependencies":[]},{"name":"shared_preferences_windows","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_windows-2.1.1\\\\","native_build":false,"dependencies":["path_provider_windows"]}],"web":[{"name":"shared_preferences_web","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_web-2.0.4\\\\","dependencies":[]}]},"dependencyGraph":[{"name":"path_provider_linux","dependencies":[]},{"name":"path_provider_windows","dependencies":[]},{"name":"shared_preferences","dependencies":["shared_preferences_android","shared_preferences_ios","shared_preferences_linux","shared_preferences_macos","shared_preferences_web","shared_preferences_windows"]},{"name":"shared_preferences_android","dependencies":[]},{"name":"shared_preferences_ios","dependencies":[]},{"name":"shared_preferences_linux","dependencies":["path_provider_linux"]},{"name":"shared_preferences_macos","dependencies":[]},{"name":"shared_preferences_web","dependencies":[]},{"name":"shared_preferences_windows","dependencies":["path_provider_windows"]}],"date_created":"2022-10-22 01:57:39.281944","version":"3.0.5"}
+{"info":"This is a generated file; do not edit or check into version control.","plugins":{"ios":[{"name":"shared_preferences_ios","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_ios-2.1.1\\\\","native_build":true,"dependencies":[]}],"android":[{"name":"shared_preferences_android","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_android-2.0.14\\\\","native_build":true,"dependencies":[]}],"macos":[{"name":"shared_preferences_macos","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_macos-2.0.4\\\\","native_build":true,"dependencies":[]}],"linux":[{"name":"path_provider_linux","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\path_provider_linux-2.1.7\\\\","native_build":false,"dependencies":[]},{"name":"shared_preferences_linux","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_linux-2.1.1\\\\","native_build":false,"dependencies":["path_provider_linux"]}],"windows":[{"name":"path_provider_windows","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\path_provider_windows-2.1.3\\\\","native_build":false,"dependencies":[]},{"name":"shared_preferences_windows","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_windows-2.1.1\\\\","native_build":false,"dependencies":["path_provider_windows"]}],"web":[{"name":"shared_preferences_web","path":"C:\\\\src\\\\flutter\\\\.pub-cache\\\\hosted\\\\pub.dartlang.org\\\\shared_preferences_web-2.0.4\\\\","dependencies":[]}]},"dependencyGraph":[{"name":"path_provider_linux","dependencies":[]},{"name":"path_provider_windows","dependencies":[]},{"name":"shared_preferences","dependencies":["shared_preferences_android","shared_preferences_ios","shared_preferences_linux","shared_preferences_macos","shared_preferences_web","shared_preferences_windows"]},{"name":"shared_preferences_android","dependencies":[]},{"name":"shared_preferences_ios","dependencies":[]},{"name":"shared_preferences_linux","dependencies":["path_provider_linux"]},{"name":"shared_preferences_macos","dependencies":[]},{"name":"shared_preferences_web","dependencies":[]},{"name":"shared_preferences_windows","dependencies":["path_provider_windows"]}],"date_created":"2022-10-22 05:18:52.864957","version":"3.0.5"}

libs/flutter/characters/lib/src/characters_controller.dart

@@ -7,24 +7,47 @@ var characterService = CharacterService();
 class CharactersController = CharactersControllerBase with _$CharactersController;
 
 abstract class CharactersControllerBase with Store {
+  @observable
+  List<Character> allCharacters = <Character>[];
+
   @observable
   List<Character> characters = <Character>[];
 
   @observable
   bool hasCharacters = false;
 
+  @observable
+  bool hasFilterCharacters = false;
+
   @action
   getAllCharacters() async {
-    characters = await characterService.getAllCharacters();
+    allCharacters = await characterService.getAllCharacters();
+    characters = allCharacters;
     hasCharacters = true;
   }
 
   @action
   getFilteredCharacters(CharacterFilters filters) async {
     hasCharacters = false;
 
-    characters = await characterService.getFilteredCharacters(filters);
+    allCharacters = await characterService.getFilteredCharacters(filters);
+    characters = allCharacters;
 
     hasCharacters = true;
   }
+
+  @action
+  getFilteredToCharacter(String value) async {
+    if (value.isEmpty) {
+      hasFilterCharacters = false;
+      characters = allCharacters;
+    } else {
+      List<Character> searchCharacter = allCharacters
+        .where((element) => element.name.toLowerCase().contains(value.toLowerCase()))
+        .toList();
+
+      hasFilterCharacters = true;
+      characters = searchCharacter;
+    }
+  }
 }

libs/flutter/characters/lib/src/characters_controller.g.dart

@@ -1,10 +1,10 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_api/flutter_api.dart';
 import 'package:flutter_characters/src/characters_controller.dart';
-import 'package:flutter_characters/src/widgets/feedback_page_widget.dart';
 import 'package:flutter_characters/src/widgets/filters_widget.dart';
 import 'package:flutter_mobx/flutter_mobx.dart';
 import 'package:flutter_modular/flutter_modular.dart';
+import 'package:flutter_shared/flutter_shared.dart';
 
 class CharactersPage extends StatefulWidget {
   const CharactersPage({Key? key}) : super(key: key);
@@ -34,69 +34,36 @@ class _CharactersPageState extends State<CharactersPage> {
   Widget build(BuildContext context) {
     return Scaffold(
       backgroundColor: Colors.white,
-      appBar: buildAppBar(),
-      body: SafeArea(
-        child: buildList(),
-      ),
-    );
-  }
-
-  AppBar buildAppBar() {
-    return AppBar(
-      elevation: 0,
-      backgroundColor: Colors.white,
-      title: const Text('Personagens', style: TextStyle(color: Colors.black87, fontSize: 16),),
-      actions: [
-        IconButton(
-          icon: const Icon(
-            Icons.bookmark_added,
-            color: Colors.red,
-          ),
-          onPressed: () => Modular.to.pushNamed('/favorites'),
-        ),
-        IconButton(
-          icon: const Icon(
-            Icons.filter_list_outlined,
-            color: Colors.red,
-          ),
-          onPressed: () => changeFilter(),
-        )
-      ],
-      bottom: AppBar(
-        elevation: 0,
-        automaticallyImplyLeading: false,
-        backgroundColor: Colors.white,
-        title: SizedBox(
-          height: 42,
-          child: TextField(
-            controller: searchValueController,
-            cursorColor: Colors.grey,
-            decoration: InputDecoration(
-              contentPadding: const EdgeInsets.all(0),
-              fillColor: Colors.grey[100],
-              filled: true,
-              border: OutlineInputBorder(
-                borderRadius: BorderRadius.circular(12),
-                borderSide: BorderSide.none
-              ),
-              hintText: 'Buscar personagens',
-              hintStyle: const TextStyle(
-                color: Colors.grey,
-                fontSize: 16
-              ),
-              prefixIcon: Container(
-                padding: const EdgeInsets.symmetric(horizontal: 16),
-                width: 18,
-                child: const Icon(Icons.search),
-              )
+      appBar: AppBarWidget(
+        title: 'Personagens',
+        searchHintText: 'Buscar personagens',
+        searchController: searchValueController,
+        textInputAction: TextInputAction.search,
+        onSubmitted: (value) {
+          Modular.to.pushNamed('/character/search/$value')
+            .then((value) => charactersController.getAllCharacters());
+          searchValueController.clear();
+        },
+        onChanged: ((value) => charactersController.getFilteredToCharacter(value)),
+        actions: [
+          IconButton(
+            icon: const Icon(
+              Icons.bookmark_added,
+              color: Colors.red,
             ),
-            onSubmitted: (value) {
-              Modular.to.pushNamed('/character/search/$value');
-              searchValueController.clear();
-            },
-            textInputAction: TextInputAction.search,
+            onPressed: () => Modular.to.pushNamed('/favorites'),
           ),
-        ),
+          IconButton(
+            icon: const Icon(
+              Icons.filter_list_outlined,
+              color: Colors.red,
+            ),
+            onPressed: () => changeFilter(),
+          )
+        ],
+      ),
+      body: SafeArea(
+        child: buildList(),
       ),
     );
   }
@@ -105,26 +72,37 @@ class _CharactersPageState extends State<CharactersPage> {
     return Observer(
       builder: (_) {
         if (charactersController.characters.isEmpty && charactersController.hasCharacters) {
-          return const FeedbackPageWidget(
-            illustration: 'assets/illustrations/search.svg',
-            message: 'Desculpe, não conseguimos \n encontrar o personagem',
+          return SingleChildScrollView(
+            child: FeedbackPageWidget(
+              illustration: Assets.ilSearch,
+              message: 'Desculpe, não conseguimos \n encontrar o personagem',
+              description: 'Não se preocupe, ainda podemos \nbuscar no banco de dados.',
+              enabledAction: true,
+              textButton: 'Buscar',
+              onPressed: () {
+                Modular.to.pushNamed('/character/search/${searchValueController.text}')
+                  .then((value) => charactersController.getAllCharacters());
+                searchValueController.clear();
+              },
+            ),
           );
         }
 
-        return charactersController.hasCharacters ? ListView.builder(
-          itemCount: charactersController.characters.length,
-          itemBuilder: (context, index) {
-            return ListTile(
-              leading: CircleAvatar(
+        return SkeletonListWidget(
+          itemCount: 10,
+          isLoading: !charactersController.hasCharacters,
+          child: ListView.builder(
+            itemCount: charactersController.characters.length,
+            itemBuilder: (context, index) {
+              return ListTileWidget(
+                title: charactersController.characters[index].name,
+                subtitle: charactersController.characters[index].species,
                 backgroundImage: NetworkImage(charactersController.characters[index].image),
-                backgroundColor: Colors.grey[300]
-              ),
-              title: Text(charactersController.characters[index].name),
-              subtitle: Text(charactersController.characters[index].species),
-              onTap: () => Modular.to.pushNamed('/character/${charactersController.characters[index].id}'),
-            );
-          },
-        ) : const Center(child: CircularProgressIndicator(),);
+                onTap: () => Modular.to.pushNamed('/character/${charactersController.characters[index].id}'),
+              );
+            },
+          ),
+        );
       },
     );
   }