forked/topola-viewer
1
0
Fork 0
mirror of https://github.com/PeWu/topola-viewer.git synced 2026-08-03 09:31:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Shift standalone to URL as source of truth

Browse Source
This commit is contained in:
Przemek Więch
2026-06-11 15:24:21 +02:00
parent 97c9628dbe
commit 1445453a9b
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/APP_REFACTORING_DESIGN.md
View File

@@ -92,7 +92,7 @@ To refactor `app.tsx` safely and maintain continuous code correctness, we will m
#### Phase 3: Shifting to URL as Single Source of Truth #### Phase 3: Shifting to URL as Single Source of Truth
We will gradually eliminate React state variables in `src/app.tsx` and derive them (including settings like `standalone`, `showWikiTreeMenus`, and `freezeAnimation`) directly from the `useLocation()` search query parameters on render: We will gradually eliminate React state variables in `src/app.tsx` and derive them (including settings like `standalone`, `showWikiTreeMenus`, and `freezeAnimation`) directly from the `useLocation()` search query parameters on render:
* [x] **Step 3.1a:** Shift `chartType` to URL as SSOT. Derive it using `useMemo` from search parameters, replace calls to `setChartType` with URL updates, and remove the React state variable and sync effect. * [x] **Step 3.1a:** Shift `chartType` to URL as SSOT. Derive it using `useMemo` from search parameters, replace calls to `setChartType` with URL updates, and remove the React state variable and sync effect.
* [ ] **Step 3.1b:** Shift `standalone` to URL as SSOT. Derive it directly from search parameters on render and remove its React state variable. * [x] **Step 3.1b:** Shift `standalone` to URL as SSOT. Derive it directly from search parameters on render and remove its React state variable.
* [ ] **Step 3.1c:** Shift `showWikiTreeMenus` to URL as SSOT. Derive it directly from search parameters on render and remove its React state variable. * [ ] **Step 3.1c:** Shift `showWikiTreeMenus` to URL as SSOT. Derive it directly from search parameters on render and remove its React state variable.
* [ ] **Step 3.1d:** Shift `freezeAnimation` to URL as SSOT. Derive it directly from search parameters on render and remove its React state variable. * [ ] **Step 3.1d:** Shift `freezeAnimation` to URL as SSOT. Derive it directly from search parameters on render and remove its React state variable.
* [ ] **Step 3.2:** Extract `selection` and `detailIndi` state. Parse them directly from URL params (`indi`, `gen`, and `detail`); update display selectors. Remove React states. Ensure that chart selection changes (`onSelection` callback) explicitly clear or update the `detail` query parameter to match the new selection to avoid getting stuck on the old details viewport. Also update the detail-only selection handler (`onDetailSelection`) to update the `detail` query parameter in the URL. * [ ] **Step 3.2:** Extract `selection` and `detailIndi` state. Parse them directly from URL params (`indi`, `gen`, and `detail`); update display selectors. Remove React states. Ensure that chart selection changes (`onSelection` callback) explicitly clear or update the `detail` query parameter to match the new selection to avoid getting stuck on the old details viewport. Also update the detail-only selection handler (`onDetailSelection`) to update the `detail` query parameter in the URL.

6
src/app.tsx
View File

@@ -91,8 +91,7 @@ export function App() {
const [error, setError] = useState<string>(); const [error, setError] = useState<string>();
/** Whether the side panel is shown. */ /** Whether the side panel is shown. */
const [showSidePanel, setShowSidePanel] = useState(false); const [showSidePanel, setShowSidePanel] = useState(false);
/** Whether the app is in standalone mode, i.e. showing 'open file' menus. */
const [standalone, setStandalone] = useState(true);
/** /**
* Whether the app should display WikiTree-specific menus when showing data * Whether the app should display WikiTree-specific menus when showing data
* from WikiTree. * from WikiTree.
@@ -124,6 +123,8 @@ export function App() {
const args = useMemo(() => getArguments(location), [location]); const args = useMemo(() => getArguments(location), [location]);
/** Type of displayed chart. */ /** Type of displayed chart. */
const chartType = args.chartType; const chartType = args.chartType;
/** Whether the app is in standalone mode, i.e. showing 'open file' menus. */
const standalone = args.standalone;
/** Prevents the Google Drive "Open with" state from being processed more than once. */ /** Prevents the Google Drive "Open with" state from being processed more than once. */
const stateProcessed = useRef(false); const stateProcessed = useRef(false);
@@ -354,7 +355,6 @@ export function App() {
setSourceSpec(args.sourceSpec); setSourceSpec(args.sourceSpec);
setSelection(args.selection); setSelection(args.selection);
setDetailIndi(args.selection?.id); setDetailIndi(args.selection?.id);
setStandalone(args.standalone);
setShowWikiTreeMenus(args.showWikiTreeMenus); setShowWikiTreeMenus(args.showWikiTreeMenus);
setFreezeAnimation(args.freezeAnimation); setFreezeAnimation(args.freezeAnimation);
setConfig(args.config); setConfig(args.config);