React based WebUI

[chrisstoll1]

Howdy,

I was looking for a nice way to manage this utility from TrueNAS. I've seen some of the other WebUI related discussions #74 and was inspired to tackle it in my own way. Its pretty straight-forward, I'm using FastAPI to serve a single page React app. This is all bundled into a docker container aptly named iSponsorBlockTV-dashboard. I've added some quality of life features like being able to search for YT channels by name to add them to the whitelist. On the cli side I've added a event handler that monitors the config file and reloads it when an update is detected. I've been running this on my TrueNAS setup and its been working pretty well so far. Definitely needs a bit more work but so far so good.

I updated the github action to build the dashboard. So currently I'm getting it onto TrueNAS with the following docker-compose.

services:
  dashboard:
    container_name: iSponsorBlockTV-dashboard
    depends_on:
      - iSponsorBlockTV
    image: ghcr.io/chrisstoll1/isponsorblocktv-dashboard:develop
    ports:
      - '30696:8080'
    restart: unless-stopped
    volumes:
      - ./data:/app/data
  iSponsorBlockTV:
    container_name: iSponsorBlockTV
    image: ghcr.io/chrisstoll1/isponsorblocktv:develop
    restart: unless-stopped
    volumes:
      - ./data:/app/data

I'd imagine something similar would be used in the final product.

Is this worth cleaning up and moving forward with? Any feedback is appreciated