From 4c4d3a45c2e058133f35ed4059b50a35dd9b06ff Mon Sep 17 00:00:00 2001
From: shamoon <4887959+shamoon@users.noreply.github.com>
Date: Sat, 11 Jan 2025 22:42:24 -0800
Subject: [PATCH] Fix: fix jittering when toggling workflows

---
 .../app/components/manage/workflows/workflows.component.html  | 4 ++--
 .../app/components/manage/workflows/workflows.component.ts    | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src-ui/src/app/components/manage/workflows/workflows.component.html b/src-ui/src/app/components/manage/workflows/workflows.component.html
index 085de71ea..0fb63d09a 100644
--- a/src-ui/src/app/components/manage/workflows/workflows.component.html
+++ b/src-ui/src/app/components/manage/workflows/workflows.component.html
@@ -22,7 +22,7 @@
     </div>
   </li>
 
-  @if (loading) {
+  @if (loading && workflows.length === 0) {
     <li class="list-group-item">
       <div class="spinner-border spinner-border-sm me-2" role="status"></div>
       <ng-container i18n>Loading...</ng-container>
@@ -36,7 +36,7 @@
         <div class="col d-flex align-items-center d-none d-sm-flex"><code>{{workflow.order}}</code></div>
         <div class="col d-flex align-items-center">
           <div class="form-check form-switch mb-0">
-            <input #inputField type="checkbox" class="form-check-input cursor-pointer" [id]="workflow.id+'_enable'" [(ngModel)]="workflow.enabled" (change)="onWorkflowEnableToggled(workflow)" *pngxIfPermissions="{ action: PermissionAction.Change, type: PermissionType.Workflow }">
+            <input #inputField type="checkbox" class="form-check-input cursor-pointer" [id]="workflow.id+'_enable'" [(ngModel)]="workflow.enabled" (change)="toggleWorkflowEnabled(workflow)" *pngxIfPermissions="{ action: PermissionAction.Change, type: PermissionType.Workflow }">
             <label class="form-check-label cursor-pointer" [for]="workflow.id+'_enable'">
               <code> @if(workflow.enabled) { <ng-container i18n>Enabled</ng-container> } @else { <span i18n class="text-muted">Disabled</span> }</code>
             </label>
diff --git a/src-ui/src/app/components/manage/workflows/workflows.component.ts b/src-ui/src/app/components/manage/workflows/workflows.component.ts
index 8d6e0f008..9c1bc1ad4 100644
--- a/src-ui/src/app/components/manage/workflows/workflows.component.ts
+++ b/src-ui/src/app/components/manage/workflows/workflows.component.ts
@@ -147,7 +147,7 @@ export class WorkflowsComponent
     })
   }
 
-  onWorkflowEnableToggled(workflow: Workflow) {
+  toggleWorkflowEnabled(workflow: Workflow) {
     this.workflowService.patch(workflow).subscribe({
       next: () => {
         this.toastService.showInfo(