package.json

@@ -20,8 +20,7 @@
     "react": "^19.2.0",
     "react-bootstrap": "^2.10.10",
     "react-dom": "^19.2.0",
-    "react-router-dom": "^7.13.1",
-    "yaml": "^2.8.2"
+    "react-router-dom": "^7.13.1"
   },
   "devDependencies": {
     "@eslint/js": "^9.39.1",

src/Home.tsx

@@ -1,40 +1,12 @@
 import { AppNav, Footer } from "./AppNav.tsx";
 import { Container, Row, Col, Image } from "react-bootstrap";
-import { atom, useAtom } from "jotai";
-import { atomWithQuery } from "jotai-tanstack-query";
-
-const costmapImageQuery = async () => {
-    const resp = await fetch("api/costmap_image");
-    if (!resp.ok) {
-        throw new Error("Network response was not ok");
-    }
-    const blob = await resp.blob();
-    return URL.createObjectURL(blob);
-};
-
-const costmapImageAtom = atomWithQuery(() => ({
-    queryKey: ["costmap_image"],
-    queryFn: costmapImageQuery,
-    refetchInterval: 1000 // 1s
-}));
 
 export function Home() {
-  const [{ data, isPending, isError }] = useAtom(costmapImageAtom);
-
-  let costmapImage = () => {
-    if (isPending) {
-        return (<p>"Loading..."</p>);
-    }
-    if (isError) {
-        return(<p>"Error!"</p>);
-    }
-      return (<Image src={data} />);
-  };
   return (
     <div>
       <AppNav />
       <Container>
-          { costmapImage() }
+        <p> Hello World! </p>
       </Container>
       <Footer />
     </div>

src/Version.tsx

@@ -1,21 +1,23 @@
 import { AppNav, Footer } from "./AppNav.tsx";
-import { Container, Row, Col, Card } from "react-bootstrap";
-import { atom, useAtom } from "jotai";
-import { atomWithQuery } from "jotai-tanstack-query";
-import YAML from "yaml";
+import { Container, Row, Col, Image } from "react-bootstrap";
+import { atom, useAtom } from 'jotai';
+import { atomWithQuery } from 'jotai-tanstack-query';
 
 const versionQueryFn = async () => {
     const resp = await fetch("api/build_info");
     if(!resp.ok) {
-    throw new Error("Network response was not ok");
+        throw new Error('Network response was not ok')
     }
+    console.log(resp);
     return resp.json();
-};
+}
 
-const versionAtom = atomWithQuery(() => ({
+const versionAtom = atomWithQuery( () =>
+    ({
         queryKey: ["version"],
         queryFn: versionQueryFn,
-}));
+    })
+);
 
 export function Version() {
   const [{ data, isPending, isError }] = useAtom(versionAtom);
@@ -27,22 +29,17 @@ export function Version() {
         if(isError) {
             return "Error loading!";
         }
-    if (!data.status) {
-      return "Can not find version";
-    }
-    return YAML.stringify(data.message);
+        return JSON.stringify(data);
     };
 
+
   return (
     <div>
       <AppNav />
-      <Container className="vert-padded">
-        <Card className="padded">
-          <Card.Title>project.yaml</Card.Title>
-          <Card.Body>
-            <pre>{versionText()}</pre>
-          </Card.Body>
-        </Card>
+      <Container>
+          <p>
+          {versionText()}
+          </p>
       </Container>
       <Footer />
     </div>

yarn.lock

@@ -1195,7 +1195,6 @@ __metadata:
     typescript: "npm:~5.9.3"
     typescript-eslint: "npm:^8.48.0"
     vite: "npm:^7.3.1"
-    yaml: "npm:^2.8.2"
   languageName: unknown
   linkType: soft
 
@@ -3073,15 +3072,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"yaml@npm:^2.8.2":
-  version: 2.8.2
-  resolution: "yaml@npm:2.8.2"
-  bin:
-    yaml: bin.mjs
-  checksum: 10c0/703e4dc1e34b324aa66876d63618dcacb9ed49f7e7fe9b70f1e703645be8d640f68ab84f12b86df8ac960bac37acf5513e115de7c970940617ce0343c8c9cd96
-  languageName: node
-  linkType: hard
-
 "yocto-queue@npm:^0.1.0":
   version: 0.1.0
   resolution: "yocto-queue@npm:0.1.0"