Merge pull request #1 from DSD-DBS/storybook

MVP with React + FastAPI

.github/workflows/push-docker-image.yml

@@ -0,0 +1,41 @@
+name: Create and publish Docker image
+
+on:
+  push:
+    branches: ['**']
+    tags: ['v*.*.*']
+
+# Defines two custom environment variables for the workflow. These are used for the Container registry domain, and a name for the Docker image that this workflow builds.
+env:
+  IMAGE_NAME: ${{ github.repository }}
+
+# There is a single job in this workflow. It's configured to run on the latest available version of Ubuntu.
+jobs:
+  build-and-push-image:
+    runs-on: ubuntu-latest
+    # Sets the permissions granted to the `GITHUB_TOKEN` for the actions in this job.
+    permissions:
+      contents: read
+      packages: write
+      #
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+      - name: Log in to the Container registry
+        uses: docker/login-action@v3
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Extract metadata (tags, labels) for Docker
+        id: meta
+        uses: docker/metadata-action@v5
+        with:
+          images: ghcr.io/${{ github.repository }}/model-explorer
+      - name: Build and push Docker image
+        uses: docker/build-push-action@v5
+        with:
+          context: .
+          push: true
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}

.gitignore

@@ -156,3 +156,8 @@ dmypy.json
 
 # Cython debug symbols
 cython_debug/
+
+node_modules/
+
+# Mac stuff
+.DS_Store

.pre-commit-config.yaml

@@ -43,13 +43,15 @@ repos:
     rev: 6.3.0
     hooks:
       - id: pydocstyle
-        exclude: '^tests/'
+        exclude: "^tests/"
         additional_dependencies:
           - pydocstyle[toml]
   - repo: https://github.com/pre-commit/mirrors-mypy
     rev: v1.8.0
     hooks:
       - id: mypy
+        additional_dependencies:
+          - types-pyyaml==6.0.11
   - repo: https://github.com/Lucas-C/pre-commit-hooks
     rev: v1.5.4
     hooks:
@@ -62,7 +64,7 @@ repos:
           - --license-filepath
           - LICENSES/.license_header.txt
           - --comment-style
-          - '#'
+          - "#"
       - id: insert-license
         name: Insert license headers (XML-style comments)
         files: '\.(?:html|md|xml)$'
@@ -72,7 +74,7 @@ repos:
           - --license-filepath
           - LICENSES/.license_header.txt
           - --comment-style
-          - '<!--| ~| -->'
+          - "<!--| ~| -->"
       - id: insert-license
         name: Insert license headers (C-style comments)
         files: '\.(?:css|js|ts)$'
@@ -82,7 +84,7 @@ repos:
           - --license-filepath
           - LICENSES/.license_header.txt
           - --comment-style
-          - '/*| *| */'
+          - "/*| *| */"
       - id: insert-license
         name: Insert license headers (reST comments)
         files: '\.rst$'
@@ -92,7 +94,17 @@ repos:
           - --license-filepath
           - LICENSES/.license_header.txt
           - --comment-style
-          - '..|  |'
+          - "..|  |"
+      - id: insert-license
+        name: Insert license headers (JSX files)
+        files: '\.jsx$'
+        exclude: '(?:^|/)\..+'
+        args:
+          - --detect-license-in-X-top-lines=15
+          - --license-filepath
+          - LICENSES/.license_header.txt
+          - --comment-style
+          - "//"
   - repo: https://github.com/fsfe/reuse-tool
     rev: v3.0.1
     hooks:
@@ -102,3 +114,11 @@ repos:
     hooks:
       - id: commitlint
         stages: [commit-msg]
+  - repo: https://github.com/pre-commit/mirrors-prettier
+    rev: v3.1.0
+    hooks:
+      - id: prettier
+        types_or: [ts, css, html, markdown]
+        additional_dependencies:
+          - 'prettier@^3.2.5'
+          - 'prettier-plugin-tailwindcss@^0.5.14'

.vscode/launch.json

@@ -0,0 +1,15 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Debug CapellaModelExplorer Backend",
+      "type": "debugpy",
+      "request": "launch",
+      "console": "integratedTerminal",
+      "envFile": ".env",
+      "pythonArgs": ["-Xdev"],
+      "module": "capella_model_explorer.backend",
+      "args": ["MODELPATH", "./templates"]
+    }
+  ]
+}

.vscode/launch.json.license

@@ -0,0 +1,2 @@
+Copyright DB InfraGO AG and contributors
+SPDX-License-Identifier: Apache-2.0

CONTRIBUTING.md

@@ -76,8 +76,7 @@ The key differences are:
 
 - **Docstrings**: The [Numpy style guide] applies here.
 
-  [numpy style guide]:
-    https://numpydoc.readthedocs.io/en/latest/format.html#docstring-standard
+  [numpy style guide]: https://numpydoc.readthedocs.io/en/latest/format.html#docstring-standard
 
   When writing docstrings for functions, use the imperative style, as per
   [PEP-257]). For example, write "Do X and Y" instead of "Does X and Y".
@@ -124,7 +123,6 @@ The key differences are:
   typing related classes like `t.TypedDict`.
 
   <!-- prettier-ignore -->
-
   Use the new syntax and classes for typing introduced with Python 3.10.
 
   - Instead of `t.Tuple`, `t.List` etc. use the builtin classes `tuple`, `list`
@@ -142,8 +140,7 @@ The key differences are:
   If you have set up black correctly, you don't need to worry about this though
   :)
 
-  [black code style]:
-    https://black.readthedocs.io/en/stable/the_black_code_style/current_style.html
+  [black code style]: https://black.readthedocs.io/en/stable/the_black_code_style/current_style.html
 
 - When working with `dict`s, consider using `t.TypedDict` instead of a more
   generic `dict[str, float|int|str]`-like annotation where possible, as the

Dockerfile

@@ -0,0 +1,56 @@
+# Copyright DB InfraGO AG and contributors
+# SPDX-License-Identifier: Apache-2.0
+
+# Build frontend
+FROM node:20 as build-frontend
+WORKDIR /app
+COPY frontend/package*.json ./
+RUN npm install
+COPY frontend/ ./
+RUN npm run build
+
+# Build backend
+FROM python:3.12-slim-bookworm
+WORKDIR /app
+COPY ./capella_model_explorer ./capella_model_explorer
+COPY ./pyproject.toml ./
+COPY ./.git ./.git
+
+USER root
+
+RUN apt-get update && \
+    apt-get install --yes --no-install-recommends \
+    git \
+    git-lfs \
+    libgirepository1.0-dev \
+    libcairo2-dev \
+    gir1.2-pango-1.0 \
+    graphviz \
+    nodejs \
+    npm && \
+    rm -rf /var/lib/apt/lists/*
+
+RUN pip install .
+COPY --from=build-frontend /app/dist/ ./frontend/dist/
+
+# Expose the port the app runs in
+EXPOSE 8000
+
+COPY ./templates /views
+
+# Cache directory has to be writable
+RUN chmod -R 777 /home
+ENV HOME=/home
+
+COPY entrypoint.sh /entrypoint.sh
+RUN chmod +x /entrypoint.sh
+ENV MODEL_ENTRYPOINT=/model
+RUN chmod -R 777 ./frontend/dist/
+
+# Run as non-root user per default
+USER 1001
+
+# Pre-install npm dependencies for context diagrams
+RUN python -c "from capellambse_context_diagrams import _elkjs; _elkjs._install_required_npm_pkg_versions()"
+
+ENTRYPOINT ["/entrypoint.sh"]