merge prod (with everything) into main

Author: Bvngee

.github/workflows/build-push-docker-images.yml

@@ -6,13 +6,15 @@ on:
 
 env:
   REGISTRY_URL: "${{ secrets.CONTAINER_REGISTRY_URL }}"
+  ENV_PRODUCTION_FILE: "${{ secrets.ENV_PRODUCTION_FILE }}"
 
 jobs:
   build:
     runs-on: ubuntu-24.04-arm
     steps:
     - uses: actions/checkout@v4
-    - name: Login to GitHub Package Registry
-      run: echo "${{ secrets.CONTAINER_REGISTRY_PASSWORD }}" | docker login $REGISTRY_URL -u "${{ secrets.CONTAINER_REGISTRY_USERNAME }}" --password-stdin
+    - run: echo "${{ secrets.CONTAINER_REGISTRY_PASSWORD }}" | docker login $REGISTRY_URL -u "${{ secrets.CONTAINER_REGISTRY_USERNAME }}" --password-stdin
+    - run: echo "$ENV_PRODUCTION_FILE" > frontend/.env.production
     - run: docker compose build
     - run: docker compose push
+    - run: docker logout $REGISTRY_URL

backend/Dockerfile

@@ -1,4 +1,4 @@
-FROM python:3.12-slim
+FROM python:3.12
 
 WORKDIR /app
 

backend/requirements.txt

@@ -5,3 +5,4 @@ pyarrow-stubs
 websockets==14.0
 aiohttp==3.11.10
 aiohttp_cors==0.7
+cantools>=40.2.1

backend/src/http_server.py

@@ -1,23 +1,24 @@
 import os
 from aiohttp import web
 import aiohttp_cors
+import cantools
 
-dirs = list(filter(None, os.environ.get("RECORDING_DIRS", "").split(":")))
+data_dir = os.environ.get("DATA_DIR", "")
 parquet_files = set()
-for toplevel_dir in dirs:
-    if not os.path.isdir(toplevel_dir):
-        print("Invalid recording dir: ", toplevel_dir)
-        continue
+if not os.path.isdir(data_dir):
+    raise ValueError("Invalid recording dir: ", data_dir)
 
-    def check_subdir(d):
-        for f in os.listdir(d):
-            path = os.path.join(d, f)
-            if os.path.isdir(path):
-                check_subdir(path)
-            elif f.endswith(".pq") or f.endswith(".parquet"):
-                parquet_files.add(os.path.relpath(path, toplevel_dir))
 
-    check_subdir(toplevel_dir)
+def check_subdir(d):
+    for f in os.listdir(d):
+        path = os.path.join(d, f)
+        if os.path.isdir(path):
+            check_subdir(path)
+        elif f.endswith(".pq") or f.endswith(".parquet"):
+            parquet_files.add(os.path.relpath(path, data_dir))
+
+
+check_subdir(data_dir)
 
 
 routes = web.RouteTableDef()
@@ -27,16 +28,17 @@ def check_subdir(d):
 async def available_recordings(request):
     return web.json_response(list(parquet_files))
 
-if len(dirs) > 0:
-    # TODO: decide on multuple dirs
-    routes.static("/api/get-recording", dirs[0], show_index=True)
-# @routes.get("/api/get-recording/{filename}")
-# async def get_recording(request: web.Request):
-#     f = request.match_info.get("filename")
-#     if not f:
-#         return web.Response(status=404, body="Unkown / incorrect recording filename!")
-#     # return web.Response(content_type="application/vnd.apache.arrow.stream", body=)
-#     return web.json_response({"you asked for": f})
+
+# This serves the parquet data directly as static files
+routes.static("/api/get-recording", data_dir, show_index=True)
+
+
+@routes.get("/api/get-dbc/{car}")
+async def get_dbc(request: web.Request):
+    car = request.match_info.get("car")
+    db = cantools.db.database.Database()
+    
+    return web.json_response(response_obj)
 
 
 app = web.Application()

backend/src/util/dbc_to_json.py

@@ -0,0 +1,55 @@
+import cantools
+import json
+
+def message_to_obj(msg: cantools.db.Message):
+    return {
+        "frame_id": msg.frame_id,
+        "name": msg.name,
+        "length": msg.length,
+        "signals": msg.signals,
+        # if the message is a container message, this lists
+        # the messages which it potentially features
+        "contained_messages": [message_to_obj(m) for m in msg.contained_messages or []],
+        # header ID of message if it is part of a container message
+        "header_id": msg.header_id,
+        "header_byte_order": msg.header_byte_order,
+        "unused_bit_pattern": msg.unused_bit_pattern,
+        "comment": msg.comment,
+        "senders": msg.senders,
+        "send_type": msg.send_type,
+        "cycle_time": msg.cycle_time,
+        "is_extended_frame": msg.is_extended_frame,
+        "is_fd": msg.is_fd,
+        "bus_name": msg.bus_name,
+        "signal_groups": msg.signal_groups,
+        "protocol": msg.protocol,
+    }
+
+def signal_to_obj(sig: cantools.db.Signal):
+    return {
+        "name": sig.name,
+        "start": sig.start,
+        "length": sig.length,
+        "byte_order": sig.byte_order,
+        "is_signed": sig.is_signed,
+        "raw_initial": sig.raw_initial,
+        "raw_invalid": sig.raw_invalid,
+        "conversion": sig.conversion,
+        "minimum": sig.maximum,
+        "maximum": sig.minimum,
+        "unit": sig.unit,
+        "comment": sig.comment,
+        "receivers": sig.receivers,
+        "is_multiplexer": sig.is_multiplexer,
+        "multiplexer_ids": sig.multiplexer_ids,
+        "multiplexer_signal": sig.multiplexer_signal,
+        "spn": sig.spn,
+    }
+
+def dbc_to_json(db: cantools.db.Database):
+    response_obj = {
+        "version": db.version,
+        "messages": [message_to_obj(msg) for msg in db.messages],
+        "nodes": db.nodes,
+        "buses": db.buses,
+    }

backend/src/sim.py renamed to backend/src/util/sim.py

@@ -6,7 +6,7 @@
 import pyarrow as pa
 import random
 
-import sim
+import util.sim as sim
 
 # List of WebSocket connections with their corresponding Arrow Stream (IPC)
 # Writers and BytesIO buffers

backend/src/websocket_server.py

@@ -17,6 +17,8 @@ services:
   # Nodejs process hosts react frontend
   nodejs:
     image: "${REGISTRY_URL:-}telemetry-vis-software/frontend:latest"
+    # NOTE: in order for the build to produce a working output, .env.production
+    # needs to be present in the build context dir with lcjs license information.
     build: ./frontend
     expose:
       - "3000"

compose.yaml

@@ -0,0 +1,99 @@
+// import { RangeSlider, RangeSliderProps, RangeSliderValue } from "@mantine/core";
+// import { useEffect, useRef, useState } from "react";
+//
+// interface DraggableRangeSliderProps extends RangeSliderProps {
+//     draggableBarHeightPx?: number;
+//     value: RangeSliderValue;
+//     onChange: (value: RangeSliderValue) => void;
+// }
+//
+// export default function DraggableRangeSlider({
+//     draggableBarHeightPx,
+//     value,
+//     onChange,
+//     ...props
+// }: DraggableRangeSliderProps) {
+//     const [range, setRange] = [value, onChange];
+//
+//     const draggingRef = useRef(false);
+//     const lastMouseX = useRef(0);
+//     const sliderRef = useRef<HTMLDivElement>(null);
+//     const width = range[1] - range[0];
+//
+//     const handleMouseDown = (event: MouseEvent) => {
+//         draggingRef.current = true;
+//         lastMouseX.current = event.clientX;
+//     };
+//
+//     const handleMouseUp = () => {
+//         draggingRef.current = false;
+//     };
+//
+//     const handleMouseMove = (event: MouseEvent) => {
+//         if (!draggingRef.current || !sliderRef.current) return;
+//
+//         const deltaX = event.clientX - lastMouseX.current;
+//         lastMouseX.current = event.clientX;
+//
+//         // Convert pixels to range values proportionally
+//         const sliderWidth = sliderRef.current.clientWidth;
+//         const rangeWidth = 100; // Assuming the slider goes from 0 to 100
+//         const scaleFactor = rangeWidth / sliderWidth; // Converts pixels to value change
+//
+//         const deltaValue = deltaX * scaleFactor; // Smooth movement
+//
+//         setRange(([start, end]) => {
+//             let newStart = start + deltaValue;
+//             let newEnd = end + deltaValue;
+//
+//             // Prevent exceeding min/max limits
+//             if (newStart < 0) {
+//                 newStart = 0;
+//                 newEnd = end - start; // Maintain width
+//             }
+//             if (newEnd > 100) {
+//                 newEnd = 100;
+//                 newStart = newEnd - (end - start); // Maintain width
+//             }
+//
+//             return [newStart, newEnd];
+//         });
+//     };
+//
+//     useEffect(() => {
+//         document.addEventListener("mousemove", handleMouseMove);
+//         document.addEventListener("mouseup", handleMouseUp);
+//         return () => {
+//             document.removeEventListener("mousemove", handleMouseMove);
+//             document.removeEventListener("mouseup", handleMouseUp);
+//         };
+//     }, []);
+//
+//     return (
+//         <div ref={sliderRef} className="relative w-full">
+//             <RangeSlider
+//                 value={range}
+//                 onChange={setRange}
+//                 styles={{
+//                     track: { cursor: "pointer" },
+//                     bar: { cursor: "pointer" },
+//                 }}
+//                 {...props}
+//             />
+//             {/* Invisible overlay to detect middle drag */}
+//             <div
+//                 className="absolute top-0 left-0 h-full bg-red-300"
+//                 style={{
+//                     cursor: "grab",
+//                     width: `${width - width * 0.1}%`,
+//                     left: `${range[0] + width * 0.05}%`,
+//                     height: "20px", // Make it easy to grab
+//                     backgroundColor: "transparent",
+//                     zIndex: 10,
+//                     top: -(20 - (sliderRef.current ? sliderRef.current.offsetHeight : 0)) / 2,
+//                 }}
+//                 onMouseDown={handleMouseDown}
+//             />
+//         </div>
+//     );
+// }