forked/topola-viewer
1
0
Fork 0
mirror of https://github.com/PeWu/topola-viewer.git synced 2026-07-17 17:21:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

Shift chartType to URL as source of truth

Browse Source
This commit is contained in:
Przemek Więch
2026-06-11 15:17:38 +02:00
parent 899fc71197
commit 97c9628dbe
2 changed files with 6 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/APP_REFACTORING_DESIGN.md
View File

@@ -91,7 +91,7 @@ To refactor `app.tsx` safely and maintain continuous code correctness, we will m
#### 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:
* [ ] **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.
* [ ] **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.

9
src/app.tsx
View File

@@ -98,8 +98,7 @@ export function App() {
* from WikiTree.
*/
const [showWikiTreeMenus, setShowWikiTreeMenus] = useState(true);
/** Type of displayed chart. */
const [chartType, setChartType] = useState<ChartType>(ChartType.Hourglass);
/** Whether to show the error popup. */
const [showErrorPopup, setShowErrorPopup] = useState(false);
/** Specification of the source of the data. */
@@ -122,6 +121,10 @@ export function App() {
const navigate = useNavigate();
const location = useLocation();
const args = useMemo(() => getArguments(location), [location]);
/** Type of displayed chart. */
const chartType = args.chartType;
/** Prevents the Google Drive "Open with" state from being processed more than once. */
const stateProcessed = useRef(false);
/** Tracks whether the component is currently mounted to prevent state updates after unmount. */
@@ -353,7 +356,6 @@ export function App() {
setDetailIndi(args.selection?.id);
setStandalone(args.standalone);
setShowWikiTreeMenus(args.showWikiTreeMenus);
setChartType(args.chartType);
setFreezeAnimation(args.freezeAnimation);
setConfig(args.config);
const currentFetchId = ++fetchIdRef.current;
@@ -399,7 +401,6 @@ export function App() {
const loadMoreFromWikitree =
args.sourceSpec.source === DataSourceEnum.WIKITREE &&
(!selection || selection.id !== args.selection?.id);
setChartType(args.chartType);
setState(
loadMoreFromWikitree ? AppState.LOADING_MORE : AppState.SHOWING_CHART,
);