Major app UI polish and performance improvements with isolates and th…

…reads management

- Major performance improvements with pub service.
- Faster load time and background update for pub packages.
- Efficient use of cache for pub packages
- Isolated fetching pub packages to a different thread
- Fixes and better isolate threads management
- Animated stage and coming soon labels
- Performance improvements in home page load times
- Polished UI in home page
- New pinning projects feature
- New collapsing grouped tiles in workflow and projects tab.
- Collapsed project groups are persistent
- Major other improvements and enhancements with load times and background checks.
- UI polish for light mode buttons and containers (minor fixes for dark mode)
- Staged workflows tab as beta from alpha

installer/bin/installer.dart

@@ -0,0 +1,6 @@
+import 'dart:io';
+
+void main(List<String> args) {
+  print('NOT IMPLEMENTED');
+  exit(1);
+}

installer/pubspec.yaml

@@ -0,0 +1,12 @@
+name: fm_installer
+description: The FlutterMatic installer that helps install a new version of FlutterMatic.
+
+environment:
+  sdk: ">=2.12.0 <3.0.0"
+
+dependencies:
+  process_run: ^0.12.3+2
+
+dev_dependencies:
+  flutter_lints: ^1.0.4
+  import_sorter: ^4.6.0

lib/app/constants/constants.dart

@@ -9,7 +9,6 @@ import 'package:flutter/material.dart';
 import 'package:process_run/shell.dart';
 
 // 🌎 Project imports:
-import 'package:fluttermatic/components/widgets/ui/activity_tile.dart';
 import 'package:fluttermatic/core/models/flutter_sdk.model.dart';
 import 'package:fluttermatic/core/models/fluttermatic.model.dart';
 
@@ -40,8 +39,6 @@ String? tagName;
 /// SHA for vscode
 String? sha;
 
-List<BgActivityTile> bgActivityTiles = <BgActivityTile>[];
-
 // OS
 String platform = Platform.operatingSystem;
 String osName = Platform.operatingSystem;

lib/app/constants/shared_pref.dart

@@ -32,8 +32,8 @@ class SPConst {
   static String gitVersion = 'GIT_VERSION';
 
   // Java Setup
-  static String javaVersion = 'JAVA_VERSION';
   static String javaPath = 'JAVA_PATH';
+  static String javaVersion = 'JAVA_VERSION';
 
   // Android Studio Setup
   static String aStudioPath = 'ANDROID_STUDIO_PATH';
@@ -48,6 +48,11 @@ class SPConst {
   static String lastProjectsReload = 'LAST_PROJECTS_RELOAD';
   static String projectRefresh = 'PROJECT_REFRESH_INTERVALS';
 
+  // Tile Collapse Memory
+  static String dartProjectsCollapsed = 'DART_PROJECTS_COLLAPSED';
+  static String pinnedProjectsCollapsed = 'PINNED_PROJECTS_COLLAPSED';
+  static String flutterProjectsCollapsed = 'FLUTTER_PROJECTS_COLLAPSED';
+
   // Last Check Updates
   static String lastGitUpdateCheck = 'LAST_GIT_UPDATE_CHECK';
   static String lastJavaUpdateCheck = 'LAST_JAVA_UPDATE_CHECK';

lib/components/dialog_templates/about/sections/changelog.dart

@@ -106,7 +106,6 @@ class _ChangelogAboutSectionState extends State<ChangelogAboutSection> {
           return Padding(
             padding: const EdgeInsets.only(bottom: 10),
             child: RoundContainer(
-              color: Colors.blueGrey.withOpacity(0.2),
               child: MarkdownBody(
                 data: _data[index],
                 selectable: true,

lib/components/dialog_templates/about/sections/contributors.dart

@@ -26,14 +26,18 @@ class ContributorsAboutSection extends StatefulWidget {
 }
 
 class _ContributorsAboutSectionState extends State<ContributorsAboutSection> {
+  static const List<_ContributorTile> _contributors = <_ContributorTile>[
+    _ContributorTile('56755783'), // Ziyad
+    _ContributorTile('35523357'), // Minnu
+  ];
+
   @override
   Widget build(BuildContext context) {
     return TabViewTabHeadline(
       title: 'Contributors',
       content: <Widget>[
         RoundContainer(
           width: double.infinity,
-          color: Colors.blueGrey.withOpacity(0.2),
           child: Row(
             children: <Widget>[
               Expanded(
@@ -51,7 +55,6 @@ class _ContributorsAboutSectionState extends State<ContributorsAboutSection> {
               ),
               HSeparators.small(),
               RectangleButton(
-                color: Colors.blueGrey.withOpacity(0.4),
                 width: 90,
                 onPressed: () =>
                     launch('https://github.com/FlutterMatic/desktop'),
@@ -63,7 +66,6 @@ class _ContributorsAboutSectionState extends State<ContributorsAboutSection> {
         VSeparators.xSmall(),
         if (_failedRequest)
           RoundContainer(
-            color: Colors.blueGrey.withOpacity(0.2),
             width: double.infinity,
             child: Column(
               children: <Widget>[
@@ -84,28 +86,24 @@ class _ContributorsAboutSectionState extends State<ContributorsAboutSection> {
             ),
           )
         else
-          Column(
-            children: const <Widget>[
-              ContributorTile('56755783'), // Ziyad
-              ContributorTile('35523357'), // Minnu
-            ],
-          ),
+          Column(children: _contributors),
       ],
     );
   }
 }
 
-// Just trying to get the data from the github api.
-class ContributorTile extends StatefulWidget {
+// Will get the contributor user information from the GitHub api and return
+// a widget that displays the information.
+class _ContributorTile extends StatefulWidget {
   final String gitHubId;
 
-  const ContributorTile(this.gitHubId, {Key? key}) : super(key: key);
+  const _ContributorTile(this.gitHubId, {Key? key}) : super(key: key);
 
   @override
   _ContributorTileState createState() => _ContributorTileState();
 }
 
-class _ContributorTileState extends State<ContributorTile> {
+class _ContributorTileState extends State<_ContributorTile> {
   // Utils
   bool _loading = true;
   bool _failed = false;
@@ -125,6 +123,7 @@ class _ContributorTileState extends State<ContributorTile> {
       Uri.parse('https://api.github.com/user/${widget.gitHubId}'),
       headers: _header,
     );
+
     if (_result.statusCode == 200 && mounted) {
       dynamic _responseJSON = json.decode(_result.body);
       setState(() {
@@ -159,12 +158,15 @@ class _ContributorTileState extends State<ContributorTile> {
         child: RectangleButton(
           height: 65,
           width: double.infinity,
-          color: Colors.blueGrey.withOpacity(0.2),
+          color: Colors.blueGrey.withOpacity(0.1),
           padding: const EdgeInsets.symmetric(horizontal: 10),
           onPressed: () => launch('https://www.github.com/$_userId'),
-          child: _loading
-              ? const Spinner(size: 15, thickness: 2)
-              : Row(
+          child: Builder(
+            builder: (_) {
+              if (_loading) {
+                return const Spinner(size: 15, thickness: 2);
+              } else {
+                return Row(
                   children: <Widget>[
                     CircleAvatar(
                       backgroundImage: NetworkImage(_profileURL, scale: 5),
@@ -183,13 +185,12 @@ class _ContributorTileState extends State<ContributorTile> {
                         ],
                       ),
                     ),
-                    Icon(
-                      Icons.arrow_forward_ios_rounded,
-                      color: Colors.blueGrey.withOpacity(0.4),
-                      size: 18,
-                    ),
+                    const Icon(Icons.arrow_forward_ios_rounded, size: 18),
                   ],
-                ),
+                );
+              }
+            },
+          ),
         ),
       );
     }

lib/components/dialog_templates/flutter/change_channel.dart

@@ -166,9 +166,13 @@ class _ChangeFlutterChannelDialogState
                   options: const <String>['Master', 'Stable', 'Beta', 'Dev'],
                 ),
                 VSeparators.small(),
-                informationWidget(
-                  'We recommend staying on the stable channel for best development experience unless it\'s necessary.',
-                  type: InformationType.warning,
+                AnimatedOpacity(
+                  opacity: _initializing ? 0.1 : 1,
+                  duration: const Duration(milliseconds: 300),
+                  child: informationWidget(
+                    'We recommend staying on the stable channel for best development experience unless it\'s necessary.',
+                    type: InformationType.warning,
+                  ),
                 ),
                 VSeparators.small(),
                 if (_switching)

lib/components/dialog_templates/flutter/flutter_doctor.dart

@@ -94,7 +94,6 @@ class _FlutterDoctorDialogState extends State<FlutterDoctorDialog> {
             ),
             if (_done) ...<Widget>[
               RoundContainer(
-                color: Colors.blueGrey.withOpacity(0.2),
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.start,
                   children: _status.map((String e) {

lib/components/dialog_templates/flutter/flutter_requirements.dart

@@ -34,7 +34,6 @@ class FlutterRequirementsDialog extends StatelessWidget {
             _linuxTemplate()
           else
             RoundContainer(
-              color: Colors.blueGrey.withOpacity(0.2),
               child: Column(
                 children: <Widget>[
                   VSeparators.xSmall(),

lib/components/dialog_templates/logs/build_logs.dart

@@ -71,10 +71,12 @@ Future<void> _generateReportOnIsolate(List<dynamic> data) async {
         logDir: Directory(_basePath));
 
     _port.send(true);
+    return;
   } catch (_, s) {
     await logger.file(LogTypeTag.error, 'Failed to generate issue report. $_',
         stackTraces: s, logDir: Directory(_basePath));
     _port.send(false);
+    return;
   }
 }
 
@@ -100,7 +102,7 @@ class _BuildLogsDialogState extends State<BuildLogsDialog> {
 
   Future<void> _generateReport() async {
     try {
-      await Isolate.spawn(_generateReportOnIsolate, <dynamic>[
+      Isolate _i = await Isolate.spawn(_generateReportOnIsolate, <dynamic>[
         _generatePort.sendPort,
         (await getApplicationSupportDirectory()).path,
         _savePath,
@@ -122,6 +124,7 @@ class _BuildLogsDialogState extends State<BuildLogsDialog> {
                 type: SnackBarType.error,
               ),
             );
+            _i.kill();
             return;
           }
 
@@ -136,6 +139,8 @@ class _BuildLogsDialogState extends State<BuildLogsDialog> {
               await shell.run('xdg-open ' + _savePath!);
             }
 
+            _i.kill();
+
             await Future<void>.delayed(const Duration(seconds: 5));
 
             if (mounted) {
@@ -155,7 +160,8 @@ class _BuildLogsDialogState extends State<BuildLogsDialog> {
             );
 
             setState(() => _savePath = null);
-
+
+            _i.kill();
             _generatePort.close();
             return;
           }
@@ -193,7 +199,6 @@ class _BuildLogsDialogState extends State<BuildLogsDialog> {
           ),
           VSeparators.normal(),
           RoundContainer(
-            color: Colors.blueGrey.withOpacity(0.2),
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,
               children: <Widget>[

lib/components/dialog_templates/other/clear_cache.dart

@@ -1,6 +1,13 @@
+// 🎯 Dart imports:
 import 'dart:io';
 
+// 🐦 Flutter imports:
 import 'package:flutter/material.dart';
+
+// 📦 Package imports:
+import 'package:path_provider/path_provider.dart';
+
+// 🌎 Project imports:
 import 'package:fluttermatic/app/constants/constants.dart';
 import 'package:fluttermatic/components/dialog_templates/dialog_header.dart';
 import 'package:fluttermatic/components/widgets/buttons/rectangle_button.dart';
@@ -14,7 +21,6 @@ import 'package:fluttermatic/core/services/logs.dart';
 import 'package:fluttermatic/main.dart';
 import 'package:fluttermatic/meta/utils/app_theme.dart';
 import 'package:fluttermatic/meta/utils/shared_pref.dart';
-import 'package:path_provider/path_provider.dart';
 
 class ClearCacheDialog extends StatefulWidget {
   const ClearCacheDialog({Key? key}) : super(key: key);

lib/components/dialog_templates/project/common/name.dart

@@ -133,7 +133,6 @@ class _ProjectNameSectionState extends State<ProjectNameSection> {
             'Your project name can only include lower-case English letters (a-z) and underscores (_).'),
         VSeparators.normal(),
         RoundContainer(
-          color: Colors.blueGrey.withOpacity(0.2),
           child: Row(
             children: <Widget>[
               Expanded(

lib/components/dialog_templates/project/dart/sections/template.dart

@@ -42,7 +42,6 @@ class _DartProjectTemplateSectionState
             'Choose your Dart template which will be used to generate your project.'),
         VSeparators.small(),
         RoundContainer(
-          color: Colors.blueGrey.withOpacity(0.2),
           child: SelectTile(
             defaultValue: widget.selectedTemplate,
             options:

lib/components/dialog_templates/project/flutter/sections/pre_config.dart

@@ -45,7 +45,6 @@ class _FlutterProjectPreConfigSectionState extends State<FlutterProjectPreConfig
         Padding(
           padding: const EdgeInsets.only(bottom: 15),
           child: RoundContainer(
-            color: Colors.blueGrey.withOpacity(0.2),
             child: Row(
               children: <Widget>[
                 Expanded(
@@ -146,7 +145,6 @@ class _FlutterProjectPreConfigSectionState extends State<FlutterProjectPreConfig
           Padding(
             padding: const EdgeInsets.only(bottom: 10),
             child: RoundContainer(
-              color: Colors.blueGrey.withOpacity(0.2),
               child: Column(
                 children: <Widget>[
                   Row(

lib/components/dialog_templates/settings/sections/discover.dart

@@ -66,7 +66,6 @@ class DiscoverSettingsSection extends StatelessWidget {
         VSeparators.small(),
         RoundContainer(
           width: double.infinity,
-          color: Colors.blueGrey.withOpacity(0.2),
           child: Row(
             children: <Widget>[
               const Expanded(

lib/components/dialog_templates/settings/sections/editors.dart

@@ -126,15 +126,13 @@ class _EditorsSettingsSectionState extends State<EditorsSettingsSection> {
         ),
         VSeparators.small(),
         RoundContainer(
-          color: Colors.blueGrey.withOpacity(0.2),
           child: CheckBoxElement(
             onChanged: (bool? val) async {
               setState(() => _askEditorAlways = (val ?? true));
               await SharedPref()
                   .pref
                   .setBool(SPConst.askEditorAlways, val ?? true);
 
-              print(SharedPref().pref.getBool(SPConst.askEditorAlways));
             },
             value: _askEditorAlways,
             text: 'Always ask me which editor to use',