feat: delete monitors

.env

@@ -38,6 +38,3 @@ MESSENGER_TRANSPORT_DSN=doctrine://default?auto_setup=0
 ###< symfony/messenger ###
 
 REDIS_HOST=redis://redis
-
-MOVIES_PATH=/var/download/movies
-TVSHOWS_PATH=/var/download/tvshows

.gitignore

@@ -1,4 +1,5 @@
 .idea
+bolt.db
 ###> symfony/framework-bundle ###
 /.env.local
 /.env.local.php

Dockerfile

@@ -12,3 +12,5 @@ RUN install-php-extensions \
 	opcache
 
 HEALTHCHECK --interval=3s --timeout=3s --retries=10 CMD [ "php", "/app/bin/console", "startup:status" ]
+
+COPY docker/app/Caddyfile /etc/frankenphp/Caddyfile

Dockerfile.prod

@@ -1,11 +0,0 @@
-FROM registry.caldwell.digital/library/php:8.4-apache
-
-RUN apt-get update && \
-    apt-get install libldap2-dev -y && \
-    rm -rf /var/lib/apt/lists/* && \
-    docker-php-ext-configure ldap --with-libdir=lib/x86_64-linux-gnu/ && \
-    docker-php-ext-install ldap
-
-COPY --chown=www-data:www-data . /var/www
-COPY bash/nginx.conf /etc/apache2/sites-enabled/vhost.conf
-RUN rm /etc/apache2/sites-enabled/000-default.conf

assets/controllers/download_list_controller.js

@@ -29,6 +29,12 @@ export default class extends Controller {
         }
     }
 
+    deleteDownload(data) {
+        fetch(`/api/download/${data.params.id}`, {method: 'DELETE'})
+            .then(res => res.json())
+            .then(json => console.debug(json));
+    }
+
     // Add custom controller actions here
     // fooBar() { this.fooTarget.classList.toggle(this.bazClass) }
 

assets/controllers/monitor_controller.js

@@ -1,24 +0,0 @@
-import { Controller } from '@hotwired/stimulus';
-
-/*
-* The following line makes this controller "lazy": it won't be downloaded until needed
-* See https://github.com/symfony/stimulus-bridge#lazy-controllers
-*/
-/* stimulusFetch: 'lazy' */
-export default class extends Controller {
-    static values = {
-        title: String,
-        tmdbId: String,
-        imdbId: String,
-        mediaType: String,
-    }
-
-    addMovieMonitor() {
-        console.log(`/monitor/movies/${this.tmdbIdValue}/${this.imdbIdValue}/${encodeURI(this.titleValue)}`)
-        fetch(`/monitor/movies/${this.tmdbIdValue}/${this.imdbIdValue}/${encodeURI(this.titleValue)}`)
-            .then(res => res.json())
-            .then(json => {
-                console.log(json)
-            })
-    }
-}

assets/controllers/monitor_list_controller.js

@@ -0,0 +1,14 @@
+import { Controller } from '@hotwired/stimulus';
+
+/*
+* The following line makes this controller "lazy": it won't be downloaded until needed
+* See https://github.com/symfony/stimulus-bridge#lazy-controllers
+*/
+/* stimulusFetch: 'lazy' */
+export default class extends Controller {
+    deleteMonitor(data) {
+        fetch(`/api/monitor/${data.params.id}`, {method: 'DELETE'})
+            .then(res => res.json())
+            .then(json => console.debug(json));
+    }
+}

assets/icons/ic/twotone-cancel.svg

@@ -0,0 +1 @@
+<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M12 4c-4.41 0-8 3.59-8 8s3.59 8 8 8s8-3.59 8-8s-3.59-8-8-8m5 11.59L15.59 17L12 13.41L8.41 17L7 15.59L10.59 12L7 8.41L8.41 7L12 10.59L15.59 7L17 8.41L13.41 12z" opacity=".3"/><path fill="currentColor" d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10s10-4.47 10-10S17.53 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8m3.59-13L12 10.59L8.41 7L7 8.41L10.59 12L7 15.59L8.41 17L12 13.41L15.59 17L17 15.59L13.41 12L17 8.41z"/></svg>

bash/app/wget_download.sh

@@ -1,2 +0,0 @@
-# $1 = movies/tvshows/etc, $2 = title of media, $3 = URL of download
-cd /var/download/${1} && if [ ! -d "${2}" ]; then mkdir "${2}"; fi && cd "${2}" && wget "${3}"

bash/nginx.conf

@@ -1,32 +0,0 @@
-server {
-    listen       80;
-    listen  [::]:80;
-    server_name  localhost;
-
-    root /var/www/public;
-
-    location /hub/ {
-        proxy_set_header X-Real-IP $remote_addr;
-        proxy_set_header Host $host;
-        proxy_redirect   off;
-        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-        proxy_pass http://mercure/;
-    }
-
-
-    location / {
-        # try to serve file directly, fallback to index.php
-        try_files $uri /index.php$is_args$args;
-    }
-
-    location ~ \.php$ {
-        fastcgi_pass unix:/run/php-fpm.sock;
-        fastcgi_split_path_info ^(.+\.php)(/.*)$;
-        fastcgi_buffers 16 16k;
-        fastcgi_buffer_size 32k;
-        include fastcgi_params;
-        fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
-        fastcgi_param DOCUMENT_ROOT $realpath_root;
-        internal;
-    }
-}

compose.yml

@@ -12,25 +12,40 @@ services:
       - $PWD/bash/caddy:/etc/caddy
       - $PWD/bash/certs:/etc/ssl
 
+
   app:
     build: .
     restart: unless-stopped
-    environment:
-      FRANKENPHP_CONFIG: "worker /app/public/index.php"
     volumes:
       - $PWD:/app
+      - mercure_data:/data
+      - mercure_config:/config
     tty: true
+    environment:
+      MERCURE_PUBLISHER_JWT_KEY: '!ChangeThisMercureHubJWTSecretKey!'
+      MERCURE_SUBSCRIBER_JWT_KEY: '!ChangeThisMercureHubJWTSecretKey!'
     depends_on:
       database:
         condition: service_healthy
 
+
   worker:
     build: .
     restart: unless-stopped
     volumes:
       - $PWD:/app
     tty: true
-    command: php /app/bin/console messenger:consume async -vv
+    command: php /app/bin/console messenger:consume async -vv --time-limit=3600 limit=10
+
+
+  scheduler:
+    build: .
+    restart: unless-stopped
+    volumes:
+      - $PWD:/app
+    command: php /app/bin/console messenger:consume scheduler_monitor -vv
+    tty: true
+
 
   redis:
     image: redis:latest
@@ -39,23 +54,6 @@ services:
     command: redis-server --maxmemory 512MB
     restart: unless-stopped
 
-  mercure:
-    image: dunglas/mercure
-    restart: unless-stopped
-    ports:
-      - "3000:80"
-    environment:
-      SERVER_NAME: ':80'
-      MERCURE_PUBLISHER_JWT_KEY: '!ChangeThisMercureHubJWTSecretKey!'
-      MERCURE_SUBSCRIBER_JWT_KEY: '!ChangeThisMercureHubJWTSecretKey!'
-      MERCURE_EXTRA_DIRECTIVES: |
-        cors_origins *
-        anonymous
-    command: /usr/bin/caddy run --config /etc/caddy/dev.Caddyfile
-    volumes:
-      - mercure_data:/data
-      - mercure_config:/config
-
 
   database:
     image: mariadb:10.11.2
@@ -74,11 +72,13 @@ services:
       timeout: 5s
       retries: 10
 
+
   adminer:
     image: adminer
     ports:
       - "8081:8080"
 
+
 volumes:
   mysql:
   mercure_data:

config/services.yaml

@@ -11,8 +11,8 @@ parameters:
     media.tvshows_path: '/var/download/%env(default:media.default_tvshows_dir:TVSHOWS_PATH)%'
 
     # Mercure
-    app.mercure.url: 'http://mercure/.well-known/mercure'
-    app.mercure.public_url: '%env(APP_URL)%/hub/.well-known/mercure'
+    app.mercure.url: 'http://app/.well-known/mercure'
+    app.mercure.public_url: '%env(APP_URL)%/.well-known/mercure'
 
     # Cache
     app.cache.adapter: '%env(default:app.cache.adapter.default:CACHE_ADAPTER)%'

deploy.compose.yml

@@ -1,70 +1,46 @@
 services:
   app:
-    image: registry.caldwell.digital/home/torsearch-app:latest
+    image: registry.caldwell.digital/home/torsearch-app:${TAG}
     ports:
       - '8001:80'
+    environment:
+      MERCURE_PUBLISHER_JWT_KEY: '!ChangeThisMercureHubJWTSecretKey!'
+      MERCURE_SUBSCRIBER_JWT_KEY: '!ChangeThisMercureHubJWTSecretKey!'
     deploy:
       replicas: 2
+    volumes:
+      - /mnt/media/downloads/movies:/var/download/movies
+      - /mnt/media/downloads/tvshows:/var/download/tvshows
+      - mercure_data:/data
+      - mercure_config:/config
     depends_on:
       - database
 
 
   worker:
-    image: registry.caldwell.digital/home/torsearch-worker:latest
+    image: registry.caldwell.digital/home/torsearch-worker:${TAG}
     volumes:
       - /mnt/media/downloads/movies:/var/download/movies
       - /mnt/media/downloads/tvshows:/var/download/tvshows
     restart: always
-    command: -vv
+    command: -vv --time-limit=3600 --limit=10
     deploy:
-      replicas: 4
+      replicas: 2
     depends_on:
       - app
 
 
   scheduler:
-    image: registry.caldwell.digital/home/torsearch-scheduler:latest
+    image: registry.caldwell.digital/home/torsearch-scheduler:${TAG}
     volumes:
-      - ./downloads:/var/download
+      - /mnt/media/downloads/movies:/var/download/movies
+      - /mnt/media/downloads/tvshows:/var/download/tvshows
     restart: always
+    command: -vv
     depends_on:
       - app
 
 
-  mercure:
-    image: dunglas/mercure
-    restart: unless-stopped
-    ports:
-      - "3001:80"
-    environment:
-      SERVER_NAME: ':80'
-      MERCURE_PUBLISHER_JWT_KEY: '!ChangeThisMercureHubJWTSecretKey!'
-      MERCURE_SUBSCRIBER_JWT_KEY: '!ChangeThisMercureHubJWTSecretKey!'
-      MERCURE_EXTRA_DIRECTIVES: |
-        cors_origins *
-        anonymous
-    command: /usr/bin/caddy run --config /etc/caddy/dev.Caddyfile
-    volumes:
-      - mercure_data:/data
-      - mercure_config:/config
-
-
-  database:
-    image: mariadb:10.11.2
-    volumes:
-      - mysql:/var/lib/mysql
-    environment:
-      MYSQL_DATABASE: app
-      MYSQL_USERNAME: app
-      MYSQL_PASSWORD: password
-      MYSQL_ROOT_PASSWORD: password
-    healthcheck:
-      test: [ "CMD", "mysqladmin" ,"ping", "-h", "localhost" ]
-      interval: 5s
-      timeout: 5s
-      retries: 10
-
-
   redis:
     image: redis:latest
     volumes:

docker/Dockerfile.app

@@ -1,6 +1,5 @@
 FROM dunglas/frankenphp
 
-ENV FRANKENPHP_CONFIG="worker /app/public/index.php 20"
 ENV SERVER_NAME=":80"
 ENV CADDY_GLOBAL_OPTIONS="auto_https off"
 ENV APP_RUNTIME="Runtime\\FrankenPhpSymfony\\Runtime"
@@ -13,10 +12,11 @@ RUN install-php-extensions \
 	opcache
 
 COPY . /app
-COPY --chmod=775 ./bash/entrypoint.sh /usr/local/bin/docker-entrypoint
+COPY --chmod=775 docker/app/entrypoint.sh /usr/local/bin/docker-entrypoint
+COPY docker/app/Caddyfile /etc/frankenphp/Caddyfile
 
 ENTRYPOINT [ "/usr/local/bin/docker-entrypoint" ]
 
-CMD [ "frankenphp", "run", "--config", "/etc/caddy/Caddyfile" ]
+CMD [ "frankenphp", "run", "--config", "/etc/frankenphp/Caddyfile" ]
 
 HEALTHCHECK --interval=3s --timeout=3s --retries=10 CMD [ "php", "/app/bin/console", "startup:status" ]

docker/Dockerfile.scheduler

@@ -1,4 +1,4 @@
-FROM dunglas/frankenphp
+FROM dunglas/frankenphp:php8.4-alpine
 
 ENV SERVER_NAME=":80"
 ENV CADDY_GLOBAL_OPTIONS="auto_https off"
@@ -13,4 +13,6 @@ RUN install-php-extensions \
 
 COPY . /app
 
-ENTRYPOINT [ "php", "/app/bin/console", "messenger:consume", "schedule_monitor" ]
+ENTRYPOINT [ "php", "/app/bin/console", "messenger:consume", "scheduler_monitor" ]
+
+HEALTHCHECK --interval=3s --timeout=3s --retries=10 CMD return 0

docker/app/Caddyfile

@@ -0,0 +1,61 @@
+{
+	{$CADDY_GLOBAL_OPTIONS}
+
+	frankenphp {
+		{$FRANKENPHP_CONFIG}
+
+
+	}
+}
+
+{$CADDY_EXTRA_CONFIG}
+
+{$SERVER_NAME:localhost} {
+	log {
+		{$CADDY_SERVER_LOG_OPTIONS}
+		# Redact the authorization query parameter that can be set by Mercure
+		format filter {
+			request>uri query {
+				replace authorization REDACTED
+			}
+		}
+	}
+
+	root /app/public
+	encode zstd br gzip
+
+	mercure {
+		# Publisher JWT key
+		publisher_jwt {env.MERCURE_PUBLISHER_JWT_KEY} {env.MERCURE_PUBLISHER_JWT_ALG}
+		# Subscriber JWT key
+		subscriber_jwt {env.MERCURE_SUBSCRIBER_JWT_KEY} {env.MERCURE_SUBSCRIBER_JWT_ALG}
+		# Allow anonymous subscribers (double-check that it's what you want)
+		anonymous
+		# Enable the subscription API (double-check that it's what you want)
+		subscriptions
+		# Custmo cors
+		cors_origins *
+		# Extra directives
+		{$MERCURE_EXTRA_DIRECTIVES}
+	}
+
+	vulcain
+
+	{$CADDY_SERVER_EXTRA_DIRECTIVES}
+
+	# Disable Topics tracking if not enabled explicitly: https://github.com/jkarlin/topics
+	header ?Permissions-Policy "browsing-topics=()"
+
+	@phpRoute {
+		not path /.well-known/mercure*
+		not file {path}
+	}
+	rewrite @phpRoute index.php
+
+	@frontController path index.php
+	php @frontController
+
+	file_server {
+		hide *.php
+	}
+}

docker/app/supervisord.conf

@@ -1,9 +0,0 @@
-[program:messenger-consume]
-command=php /var/www/bin/console messenger:consume async --time-limit=3600
-user=nobody
-numprocs=2
-startsecs=0
-autostart=true
-autorestart=true
-startretries=10
-process_name=%(program_name)s_%(process_num)02d

nomad.deploy.hcl

@@ -0,0 +1,129 @@
+variable "image_tag" {
+  type        = string
+  description = "Docker image tag to deploy."
+  default     = "latest"
+}
+
+job "torsearch" {
+  datacenters = [ "home" ]
+  type = "service"
+
+  group "app" {
+    count = 2
+
+    update {
+      max_parallel     = 4
+      min_healthy_time = "30s"
+      healthy_deadline = "3m"
+      auto_revert = true
+    }
+
+    network {
+      port "app" {
+        to = 80
+      }
+    }
+
+    task "app" {
+      driver = "docker"
+
+      config {
+        image = "registry.caldwell.digital/home/torsearch-app:${var.image_tag}"
+        ports = ["app"]
+      }
+
+      env {
+        MERCURE_PUBLISHER_JWT_KEY = "!ChangeThisMercureHubJWTSecretKey!"
+        MERCURE_SUBSCRIBER_JWT_KEY = "!ChangeThisMercureHubJWTSecretKey!"
+      }
+
+      service {
+        name = "torsearch-app"
+        provider = "nomad"
+        port = "app"
+
+        meta {
+          nomad_ingress_enabled  = true
+          nomad_ingress_hostname = "torsearch-nomad.caldwell.digital"
+        }
+      }
+    }
+  }
+
+  group "worker" {
+    count = 2
+    update {
+      max_parallel     = 4
+      min_healthy_time = "30s"
+      healthy_deadline = "3m"
+      auto_revert = true
+    }
+
+    volume "media" {
+      type = "host"
+      source = "media"
+      read_only = false
+    }
+
+    task "worker" {
+      driver = "docker"
+
+      volume_mount {
+        volume      = "media"
+        destination = "/var/download"
+        read_only = false
+      }
+
+      config {
+        image = "registry.caldwell.digital/home/torsearch-worker:${var.image_tag}"
+        args = [
+          "-vv"
+        ]
+      }
+
+      service {
+        name = "torsearch-worker"
+        provider = "nomad"
+      }
+    }
+  }
+
+  group "scheduler" {
+    count = 1
+
+    update {
+      max_parallel     = 2
+      min_healthy_time = "30s"
+      healthy_deadline = "3m"
+      auto_revert = true
+    }
+
+    volume "media" {
+      type = "host"
+      source = "media"
+      read_only = false
+    }
+
+    task "scheduler" {
+      driver = "docker"
+
+      volume_mount {
+        volume      = "media"
+        destination = "/var/download"
+        read_only = false
+      }
+
+      config {
+        image = "registry.caldwell.digital/home/torsearch-scheduler:${var.image_tag}"
+        args = [
+          "-vv"
+        ]
+      }
+
+      service {
+        name = "torsearch-scheduler"
+        provider = "nomad"
+      }
+    }
+  }
+}

src/Download/Action/Command/DeleteDownloadCommand.php

@@ -0,0 +1,15 @@
+<?php
+
+namespace App\Download\Action\Command;
+
+use OneToMany\RichBundle\Contract\CommandInterface;
+
+/**
+ * @implements CommandInterface<DeleteDownloadCommand>
+ */
+class DeleteDownloadCommand implements CommandInterface
+{
+    public function __construct(
+        public int $downloadId,
+    ) {}
+}

src/Download/Action/Handler/DeleteDownloadHandler.php

@@ -0,0 +1,26 @@
+<?php
+
+namespace App\Download\Action\Handler;
+
+use App\Download\Action\Command\DeleteDownloadCommand;
+use App\Download\Action\Result\DeleteDownloadResult;
+use App\Download\Framework\Repository\DownloadRepository;
+use OneToMany\RichBundle\Contract\CommandInterface;
+use OneToMany\RichBundle\Contract\HandlerInterface;
+use OneToMany\RichBundle\Contract\ResultInterface;
+
+/** @implements HandlerInterface<DeleteDownloadCommand, DeleteDownloadResult> */
+readonly class DeleteDownloadHandler implements HandlerInterface
+{
+    public function __construct(
+        private DownloadRepository $downloadRepository,
+    ) {}
+
+    public function handle(CommandInterface $command): ResultInterface
+    {
+        $download = $this->downloadRepository->find($command->downloadId);
+        $this->downloadRepository->delete($command->downloadId);
+
+        return new DeleteDownloadResult(200, 'Success', $download);
+    }
+}

src/Download/Action/Input/DeleteDownloadInput.php

@@ -0,0 +1,24 @@
+<?php
+
+namespace App\Download\Action\Input;
+
+use App\Download\Action\Command\DeleteDownloadCommand;
+use OneToMany\RichBundle\Attribute\SourceRoute;
+use OneToMany\RichBundle\Contract\CommandInterface;
+use OneToMany\RichBundle\Contract\InputInterface;
+
+/** @implements InputInterface<DeleteDownloadInput> */
+class DeleteDownloadInput implements InputInterface
+{
+    public function __construct(
+        #[SourceRoute('downloadId')]
+        public int $downloadId,
+    ) {}
+
+    public function toCommand(): CommandInterface
+    {
+        return new DeleteDownloadCommand(
+            $this->downloadId,
+        );
+    }
+}

src/Download/Action/Result/DeleteDownloadResult.php

@@ -0,0 +1,16 @@
+<?php
+
+namespace App\Download\Action\Result;
+
+use App\Download\Framework\Entity\Download;
+use OneToMany\RichBundle\Contract\ResultInterface;
+
+/** @implements ResultInterface<DownloadMediaResult> */
+class DeleteDownloadResult implements ResultInterface
+{
+    public function __construct(
+        public int $status,
+        public string $message,
+        public Download $download,
+    ) {}
+}

src/Download/Framework/Controller/ApiController.php

@@ -2,6 +2,8 @@
 
 namespace App\Download\Framework\Controller;
 
+use App\Download\Action\Handler\DeleteDownloadHandler;
+use App\Download\Action\Input\DeleteDownloadInput;
 use App\Download\Action\Input\DownloadMediaInput;
 use App\Download\Framework\Repository\DownloadRepository;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
@@ -56,4 +58,23 @@ class ApiController extends AbstractController
 
         return $this->json(['status' => 200, 'message' => 'Added to Queue']);
     }
+
+    #[Route('/api/download/{downloadId}', name: 'api_download_delete', methods: ['DELETE'])]
+    public function deleteDownload(
+        Request $request,
+        DeleteDownloadInput $input,
+        DeleteDownloadHandler $handler,
+    ): Response {
+        $result = $handler->handle($input->toCommand());
+        $this->hub->publish(new Update(
+            $request->getSession()->get('mercure_alert_topic'),
+            $this->renderView('broadcast/Alert.stream.html.twig', [
+                'alert_id' => uniqid(),
+                'title' => 'Success',
+                'message' => '"' . $result->download->getTitle() . '" has been deleted.',
+            ])
+        ));
+
+        return $this->json(['status' => 200, 'message' => 'Download Deleted']);
+    }
 }

src/Monitor/Action/Command/DeleteMonitorCommand.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace App\Monitor\Action\Command;
+
+use OneToMany\RichBundle\Contract\CommandInterface;
+
+/** @implements CommandInterface<DeleteMonitorCommand> */
+class DeleteMonitorCommand implements CommandInterface
+{
+    public function __construct(
+        public string $monitorId,
+    ) {}
+}

src/Monitor/Action/Handler/DeleteMonitorHandler.php

@@ -0,0 +1,36 @@
+<?php
+
+namespace App\Monitor\Action\Handler;
+
+use App\Monitor\Action\Command\AddMonitorCommand;
+use App\Monitor\Action\Command\DeleteMonitorCommand;
+use App\Monitor\Action\Result\AddMonitorResult;
+use App\Monitor\Action\Result\DeleteMonitorResult;
+use App\Monitor\Framework\Entity\Monitor;
+use App\Monitor\Framework\Repository\MonitorRepository;
+use App\User\Framework\Repository\UserRepository;
+use DateTimeImmutable;
+use OneToMany\RichBundle\Contract\CommandInterface;
+use OneToMany\RichBundle\Contract\HandlerInterface;
+use OneToMany\RichBundle\Contract\ResultInterface;
+
+/** @implements HandlerInterface<DeleteMonitorCommand, DeleteMonitorResult> */
+readonly class DeleteMonitorHandler implements HandlerInterface
+{
+    public function __construct(
+        private MonitorRepository $monitorRepository,
+    ) {}
+
+    public function handle(CommandInterface $command): ResultInterface
+    {
+        $monitor = $this->monitorRepository->find($command->monitorId);
+        $this->monitorRepository->getEntityManager()->remove($monitor);
+        $this->monitorRepository->getEntityManager()->flush();
+
+        return new DeleteMonitorResult(
+            status: 'OK',
+            result: [],
+            monitor: $monitor
+        );
+    }
+}

src/Monitor/Action/Input/DeleteMonitorInput.php

@@ -0,0 +1,24 @@
+<?php
+
+namespace App\Monitor\Action\Input;
+
+use App\Monitor\Action\Command\DeleteMonitorCommand;
+use OneToMany\RichBundle\Attribute\SourceRoute;
+use OneToMany\RichBundle\Contract\CommandInterface;
+use OneToMany\RichBundle\Contract\InputInterface;
+
+/** @implements InputInterface<DeleteMonitorInput, DeleteMonitorCommand> */
+class DeleteMonitorInput implements InputInterface
+{
+    public function __construct(
+        #[SourceRoute('monitorId')]
+        public int $monitorId,
+    ) {}
+
+    public function toCommand(): CommandInterface
+    {
+        return new DeleteMonitorCommand(
+            $this->monitorId
+        );
+    }
+}

src/Monitor/Action/Result/DeleteMonitorResult.php

@@ -0,0 +1,15 @@
+<?php
+
+namespace App\Monitor\Action\Result;
+
+use App\Monitor\Framework\Entity\Monitor;
+use OneToMany\RichBundle\Contract\ResultInterface;
+
+class DeleteMonitorResult implements ResultInterface
+{
+    public function __construct(
+        public string $status,
+        public array $result,
+        public Monitor $monitor,
+    ) {}
+}

src/Monitor/Framework/Controller/ApiController.php

@@ -2,8 +2,11 @@
 
 namespace App\Monitor\Framework\Controller;
 
+use App\Download\Action\Input\DeleteDownloadInput;
 use App\Monitor\Action\Handler\AddMonitorHandler;
+use App\Monitor\Action\Handler\DeleteMonitorHandler;
 use App\Monitor\Action\Input\AddMonitorInput;
+use App\Monitor\Action\Input\DeleteMonitorInput;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
 use Symfony\Bundle\SecurityBundle\Security;
 use Symfony\Component\DependencyInjection\Attribute\Autowire;
@@ -43,4 +46,27 @@ class ApiController extends AbstractController
             'message' => $response
         ]);
     }
+
+    #[Route('/api/monitor/{monitorId}', name: 'api_monitor_delete', methods: ['DELETE'])]
+    public function deleteMonitor(
+        DeleteMonitorInput $input,
+        DeleteMonitorHandler $handler,
+        HubInterface $hub,
+    ) {
+        $response = $handler->handle($input->toCommand());
+
+        $hub->publish(new Update(
+            'alerts',
+            $this->renderer->render('broadcast/Alert.stream.html.twig', [
+                'alert_id' => uniqid(),
+                'title' => 'Success',
+                'message' => "New monitor added for {$response->monitor->getTitle()}",
+            ])
+        ));
+
+        return $this->json([
+            'status' => 200,
+            'message' => $response
+        ]);
+    }
 }

src/Monitor/Framework/Entity/Monitor.php

@@ -7,7 +7,9 @@ use App\User\Framework\Entity\User;
 use Doctrine\DBAL\Types\Types;
 use Doctrine\ORM\Mapping as ORM;
 use Symfony\Component\Serializer\Attribute\Ignore;
+use Symfony\UX\Turbo\Attribute\Broadcast;
 
+#[Broadcast(template: 'broadcast/Monitor.stream.html.twig')]
 #[ORM\Entity(repositoryClass: MonitorRepository::class)]
 class Monitor
 {

templates/broadcast/Download.stream.html.twig

@@ -18,6 +18,7 @@
                         <twig:StatusBadge color="green" status="Complete" />
                     {% endif %}
                 </td>
+                <td></td>
             </tr>
         </template>
     </turbo-stream>
@@ -35,6 +36,7 @@
                         <div class="text-green-700 rounded-sm text-bold text-gray-950 text-center bg-green-600 h-5" style="width:{{ entity.progress }}%">{{ entity.progress }}%</div>
                     </div>
                 </td>
+                <td></td>
             </template>
         </turbo-stream>
     {% else %}
@@ -59,6 +61,15 @@
                     <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-gray-50">
                         <twig:StatusBadge color="green" status="Complete" />
                     </td>
+                    <td class="px-6 py-4 flex flex-row align-middle justify-center">
+                        <button {{ stimulus_action('download_list', 'deleteDownload', 'click', {id: download.id}) }}>
+                            <twig:ux:icon
+                                    name="ic:twotone-cancel" width="18px"
+                                    class="rounded-full align-middle text-red-600"
+                                    title="Remove {{ download.title }} from download list. This will not delete the file."
+                            />
+                        </button>
+                    </td>
                 </tr>
             </template>
         </turbo-stream>

templates/broadcast/Monitor.stream.html.twig

@@ -0,0 +1,85 @@
+{# Learn how to use Turbo Streams: https://github.com/symfony/ux-turbo#broadcast-doctrine-entities-update #}
+{% block create %}
+    <turbo-stream action="remove" target="active_monitors_no_monitors">
+    </turbo-stream>
+
+    <turbo-stream action="append" target="monitors">
+        <template>
+            <tr  id="monitor_{{ entity.id }}">
+                <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-stone-800 min-w-[50ch] max-w-[50ch] truncate">
+                    {{ entity.title }}
+                </td>
+                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800">
+                    {{ entity.searchCount }}
+                </td>
+                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800">
+                    {{ entity.createdAt|date('m/d/Y h:i a') }}
+                </td>
+                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800">
+                    {{ entity.lastSearch|date('m/d/Y h:i a') }}
+                </td>
+                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800">
+                    {% if entity.status == "New" %}
+                        <twig:StatusBadge color="orange" status="{{ entity.status }}" />
+                    {% elseif entity.status == "In Progress" or entity.status == "Active" %}
+                        <twig:StatusBadge color="purple" status="{{ entity.status }}" />
+                    {% else %}
+                        <twig:StatusBadge color="green" status="{{ entity.status }}" />
+                    {% endif %}
+                </td>
+                <td class="px-6 py-4 flex flex-row align-middle justify-center">
+                    <button {{ stimulus_action('monitor_list', 'deleteMonitor', 'click', {id: entity.id}) }}>
+                        <twig:ux:icon
+                                name="ic:twotone-cancel" width="18px"
+                                class="rounded-full align-middle text-red-600"
+                                title="Remove {{ entity.title }} from your Monitor list."
+                        />
+                    </button>
+                </td>
+            </tr>
+        </template>
+    </turbo-stream>
+{% endblock %}
+
+{% block update %}
+        <turbo-stream action="prepend" target="monitors">
+            <template>
+                <tr  id="monitor_{{ entity.id }}">
+                    <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-stone-800 min-w-[50ch] max-w-[50ch] truncate">
+                        {{ entity.title }}
+                    </td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800">
+                        {{ entity.searchCount }}
+                    </td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800">
+                        {{ entity.createdAt|date('m/d/Y h:i a') }}
+                    </td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800">
+                        {{ entity.lastSearch|date('m/d/Y h:i a') }}
+                    </td>
+                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800">
+                        {% if entity.status == "New" %}
+                            <twig:StatusBadge color="orange" status="{{ entity.status }}" />
+                        {% elseif entity.status == "In Progress" or entity.status == "Active" %}
+                            <twig:StatusBadge color="purple" status="{{ entity.status }}" />
+                        {% else %}
+                            <twig:StatusBadge color="green" status="{{ entity.status }}" />
+                        {% endif %}
+                    </td>
+                    <td class="px-6 py-4 flex flex-row align-middle justify-center">
+                        <button {{ stimulus_action('monitor_list', 'deleteMonitor', 'click', {id: entity.id}) }}>
+                            <twig:ux:icon
+                                    name="ic:twotone-cancel" width="18px"
+                                    class="rounded-full align-middle text-red-600"
+                                    title="Remove {{ entity.title }} from your Monitor list."
+                            />
+                        </button>
+                    </td>
+                </tr>
+            </template>
+        </turbo-stream>
+{% endblock %}
+
+{% block remove %}
+    <turbo-stream action="remove" target="monitor_{{ id }}"></turbo-stream>
+{% endblock %}

templates/components/DownloadList.html.twig

@@ -23,6 +23,9 @@
                 class="px-6 py-3 text-start text-xs font-medium text-gray-500 uppercase dark:text-stone-800">
                 Progress
             </th>
+            <th scope="col"
+                class="px-6 py-3 text-start text-xs font-medium text-gray-500 uppercase dark:text-stone-800">
+            </th>
         </tr>
         </thead>
         <tbody id="{{ table_body_id }}" class="divide-y divide-gray-200 dark:divide-gray-50">
@@ -45,15 +48,24 @@
                     <td class="px-6 py-4 whitespace-nowrap text-sm align-middle text-gray-800 dark:text-gray-50">
                         {% if download.progress < 100 %}
                             <div class="border-2 border-green-700 rounded-md w-full h-6 align-middle overflow-hidden">
-                                <div class="text-green-700 rounded-sm text-bold text-gray-950 text-center bg-green-600 h-5" style="width:{{ download.progress }}%">{{ download.progress }}%</div>
+                                <div class="text-green-700 rounded-sm text-bold text-gray-950 text-center bg-green-600 h-5"
+                                     style="width:{{ download.progress }}%">
+                                    {{ download.progress }}%
+                                </div>
                             </div>
-{#                        <div class="w-[3.25ch] h-[3.25ch] bg-purple-600 rounded-full block text-center table-cell align-middle text-xs text-gray-50">#}
-{#                            {{ download.progress }}#}
-{#                        </div>#}
                         {% else %}
-                            <twig:StatusBadge color="green" status="Completed" />
+                            <twig:StatusBadge color="green" status="Complete" />
                         {% endif %}
                     </td>
+                    <td class="px-6 py-4 flex flex-row align-middle justify-center">
+                        <button {{ stimulus_action('download_list', 'deleteDownload', 'click', {id: download.id}) }}>
+                            <twig:ux:icon
+                                    name="ic:twotone-cancel" width="18px"
+                                    class="rounded-full align-middle text-red-600"
+                                    title="Remove {{ download.title }} from your Download list. This will not delete the file."
+                            />
+                        </button>
+                    </td>
                 </tr>
             {% endfor %}
             {% if this.isWidget == true and this.downloads.items|length > this.perPage %}

templates/components/MonitorList.html.twig

@@ -1,6 +1,5 @@
-<div{{ attributes }} class="min-w-48">
-    <p class="text-white mb-1">The items you're currently monitoring to automatically download.</p>
-    <table id="downloads" class="divide-y divide-gray-200 bg-gray-50 overflow-hidden rounded-lg table-fixed" {{ turbo_stream_listen('App\\Download\\Framework\\Entity\\Download') }}>
+<div{{ attributes.defaults(stimulus_controller('monitor_list')) }}>
+    <table id="monitor_list" class="divide-y divide-gray-200 bg-gray-50 overflow-hidden rounded-lg table-auto w-full" {{ turbo_stream_listen('App\\Monitor\\Framework\\Entity\\Monitor') }}>
         <thead>
         <tr class="bg-orange-500 bg-filter bg-blur-lg bg-opacity-80 text-gray-950">
             <th scope="col"
@@ -23,9 +22,10 @@
                 class="px-6 py-3 text-start text-xs font-medium uppercase">
                 Status
             </th>
+            <th></th>
         </tr>
         </thead>
-        <tbody class="divide-y divide-gray-50">
+        <tbody id="monitors" class="divide-y divide-gray-50">
         {% if this.userMonitors.items|length > 0 %}
             {% for monitor in this.userMonitors.items %}
                 <tr  id="monitor_{{ monitor.id }}">
@@ -50,18 +50,27 @@
                             <twig:StatusBadge color="green" status="{{ monitor.status }}" />
                         {% endif %}
                     </td>
+                    <td class="px-6 py-4 flex flex-row align-middle justify-center">
+                        <button {{ stimulus_action('monitor_list', 'deleteMonitor', 'click', {id: monitor.id}) }}>
+                            <twig:ux:icon
+                                    name="ic:twotone-cancel" width="18px"
+                                    class="rounded-full align-middle text-red-600"
+                                    title="Remove {{ monitor.title }} from your Monitor list."
+                            />
+                        </button>
+                    </td>
                 </tr>
             {% endfor %}
             {% if this.userMonitors.items|length > 5 %}
                 <tr  id="monitor_view_all">
-                    <td colspan="5" class="py-2 whitespace-nowrap bg-orange-500 uppercase text-sm font-medium text-center text-white min-w-[50ch] max-w-[50ch] truncate">
+                    <td colspan="100%" class="py-2 whitespace-nowrap bg-orange-500 uppercase text-sm font-medium text-center text-white min-w-[50ch] max-w-[50ch] truncate">
                         <a href="#">View All Monitors</a>
                     </td>
                 </tr>
             {% endif %}
         {% else %}
-            <tr>
-                <td class="px-6 py-4 whitespace-nowrap text-xs uppercase text-center col-span-2 font-medium text-stone-800" colspan="2">
+            <tr id="active_monitors_no_monitors">
+                <td class="px-6 py-4 whitespace-nowrap text-xs uppercase text-center col-span-2 font-medium text-stone-800" colspan="100%">
                     No monitors
                 </td>
             </tr>