strapi-content-sync-pro 1.0.4 → 1.0.5

package/README.md

@@ -14,7 +14,7 @@ A powerful Strapi v5 plugin to copy, migrate, and live-sync content, media, and
 Plugin intro: https://youtu.be/hr3dD6dLgLQ
 
 <a href="https://youtu.be/hr3dD6dLgLQ" target="_blank" rel="noopener noreferrer">
-  <img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20160506.png" alt="Content Sync Pro — watch the intro video" width="100%" />
+  <img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20122937.png" alt="Content Sync Pro — watch the intro video" width="100%" />
 </a>
 
 ## Screenshots
@@ -26,24 +26,39 @@ Plugin intro: https://youtu.be/hr3dD6dLgLQ
 
   <table>
     <tr>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20160506.png" alt="Content Sync Pro - screenshot 1" width="100%" /></td>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20160558.png" alt="Content Sync Pro - screenshot 2" width="100%" /></td>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20175903.png" alt="Content Sync Pro - screenshot 3" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20114332.png" alt="Content Sync Pro - screenshot 1" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20114644.png" alt="Content Sync Pro - screenshot 2" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20114651.png" alt="Content Sync Pro - screenshot 3" width="100%" /></td>
     </tr>
     <tr>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20175931.png" alt="Content Sync Pro - screenshot 4" width="100%" /></td>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20180001.png" alt="Content Sync Pro - screenshot 5" width="100%" /></td>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20180041.png" alt="Content Sync Pro - screenshot 6" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20114737.png" alt="Content Sync Pro - screenshot 4" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20114904.png" alt="Content Sync Pro - screenshot 5" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20114940.png" alt="Content Sync Pro - screenshot 6" width="100%" /></td>
     </tr>
     <tr>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20180116.png" alt="Content Sync Pro - screenshot 7" width="100%" /></td>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20180135.png" alt="Content Sync Pro - screenshot 8" width="100%" /></td>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20180202.png" alt="Content Sync Pro - screenshot 9" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20115003.png" alt="Content Sync Pro - screenshot 7" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20115024.png" alt="Content Sync Pro - screenshot 8" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20115116.png" alt="Content Sync Pro - screenshot 9" width="100%" /></td>
     </tr>
     <tr>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20180228.png" alt="Content Sync Pro - screenshot 10" width="100%" /></td>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20180251.png" alt="Content Sync Pro - screenshot 11" width="100%" /></td>
-      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-20%20180301.png" alt="Content Sync Pro - screenshot 12" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20115141.png" alt="Content Sync Pro - screenshot 10" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20115252.png" alt="Content Sync Pro - screenshot 11" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20115448.png" alt="Content Sync Pro - screenshot 12" width="100%" /></td>
+    </tr>
+    <tr>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20120534.png" alt="Content Sync Pro - screenshot 13" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20122544.png" alt="Content Sync Pro - screenshot 14" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20122712.png" alt="Content Sync Pro - screenshot 15" width="100%" /></td>
+    </tr>
+    <tr>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20122730.png" alt="Content Sync Pro - screenshot 16" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20122858.png" alt="Content Sync Pro - screenshot 17" width="100%" /></td>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20122924.png" alt="Content Sync Pro - screenshot 18" width="100%" /></td>
+    </tr>
+    <tr>
+      <td width="33%"><img src="https://raw.githubusercontent.com/eharain/strapi-content-sync-pro/master/docs/Screenshot%202026-04-23%20122937.png" alt="Content Sync Pro - screenshot 19" width="100%" /></td>
+      <td width="33%"></td>
+      <td width="33%"></td>
     </tr>
   </table>
 </details>
@@ -191,6 +206,7 @@ Full media synchronization between Strapi instances:
 - **Profile-based** — Create media sync profiles with direction, conflict strategy, MIME filters, filename patterns, and execution settings.
 - **DB + File Sync** — Syncs both the `plugin::upload.file` database rows and the actual file bytes.
 - **Morph Link Remapping** — Syncs `files_related_morphs` links by mapping file + related entities through documentId, then remapping to local numeric ids before insert.
+- **Live Status + Pause/Resume/Stop** — The Media tab polls status every 2 s while a profile is running or paused and shows live phase and counters (`pushed`, `pulled`, `skipped`, `errors`). Long runs can be paused, resumed, or stopped cooperatively from the UI or via `POST /api/strapi-content-sync-pro/media-sync/profiles/:id/pause|resume|cancel` (URL strategy; rsync runs cannot be paused mid-process).
 
 ## Enforcement
 
@@ -293,7 +309,8 @@ Check the **Logs** tab for detailed sync history including:
 
 ## Contributing
 
-Contributions are welcome! Please open an issue or submit a pull request.
+Contributions are welcome! Please open an issue or submit a pull request. 
+
 
 ## License
 

package/admin/src/components/ConfigTab.jsx

@@ -143,6 +143,38 @@ const ConfigTab = () => {
         }
     };
 
+    // Validate + normalize a Strapi Server URL entered by the user.
+    // Returns { ok: true, normalized } or { ok: false, error }.
+    const validateBaseUrl = (raw) => {
+        if (!raw || !raw.trim()) {
+            return { ok: false, error: 'Server URL is required' };
+        }
+        let url = raw.trim();
+        if (!/^https?:\/\//i.test(url)) {
+            return {
+                ok: false,
+                error: 'Server URL must start with http:// or https:// (e.g. http://localhost:4010)',
+            };
+        }
+        // Strip trailing slashes and common mistakes like /admin or /api
+        url = url.replace(/\/+$/, '').replace(/\/admin$/i, '').replace(/\/api$/i, '');
+        try {
+            const parsed = new URL(url);
+            if (!parsed.hostname) {
+                return { ok: false, error: 'Server URL is missing a hostname' };
+            }
+            if (parsed.pathname && parsed.pathname !== '/' && parsed.pathname !== '') {
+                return {
+                    ok: false,
+                    error: `Server URL should be the Strapi root (e.g. http://localhost:4010), not include a path like "${parsed.pathname}"`,
+                };
+            }
+        } catch {
+            return { ok: false, error: 'Server URL is not a valid URL' };
+        }
+        return { ok: true, normalized: url };
+    };
+
     // Login with credentials to remote server and get/create API token
     const handleLoginWithCredentials = async () => {
         if (!config.baseUrl || !credentials.email || !credentials.password) {
@@ -150,12 +182,22 @@ const ConfigTab = () => {
             return;
         }
 
+        const urlCheck = validateBaseUrl(config.baseUrl);
+        if (!urlCheck.ok) {
+            setLoginState({ loading: false, success: false, error: urlCheck.error });
+            return;
+        }
+        // Auto-correct the stored value if we had to normalize it (e.g. trim slash or /admin)
+        if (urlCheck.normalized !== config.baseUrl) {
+            setConfig((prev) => ({ ...prev, baseUrl: urlCheck.normalized }));
+        }
+
         setLoginState({ loading: true, success: false, error: null });
 
         try {
             // Call our backend to proxy the login request
             const response = await post(`/${PLUGIN_ID}/config/remote-login`, {
-                baseUrl: config.baseUrl,
+                baseUrl: urlCheck.normalized,
                 email: credentials.email,
                 password: credentials.password,
             });
@@ -368,10 +410,46 @@ const ConfigTab = () => {
                                                 placeholder="https://my-other-strapi.com"
                                                 value={config.baseUrl}
                                                 onChange={(e) => setConfig((p) => ({ ...p, baseUrl: e.target.value }))}
+                                                onBlur={(e) => {
+                                                    const v = validateBaseUrl(e.target.value);
+                                                    if (v.ok && v.normalized !== e.target.value) {
+                                                        setConfig((p) => ({ ...p, baseUrl: v.normalized }));
+                                                    }
+                                                }}
                                             />
-                                            <Field.Hint>URL of the remote Strapi server where this plugin is also installed</Field.Hint>
+                                            <Field.Hint>URL of the remote Strapi server where this plugin is also installed. Use the root URL only (e.g. http://localhost:4010) — do not append /admin or /api.</Field.Hint>
+                                            {config.baseUrl && (() => {
+                                                const v = validateBaseUrl(config.baseUrl);
+                                                return v.ok ? null : (
+                                                    <Box paddingTop={1}>
+                                                        <Typography variant="pi" textColor="danger600">
+                                                            {v.error}
+                                                        </Typography>
+                                                    </Box>
+                                                );
+                                            })()}
                                         </Field.Root>
 
+                                        <Box>
+                                            <Alert variant="default" title="Before you continue">
+                                                <Box>
+                                                    <Typography variant="pi">
+                                                        • <strong>Server URL</strong> must be the Strapi root (e.g. <code>http://localhost:4010</code>) — not <code>/admin</code>, <code>/api</code>, or an internal IP the server can't see.
+                                                    </Typography>
+                                                </Box>
+                                                <Box paddingTop={1}>
+                                                    <Typography variant="pi">
+                                                        • Use an <strong>existing admin user's</strong> email and password for the remote Strapi panel. This is not an API token and not a local DB user.
+                                                    </Typography>
+                                                </Box>
+                                                <Box paddingTop={1}>
+                                                    <Typography variant="pi">
+                                                        • If you see "Missing or invalid credentials", verify the URL first, then the email/password. A wrong URL often surfaces as an auth error.
+                                                    </Typography>
+                                                </Box>
+                                            </Alert>
+                                        </Box>
+
                                         <Field.Root>
                                             <Field.Label>API Token</Field.Label>
                                             <Flex gap={2}>
@@ -391,7 +469,7 @@ const ConfigTab = () => {
                                             <Button
                                                 variant="secondary"
                                                 onClick={() => setShowLoginModal(true)}
-                                                disabled={!config.baseUrl}
+                                                disabled={!config.baseUrl || !validateBaseUrl(config.baseUrl).ok}
                                             >
                                                 {config.apiToken ? 'Regenerate' : 'Generate'}
                                             </Button>

package/admin/src/components/HelpTab.jsx

@@ -840,6 +840,40 @@ http://localhost:1337</CodeBlock>
               </Typography>
             </HelpSection>
 
+            <HelpSection title="Live status, Pause, Resume, and Stop">
+              <Typography variant="omega">
+                Media sync runs can take a long time. The Media tab shows live state for any profile
+                that is currently running or paused and automatically polls status every 2 seconds
+                while work is in progress, so you can navigate away and come back without losing
+                visibility. The Status sub-tab shows the active phase (for example
+                <code> listing</code>, <code>pushing</code>, <code>pulling</code>) and live counters
+                for <code>pushed</code>, <code>pulled</code>, <code>skipped</code>, and
+                <code> errors</code>.
+              </Typography>
+              <ul style={{ paddingLeft: '20px', marginTop: '8px', lineHeight: '1.8' }}>
+                <li><Typography variant="omega"><strong>Run</strong> - starts the profile as a background job; the UI flips to Running immediately and keeps polling.</Typography></li>
+                <li><Typography variant="omega"><strong>Pause</strong> - requests a cooperative halt at the next checkpoint (between pages/batches). Already in-flight file transfers finish first.</Typography></li>
+                <li><Typography variant="omega"><strong>Resume</strong> - continues a paused run from where it stopped without redoing completed work.</Typography></li>
+                <li><Typography variant="omega"><strong>Stop</strong> - cancels the run at the next checkpoint. Work already synced is kept; remaining items are skipped.</Typography></li>
+              </ul>
+              <Typography variant="omega" paddingTop={2}>
+                Corresponding endpoints:
+              </Typography>
+              <ul style={{ paddingLeft: '20px', marginTop: '8px', lineHeight: '1.8' }}>
+                <li><code>POST /api/strapi-content-sync-pro/media-sync/profiles/:id/pause</code></li>
+                <li><code>POST /api/strapi-content-sync-pro/media-sync/profiles/:id/resume</code></li>
+                <li><code>POST /api/strapi-content-sync-pro/media-sync/profiles/:id/cancel</code></li>
+                <li><code>GET  /api/strapi-content-sync-pro/media-sync/status</code> (returns <code>running</code>, <code>paused</code>, and per-profile <code>progress</code>)</li>
+              </ul>
+              <Typography variant="pi" textColor="warning600" paddingTop={2}>
+                <strong>Note:</strong> Pause/Resume/Stop are implemented for the <strong>URL</strong>
+                strategy, which is the default and most common choice. The <strong>rsync</strong>
+                strategy runs as a single child process and cannot be paused mid-flight; for rsync
+                profiles these controls are a no-op until the current rsync invocation finishes on
+                its own.
+              </Typography>
+            </HelpSection>
+
             <HelpSection title="Dry run & testing">
               <Typography variant="omega">
                 Toggle <strong>Dry run</strong> on a profile to list what would change without transferring any

package/admin/src/components/MediaTab.jsx

@@ -19,7 +19,7 @@ import {
   Dialog,
   IconButton,
 } from '@strapi/design-system';
-import { Pencil, Trash, Play, Check } from '@strapi/icons';
+import { Pencil, Trash, Play, Check, Stop } from '@strapi/icons';
 import { useFetchClient } from '@strapi/strapi/admin';
 
 const PLUGIN_ID = 'strapi-content-sync-pro';
@@ -122,8 +122,25 @@ const MediaTab = () => {
     }
   };
 
+  const refreshStatus = async () => {
+    try {
+      const sRes = await get(`/${PLUGIN_ID}/media-sync/status`);
+      setStatus(sRes.data.data || {});
+    } catch {
+      /* silent — polling should not spam errors */
+    }
+  };
+
   useEffect(() => { reload(); }, []);
 
+  // Live status polling: while anything is running or paused, poll every 2s.
+  useEffect(() => {
+    const anyActive = (status?.profiles || []).some((p) => p.running || p.paused);
+    if (!anyActive) return undefined;
+    const id = setInterval(refreshStatus, 2000);
+    return () => clearInterval(id);
+  }, [status]);
+
   const handleSaveGlobal = async () => {
     setSaving(true); setMessage(null);
     try {
@@ -174,25 +191,67 @@ const MediaTab = () => {
   };
 
   const handleRunProfile = async (id) => {
-    setRunning(true); setMessage(null);
+    setMessage(null);
+    // Fire-and-forget: don't await — the sync may run for a long time.
+    // Poll status to reflect progress and completion.
+    post(`/${PLUGIN_ID}/media-sync/profiles/${id}/run`, {})
+      .then(() => {
+        setMessage({ type: 'success', text: 'Media sync complete.' });
+        refreshStatus();
+      })
+      .catch((err) => {
+        setMessage({ type: 'danger', text: err?.response?.data?.error?.message || err.message });
+        refreshStatus();
+      });
+    setMessage({ type: 'success', text: 'Media sync started. You can pause or stop it from the Status tab.' });
+    // Kick an immediate status refresh so the UI flips to Running right away.
+    setTimeout(refreshStatus, 500);
+  };
+
+  const handleRunAll = async () => {
+    setMessage(null);
+    post(`/${PLUGIN_ID}/media-sync/run-active`, {})
+      .then(() => {
+        setMessage({ type: 'success', text: 'All active media profiles synced.' });
+        refreshStatus();
+      })
+      .catch((err) => {
+        setMessage({ type: 'danger', text: err?.response?.data?.error?.message || err.message });
+        refreshStatus();
+      });
+    setMessage({ type: 'success', text: 'Sync All started. Watch progress in the Status tab.' });
+    setTimeout(refreshStatus, 500);
+  };
+
+  const handlePauseProfile = async (id) => {
     try {
-      await post(`/${PLUGIN_ID}/media-sync/profiles/${id}/run`, {});
-      setMessage({ type: 'success', text: 'Media sync complete.' });
-      await reload();
+      await post(`/${PLUGIN_ID}/media-sync/profiles/${id}/pause`, {});
+      setMessage({ type: 'success', text: 'Pause requested. The run will halt at the next checkpoint.' });
+      refreshStatus();
     } catch (err) {
       setMessage({ type: 'danger', text: err?.response?.data?.error?.message || err.message });
-    } finally { setRunning(false); }
+    }
   };
 
-  const handleRunAll = async () => {
-    setRunning(true); setMessage(null);
+  const handleResumeProfile = async (id) => {
     try {
-      await post(`/${PLUGIN_ID}/media-sync/run-active`, {});
-      setMessage({ type: 'success', text: 'All active media profiles synced.' });
-      await reload();
+      await post(`/${PLUGIN_ID}/media-sync/profiles/${id}/resume`, {});
+      setMessage({ type: 'success', text: 'Run resumed.' });
+      refreshStatus();
     } catch (err) {
       setMessage({ type: 'danger', text: err?.response?.data?.error?.message || err.message });
-    } finally { setRunning(false); }
+    }
+  };
+
+  const handleCancelProfile = async (id) => {
+    if (!confirm('Stop this media profile run? Progress already done is kept, remaining work is aborted.')) return;
+    try {
+      await post(`/${PLUGIN_ID}/media-sync/profiles/${id}/cancel`, {});
+      setMessage({ type: 'success', text: 'Stop requested.' });
+      refreshStatus();
+    } catch (err) {
+      setMessage({ type: 'danger', text: err?.response?.data?.error?.message || err.message });
+    }
   };
 
   const handleTest = async () => {
@@ -245,7 +304,7 @@ const MediaTab = () => {
               <Typography variant="delta">Media Sync Profiles</Typography>
               <Flex gap={2}>
                 <Button variant="secondary" onClick={handleTest} loading={testing} disabled={testing}>Test connection</Button>
-                <Button variant="secondary" onClick={handleRunAll} loading={running} disabled={running}>Sync All Active</Button>
+                <Button variant="secondary" onClick={handleRunAll} disabled={!!status?.running}>Sync All Active</Button>
                 <Button onClick={() => { setEditProfile({ ...EMPTY_PROFILE, includeMime: defaults?.mimeAll || [] }); setEditMode('create'); }}>
                   Create Profile
                 </Button>
@@ -289,9 +348,30 @@ const MediaTab = () => {
                       {!p.active && (
                         <Button variant="tertiary" size="S" onClick={() => handleActivate(p.id)} startIcon={<Check />}>Activate</Button>
                       )}
-                      {p.active && (
-                        <Button variant="secondary" size="S" onClick={() => handleRunProfile(p.id)} loading={running} disabled={running} startIcon={<Play />}>Run</Button>
-                      )}
+                      {p.active && (() => {
+                        const sp = (status?.profiles || []).find((x) => x.id === p.id);
+                        const isRunning = !!sp?.running;
+                        const isPaused = !!sp?.paused;
+                        if (isRunning && !isPaused) {
+                          return (
+                            <>
+                              <Button variant="tertiary" size="S" onClick={() => handlePauseProfile(p.id)}>Pause</Button>
+                              <IconButton label="Stop" onClick={() => handleCancelProfile(p.id)}><Stop /></IconButton>
+                            </>
+                          );
+                        }
+                        if (isPaused) {
+                          return (
+                            <>
+                              <Button variant="secondary" size="S" onClick={() => handleResumeProfile(p.id)} startIcon={<Play />}>Resume</Button>
+                              <IconButton label="Stop" onClick={() => handleCancelProfile(p.id)}><Stop /></IconButton>
+                            </>
+                          );
+                        }
+                        return (
+                          <Button variant="secondary" size="S" onClick={() => handleRunProfile(p.id)} startIcon={<Play />}>Run</Button>
+                        );
+                      })()}
                       <IconButton label="Edit" onClick={() => { setEditProfile({ ...p }); setEditMode('edit'); }}><Pencil /></IconButton>
                       <IconButton label="Delete" onClick={() => handleDelete(p.id)}><Trash /></IconButton>
                     </Flex>
@@ -382,21 +462,52 @@ const MediaTab = () => {
         {/* ── Status Tab ──────────────────────────────────────────────── */}
         <Tabs.Content value="status">
           <Box paddingTop={4}>
-            <Typography variant="delta" paddingBottom={3}>Media Sync Status</Typography>
-            {status?.profiles?.map((sp) => (
-              <Box key={sp.id} background="neutral0" padding={3} hasRadius shadow="tableShadow" marginBottom={2}>
-                <Flex justifyContent="space-between" alignItems="center">
-                  <Flex gap={2} alignItems="center">
-                    <Typography variant="omega" fontWeight="bold">{sp.name}</Typography>
-                    {sp.active && <Badge active>Active</Badge>}
-                    <Badge>{sp.running ? 'Running' : 'Idle'}</Badge>
+            <Flex justifyContent="space-between" alignItems="center" paddingBottom={3}>
+              <Typography variant="delta">Media Sync Status</Typography>
+              <Button variant="tertiary" size="S" onClick={refreshStatus}>Refresh</Button>
+            </Flex>
+            {status?.profiles?.map((sp) => {
+              const prog = sp.progress || null;
+              const stateLabel = sp.paused ? 'Paused' : sp.running ? 'Running' : 'Idle';
+              return (
+                <Box key={sp.id} background="neutral0" padding={3} hasRadius shadow="tableShadow" marginBottom={2}>
+                  <Flex justifyContent="space-between" alignItems="center">
+                    <Flex gap={2} alignItems="center">
+                      <Typography variant="omega" fontWeight="bold">{sp.name}</Typography>
+                      {sp.active && <Badge active>Active</Badge>}
+                      <Badge>{stateLabel}</Badge>
+                      {prog?.phase && (sp.running || sp.paused) && (
+                        <Typography variant="pi" textColor="neutral600">phase: {prog.phase}</Typography>
+                      )}
+                    </Flex>
+                    <Flex gap={1} alignItems="center">
+                      {sp.running && !sp.paused && (
+                        <>
+                          <Button variant="tertiary" size="S" onClick={() => handlePauseProfile(sp.id)}>Pause</Button>
+                          <Button variant="danger-light" size="S" startIcon={<Stop />} onClick={() => handleCancelProfile(sp.id)}>Stop</Button>
+                        </>
+                      )}
+                      {sp.paused && (
+                        <>
+                          <Button variant="secondary" size="S" startIcon={<Play />} onClick={() => handleResumeProfile(sp.id)}>Resume</Button>
+                          <Button variant="danger-light" size="S" startIcon={<Stop />} onClick={() => handleCancelProfile(sp.id)}>Stop</Button>
+                        </>
+                      )}
+                      <Typography variant="pi" textColor="neutral600" paddingLeft={2}>
+                        Mode: {(sp.executionMode || '').replace('_', ' ')} | Last: {sp.lastExecutedAt ? new Date(sp.lastExecutedAt).toLocaleString() : 'never'}
+                      </Typography>
+                    </Flex>
                   </Flex>
-                  <Typography variant="pi" textColor="neutral600">
-                    Mode: {(sp.executionMode || '').replace('_', ' ')} | Last: {sp.lastExecutedAt ? new Date(sp.lastExecutedAt).toLocaleString() : 'never'}
-                  </Typography>
-                </Flex>
-              </Box>
-            ))}
+                  {(sp.running || sp.paused) && prog && (
+                    <Box paddingTop={2}>
+                      <Typography variant="pi" textColor="neutral700">
+                        pushed: {prog.pushed || 0} · pulled: {prog.pulled || 0} · skipped: {prog.skipped || 0} · errors: {prog.errors || 0}
+                      </Typography>
+                    </Box>
+                  )}
+                </Box>
+              );
+            })}
             {status?.lastResult && (
               <Box paddingTop={3} background="neutral0" padding={4} hasRadius shadow="tableShadow">
                 <Typography variant="sigma">Last Run Result</Typography>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "strapi-content-sync-pro",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Strapi v5 plugin to copy, migrate, and live-sync content, media, and data between multiple Strapi environments with bi-directional sync, field-level policies, scheduling, and alerts.",
   "license": "MIT",
   "author": {