Extra Font Size Controls (#1537)

This adds:
- "editor:fontsize" to modify the code editor's font size
- "ai:fontsize" to modify the ai widget's font size (for general text)
- "ai:fixedfontsize" to modify the ai widget's fixed font size (for code
fragments)

frontend/app/view/codeeditor/codeeditor.tsx

@@ -122,6 +122,7 @@ export function CodeEditor({ blockId, text, language, filename, meta, onChange,
     const minimapEnabled = useOverrideConfigAtom(blockId, "editor:minimapenabled") ?? false;
     const stickyScrollEnabled = useOverrideConfigAtom(blockId, "editor:stickyscrollenabled") ?? false;
     const wordWrap = useOverrideConfigAtom(blockId, "editor:wordwrap") ?? false;
+    const fontSize = useOverrideConfigAtom(blockId, "editor:fontsize");
     const theme = "wave-theme-dark";
 
     React.useEffect(() => {
@@ -150,8 +151,9 @@ export function CodeEditor({ blockId, text, language, filename, meta, onChange,
         opts.minimap.enabled = minimapEnabled;
         opts.stickyScroll.enabled = stickyScrollEnabled;
         opts.wordWrap = wordWrap ? "on" : "off";
+        opts.fontSize = fontSize;
         return opts;
-    }, [minimapEnabled, stickyScrollEnabled, wordWrap]);
+    }, [minimapEnabled, stickyScrollEnabled, wordWrap, fontSize]);
 
     return (
         <div className="code-editor-wrapper">

frontend/app/view/waveai/waveai.tsx

@@ -8,7 +8,7 @@ import { RpcResponseHelper, WshClient } from "@/app/store/wshclient";
 import { RpcApi } from "@/app/store/wshclientapi";
 import { makeFeBlockRouteId } from "@/app/store/wshrouter";
 import { DefaultRouter, TabRpcClient } from "@/app/store/wshrpcutil";
-import { atoms, createBlock, fetchWaveFile, getApi, globalStore, WOS } from "@/store/global";
+import { atoms, createBlock, fetchWaveFile, getApi, globalStore, useOverrideConfigAtom, WOS } from "@/store/global";
 import { BlockService, ObjectService } from "@/store/services";
 import { adaptFromReactOrNativeKeyEvent, checkKeyPressed } from "@/util/keyutil";
 import { fireAndForget, isBlank, makeIconClass } from "@/util/util";
@@ -30,6 +30,7 @@ const slidingWindowSize = 30;
 
 interface ChatItemProps {
     chatItem: ChatMessageType;
+    model: WaveAiModel;
 }
 
 function promptToMsg(prompt: OpenAIPromptMessageType): ChatMessageType {
@@ -430,11 +431,12 @@ function makeWaveAiViewModel(blockId: string): WaveAiModel {
     return waveAiModel;
 }
 
-const ChatItem = ({ chatItem }: ChatItemProps) => {
+const ChatItem = ({ chatItem, model }: ChatItemProps) => {
     const { user, text } = chatItem;
     const cssVar = "--panel-bg-color";
     const panelBgColor = getComputedStyle(document.documentElement).getPropertyValue(cssVar).trim();
-
+    const fontSize = useOverrideConfigAtom(model.blockId, "ai:fontsize");
+    const fixedFontSize = useOverrideConfigAtom(model.blockId, "ai:fixedfontsize");
     const renderContent = useMemo(() => {
         if (user == "error") {
             return (
@@ -445,7 +447,12 @@ const ChatItem = ({ chatItem }: ChatItemProps) => {
                         </div>
                     </div>
                     <div className="chat-msg chat-msg-error">
-                        <Markdown text={text} scrollable={false} />
+                        <Markdown
+                            text={text}
+                            scrollable={false}
+                            fontSizeOverride={fontSize}
+                            fixedFontSizeOverride={fixedFontSize}
+                        />
                     </div>
                 </>
             );
@@ -459,7 +466,12 @@ const ChatItem = ({ chatItem }: ChatItemProps) => {
                         </div>
                     </div>
                     <div className="chat-msg chat-msg-assistant">
-                        <Markdown text={text} scrollable={false} />
+                        <Markdown
+                            text={text}
+                            scrollable={false}
+                            fontSizeOverride={fontSize}
+                            fixedFontSizeOverride={fixedFontSize}
+                        />
                     </div>
                 </>
             ) : (
@@ -474,11 +486,17 @@ const ChatItem = ({ chatItem }: ChatItemProps) => {
         return (
             <>
                 <div className="chat-msg chat-msg-user">
-                    <Markdown className="msg-text" text={text} scrollable={false} />
+                    <Markdown
+                        className="msg-text"
+                        text={text}
+                        scrollable={false}
+                        fontSizeOverride={fontSize}
+                        fixedFontSizeOverride={fixedFontSize}
+                    />
                 </div>
             </>
         );
-    }, [text, user]);
+    }, [text, user, fontSize, fixedFontSize]);
 
     return <div className={"chat-msg-container"}>{renderContent}</div>;
 };
@@ -487,10 +505,11 @@ interface ChatWindowProps {
     chatWindowRef: React.RefObject<HTMLDivElement>;
     messages: ChatMessageType[];
     msgWidths: Object;
+    model: WaveAiModel;
 }
 
 const ChatWindow = memo(
-    forwardRef<OverlayScrollbarsComponentRef, ChatWindowProps>(({ chatWindowRef, messages, msgWidths }, ref) => {
+    forwardRef<OverlayScrollbarsComponentRef, ChatWindowProps>(({ chatWindowRef, messages, msgWidths, model }, ref) => {
         const [isUserScrolling, setIsUserScrolling] = useState(false);
 
         const osRef = useRef<OverlayScrollbarsComponentRef>(null);
@@ -559,7 +578,7 @@ const ChatWindow = memo(
                 <div ref={chatWindowRef} className="chat-window" style={msgWidths}>
                     <div className="filler"></div>
                     {messages.map((chitem, idx) => (
-                        <ChatItem key={idx} chatItem={chitem} />
+                        <ChatItem key={idx} chatItem={chitem} model={model} />
                     ))}
                 </div>
             </OverlayScrollbarsComponent>
@@ -804,7 +823,13 @@ const WaveAi = ({ model }: { model: WaveAiModel; blockId: string }) => {
     return (
         <div ref={waveaiRef} className="waveai">
             <div className="waveai-chat">
-                <ChatWindow ref={osRef} chatWindowRef={chatWindowRef} messages={messages} msgWidths={msgWidths} />
+                <ChatWindow
+                    ref={osRef}
+                    chatWindowRef={chatWindowRef}
+                    messages={messages}
+                    msgWidths={msgWidths}
+                    model={model}
+                />
             </div>
             <div className="waveai-controls">
                 <div className="waveai-input-wrapper">

frontend/types/gotypes.d.ts

@@ -617,6 +617,8 @@ declare global {
         "ai:apiversion"?: string;
         "ai:maxtokens"?: number;
         "ai:timeoutms"?: number;
+        "ai:fontsize"?: number;
+        "ai:fixedfontsize"?: number;
         "term:*"?: boolean;
         "term:fontsize"?: number;
         "term:fontfamily"?: string;
@@ -629,6 +631,7 @@ declare global {
         "editor:minimapenabled"?: boolean;
         "editor:stickyscrollenabled"?: boolean;
         "editor:wordwrap"?: boolean;
+        "editor:fontsize"?: number;
         "web:*"?: boolean;
         "web:openlinksinternally"?: boolean;
         "web:defaulturl"?: string;

pkg/wconfig/metaconsts.go

@@ -17,6 +17,8 @@ const (
 	ConfigKey_AIApiVersion                   = "ai:apiversion"
 	ConfigKey_AiMaxTokens                    = "ai:maxtokens"
 	ConfigKey_AiTimeoutMs                    = "ai:timeoutms"
+	ConfigKey_AiFontSize                     = "ai:fontsize"
+	ConfigKey_AiFixedFontSize                = "ai:fixedfontsize"
 
 	ConfigKey_TermClear                      = "term:*"
 	ConfigKey_TermFontSize                   = "term:fontsize"
@@ -31,6 +33,7 @@ const (
 	ConfigKey_EditorMinimapEnabled           = "editor:minimapenabled"
 	ConfigKey_EditorStickyScrollEnabled      = "editor:stickyscrollenabled"
 	ConfigKey_EditorWordWrap                 = "editor:wordwrap"
+	ConfigKey_EditorFontSize                 = "editor:fontsize"
 
 	ConfigKey_WebClear                       = "web:*"
 	ConfigKey_WebOpenLinksInternally         = "web:openlinksinternally"

pkg/wconfig/settingsconfig.go

@@ -44,6 +44,8 @@ type SettingsType struct {
 	AIApiVersion    string  `json:"ai:apiversion,omitempty"`
 	AiMaxTokens     float64 `json:"ai:maxtokens,omitempty"`
 	AiTimeoutMs     float64 `json:"ai:timeoutms,omitempty"`
+	AiFontSize      float64 `json:"ai:fontsize,omitempty"`
+	AiFixedFontSize float64 `json:"ai:fixedfontsize,omitempty"`
 
 	TermClear          bool     `json:"term:*,omitempty"`
 	TermFontSize       float64  `json:"term:fontsize,omitempty"`
@@ -58,6 +60,7 @@ type SettingsType struct {
 	EditorMinimapEnabled      bool    `json:"editor:minimapenabled,omitempty"`
 	EditorStickyScrollEnabled bool    `json:"editor:stickyscrollenabled,omitempty"`
 	EditorWordWrap            bool    `json:"editor:wordwrap,omitempty"`
+	EditorFontSize            float64 `json:"editor:fontsize,omitempty"`
 
 	WebClear               bool   `json:"web:*,omitempty"`
 	WebOpenLinksInternally bool   `json:"web:openlinksinternally,omitempty"`