fix: space icon color assertion (#6570)

* fix: space icon color assertion

* chore: bump version 0.7.2

frontend/Makefile.toml

@@ -26,7 +26,7 @@ CARGO_MAKE_EXTEND_WORKSPACE_MAKEFILE = true
 CARGO_MAKE_CRATE_FS_NAME = "dart_ffi"
 CARGO_MAKE_CRATE_NAME = "dart-ffi"
 LIB_NAME = "dart_ffi"
-APPFLOWY_VERSION = "0.7.1"
+APPFLOWY_VERSION = "0.7.2"
 FLUTTER_DESKTOP_FEATURES = "dart"
 PRODUCT_NAME = "AppFlowy"
 MACOSX_DEPLOYMENT_TARGET = "11.0"

frontend/appflowy_flutter/lib/workspace/presentation/home/menu/sidebar/space/space_icon.dart

@@ -3,6 +3,7 @@ import 'package:appflowy/plugins/document/presentation/editor_plugins/base/strin
 import 'package:appflowy/shared/icon_emoji_picker/icon_picker.dart';
 import 'package:appflowy/workspace/application/view/view_ext.dart';
 import 'package:appflowy/workspace/presentation/home/menu/sidebar/space/space_icon_popup.dart';
+import 'package:appflowy_backend/log.dart';
 import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
 import 'package:flowy_infra_ui/flowy_infra_ui.dart';
 import 'package:flutter/material.dart';
@@ -25,38 +26,7 @@ class SpaceIcon extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    // if space icon is null, use the first character of space name as icon
-
-    final Color color;
-    final Widget icon;
-
-    if (space.spaceIcon == null) {
-      final name = space.name.isNotEmpty ? space.name.capitalize()[0] : '';
-      icon = FlowyText.medium(
-        name,
-        color: Theme.of(context).colorScheme.surface,
-        fontSize: svgSize,
-        figmaLineHeight: textDimension ?? dimension,
-      );
-      color = Color(int.parse(builtInSpaceColors.first));
-    } else {
-      final spaceIconColor = space.spaceIconColor;
-      color = spaceIconColor != null
-          ? Color(int.parse(spaceIconColor))
-          : Colors.transparent;
-      final svg = space.buildSpaceIconSvg(
-        context,
-        size: svgSize != null ? Size.square(svgSize!) : null,
-      );
-      if (svg == null) {
-        icon = const SizedBox.shrink();
-      } else {
-        icon =
-            svgSize == null || space.spaceIcon?.contains('space_icon') == true
-                ? svg
-                : SizedBox.square(dimension: svgSize!, child: svg);
-      }
-    }
+    final (icon, color) = _buildSpaceIcon(context);
 
     return ClipRRect(
       borderRadius: BorderRadius.circular(cornerRadius),
@@ -70,6 +40,67 @@ class SpaceIcon extends StatelessWidget {
       ),
     );
   }
+
+  (Widget, Color?) _buildSpaceIcon(BuildContext context) {
+    final spaceIcon = space.spaceIcon;
+    if (spaceIcon == null || spaceIcon.isEmpty == true) {
+      // if space icon is null, use the first character of space name as icon
+      return _buildEmptySpaceIcon(context);
+    } else {
+      return _buildCustomSpaceIcon(context);
+    }
+  }
+
+  (Widget, Color?) _buildEmptySpaceIcon(BuildContext context) {
+    final name = space.name.isNotEmpty ? space.name.capitalize()[0] : '';
+    final icon = FlowyText.medium(
+      name,
+      color: Theme.of(context).colorScheme.surface,
+      fontSize: svgSize,
+      figmaLineHeight: textDimension ?? dimension,
+    );
+    Color? color;
+    try {
+      final defaultColor = builtInSpaceColors.firstOrNull;
+      if (defaultColor != null) {
+        color = Color(int.parse(defaultColor));
+      }
+    } catch (e) {
+      Log.error('Failed to parse default space icon color: $e');
+    }
+    return (icon, color);
+  }
+
+  (Widget, Color?) _buildCustomSpaceIcon(BuildContext context) {
+    final spaceIconColor = space.spaceIconColor;
+
+    final svg = space.buildSpaceIconSvg(
+      context,
+      size: svgSize != null ? Size.square(svgSize!) : null,
+    );
+    Widget icon;
+    if (svg == null) {
+      icon = const SizedBox.shrink();
+    } else {
+      icon = svgSize == null ||
+              space.spaceIcon?.contains(ViewExtKeys.spaceIconKey) == true
+          ? svg
+          : SizedBox.square(dimension: svgSize!, child: svg);
+    }
+
+    Color color = Colors.transparent;
+    if (spaceIconColor != null && spaceIconColor.isNotEmpty) {
+      try {
+        color = Color(int.parse(spaceIconColor));
+      } catch (e) {
+        Log.error(
+          'Failed to parse space icon color: $e, value: $spaceIconColor',
+        );
+      }
+    }
+
+    return (icon, color);
+  }
 }
 
 const kDefaultSpaceIconId = 'interface_essential/home-3';

frontend/appflowy_flutter/pubspec.yaml

@@ -4,7 +4,7 @@ description: Bring projects, wikis, and teams together with AI. AppFlowy is an
   your data. The best open source alternative to Notion.
 publish_to: "none"
 
-version: 0.7.1
+version: 0.7.2
 
 environment:
   flutter: ">=3.22.0"

frontend/appflowy_flutter/test/widget_test/spae_cion_test.dart

@@ -0,0 +1,58 @@
+import 'dart:convert';
+
+import 'package:appflowy/workspace/application/view/view_ext.dart';
+import 'package:appflowy/workspace/presentation/home/menu/sidebar/space/space_icon.dart';
+import 'package:appflowy_backend/protobuf/flowy-folder/view.pb.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+void main() {
+  group('space_icon.dart', () {
+    testWidgets('space icon is empty', (WidgetTester tester) async {
+      final emptySpaceIcon = {
+        ViewExtKeys.spaceIconKey: '',
+        ViewExtKeys.spaceIconColorKey: '',
+      };
+      final space = ViewPB(
+        name: 'test',
+        extra: jsonEncode(emptySpaceIcon),
+      );
+      await tester.pumpWidget(
+        MaterialApp(
+          home: Material(
+            child: SpaceIcon(dimension: 22, space: space),
+          ),
+        ),
+      );
+
+      // test that the input field exists
+      expect(find.byType(SpaceIcon), findsOneWidget);
+
+      // use the first character of page name as icon
+      expect(find.text('T'), findsOneWidget);
+    });
+
+    testWidgets('space icon is null', (WidgetTester tester) async {
+      final emptySpaceIcon = {
+        ViewExtKeys.spaceIconKey: null,
+        ViewExtKeys.spaceIconColorKey: null,
+      };
+      final space = ViewPB(
+        name: 'test',
+        extra: jsonEncode(emptySpaceIcon),
+      );
+      await tester.pumpWidget(
+        MaterialApp(
+          home: Material(
+            child: SpaceIcon(dimension: 22, space: space),
+          ),
+        ),
+      );
+
+      expect(find.byType(SpaceIcon), findsOneWidget);
+
+      // use the first character of page name as icon
+      expect(find.text('T'), findsOneWidget);
+    });
+  });
+}