update

reader/src/App.jsx

@@ -1,5 +1,13 @@
 import { StrictMode, Fragment, useLayoutEffect, useRef, useState, useEffect, useMemo } from "react";
-import { Navigate, BrowserRouter, Link, Outlet, Route, Routes } from "react-router";
+import {
+  Navigate,
+  useSearchParams,
+  BrowserRouter,
+  Link,
+  Outlet,
+  Route,
+  Routes,
+} from "react-router";
 import { marked } from "marked";
 import { resourcesInstance } from "./api.js";
 import { useStore } from "./store.js";
@@ -20,6 +28,7 @@ import {
   VRuleIcon,
 } from "./icons/Icons";
 import ResourcePage from "./ResourcePage.jsx";
+import NamePage from "./NamePage.jsx";
 import io from "socket.io-client";
 
 //const socket = io("http://localhost:3000");
@@ -134,6 +143,7 @@ export function App() {
             <Route path=":topicId" element={<FileReader />} />
           </Route>
           <Route path="/edit" element={<ResourcePage />} />
+          <Route path="/name" element={<NamePage />} />
         </Routes>
       </BrowserRouter>
       <ToastContainer />
@@ -161,7 +171,19 @@ function LoadingWrapper({ children }) {
 
 function Layout() {
   const config = useStore((state) => state.config);
+  const changeConfig = useStore((state) => state.changeConfig);
   const topic = useTopic();
+  const [searchParams, setSearchParams] = useSearchParams();
+
+  useEffect(() => {
+    if (searchParams.has("v")) {
+      const resV = Number(searchParams.get("v"));
+      if (typeof resV === "number" && resV >= 0 && resV <= 8) {
+        changeConfig({ version: resV });
+      }
+      setSearchParams({});
+    }
+  }, [searchParams, changeConfig, setSearchParams]);
 
   return (
     <div className="max-w-7xl mx-auto h-full relative flex flex-col">
@@ -298,7 +320,7 @@ export function Reader({ topic }) {
 
   const resourceIdx = useStore((state) => state.resourceIdx);
   const selectResource = useStore((state) => state.selectResource);
-
+  console.log(resourceIdx);
   const selectedResource = topic.resources[resourceIdx];
 
   return (

reader/src/NamePage.jsx

@@ -0,0 +1,3 @@
+export default function NamePage() {
+  return <div>Hello name page</div>;
+}

reader/src/ResourcePage.jsx

@@ -17,6 +17,7 @@ function LoadingWrapper() {
 }
 
 function SelectResource({ topics, selectedTopic, selectedResource, onChange, disabled }) {
+  const version = useStore((state) => state.config.version);
   function handleChange(newTopicIdx, newResourceIdx) {
     if (disabled) {
       return;
@@ -43,7 +44,7 @@ function SelectResource({ topics, selectedTopic, selectedResource, onChange, dis
             id="topicSelect"
             value={selectedTopic.seq - 1}
             onChange={(event) => {
-              handleChange(parseInt(event.target.value), 0);
+              handleChange(parseInt(event.target.value), version);
             }}
             className="disabled:bg-gray-50 disabled:text-gray-500 px-2 py-1 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent bg-white"
           >
@@ -121,8 +122,9 @@ const ResourcePage = ({ topics }) => {
   const [tokenInput, setTokenInput] = useState("");
 
   // Topic + resource
+  const version = useStore((state) => state.config.version);
   const [topicIdx, setTopicIdx] = useState(0);
-  const [resourceIdx, setResourceIdx] = useState(0);
+  const [resourceIdx, setResourceIdx] = useState(version);
   const setStructure = useStore((state) => state.setStructure);
   const selectedTopic = topics[topicIdx];
   const selectedResource = selectedTopic.resources[resourceIdx];
@@ -170,19 +172,18 @@ const ResourcePage = ({ topics }) => {
   }, [content]);
 
   const handleLoad = () => {
-    return;
-    const iframe = iframeRef.current;
-    if (iframe) {
-      try {
-        // Only works for same-origin content
-        const contentHeight = iframe.contentDocument.body.scrollHeight;
-        if (contentHeight > 100) {
-          iframe.style.height = contentHeight + "px";
-        }
-      } catch (error) {
-        console.log("Cross-origin iframe - cannot access content height");
-      }
-    }
+    //const iframe = iframeRef.current;
+    //if (iframe) {
+    //  try {
+    //    // Only works for same-origin content
+    //    const contentHeight = iframe.contentDocument.body.scrollHeight;
+    //    if (contentHeight > 100) {
+    //      iframe.style.height = contentHeight + "px";
+    //    }
+    //  } catch (error) {
+    //    console.log("Cross-origin iframe - cannot access content height");
+    //  }
+    //}
   };
 
   const handleTokenSubmit = () => {

reader/src/store.js

@@ -20,7 +20,7 @@ export const useStore = create((set, get) => ({
     if (topicIdx === null) {
       set({ topicIdx, resourceIdx: null });
     } else {
-      set({ topicIdx, resourceIdx: 0 });
+      set({ topicIdx, resourceIdx: get().config.version });
     }
   },
   selectResource: (resourceIdx) => {
@@ -59,6 +59,7 @@ function getLocalConfig() {
     narrowMode: true,
     justifyText: false,
     contentZoomLevel: 100,
+    version: 0,
   };
   const config_str = localStorage.getItem("config");
   const config = config_str ? JSON.parse(config_str) : {};

resource-provider/server.js

@@ -124,8 +124,8 @@ app.post(
   verifyToken,
   asyncHandler(async (req, res) => {
     try {
-      const { topicSeq, resourceSeq, content } = req.body;
-      if (!topicSeq || !resourceSeq || !content) {
+      const { topicSeq, resourceSeq, content = "" } = req.body;
+      if (!topicSeq || !resourceSeq) {
         res.status(400).json({ message: "Missing body" });
         return;
       }
@@ -186,11 +186,9 @@ app.post(
       }
 
       if (sourceResourceSeq === targetResourceSeq) {
-        res
-          .status(400)
-          .json({
-            message: "Source and target resource sequences cannot be the same",
-          });
+        res.status(400).json({
+          message: "Source and target resource sequences cannot be the same",
+        });
         return;
       }