diff --git a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/message/ai_markdown_text.dart b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/message/ai_markdown_text.dart
index 2d816bb5db..38fe4a8807 100644
--- a/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/message/ai_markdown_text.dart
+++ b/frontend/appflowy_flutter/lib/plugins/ai_chat/presentation/message/ai_markdown_text.dart
@@ -52,15 +52,6 @@ class _AppFlowyEditorMarkdown extends StatefulWidget {
 
 class _AppFlowyEditorMarkdownState extends State<_AppFlowyEditorMarkdown> {
   late EditorState editorState;
-  late final styleCustomizer = EditorStyleCustomizer(
-    context: context,
-    padding: EdgeInsets.zero,
-  );
-  late final editorStyle = styleCustomizer.style().copyWith(
-        // hide the cursor
-        cursorColor: Colors.transparent,
-        cursorWidth: 0,
-      );
   late EditorScrollController scrollController;
 
   @override
@@ -99,6 +90,17 @@ class _AppFlowyEditorMarkdownState extends State<_AppFlowyEditorMarkdown> {
 
   @override
   Widget build(BuildContext context) {
+    // don't lazy load the styleCustomizer and blockBuilders,
+    //  it needs the context to get the theme.
+    final styleCustomizer = EditorStyleCustomizer(
+      context: context,
+      padding: EdgeInsets.zero,
+    );
+    final editorStyle = styleCustomizer.style().copyWith(
+          // hide the cursor
+          cursorColor: Colors.transparent,
+          cursorWidth: 0,
+        );
     final blockBuilders = getEditorBuilderMap(
       context: context,
       editorState: editorState,
diff --git a/frontend/appflowy_flutter/lib/workspace/presentation/widgets/image_viewer/interactive_image_toolbar.dart b/frontend/appflowy_flutter/lib/workspace/presentation/widgets/image_viewer/interactive_image_toolbar.dart
index 21fb54066d..c3d9cbdbea 100644
--- a/frontend/appflowy_flutter/lib/workspace/presentation/widgets/image_viewer/interactive_image_toolbar.dart
+++ b/frontend/appflowy_flutter/lib/workspace/presentation/widgets/image_viewer/interactive_image_toolbar.dart
@@ -1,8 +1,6 @@
 import 'dart:convert';
 import 'dart:io';
 
-import 'package:flutter/material.dart';
-
 import 'package:appflowy/core/helpers/url_launcher.dart';
 import 'package:appflowy/generated/flowy_svgs.g.dart';
 import 'package:appflowy/generated/locale_keys.g.dart';
@@ -16,6 +14,7 @@ import 'package:flowy_infra_ui/flowy_infra_ui.dart';
 import 'package:flowy_infra_ui/style_widget/hover.dart';
 import 'package:flowy_infra_ui/style_widget/snap_bar.dart';
 import 'package:flowy_infra_ui/widget/flowy_tooltip.dart';
+import 'package:flutter/material.dart';
 import 'package:http/http.dart' as http;
 import 'package:path/path.dart';
 
@@ -104,7 +103,7 @@ class InteractiveImageToolbar extends StatelessWidget {
                   ),
                   AppFlowyPopover(
                     offset: const Offset(0, -8),
-                    decoration: const BoxDecoration(color: Colors.transparent),
+                    decorationColor: Colors.transparent,
                     direction: PopoverDirection.topWithCenterAligned,
                     constraints: const BoxConstraints(maxHeight: 50),
                     popupBuilder: (context) => _renderToolbarItems(