From 348c477f75d8fcc2c953d83c8ccae3487ed948f3 Mon Sep 17 00:00:00 2001
From: fufesou <13586388+fufesou@users.noreply.github.com>
Date: Tue, 22 Jul 2025 23:42:05 +0800
Subject: [PATCH] fix: terminal, web, fonts (#12376)

Signed-off-by: fufesou <linlong1266@gmail.com>
---
 flutter/lib/mobile/pages/terminal_page.dart | 19 +++++++++++++++++++
 flutter/pubspec.lock                        |  8 ++++++++
 flutter/pubspec.yaml                        |  1 +
 3 files changed, 28 insertions(+)

diff --git a/flutter/lib/mobile/pages/terminal_page.dart b/flutter/lib/mobile/pages/terminal_page.dart
index d7d17994c..e1e06c26c 100644
--- a/flutter/lib/mobile/pages/terminal_page.dart
+++ b/flutter/lib/mobile/pages/terminal_page.dart
@@ -3,6 +3,7 @@ import 'package:flutter/services.dart';
 import 'package:flutter_hbb/common.dart';
 import 'package:flutter_hbb/models/model.dart';
 import 'package:flutter_hbb/models/terminal_model.dart';
+import 'package:google_fonts/google_fonts.dart';
 import 'package:xterm/xterm.dart';
 import '../../desktop/pages/terminal_connection_manager.dart';
 
@@ -31,6 +32,12 @@ class _TerminalPageState extends State<TerminalPage>
   late FFI _ffi;
   late TerminalModel _terminalModel;
 
+  // For web only.
+  // 'monospace' does not work on web, use Google Fonts, `??` is only for null safety.
+  final String _robotoMonoFontFamily = isWeb
+      ? (GoogleFonts.robotoMono().fontFamily ?? 'monospace')
+      : 'monospace';
+
   @override
   void initState() {
     super.initState();
@@ -81,6 +88,7 @@ class _TerminalPageState extends State<TerminalPage>
         _terminalModel.terminal,
         controller: _terminalModel.terminalController,
         autofocus: true,
+        textStyle: _getTerminalStyle(),
         backgroundOpacity: 0.7,
         padding: const EdgeInsets.symmetric(horizontal: 5.0, vertical: 2.0),
         onSecondaryTapDown: (details, offset) async {
@@ -101,6 +109,17 @@ class _TerminalPageState extends State<TerminalPage>
     );
   }
 
+  // https://github.com/TerminalStudio/xterm.dart/issues/42#issuecomment-877495472
+  // https://github.com/TerminalStudio/xterm.dart/issues/198#issuecomment-2526548458
+  TerminalStyle _getTerminalStyle() {
+    return isWeb
+        ? TerminalStyle(
+            fontFamily: _robotoMonoFontFamily,
+            fontSize: 14,
+          )
+        : const TerminalStyle();
+  }
+
   @override
   bool get wantKeepAlive => true;
 }
diff --git a/flutter/pubspec.lock b/flutter/pubspec.lock
index aba6c7879..c6f8aa1c2 100644
--- a/flutter/pubspec.lock
+++ b/flutter/pubspec.lock
@@ -689,6 +689,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "2.1.3"
+  google_fonts:
+    dependency: "direct main"
+    description:
+      name: google_fonts
+      sha256: b1ac0fe2832c9cc95e5e88b57d627c5e68c223b9657f4b96e1487aa9098c7b82
+      url: "https://pub.dev"
+    source: hosted
+    version: "6.2.1"
   graphs:
     dependency: transitive
     description:
diff --git a/flutter/pubspec.yaml b/flutter/pubspec.yaml
index 03de1a4eb..72ea27015 100644
--- a/flutter/pubspec.yaml
+++ b/flutter/pubspec.yaml
@@ -108,6 +108,7 @@ dependencies:
   extended_text: 14.0.0
   xterm: 4.0.0
   sqflite: 2.2.0
+  google_fonts: ^6.2.1
 
 dev_dependencies:
   icons_launcher: ^2.0.4