sync worked

frontend/src/routes/settings/+page.svelte

@@ -150,6 +150,7 @@
   let displayMappings = [];
   let isSavingMigration = false;
   let isLoadingMigration = false;
+  let isSyncing = false;
 
   async function loadMigrationSettings() {
     isLoadingMigration = true;
@@ -183,6 +184,23 @@
     }
   }
 
+  async function triggerSyncNow() {
+    isSyncing = true;
+    try {
+      const result = await api.postApi("/migration/sync-now", {});
+      addToast(
+        `Synced ${result.synced_count} environment(s)${result.failed_count > 0 ? `, ${result.failed_count} failed` : ""}`,
+        result.failed_count > 0 ? "warning" : "success",
+      );
+      await loadMigrationSettings();
+    } catch (err) {
+      console.error("[SettingsPage][Migration] Sync failed:", err);
+      addToast(err.message || "Sync failed", "error");
+    } finally {
+      isSyncing = false;
+    }
+  }
+
   // Handle global settings save (Logging, Storage)
   async function handleSave() {
     console.log("[SettingsPage][Action] Saving settings");
@@ -1015,6 +1033,41 @@
               >
                 {isSavingMigration ? "Saving..." : "Save"}
               </button>
+              <button
+                on:click={triggerSyncNow}
+                disabled={isSyncing}
+                class="bg-green-600 text-white px-4 py-2 rounded hover:bg-green-700 h-[42px] min-w-[150px] flex items-center justify-center gap-2 disabled:opacity-50"
+              >
+                {#if isSyncing}
+                  <svg
+                    class="w-4 h-4 animate-spin"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
+                    ><path
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"
+                    ></path></svg
+                  >
+                  Syncing...
+                {:else}
+                  <svg
+                    class="w-4 h-4"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
+                    ><path
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"
+                    ></path></svg
+                  >
+                  Sync Now
+                {/if}
+              </button>
             </div>
           </div>