Turn DSS visualization into microservice/web application

Goal

Build a web application based on next.js that visualizes runs from Distributed Summary Synthesis (DSS) based on the results data available in a database.

Issue

Currently, we have a a Python script that connects to the database of our analysis results and renders the information from a hard-coded run into a HTML page. It then starts a web server that serves this page.

This script has two main caveats:

• To visualize a different run, it must be re-executed. This means that the script can not be deployed standalone.
• Python is a subpar choice for designing a web-based visualization, especially because IDEs provide little support for the Python-based styling (example code). This means that maintenance of the visualization is unnecessarily difficult.

Technical Details

DSS writes its analysis results into a database (reference). The existing script (mainly lines 27-117) can be used as a reference on how to process this data.

It would be good to have the visualization webapp as a continuously running service that can be queried for different runs. Probably a resource-based web app makes sense, with routes like http://visualization/runs/Run%2F1 to display the visualization for the run with name 'Run/1'.

Wireframe for prototype: https://www.figma.com/board/gaq1doKvw5QERuniqQhBIB/DSS-Run-Visualization-Wireframe?node-id=0-1&t=7ZkngaK4OI3m7wsN-1

First Steps

First, install skaffold and minikube (or Docker Desktop with a running Kubernetes instance, or some other distribution of kubernetes). Then build and run a first instance of DSS; please create an issue in this repository if you encounter any errors. The first run should create the SQLite database /tmp/messages.db in the docker container of the service scheduler. You can use this for initial development, so save it.

Then initialize a new next.js project in directory visualization in the root of this repository. Important: The project must use the app router, not the page router.

Then build a first server-side route /api/runs. When called with a HTTP GET request, this route should fetch all distinct run ids from a configured DSS database and return them. Then build a frontend component to display these run ids to the user. The user should be able to select one run id. This routes him to a new page /app/runs/[runId]/. This page can just show 'Hello World' for now. As soon as you have this, please open a merge request so that we can talk about the next steps.