add drag and drop to rest of lists

src/app/components/processor/processor.html

@@ -63,13 +63,37 @@
     <div
       class="flex flex-col bg-gray-800 border-2 {{
         isInError() ? 'border-red-500' : 'border-gray-600'
-      }} border-dotted w-fit h-full"
+      }} border-solid w-fit h-full opacity-30"
     >
       <div class="flex items-center justify-center">
-        <div class="grow ml-1 mr-3 text-transparent">
+        @if (inDragList()) {
+          <div
+            cdkDragHandle
+            class="flex items-center justify-center bg-transparent hover:bg-gray-700 hover:cursor-move text-blue-400"
+          >
+            <mat-icon>drag_indicator</mat-icon>
+          </div>
+        }
+        <div class="grow ml-1 mr-3 text-white">
           {{ schema()?.title || processor()?.type }}
         </div>
+        <div
+          class="flex items-center justify-center hover:bg-gray-700 hover:cursor-pointer"
+          (click)="delete.emit()"
+        >
+          <mat-icon class="text-red-500!">close</mat-icon>
+        </div>
       </div>
+      @if (hasParams()) {
+        <hr class="bg-gray-600 h-0.5 border-0" />
+        <div>
+          <app-params-form
+            [paramsSchema]="schema()?.properties?.params"
+            [data]="params()"
+            (updated)="paramsUpdated($event)"
+          ></app-params-form>
+        </div>
+      }
     </div>
   </div>
 }