From 785f20d0e78adbea273e55baa69623838466f1a8 Mon Sep 17 00:00:00 2001 From: Harald Schilly Date: Mon, 6 Oct 2025 15:00:43 +0200 Subject: [PATCH 1/3] frontend/latex/sync: remove a sync timeout --- .../frontend/frame-editors/latex-editor/output.tsx | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/src/packages/frontend/frame-editors/latex-editor/output.tsx b/src/packages/frontend/frame-editors/latex-editor/output.tsx index 6fe0a1cfdbc..0b2d6584ebc 100644 --- a/src/packages/frontend/frame-editors/latex-editor/output.tsx +++ b/src/packages/frontend/frame-editors/latex-editor/output.tsx @@ -369,11 +369,8 @@ export function Output(props: OutputProps) { const autoSyncInProgress = actions.store.get("autoSyncInProgress"); if (autoSyncInProgress) { - // Debounce the flag clearing to avoid clearing too early during scrolling - clearTimeout((window as any).__autoSyncClearTimeout); - (window as any).__autoSyncClearTimeout = setTimeout(() => { - actions.setState({ autoSyncInProgress: false }); - }, 500); // Wait longer to ensure scrolling has stabilized + // Clear immediately to allow next forward sync without delay + actions.setState({ autoSyncInProgress: false }); } }} onPageDimensions={setPageDimensions} From 7c80dc304c98bd5a2b869fb7e9cfbe34fe4d816b Mon Sep 17 00:00:00 2001 From: Harald Schilly Date: Mon, 6 Oct 2025 15:04:10 +0200 Subject: [PATCH 2/3] frontend/latex/files: clarify, summary is not available -- it might not be loaded yet --- .../frontend/frame-editors/latex-editor/output-files.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/packages/frontend/frame-editors/latex-editor/output-files.tsx b/src/packages/frontend/frame-editors/latex-editor/output-files.tsx index 789889af4e0..01a6b3323d0 100644 --- a/src/packages/frontend/frame-editors/latex-editor/output-files.tsx +++ b/src/packages/frontend/frame-editors/latex-editor/output-files.tsx @@ -63,7 +63,7 @@ export function OutputFiles({ path: filePath, displayPath, isMain: false, - summary: fileSummaries[filePath] ?? "Loading...", + summary: fileSummaries[filePath] ?? "Summary not available...", }; }); From 99e3b14b3480347ecb739f2c6ad086481f4264dc Mon Sep 17 00:00:00 2001 From: Harald Schilly Date: Mon, 6 Oct 2025 15:44:15 +0200 Subject: [PATCH 3/3] frontend: refactor DEFAULT_FONT_SIZE = 14 as a global constant and fix latex/ouput/pdf zooming --- .../account/editor-settings/font-size.tsx | 3 ++- .../editors/slate/editable-markdown.tsx | 3 ++- .../frame-editors/latex-editor/output.tsx | 5 +++-- .../frame-editors/latex-editor/pdfjs.tsx | 18 +++++++++++++----- .../whiteboard-editor/overview.tsx | 3 ++- .../frontend/frame-editors/x11-editor/x11.tsx | 4 +++- .../frontend/jupyter/history-viewer.tsx | 3 ++- src/packages/util/consts/ui.ts | 3 +++ 8 files changed, 30 insertions(+), 12 deletions(-) diff --git a/src/packages/frontend/account/editor-settings/font-size.tsx b/src/packages/frontend/account/editor-settings/font-size.tsx index 0e931f1a200..fc81d4010ba 100644 --- a/src/packages/frontend/account/editor-settings/font-size.tsx +++ b/src/packages/frontend/account/editor-settings/font-size.tsx @@ -5,6 +5,7 @@ import { InputNumber } from "antd"; import { LabeledRow } from "@cocalc/frontend/components"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { useIntl } from "react-intl"; interface Props { @@ -24,7 +25,7 @@ export function EditorSettingsFontSize(props: Props) { className="cc-account-prefs-font-size" > props.on_change("font_size", n ?? 14)} + onChange={(n) => props.on_change("font_size", n ?? DEFAULT_FONT_SIZE)} min={5} max={32} value={props.font_size} diff --git a/src/packages/frontend/editors/slate/editable-markdown.tsx b/src/packages/frontend/editors/slate/editable-markdown.tsx index 797ee9db80d..cc032541cdd 100644 --- a/src/packages/frontend/editors/slate/editable-markdown.tsx +++ b/src/packages/frontend/editors/slate/editable-markdown.tsx @@ -28,6 +28,7 @@ import { EditorFunctions } from "@cocalc/frontend/editors/markdown-input/multimo import { SAVE_DEBOUNCE_MS } from "@cocalc/frontend/frame-editors/code-editor/const"; import { useFrameContext } from "@cocalc/frontend/frame-editors/frame-tree/frame-context"; import { Path } from "@cocalc/frontend/frame-editors/frame-tree/path"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { EditorState } from "@cocalc/frontend/frame-editors/frame-tree/types"; import { markdown_to_html } from "@cocalc/frontend/markdown"; import Fragment, { FragmentId } from "@cocalc/frontend/misc/fragment-id"; @@ -171,7 +172,7 @@ export const EditableMarkdown: React.FC = React.memo((props: Props) => { const isMountedRef = useIsMountedRef(); const id = id0 ?? ""; const actions = actions0 ?? {}; - const font_size = font_size0 ?? desc?.get("font_size") ?? 14; // so possible to use without specifying this. TODO: should be from account settings + const font_size = font_size0 ?? desc?.get("font_size") ?? DEFAULT_FONT_SIZE; // so possible to use without specifying this. TODO: should be from account settings const [change, setChange] = useState(0); const editor = useMemo(() => { diff --git a/src/packages/frontend/frame-editors/latex-editor/output.tsx b/src/packages/frontend/frame-editors/latex-editor/output.tsx index 0b2d6584ebc..d7e68807ba2 100644 --- a/src/packages/frontend/frame-editors/latex-editor/output.tsx +++ b/src/packages/frontend/frame-editors/latex-editor/output.tsx @@ -40,6 +40,7 @@ import { import { EditorState } from "@cocalc/frontend/frame-editors/frame-tree/types"; import { project_api } from "@cocalc/frontend/frame-editors/generic/client"; import { editor, labels } from "@cocalc/frontend/i18n"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { TITLE_BAR_BORDER } from "../frame-tree/style"; import { Actions } from "./actions"; @@ -253,8 +254,8 @@ export function Output(props: OutputProps) { // Handle zoom changes from pinch-to-zoom or wheel gestures const handleZoomChange = useCallback( (data: Data) => { - // Convert fontSize to zoom scale (fontSize 14 = 1.0 zoom) - const newZoom = data.fontSize / 14; + // Convert fontSize to zoom scale (DEFAULT_FONT_SIZE = 1.0 zoom) + const newZoom = data.fontSize / DEFAULT_FONT_SIZE; const local_view_state = actions.store.get("local_view_state"); actions.setState({ local_view_state: local_view_state.setIn([id, "pdf_zoom"], newZoom), diff --git a/src/packages/frontend/frame-editors/latex-editor/pdfjs.tsx b/src/packages/frontend/frame-editors/latex-editor/pdfjs.tsx index 0258023d3d7..c82a4ac5109 100644 --- a/src/packages/frontend/frame-editors/latex-editor/pdfjs.tsx +++ b/src/packages/frontend/frame-editors/latex-editor/pdfjs.tsx @@ -35,6 +35,7 @@ import usePinchToZoom, { } from "@cocalc/frontend/frame-editors/frame-tree/pinch-to-zoom"; import { EditorState } from "@cocalc/frontend/frame-editors/frame-tree/types"; import { list_alternatives, seconds_ago } from "@cocalc/util/misc"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { COLORS } from "@cocalc/util/theme"; import { Actions, Actions as LatexEditorActions } from "./actions"; import { dblclick } from "./mouse-click"; @@ -248,7 +249,7 @@ export function PDFJS({ if (evt.key == "0" && (evt.metaKey || evt.ctrlKey)) { actions.set_font_size( id, - redux.getStore("account").get("font_size") ?? 14, + redux.getStore("account").get("font_size") ?? DEFAULT_FONT_SIZE, ); return; } @@ -440,7 +441,8 @@ export function PDFJS({ // Use onZoom callback if available (new zoom system), otherwise fall back to font_size if (onZoom) { - const fontSize = getFontSize(scale); + // For zoom-to-fit, always use DEFAULT_FONT_SIZE as base to avoid account font size dependency + const fontSize = scale * DEFAULT_FONT_SIZE; onZoom({ fontSize }); } else { actions.set_font_size(id, getFontSize(scale)); @@ -464,7 +466,8 @@ export function PDFJS({ // Use onZoom callback if available (new zoom system), otherwise fall back to font_size if (onZoom) { - const fontSize = getFontSize(scale); + // For zoom-to-fit, always use DEFAULT_FONT_SIZE as base to avoid account font size dependency + const fontSize = scale * DEFAULT_FONT_SIZE; onZoom({ fontSize }); } else { actions.set_font_size(id, getFontSize(scale)); @@ -840,11 +843,16 @@ export function PDFJS({ if (zoom !== undefined) { return zoom; } - return font_size / (redux.getStore("account").get("font_size") ?? 14); + return ( + font_size / + (redux.getStore("account").get("font_size") ?? DEFAULT_FONT_SIZE) + ); }, [zoom, font_size]); function getFontSize(scale: number): number { - return (redux.getStore("account").get("font_size") ?? 14) * scale; + return ( + (redux.getStore("account").get("font_size") ?? DEFAULT_FONT_SIZE) * scale + ); } function renderOtherViewers() { diff --git a/src/packages/frontend/frame-editors/whiteboard-editor/overview.tsx b/src/packages/frontend/frame-editors/whiteboard-editor/overview.tsx index 8f1d4d1f6ea..eae1c74a732 100644 --- a/src/packages/frontend/frame-editors/whiteboard-editor/overview.tsx +++ b/src/packages/frontend/frame-editors/whiteboard-editor/overview.tsx @@ -12,6 +12,7 @@ import { VirtuosoGrid } from "react-virtuoso"; import { useEditorRedux } from "@cocalc/frontend/app-framework"; import { Loading } from "@cocalc/frontend/components"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { State, elementsList } from "./actions"; import DeletePage from "./delete-page"; import { useFrameContext } from "./hooks"; @@ -21,7 +22,7 @@ import { Overview as OnePage } from "./tools/navigation"; export default function Overview() { const { actions, id: frameId, project_id, path, desc } = useFrameContext(); const useEditor = useEditorRedux({ project_id, path }); - const size = 15 * (desc?.get("font_size") ?? 14); + const size = 15 * (desc?.get("font_size") ?? DEFAULT_FONT_SIZE); const isLoaded = useEditor("is_loaded"); const pagesMap = useEditor("pages"); const elementsMap = useEditor("elements"); diff --git a/src/packages/frontend/frame-editors/x11-editor/x11.tsx b/src/packages/frontend/frame-editors/x11-editor/x11.tsx index 0c198747f7d..6a69cea088d 100644 --- a/src/packages/frontend/frame-editors/x11-editor/x11.tsx +++ b/src/packages/frontend/frame-editors/x11-editor/x11.tsx @@ -23,6 +23,7 @@ import { } from "@cocalc/frontend/app-framework"; import { Loading } from "@cocalc/frontend/components"; import { retry_until_success } from "@cocalc/util/async-utils"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { cmp } from "@cocalc/util/misc"; import { Actions } from "./actions"; import { TAB_BAR_GREY } from "./theme"; @@ -56,7 +57,8 @@ export function X11({ const windowRef = useRef(null as any); const focusRef = useRef(null as any); - const default_font_size = useTypedRedux("account", "font_size") ?? 14; + const default_font_size = + useTypedRedux("account", "font_size") ?? DEFAULT_FONT_SIZE; const windows: Map = useRedux(name, "windows"); const x11_is_idle: boolean = useRedux(name, "x11_is_idle"); const disabled: boolean = useRedux(name, "disabled"); diff --git a/src/packages/frontend/jupyter/history-viewer.tsx b/src/packages/frontend/jupyter/history-viewer.tsx index 4b9cbb142a9..e2b965e3b65 100644 --- a/src/packages/frontend/jupyter/history-viewer.tsx +++ b/src/packages/frontend/jupyter/history-viewer.tsx @@ -11,6 +11,7 @@ import { fromJS, List, Map } from "immutable"; import { redux, useTypedRedux } from "@cocalc/frontend/app-framework"; import { ErrorDisplay } from "@cocalc/frontend/components"; import * as cell_utils from "@cocalc/jupyter/util/cell-utils"; +import { DEFAULT_FONT_SIZE } from "@cocalc/util/consts/ui"; import { path_split } from "@cocalc/util/misc"; import { CellList } from "./cell-list"; import { cm_options } from "./cm_options"; @@ -30,7 +31,7 @@ function get_cells(doc): { cells: Map; cell_list: List } { export function HistoryViewer({ project_id, path, doc, font_size }) { const default_font_size = - font_size ?? useTypedRedux("account", "font_size") ?? 14; + font_size ?? useTypedRedux("account", "font_size") ?? DEFAULT_FONT_SIZE; const { head: directory } = path_split(path); const { cells, cell_list } = get_cells(doc); diff --git a/src/packages/util/consts/ui.ts b/src/packages/util/consts/ui.ts index f1fc79d291e..2df332c0f02 100644 --- a/src/packages/util/consts/ui.ts +++ b/src/packages/util/consts/ui.ts @@ -28,3 +28,6 @@ export const DOC_AI = "https://doc.cocalc.com/ai.html"; // to all legal requirements. We thus don't use their trademark // anywhere in our frontend. export const R_IDE = "R IDE"; + +// Default font size for account settings and UI elements +export const DEFAULT_FONT_SIZE = 14;