add subpath

DSD-DBS · Apr 9, 2024 · 8cd656a · 8cd656a
1 parent 4dff213
commit 8cd656a
Show file tree

Hide file tree

Showing 10 changed files with 40 additions and 18 deletions.
diff --git a/Dockerfile b/Dockerfile
@@ -36,5 +36,9 @@ COPY --from=build-frontend /app/dist/ ./frontend/dist/
 # Expose the port the app runs in
 EXPOSE 8000
 
+COPY entrypoint.sh /entrypoint.sh
+RUN chmod +x /entrypoint.sh
+ENTRYPOINT ["/entrypoint.sh"]
+
 # Start the application
 CMD ["python", "-m", "capella_model_explorer.backend", "/model", "/views"]
diff --git a/capella_model_explorer/backend/explorer.py b/capella_model_explorer/backend/explorer.py
@@ -10,7 +10,7 @@
 
 import capellambse
 import yaml
-from fastapi import FastAPI, Request
+from fastapi import APIRouter, FastAPI, Request
 from fastapi.middleware.cors import CORSMiddleware
 from fastapi.responses import HTMLResponse
 from fastapi.staticfiles import StaticFiles
@@ -46,30 +46,32 @@ def __post_init__(self):
         )
         self.app.state.templates = Jinja2Templates(directory=PATH_TO_FRONTEND)
 
-        self.configure_routes()
+        router = APIRouter()
+        self.configure_routes(router)
+        self.app.include_router(router, prefix="/myapp")
 
-    def configure_routes(self):
-        self.app.mount(
+    def configure_routes(self, router: APIRouter):
+        router.mount(
             "/assets",
             StaticFiles(
                 directory=PATH_TO_FRONTEND.joinpath("assets"), html=True
             ),
         )
 
-        @self.app.get("/api/views")
+        @router.get("/api/views")
         def read_templates():
             # list all templates in the templates folder from .yaml
             self.grouped_templates, self.templates = index_templates(
                 self.templates_path
             )
             return self.grouped_templates
 
-        @self.app.get("/api/objects/{uuid}")
+        @router.get("/api/objects/{uuid}")
         def read_object(uuid: str):
             obj = self.model.by_uuid(uuid)
             return {"idx": obj.uuid, "name": obj.name, "type": obj.xtype}
 
-        @self.app.get("/api/views/{template_name}")
+        @router.get("/api/views/{template_name}")
         def read_template(template_name: str):
             template_name = urlparse.unquote(template_name)
             if not template_name in self.templates:
@@ -96,7 +98,7 @@ def read_template(template_name: str):
                 base["error"] = str(e)
             return base
 
-        @self.app.get("/api/views/{template_name}/{object_id}")
+        @router.get("/api/views/{template_name}/{object_id}")
         def render_template(template_name: str, object_id: str):
             content = None
             object = None
@@ -137,7 +139,7 @@ def render_template(template_name: str, object_id: str):
                 )
                 return HTMLResponse(content=error_message)
 
-        @self.app.get("/api/model-info")
+        @router.get("/api/model-info")
         def model_info():
             info = self.model.info
             return {
@@ -149,7 +151,7 @@ def model_info():
                 "badge": self.model.description_badge,
             }
 
-        @self.app.get("/{rest_of_path:path}")
+        @router.get("/{rest_of_path:path}")
         async def catch_all(request: Request, rest_of_path: str):
             del rest_of_path
             return self.app.state.templates.TemplateResponse(

diff --git a/entrypoint.sh b/entrypoint.sh
@@ -0,0 +1,3 @@
+#!/bin/bash
+sed -i 's#__ROUTE_PREFIX__#'"$ROUTE_PREFIX"'#g' /app/frontend/dist/env.js
+exec "$@"
diff --git a/frontend/index.html b/frontend/index.html
@@ -10,6 +10,7 @@
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Model Explorer</title>
+    <script type="module" src="/public/env.js"></script>
   </head>
   <body>
     <div id="root"></div>

diff --git a/frontend/package.json b/frontend/package.json
@@ -5,7 +5,7 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "vite build",
+    "build": "vite build && cp public/env.js dist/env.js",
     "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview",
     "storybook": "storybook dev -p 6006",

diff --git a/frontend/public/env.js b/frontend/public/env.js
@@ -0,0 +1,3 @@
+window.env = {
+    ROUTE_PREFIX: '__ROUTE_PREFIX__',
+  };
diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
@@ -13,14 +13,16 @@ import { HomeView } from './views/HomeView'
 
 function App() {
   const [count, setCount] = useState(0)
+  const API_ENDPOINT = window.env.API_ENDPOINT;
+  const ROUTE_PREFIX = window.env.ROUTE_PREFIX;
 
   return (
     <Router>
       <Routes>
-        <Route path="/" element={<HomeView/>} />
+        <Route path={`${ROUTE_PREFIX}/*`} element={<HomeView/>} />
         {/* <Route path="/views" element={<WiredTemplatesList endpoint="http://localhost:8000/api/views" />} /> */}
-        <Route path="/:templateName" element={<TemplateView endpoint="http://localhost:8000/api/views/" />} />
-        <Route path="/:templateName/:objectID" element={<TemplateView endpoint="http://localhost:8000/api/views/" />} />
+        <Route path={`${ROUTE_PREFIX}/:templateName`} element={<TemplateView endpoint={API_ENDPOINT} />} />
+        <Route path={`${ROUTE_PREFIX}/:templateName/:objectID`} element={<TemplateView endpoint={API_ENDPOINT} />} />
       </Routes>
     </Router>
   )

diff --git a/frontend/src/components/TemplateDetails.jsx b/frontend/src/components/TemplateDetails.jsx
@@ -5,7 +5,7 @@ import React, { useEffect, useState } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 
 export const TemplateDetails = ({ endpoint, onSingleInstance }) => {
-    let { templateName, objectID } = useParams();
+    let { session, session_id,  templateName, objectID } = useParams();
     const [error, setError] = useState(null);
     const [details, setDetails] = useState([]);
     const navigate = useNavigate();

diff --git a/frontend/src/components/WiredTemplatesList.jsx b/frontend/src/components/WiredTemplatesList.jsx
@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import React, {useState, useEffect} from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useLocation } from 'react-router-dom';
 import { ViewsList } from './ViewsList';
 import { API_BASE_URL } from '../APIConfig';
 
@@ -11,6 +11,7 @@ export const WiredTemplatesList = () => {
     const [templates, setTemplates] = useState([])
     const [error, setError] = useState(null);
     const navigate = useNavigate();
+    const location = useLocation();
 
     useEffect(() => {
         const fetchTemplates = async () => {
@@ -42,4 +43,10 @@ export const WiredTemplatesList = () => {
             }
         </div>);
     }
-    return <ViewsList templates={templates} cardClickCallback={(idx) => navigate(`/${idx}`, {state: {idx: idx}})} />;}
+    return (
+        <ViewsList 
+            templates={templates} 
+            cardClickCallback={(idx) => navigate(`/${location.pathname}/${idx}`, {state: {idx: idx}})}
+        />
+    );
+}
diff --git a/frontend/src/views/TemplateView.jsx b/frontend/src/views/TemplateView.jsx
@@ -14,7 +14,7 @@ import { InstanceView } from "../components/InstanceView";
 import { TemplateDetails } from "../components/TemplateDetails";
 
 export const TemplateView = ({ endpoint }) => {
-    let { templateName, objectID } = useParams();
+    let { session, session_id,  templateName, objectID } = useParams();
     const [singleObjectID, setObjectID] = useState(null);
     const location = useLocation();