sync scrolling of the tabbar across views

This commit is contained in:
Evan Simkowitz 2024-12-11 15:47:28 -08:00
parent be7dda55d4
commit b890bd0ecb
No known key found for this signature in database
4 changed files with 16 additions and 1 deletions

View File

@ -12,7 +12,8 @@ import { OverlayScrollbars } from "overlayscrollbars";
import { createRef, memo, useCallback, useEffect, useRef, useState } from "react"; import { createRef, memo, useCallback, useEffect, useRef, useState } from "react";
import { debounce } from "throttle-debounce"; import { debounce } from "throttle-debounce";
import { IconButton } from "../element/iconbutton"; import { IconButton } from "../element/iconbutton";
import { WorkspaceService } from "../store/services"; import { ObjectService, WorkspaceService } from "../store/services";
import { makeORef } from "../store/wos";
import { Tab } from "./tab"; import { Tab } from "./tab";
import "./tabbar.scss"; import "./tabbar.scss";
import { UpdateStatusBanner } from "./updatebanner"; import { UpdateStatusBanner } from "./updatebanner";
@ -201,6 +202,10 @@ const TabBar = memo(({ workspace }: TabBarProps) => {
setTabIds(newTabIdsArr); setTabIds(newTabIdsArr);
setPinnedTabIds(newPinnedTabSet); setPinnedTabIds(newPinnedTabSet);
} }
if (osInstanceRef.current) {
const { viewport } = osInstanceRef.current.elements();
viewport.scrollLeft = workspace.meta?.["scroll:offset"] ?? 0;
}
}, [workspace, tabIds, pinnedTabIds]); }, [workspace, tabIds, pinnedTabIds]);
const saveTabsPosition = useCallback(() => { const saveTabsPosition = useCallback(() => {
@ -578,6 +583,11 @@ const TabBar = memo(({ workspace }: TabBarProps) => {
if (scrollableRef.current) { if (scrollableRef.current) {
const { viewport } = osInstanceRef.current.elements(); const { viewport } = osInstanceRef.current.elements();
viewport.scrollLeft = tabIds.length * tabWidthRef.current; viewport.scrollLeft = tabIds.length * tabWidthRef.current;
fireAndForget(() =>
ObjectService.UpdateObjectMeta(makeORef("workspace", workspace.oid), {
"scroll:offset": viewport.scrollLeft,
})
);
} }
}), }),
[tabIds] [tabIds]

View File

@ -494,6 +494,7 @@ declare global {
"vdom:correlationid"?: string; "vdom:correlationid"?: string;
"vdom:route"?: string; "vdom:route"?: string;
"vdom:persist"?: boolean; "vdom:persist"?: boolean;
"scroll:offset"?: number;
count?: number; count?: number;
}; };

View File

@ -100,6 +100,8 @@ const (
MetaKey_VDomRoute = "vdom:route" MetaKey_VDomRoute = "vdom:route"
MetaKey_VDomPersist = "vdom:persist" MetaKey_VDomPersist = "vdom:persist"
MetaKey_ScrollOffset = "scroll:offset"
MetaKey_Count = "count" MetaKey_Count = "count"
) )

View File

@ -101,6 +101,8 @@ type MetaTSType struct {
VDomRoute string `json:"vdom:route,omitempty"` VDomRoute string `json:"vdom:route,omitempty"`
VDomPersist bool `json:"vdom:persist,omitempty"` VDomPersist bool `json:"vdom:persist,omitempty"`
ScrollOffset float64 `json:"scroll:offset,omitempty"`
Count int `json:"count,omitempty"` // temp for cpu plot. will remove later Count int `json:"count,omitempty"` // temp for cpu plot. will remove later
} }