v2.12.0

changelog.md

@@ -1,5 +1,32 @@
 # Changelog
 
+## 2026-03-02 - 2.12.0 - feat(pipelines)
+add pipelines view modes, time-range filtering, group aggregation, sorting, and job log polling
+
+- Add view modes for pipelines: 'current', 'project', 'group', and 'error'; support timeRange and sortBy parameters on getPipelines requests and in the UI.
+- Implement aggregated pipeline fetching across projects with batching, deduplication, and active-run prioritization (fetchCurrentPipelines, fetchAggregatedPipelines, fetchGroupPipelines, fetchErrorPipelines).
+- Add filtering by time ranges (1h, 6h, 1d, 3d, 7d, 30d) and sorting options (created, duration, status) with status priority ordering.
+- Extend BaseProvider API: add IPipelineListOptions (status, ref, source), add getGroupProjects, and update Gitea/GitLab providers to honor new options and include projectName mapping.
+- Enhance web UI: new controls/state for viewMode, timeRange, sortBy, group selection, plus job log polling with auto-scroll and cleanup on disconnect.
+- Bump dependencies: @apiclient.xyz/gitea 1.3.0 -> 1.4.0 and @apiclient.xyz/gitlab 2.4.0 -> 2.5.0.
+
+## 2026-03-02 - 2.11.1 - fix(meta)
+update repository metadata (non-functional change)
+
+- Change was metadata-only (+1 -1) with no source code changes
+- Current package.json version: 2.11.0 — recommend patch bump to 2.11.1
+
+## 2026-03-02 - 2.11.0 - feat(sync)
+add branch & tag listing support and improve sync mirroring and sync log routing
+
+- Bump @apiclient.xyz/gitea to 1.3.0 and @apiclient.xyz/gitlab to 2.4.0
+- Add IBranch and ITag interfaces and export them from ts_interfaces
+- Add getBranches/getTags to BaseProvider and implement paginated branch/tag listing for Gitea and GitLab providers
+- SyncManager now creates a temporary mirrors directory (RAM-backed), auto-cleans it on shutdown, and no longer requires a configured syncMirrorsPath (removed from paths and gitopsapp)
+- Add refsMatch in SyncManager to accurately compare local branches/tags with target refs (uses for-each-ref and ls-remote) to avoid unnecessary pushes
+- Introduce avatarUploadCache and other internal sync manager improvements
+- Change log channel/tagging: sync log messages use 'sync' (was 'git') and TypedSocket broadcasts use a new 'syncLogClient' tag; web client now sets that tag when creating the socket
+
 ## 2026-02-28 - 2.10.0 - feat(managed-secrets)
 add centrally managed secrets with GITOPS_ prefix pushed to multiple targets
 

deno.json

@@ -1,6 +1,6 @@
 {
   "name": "@serve.zone/gitops",
-  "version": "2.8.0",
+  "version": "2.12.0",
   "exports": "./mod.ts",
   "nodeModulesDir": "auto",
   "tasks": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@serve.zone/gitops",
-  "version": "2.10.0",
+  "version": "2.12.0",
   "description": "GitOps management app for Gitea and GitLab - manage secrets, browse projects, view CI pipelines, and stream build logs",
   "main": "mod.ts",
   "type": "module",
@@ -16,8 +16,8 @@
     "@api.global/typedrequest-interfaces": "^3.0.19",
     "@api.global/typedserver": "8.4.0",
     "@api.global/typedsocket": "^4.1.0",
-    "@apiclient.xyz/gitea": "1.2.0",
+    "@apiclient.xyz/gitea": "1.4.0",
-    "@apiclient.xyz/gitlab": "2.3.0",
+    "@apiclient.xyz/gitlab": "2.5.0",
     "@design.estate/dees-catalog": "^3.43.3",
     "@design.estate/dees-element": "^2.1.6"
   },

ts/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/gitops',
-  version: '2.8.0',
+  version: '2.12.0',
   description: 'GitOps management app for Gitea and GitLab - manage secrets, browse projects, view CI pipelines, and stream build logs'
 }

ts/classes/gitopsapp.ts

@@ -70,7 +70,6 @@ export class GitopsApp {
       this.storageManager,
       this.connectionManager,
       this.actionLog,
-      this.paths.syncMirrorsPath,
     );
     await this.syncManager.init();
 

ts/classes/syncmanager.ts

@@ -4,6 +4,7 @@ import type * as interfaces from '../../ts_interfaces/index.ts';
 import type { ConnectionManager } from './connectionmanager.ts';
 import type { ActionLog } from './actionlog.ts';
 import type { StorageManager } from '../storage/index.ts';
+import type { BaseProvider } from '../providers/classes.baseprovider.ts';
 
 const SYNC_PREFIX = '/sync/';
 const SYNC_STATUS_PREFIX = '/sync-status/';
@@ -19,15 +20,19 @@ export class SyncManager {
   private runningSync: Set<string> = new Set();
   private syncedGroupMeta: Set<string> = new Set();
   private currentSyncConfig: interfaces.data.ISyncConfig | null = null;
+  private avatarUploadCache: Map<string, string> = new Map();
+
+  private mirrorsPath = '';
 
   constructor(
     private storageManager: StorageManager,
     private connectionManager: ConnectionManager,
     private actionLog: ActionLog,
-    private mirrorsPath: string,
   ) {}
 
   async init(): Promise<void> {
+    // Create temp directory for mirrors (RAM-backed on most Linux systems via tmpfs)
+    this.mirrorsPath = await Deno.makeTempDir({ prefix: 'gitops-mirrors-' });
     await this.loadConfigs();
     for (const config of this.configs) {
       if (config.status === 'active') {
@@ -44,6 +49,12 @@ export class SyncManager {
       clearInterval(timer);
     }
     this.timers.clear();
+    // Clean up temp mirrors directory
+    if (this.mirrorsPath) {
+      try {
+        await Deno.remove(this.mirrorsPath, { recursive: true });
+      } catch { /* may already be gone */ }
+    }
   }
 
   // ============================================================================
@@ -290,7 +301,7 @@ export class SyncManager {
         const batch = projects.slice(i, i + CONCURRENCY);
         await Promise.all(batch.map(async (project) => {
           try {
-            logger.syncLog('info', `Syncing ${project.fullPath}...`, 'git');
+            logger.syncLog('info', `Syncing ${project.fullPath}...`, 'sync');
             await this.syncRepo(config, project, sourceConn, targetConn);
             synced++;
             await this.updateRepoStatus(config.id, project.fullPath, {
@@ -298,7 +309,7 @@ export class SyncManager {
               lastSyncAt: Date.now(),
               lastSyncError: undefined,
             });
-            logger.syncLog('success', `Synced ${project.fullPath}`, 'git');
+            logger.syncLog('success', `Synced ${project.fullPath}`, 'sync');
           } catch (err) {
             const errMsg = err instanceof Error ? err.message : String(err);
             await this.updateRepoStatus(config.id, project.fullPath, {
@@ -306,7 +317,7 @@ export class SyncManager {
               lastSyncError: errMsg,
               lastSyncAt: Date.now(),
             });
-            logger.syncLog('error', `Sync failed for ${project.fullPath}: ${errMsg}`, 'git');
+            logger.syncLog('error', `Sync failed for ${project.fullPath}: ${errMsg}`, 'sync');
           }
         }));
       }
@@ -372,21 +383,38 @@ export class SyncManager {
     // Ensure target group/project hierarchy exists
     await this.ensureTargetExists(targetConn, targetFullPath, project, sourceConn, sourceConn.groupFilter, config.targetGroupOffset);
 
+    // API-based ref comparison (fast path — avoids git clone when refs already match)
+    const sourceProvider = this.connectionManager.getProvider(sourceConn.id);
+    const targetProvider = this.connectionManager.getProvider(targetConn.id);
+    const apiRefsMatch = await this.refsMatchViaApi(
+      sourceProvider, targetProvider, project.fullPath, targetFullPath,
+    );
+    if (apiRefsMatch === true) {
+      logger.syncLog('info', `Refs match via API for ${project.fullPath}, skipping git`, 'api');
+      await this.syncProjectMetadata(config, sourceConn, targetConn, project.fullPath, targetFullPath);
+      return;
+    }
+
     // Clone or fetch from source
     try {
       const exists = await this.dirExists(mirrorDir);
       if (!exists) {
         await Deno.mkdir(mirrorDir, { recursive: true });
         await this.runGit(['clone', '--bare', sourceUrl, '.'], mirrorDir);
-      } else {
-        // Update source remote URL in case it changed
-        try {
-          await this.runGit(['remote', 'set-url', 'origin', sourceUrl], mirrorDir);
-        } catch {
-          // Ignore errors
-        }
-        await this.runGit(['fetch', '--prune', 'origin'], mirrorDir);
       }
+      // Ensure fetch refspec is configured (bare clones don't set one by default,
+      // which prevents tracking branch renames like master -> main)
+      await this.runGit(
+        ['config', 'remote.origin.fetch', '+refs/heads/*:refs/heads/*'], mirrorDir,
+      );
+      // Update source remote URL in case connection changed
+      try {
+        await this.runGit(['remote', 'set-url', 'origin', sourceUrl], mirrorDir);
+      } catch {
+        // Ignore errors
+      }
+      // Fetch latest refs from source (--prune removes branches deleted on remote)
+      await this.runGit(['fetch', '--prune', 'origin'], mirrorDir);
     } catch (err: any) {
       const msg = err instanceof Error ? err.message : String(err);
       if (msg.includes("couldn't find remote ref HEAD")) {
@@ -421,26 +449,33 @@ export class SyncManager {
       });
     }
 
-    // Phase 1: push all refs without pruning (ensures target has all source branches)
+    // Compare refs to determine if push is needed
-    await this.runGit([
+    const refsAlreadyMatch = !isUnrelated && await this.refsMatch(mirrorDir);
-      'push', 'target',
-      '+refs/heads/*:refs/heads/*',
-      '+refs/tags/*:refs/tags/*',
-    ], mirrorDir);
 
-    // Phase 2: sync default_branch now that all branches exist on target
+    if (refsAlreadyMatch) {
-    await this.syncDefaultBranchBeforePush(sourceConn, targetConn, project.fullPath, targetFullPath);
+      logger.syncLog('info', `Refs already match for ${project.fullPath}, skipping push`, 'api');
+    } else {
+      // Phase 1: push all refs without pruning (ensures target has all source branches)
+      await this.runGit([
+        'push', 'target',
+        '+refs/heads/*:refs/heads/*',
+        '+refs/tags/*:refs/tags/*',
+      ], mirrorDir);
 
-    // Phase 2b: unprotect stale branches on target so --prune can delete them
+      // Phase 2: sync default_branch now that all branches exist on target
-    await this.unprotectStaleBranches(targetConn, targetFullPath, mirrorDir);
+      await this.syncDefaultBranchBeforePush(sourceConn, targetConn, project.fullPath, targetFullPath);
 
-    // Phase 3: push with --prune to remove stale branches (safe now that default_branch is correct)
+      // Phase 2b: unprotect stale branches on target so --prune can delete them
-    await this.runGit([
+      await this.unprotectStaleBranches(targetConn, targetFullPath, mirrorDir);
-      'push', 'target',
+
-      '+refs/heads/*:refs/heads/*',
+      // Phase 3: push with --prune to remove stale branches (safe now that default_branch is correct)
-      '+refs/tags/*:refs/tags/*',
+      await this.runGit([
-      '--prune',
+        'push', 'target',
-    ], mirrorDir);
+        '+refs/heads/*:refs/heads/*',
+        '+refs/tags/*:refs/tags/*',
+        '--prune',
+      ], mirrorDir);
+    }
 
     // Sync project metadata (description, visibility, topics, default_branch, avatar)
     await this.syncProjectMetadata(config, sourceConn, targetConn, project.fullPath, targetFullPath);
@@ -1007,10 +1042,14 @@ export class SyncManager {
     if (data[0] === 0x89 && data[1] === 0x50) return 'image/png';
     if (data[0] === 0xFF && data[1] === 0xD8) return 'image/jpeg';
     if (data[0] === 0x47 && data[1] === 0x49) return 'image/gif';
+    // SVG: text-based XML, no magic bytes — check content
+    const textStart = new TextDecoder().decode(data.slice(0, 200));
+    if (textStart.includes('<svg') || textStart.includes('<?xml')) return 'image/svg+xml';
     // Fallback: check URL extension
     if (url.includes('.png')) return 'image/png';
     if (url.includes('.jpg') || url.includes('.jpeg')) return 'image/jpeg';
     if (url.includes('.gif')) return 'image/gif';
+    if (url.includes('.svg')) return 'image/svg+xml';
     return 'image/png'; // default
   }
 
@@ -1146,7 +1185,6 @@ export class SyncManager {
             if (sourceGroup) {
               const groupMeta = this.extractGroupMeta(sourceConn, sourceGroup);
               if (groupMeta.avatarUrl) {
-                logger.syncLog('info', `Applying group avatar to ${targetFullPath}`, 'api');
                 await this.syncProjectAvatar(sourceConn, targetConn, sourceFullPath, targetFullPath, groupMeta.avatarUrl, targetProject);
                 groupAvatarApplied = true;
               }
@@ -1293,24 +1331,41 @@ export class SyncManager {
     meta: { description: string; visibility: string; topics: string[]; defaultBranch: string },
   ): Promise<void> {
     if (conn.providerType === 'gitlab') {
+      // Update description, visibility, topics (always safe)
       await this.rawApiCall(conn, 'PUT', `/api/v4/projects/${rawProject.id}`, {
         description: meta.description,
         visibility: this.normalizeVisibility(meta.visibility),
         topics: meta.topics,
-        default_branch: meta.defaultBranch,
       });
+      // Update default_branch separately — may fail if the branch doesn't exist in git
+      try {
+        await this.rawApiCall(conn, 'PUT', `/api/v4/projects/${rawProject.id}`, {
+          default_branch: meta.defaultBranch,
+        });
+      } catch (err) {
+        const errMsg = err instanceof Error ? err.message : String(err);
+        logger.syncLog('warn', `Could not set default_branch to "${meta.defaultBranch}" for ${fullPath}: ${errMsg}`, 'api');
+      }
     } else {
       const segments = fullPath.split('/');
       const repo = segments.pop()!;
       const owner = segments[0] || '';
       const encodedOwner = encodeURIComponent(owner);
       const encodedRepo = encodeURIComponent(repo);
-      // Update description, visibility, default_branch
+      // Update description, visibility
       await this.rawApiCall(conn, 'PATCH', `/api/v1/repos/${encodedOwner}/${encodedRepo}`, {
         description: meta.description,
         private: this.normalizeVisibility(meta.visibility) === 'private',
-        default_branch: meta.defaultBranch,
       });
+      // Update default_branch separately — may fail if the branch doesn't exist in git
+      try {
+        await this.rawApiCall(conn, 'PATCH', `/api/v1/repos/${encodedOwner}/${encodedRepo}`, {
+          default_branch: meta.defaultBranch,
+        });
+      } catch (err) {
+        const errMsg = err instanceof Error ? err.message : String(err);
+        logger.syncLog('warn', `Could not set default_branch to "${meta.defaultBranch}" for ${fullPath}: ${errMsg}`, 'api');
+      }
       // Topics are a separate endpoint in Gitea
       await this.rawApiCall(conn, 'PUT', `/api/v1/repos/${encodedOwner}/${encodedRepo}/topics`, {
         topics: meta.topics,
@@ -1355,25 +1410,55 @@ export class SyncManager {
   private async syncProjectAvatar(
     sourceConn: interfaces.data.IProviderConnection,
     targetConn: interfaces.data.IProviderConnection,
-    sourceFullPath: string,
+    _sourceFullPath: string,
     targetFullPath: string,
     sourceAvatarUrl: string,
     targetRawProject: any,
   ): Promise<void> {
     // Resolve relative avatar URLs
-    const resolvedUrl = sourceAvatarUrl.startsWith('http')
+    const resolvedSourceUrl = sourceAvatarUrl.startsWith('http')
       ? sourceAvatarUrl
       : `${sourceConn.baseUrl.replace(/\/+$/, '')}${sourceAvatarUrl}`;
 
-    const avatarData = await this.rawBinaryFetch(sourceConn, resolvedUrl);
+    const sourceAvatarData = await this.rawBinaryFetch(sourceConn, resolvedSourceUrl);
-    if (!avatarData || avatarData.length === 0) return;
+    if (!sourceAvatarData || sourceAvatarData.length === 0) return;
+
+    // Skip SVG avatars — not supported by GitLab project endpoints
+    const mimeType = this.guessAvatarMimeType(sourceAvatarData, resolvedSourceUrl);
+    if (mimeType === 'image/svg+xml') {
+      logger.syncLog('warn', `Skipping SVG avatar for ${targetFullPath} (not supported by target)`, 'api');
+      return;
+    }
+
+    // Check in-memory cache: skip if source hasn't changed since last upload
+    const sourceHash = await this.hashBytes(sourceAvatarData);
+    const cacheKey = `project:${targetFullPath}`;
+    if (this.avatarUploadCache.get(cacheKey) === sourceHash) {
+      return; // Source avatar unchanged since last upload
+    }
+
+    // Compare with target's current avatar to avoid unnecessary uploads
+    const targetMeta = this.extractProjectMeta(targetConn, targetRawProject);
+    if (targetMeta.avatarUrl) {
+      try {
+        const resolvedTargetUrl = targetMeta.avatarUrl.startsWith('http')
+          ? targetMeta.avatarUrl
+          : `${targetConn.baseUrl.replace(/\/+$/, '')}${targetMeta.avatarUrl}`;
+        const targetAvatarData = await this.rawBinaryFetch(targetConn, resolvedTargetUrl);
+        if (targetAvatarData && this.binaryEqual(sourceAvatarData, targetAvatarData)) {
+          this.avatarUploadCache.set(cacheKey, sourceHash);
+          return; // Avatars are identical — skip upload
+        }
+      } catch {
+        // Failed to fetch target avatar — proceed with upload as safe fallback
+      }
+    }
 
     logger.syncLog('info', `Syncing avatar for ${targetFullPath}...`, 'api');
 
     if (targetConn.providerType === 'gitlab') {
       // GitLab: multipart upload
-      const mimeType = this.guessAvatarMimeType(avatarData, resolvedUrl);
+      const blob = new Blob([sourceAvatarData.buffer as ArrayBuffer], { type: mimeType });
-      const blob = new Blob([avatarData.buffer as ArrayBuffer], { type: mimeType });
       const ext = mimeType.split('/')[1] || 'png';
       const formData = new FormData();
       formData.append('avatar', blob, `avatar.${ext}`);
@@ -1387,13 +1472,15 @@ export class SyncManager {
       const segments = targetFullPath.split('/');
       const repo = segments.pop()!;
       const owner = segments[0] || '';
-      const base64Image = this.uint8ArrayToBase64(avatarData);
+      const base64Image = this.uint8ArrayToBase64(sourceAvatarData);
       await this.rawApiCall(
         targetConn, 'POST',
         `/api/v1/repos/${encodeURIComponent(owner)}/${encodeURIComponent(repo)}/avatar`,
         { image: base64Image },
       );
     }
+
+    this.avatarUploadCache.set(cacheKey, sourceHash);
   }
 
   private async removeProjectAvatar(
@@ -1423,18 +1510,48 @@ export class SyncManager {
     sourceAvatarUrl: string,
     targetRawGroup: any,
   ): Promise<void> {
-    const resolvedUrl = sourceAvatarUrl.startsWith('http')
+    const resolvedSourceUrl = sourceAvatarUrl.startsWith('http')
       ? sourceAvatarUrl
       : `${sourceConn.baseUrl.replace(/\/+$/, '')}${sourceAvatarUrl}`;
 
-    const avatarData = await this.rawBinaryFetch(sourceConn, resolvedUrl);
+    const sourceAvatarData = await this.rawBinaryFetch(sourceConn, resolvedSourceUrl);
-    if (!avatarData || avatarData.length === 0) return;
+    if (!sourceAvatarData || sourceAvatarData.length === 0) return;
+
+    // Skip SVG avatars — not supported by GitLab project endpoints
+    const mimeType = this.guessAvatarMimeType(sourceAvatarData, resolvedSourceUrl);
+    if (mimeType === 'image/svg+xml') {
+      logger.syncLog('warn', `Skipping SVG avatar for group ${targetGroupPath} (not supported by target)`, 'api');
+      return;
+    }
+
+    // Check in-memory cache: skip if source hasn't changed since last upload
+    const sourceHash = await this.hashBytes(sourceAvatarData);
+    const cacheKey = `group:${targetGroupPath}`;
+    if (this.avatarUploadCache.get(cacheKey) === sourceHash) {
+      return; // Source avatar unchanged since last upload
+    }
+
+    // Compare with target's current avatar to avoid unnecessary uploads
+    const targetMeta = this.extractGroupMeta(targetConn, targetRawGroup);
+    if (targetMeta.avatarUrl) {
+      try {
+        const resolvedTargetUrl = targetMeta.avatarUrl.startsWith('http')
+          ? targetMeta.avatarUrl
+          : `${targetConn.baseUrl.replace(/\/+$/, '')}${targetMeta.avatarUrl}`;
+        const targetAvatarData = await this.rawBinaryFetch(targetConn, resolvedTargetUrl);
+        if (targetAvatarData && this.binaryEqual(sourceAvatarData, targetAvatarData)) {
+          this.avatarUploadCache.set(cacheKey, sourceHash);
+          return; // Avatars are identical — skip upload
+        }
+      } catch {
+        // Failed to fetch target avatar — proceed with upload as safe fallback
+      }
+    }
 
     logger.syncLog('info', `Syncing avatar for group ${targetGroupPath}...`, 'api');
 
     if (targetConn.providerType === 'gitlab') {
-      const mimeType = this.guessAvatarMimeType(avatarData, resolvedUrl);
+      const blob = new Blob([sourceAvatarData.buffer as ArrayBuffer], { type: mimeType });
-      const blob = new Blob([avatarData.buffer as ArrayBuffer], { type: mimeType });
       const ext = mimeType.split('/')[1] || 'png';
       const formData = new FormData();
       formData.append('avatar', blob, `avatar.${ext}`);
@@ -1445,13 +1562,15 @@ export class SyncManager {
       );
     } else {
       const orgName = targetGroupPath.split('/')[0] || targetGroupPath;
-      const base64Image = this.uint8ArrayToBase64(avatarData);
+      const base64Image = this.uint8ArrayToBase64(sourceAvatarData);
       await this.rawApiCall(
         targetConn, 'POST',
         `/api/v1/orgs/${encodeURIComponent(orgName)}/avatar`,
         { image: base64Image },
       );
     }
+
+    this.avatarUploadCache.set(cacheKey, sourceHash);
   }
 
   private async removeGroupAvatar(
@@ -1471,6 +1590,19 @@ export class SyncManager {
     }
   }
 
+  private binaryEqual(a: Uint8Array, b: Uint8Array): boolean {
+    if (a.length !== b.length) return false;
+    for (let i = 0; i < a.length; i++) {
+      if (a[i] !== b[i]) return false;
+    }
+    return true;
+  }
+
+  private async hashBytes(data: Uint8Array): Promise<string> {
+    const hashBuffer = await crypto.subtle.digest('SHA-256', data.buffer as ArrayBuffer);
+    return Array.from(new Uint8Array(hashBuffer)).map(b => b.toString(16).padStart(2, '0')).join('');
+  }
+
   private uint8ArrayToBase64(bytes: Uint8Array): string {
     let binary = '';
     for (let i = 0; i < bytes.length; i++) {
@@ -1690,6 +1822,133 @@ export class SyncManager {
     }
   }
 
+  /**
+   * Fetch all branch and tag SHAs from a repo via provider API.
+   * Returns null on any error (safe fallback to git-based comparison).
+   */
+  private async listRefsViaProvider(
+    provider: BaseProvider,
+    fullPath: string,
+  ): Promise<{ branches: Map<string, string>; tags: Map<string, string> } | null> {
+    try {
+      const [branches, tags] = await Promise.all([
+        provider.getBranches(fullPath),
+        provider.getTags(fullPath),
+      ]);
+      return {
+        branches: new Map(branches.map((b) => [b.name, b.commitSha])),
+        tags: new Map(tags.map((t) => [t.name, t.commitSha])),
+      };
+    } catch {
+      return null;
+    }
+  }
+
+  /**
+   * Compare refs between source and target via provider API (no git clone needed).
+   * Returns true (match), false (differ), or null (can't determine — fall through to git).
+   */
+  private async refsMatchViaApi(
+    sourceProvider: BaseProvider,
+    targetProvider: BaseProvider,
+    sourceFullPath: string,
+    targetFullPath: string,
+  ): Promise<boolean | null> {
+    const [sourceRefs, targetRefs] = await Promise.all([
+      this.listRefsViaProvider(sourceProvider, sourceFullPath),
+      this.listRefsViaProvider(targetProvider, targetFullPath),
+    ]);
+    if (!sourceRefs || !targetRefs) return null;
+
+    // Compare branches
+    if (sourceRefs.branches.size !== targetRefs.branches.size) return false;
+    for (const [name, sha] of sourceRefs.branches) {
+      if (targetRefs.branches.get(name) !== sha) return false;
+    }
+
+    // Compare tags
+    if (sourceRefs.tags.size !== targetRefs.tags.size) return false;
+    for (const [name, sha] of sourceRefs.tags) {
+      if (targetRefs.tags.get(name) !== sha) return false;
+    }
+
+    return true;
+  }
+
+  /**
+   * Compare local refs (source) with target remote refs.
+   * Returns true when all branches and tags are identical — no push needed.
+   */
+  private async refsMatch(mirrorDir: string): Promise<boolean> {
+    try {
+      // Local branches (source)
+      const localHeadsRaw = await this.runGit(
+        ['for-each-ref', '--format=%(refname:strip=2) %(objectname)', 'refs/heads/'], mirrorDir,
+      );
+      // Target branches (fetched by checkUnrelatedHistory)
+      const targetHeadsRaw = await this.runGit(
+        ['for-each-ref', '--format=%(refname:strip=3) %(objectname)', 'refs/remotes/target/'], mirrorDir,
+      );
+
+      // Local tags
+      const localTagsRaw = await this.runGit(
+        ['for-each-ref', '--format=%(refname:strip=2) %(objectname)', 'refs/tags/'], mirrorDir,
+      );
+      // Target tags via ls-remote (avoids shared refs/tags/ namespace ambiguity in bare repos)
+      const targetTagsRaw = await this.runGit(['ls-remote', '--tags', 'target'], mirrorDir);
+
+      const parseRefLines = (raw: string): Map<string, string> => {
+        const map = new Map<string, string>();
+        for (const line of raw.trim().split('\n')) {
+          if (!line.trim()) continue;
+          const parts = line.trim().split(/\s+/);
+          if (parts.length >= 2) {
+            map.set(parts[0], parts[1]);
+          }
+        }
+        return map;
+      };
+
+      const parseLsRemoteTags = (raw: string): Map<string, string> => {
+        const map = new Map<string, string>();
+        for (const line of raw.trim().split('\n')) {
+          if (!line.trim()) continue;
+          // Skip ^{} dereference lines
+          if (line.includes('^{}')) continue;
+          const parts = line.trim().split(/\s+/);
+          if (parts.length >= 2) {
+            // parts[0] = sha, parts[1] = refs/tags/name
+            const tagName = parts[1].replace('refs/tags/', '');
+            map.set(tagName, parts[0]);
+          }
+        }
+        return map;
+      };
+
+      const localHeads = parseRefLines(localHeadsRaw);
+      const targetHeads = parseRefLines(targetHeadsRaw);
+      const localTags = parseRefLines(localTagsRaw);
+      const targetTags = parseLsRemoteTags(targetTagsRaw);
+
+      // Compare branches
+      if (localHeads.size !== targetHeads.size) return false;
+      for (const [name, sha] of localHeads) {
+        if (targetHeads.get(name) !== sha) return false;
+      }
+
+      // Compare tags
+      if (localTags.size !== targetTags.size) return false;
+      for (const [name, sha] of localTags) {
+        if (targetTags.get(name) !== sha) return false;
+      }
+
+      return true;
+    } catch {
+      // On any error, fall back to pushing (safe default)
+      return false;
+    }
+  }
+
   private async runGit(args: string[], cwd?: string): Promise<string> {
     const cmd = new Deno.Command('git', {
       args,

ts/opsserver/handlers/pipelines.handler.ts

@@ -2,6 +2,27 @@ import * as plugins from '../../plugins.ts';
 import type { OpsServer } from '../classes.opsserver.ts';
 import * as interfaces from '../../../ts_interfaces/index.ts';
 import { requireValidIdentity } from '../helpers/guards.ts';
+import type { BaseProvider } from '../../providers/classes.baseprovider.ts';
+
+const TIME_RANGE_MS: Record<string, number> = {
+  '1h': 60 * 60 * 1000,
+  '6h': 6 * 60 * 60 * 1000,
+  '1d': 24 * 60 * 60 * 1000,
+  '3d': 3 * 24 * 60 * 60 * 1000,
+  '7d': 7 * 24 * 60 * 60 * 1000,
+  '30d': 30 * 24 * 60 * 60 * 1000,
+};
+
+const STATUS_PRIORITY: Record<string, number> = {
+  running: 0,
+  pending: 1,
+  waiting: 2,
+  manual: 3,
+  failed: 4,
+  canceled: 5,
+  success: 6,
+  skipped: 7,
+};
 
 export class PipelinesHandler {
   public typedrouter = new plugins.typedrequest.TypedRouter();
@@ -16,7 +37,7 @@ export class PipelinesHandler {
   }
 
   private registerHandlers(): void {
-    // Get pipelines
+    // Get pipelines — supports view modes
     this.typedrouter.addTypedHandler(
       new plugins.typedrequest.TypedHandler<interfaces.requests.IReq_GetPipelines>(
         'getPipelines',
@@ -25,10 +46,32 @@ export class PipelinesHandler {
           const provider = this.opsServerRef.gitopsAppRef.connectionManager.getProvider(
             dataArg.connectionId,
           );
-          const pipelines = await provider.getPipelines(dataArg.projectId, {
+
-            page: dataArg.page,
+          const viewMode = dataArg.viewMode || 'project';
-          });
+          const timeRange = dataArg.timeRange || '1d';
-          return { pipelines };
+          const sortBy = dataArg.sortBy || 'created';
+
+          let pipelines: interfaces.data.IPipeline[];
+
+          if (viewMode === 'project') {
+            if (!dataArg.projectId) return { pipelines: [] };
+            pipelines = await provider.getPipelines(dataArg.projectId, {
+              page: dataArg.page,
+              status: dataArg.status,
+            });
+            pipelines = this.filterByTimeRange(pipelines, timeRange);
+          } else if (viewMode === 'current') {
+            pipelines = await this.fetchCurrentPipelines(provider, timeRange);
+          } else if (viewMode === 'group') {
+            if (!dataArg.groupId) return { pipelines: [] };
+            pipelines = await this.fetchGroupPipelines(provider, dataArg.groupId, timeRange);
+          } else if (viewMode === 'error') {
+            pipelines = await this.fetchErrorPipelines(provider, timeRange);
+          } else {
+            pipelines = [];
+          }
+
+          return { pipelines: this.sortPipelines(pipelines, sortBy).slice(0, 200) };
         },
       ),
     );
@@ -94,4 +137,161 @@ export class PipelinesHandler {
       ),
     );
   }
+
+  // ---------------------------------------------------------------------------
+  // View mode helpers
+  // ---------------------------------------------------------------------------
+
+  /**
+   * Current mode: running/pending always shown, plus recent pipelines within timeRange.
+   * Makes two parallel aggregation passes to ensure active pipelines are never missed:
+   *   1. Recent pipelines (no status filter) — for time-range display
+   *   2. Active pipelines (status: 'running') — guarantees we catch all running ones
+   */
+  private async fetchCurrentPipelines(
+    provider: BaseProvider,
+    timeRange: string,
+  ): Promise<interfaces.data.IPipeline[]> {
+    const projects = await provider.getProjects();
+
+    // Two parallel fetches: recent + explicitly active
+    const [recentPipelines, activePipelines] = await Promise.all([
+      this.fetchAggregatedPipelines(provider, projects, { perPage: 50 }),
+      this.fetchAggregatedPipelines(provider, projects, { status: 'running', perPage: 50 }),
+    ]);
+
+    // Merge and deduplicate (active first so they take precedence)
+    const seenIds = new Set<string>();
+    const merged: interfaces.data.IPipeline[] = [];
+    for (const p of [...activePipelines, ...recentPipelines]) {
+      const key = `${p.connectionId}:${p.projectId}:${p.id}`;
+      if (!seenIds.has(key)) {
+        seenIds.add(key);
+        merged.push(p);
+      }
+    }
+
+    // Running/pending pipelines are always shown regardless of time
+    const active = merged.filter(
+      (p) => p.status === 'running' || p.status === 'pending' || p.status === 'waiting',
+    );
+    const rest = merged.filter(
+      (p) => p.status !== 'running' && p.status !== 'pending' && p.status !== 'waiting',
+    );
+    const filteredRest = this.filterByTimeRange(rest, timeRange);
+
+    // Final dedup (active pipelines may also appear in filtered rest)
+    const activeIds = new Set(active.map((p) => `${p.connectionId}:${p.projectId}:${p.id}`));
+    const uniqueRest = filteredRest.filter(
+      (p) => !activeIds.has(`${p.connectionId}:${p.projectId}:${p.id}`),
+    );
+
+    return [...active, ...uniqueRest];
+  }
+
+  /**
+   * Group mode: pipelines from all projects in a group
+   */
+  private async fetchGroupPipelines(
+    provider: BaseProvider,
+    groupId: string,
+    timeRange: string,
+  ): Promise<interfaces.data.IPipeline[]> {
+    const projects = await provider.getGroupProjects(groupId);
+    const allPipelines = await this.fetchAggregatedPipelines(provider, projects);
+    return this.filterByTimeRange(allPipelines, timeRange);
+  }
+
+  /**
+   * Error mode: only failed pipelines
+   */
+  private async fetchErrorPipelines(
+    provider: BaseProvider,
+    timeRange: string,
+  ): Promise<interfaces.data.IPipeline[]> {
+    const projects = await provider.getProjects();
+    const allPipelines = await this.fetchAggregatedPipelines(provider, projects, { status: 'failed' });
+    return this.filterByTimeRange(allPipelines, timeRange);
+  }
+
+  /**
+   * Fetch pipelines from multiple projects in parallel (batched)
+   */
+  private async fetchAggregatedPipelines(
+    provider: BaseProvider,
+    projects: interfaces.data.IProject[],
+    opts?: { status?: string; perPage?: number },
+  ): Promise<interfaces.data.IPipeline[]> {
+    const BATCH_SIZE = 10;
+    const perPage = opts?.perPage || 50;
+    const allPipelines: interfaces.data.IPipeline[] = [];
+
+    for (let i = 0; i < projects.length; i += BATCH_SIZE) {
+      const batch = projects.slice(i, i + BATCH_SIZE);
+      const results = await Promise.allSettled(
+        batch.map(async (project) => {
+          const pipelines = await provider.getPipelines(project.id, {
+            perPage,
+            status: opts?.status,
+          });
+          // Enrich with proper project name
+          return pipelines.map((p) => ({
+            ...p,
+            projectName: project.fullPath || project.name || p.projectId,
+          }));
+        }),
+      );
+      for (let j = 0; j < results.length; j++) {
+        const result = results[j];
+        if (result.status === 'fulfilled') {
+          allPipelines.push(...result.value);
+        } else {
+          const projectId = batch[j]?.id || 'unknown';
+          console.warn(`[PipelinesHandler] Failed to fetch pipelines for project ${projectId}: ${result.reason}`);
+        }
+      }
+    }
+
+    return allPipelines;
+  }
+
+  // ---------------------------------------------------------------------------
+  // Filtering and sorting
+  // ---------------------------------------------------------------------------
+
+  private filterByTimeRange(
+    pipelines: interfaces.data.IPipeline[],
+    timeRange: string,
+  ): interfaces.data.IPipeline[] {
+    const cutoffMs = TIME_RANGE_MS[timeRange] || TIME_RANGE_MS['1d'];
+    const cutoff = Date.now() - cutoffMs;
+    return pipelines.filter((p) => {
+      if (!p.createdAt) return false;
+      return new Date(p.createdAt).getTime() >= cutoff;
+    });
+  }
+
+  private sortPipelines(
+    pipelines: interfaces.data.IPipeline[],
+    sortBy: string,
+  ): interfaces.data.IPipeline[] {
+    const sorted = [...pipelines];
+    switch (sortBy) {
+      case 'duration':
+        sorted.sort((a, b) => (b.duration || 0) - (a.duration || 0));
+        break;
+      case 'status':
+        sorted.sort(
+          (a, b) => (STATUS_PRIORITY[a.status] ?? 99) - (STATUS_PRIORITY[b.status] ?? 99),
+        );
+        break;
+      case 'created':
+      default:
+        sorted.sort(
+          (a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(),
+        );
+        break;
+    }
+    return sorted;
+  }
 }

ts/opsserver/handlers/sync.handler.ts

@@ -22,7 +22,7 @@ export class SyncHandler {
       try {
         const typedsocket = this.opsServerRef.server?.typedserver?.typedsocket;
         if (!typedsocket) return;
-        typedsocket.findAllTargetConnectionsByTag('allClients').then((connections) => {
+        typedsocket.findAllTargetConnectionsByTag('syncLogClient').then((connections) => {
           for (const conn of connections) {
             typedsocket
               .createTypedRequest<interfaces.requests.IReq_PushSyncLog>('pushSyncLog', conn)

ts/opsserver/handlers/webhook.handler.ts

@@ -31,7 +31,7 @@ export class WebhookHandler {
       try {
         const typedsocket = this.opsServerRef.server.typedserver.typedsocket;
         if (typedsocket) {
-          const connections = await typedsocket.findAllTargetConnectionsByTag('allClients');
+          const connections = await typedsocket.findAllTargetConnectionsByTag('syncLogClient');
           for (const conn of connections) {
             const req = typedsocket.createTypedRequest<interfaces.requests.IReq_WebhookNotification>(
               'webhookNotification',

ts/paths.ts

@@ -4,7 +4,6 @@ export interface IGitopsPaths {
   gitopsHomeDir: string;
   defaultStoragePath: string;
   defaultTsmDbPath: string;
-  syncMirrorsPath: string;
 }
 
 /**
@@ -16,6 +15,5 @@ export function resolvePaths(baseDir?: string): IGitopsPaths {
     gitopsHomeDir: home,
     defaultStoragePath: path.join(home, 'storage'),
     defaultTsmDbPath: path.join(home, 'tsmdb'),
-    syncMirrorsPath: path.join(home, 'mirrors'),
   };
 }

ts/providers/classes.baseprovider.ts

@@ -11,6 +11,12 @@ export interface IListOptions {
   perPage?: number;
 }
 
+export interface IPipelineListOptions extends IListOptions {
+  status?: string;
+  ref?: string;
+  source?: string;
+}
+
 /**
  * Abstract base class for Git provider implementations.
  * Subclasses implement Gitea API v1 or GitLab API v4.
@@ -36,6 +42,9 @@ export abstract class BaseProvider {
   // Groups / Orgs
   abstract getGroups(opts?: IListOptions): Promise<interfaces.data.IGroup[]>;
 
+  // Group Projects
+  abstract getGroupProjects(groupId: string, opts?: IListOptions): Promise<interfaces.data.IProject[]>;
+
   // Secrets — project scope
   abstract getProjectSecrets(projectId: string): Promise<interfaces.data.ISecret[]>;
   abstract createProjectSecret(
@@ -64,10 +73,14 @@ export abstract class BaseProvider {
   ): Promise<interfaces.data.ISecret>;
   abstract deleteGroupSecret(groupId: string, key: string): Promise<void>;
 
+  // Branches / Tags
+  abstract getBranches(projectFullPath: string, opts?: IListOptions): Promise<interfaces.data.IBranch[]>;
+  abstract getTags(projectFullPath: string, opts?: IListOptions): Promise<interfaces.data.ITag[]>;
+
   // Pipelines / CI
   abstract getPipelines(
     projectId: string,
-    opts?: IListOptions,
+    opts?: IPipelineListOptions,
   ): Promise<interfaces.data.IPipeline[]>;
   abstract getPipelineJobs(
     projectId: string,

ts/providers/classes.giteaprovider.ts

@@ -1,6 +1,6 @@
 import * as plugins from '../plugins.ts';
 import type * as interfaces from '../../ts_interfaces/index.ts';
-import { BaseProvider, type ITestConnectionResult, type IListOptions } from './classes.baseprovider.ts';
+import { BaseProvider, type ITestConnectionResult, type IListOptions, type IPipelineListOptions } from './classes.baseprovider.ts';
 
 /**
  * Gitea API v1 provider implementation
@@ -70,6 +70,59 @@ export class GiteaProvider extends BaseProvider {
     return allOrgs.map((o) => this.mapGroup(o));
   }
 
+  async getGroupProjects(groupId: string, opts?: IListOptions): Promise<interfaces.data.IProject[]> {
+    if (opts?.page) {
+      const repos = await this.client.getOrgRepos(groupId, opts);
+      return repos.map((r) => this.mapProject(r));
+    }
+    const allRepos: plugins.giteaClient.IGiteaRepository[] = [];
+    const perPage = opts?.perPage || 50;
+    let page = 1;
+    while (true) {
+      const repos = await this.client.getOrgRepos(groupId, { ...opts, page, perPage });
+      allRepos.push(...repos);
+      if (repos.length < perPage) break;
+      page++;
+    }
+    return allRepos.map((r) => this.mapProject(r));
+  }
+
+  // --- Branches / Tags ---
+
+  async getBranches(projectFullPath: string, opts?: IListOptions): Promise<interfaces.data.IBranch[]> {
+    if (opts?.page) {
+      const branches = await this.client.getRepoBranches(projectFullPath, opts);
+      return branches.map((b) => ({ name: b.name, commitSha: b.commit.id }));
+    }
+    const all: interfaces.data.IBranch[] = [];
+    const perPage = opts?.perPage || 50;
+    let page = 1;
+    while (true) {
+      const branches = await this.client.getRepoBranches(projectFullPath, { ...opts, page, perPage });
+      all.push(...branches.map((b) => ({ name: b.name, commitSha: b.commit.id })));
+      if (branches.length < perPage) break;
+      page++;
+    }
+    return all;
+  }
+
+  async getTags(projectFullPath: string, opts?: IListOptions): Promise<interfaces.data.ITag[]> {
+    if (opts?.page) {
+      const tags = await this.client.getRepoTags(projectFullPath, opts);
+      return tags.map((t) => ({ name: t.name, commitSha: t.commit.sha }));
+    }
+    const all: interfaces.data.ITag[] = [];
+    const perPage = opts?.perPage || 50;
+    let page = 1;
+    while (true) {
+      const tags = await this.client.getRepoTags(projectFullPath, { ...opts, page, perPage });
+      all.push(...tags.map((t) => ({ name: t.name, commitSha: t.commit.sha })));
+      if (tags.length < perPage) break;
+      page++;
+    }
+    return all;
+  }
+
   // --- Project Secrets ---
 
   async getProjectSecrets(projectId: string): Promise<interfaces.data.ISecret[]> {
@@ -130,9 +183,15 @@ export class GiteaProvider extends BaseProvider {
 
   async getPipelines(
     projectId: string,
-    opts?: IListOptions,
+    opts?: IPipelineListOptions,
   ): Promise<interfaces.data.IPipeline[]> {
-    const runs = await this.client.getActionRuns(projectId, opts);
+    const runs = await this.client.getActionRuns(projectId, {
+      page: opts?.page,
+      perPage: opts?.perPage,
+      status: opts?.status,
+      branch: opts?.ref,
+      event: opts?.source,
+    });
     return runs.map((r) => this.mapPipeline(r, projectId));
   }
 
@@ -200,11 +259,11 @@ export class GiteaProvider extends BaseProvider {
     };
   }
 
-  private mapPipeline(r: plugins.giteaClient.IGiteaActionRun, projectId: string): interfaces.data.IPipeline {
+  private mapPipeline(r: plugins.giteaClient.IGiteaActionRun, projectId: string, projectName?: string): interfaces.data.IPipeline {
     return {
       id: String(r.id),
       projectId,
-      projectName: projectId,
+      projectName: projectName || projectId,
       connectionId: this.connectionId,
       status: this.mapStatus(r.status || r.conclusion),
       ref: r.head_branch || '',

ts/providers/classes.gitlabprovider.ts

@@ -1,6 +1,6 @@
 import * as plugins from '../plugins.ts';
 import type * as interfaces from '../../ts_interfaces/index.ts';
-import { BaseProvider, type ITestConnectionResult, type IListOptions } from './classes.baseprovider.ts';
+import { BaseProvider, type ITestConnectionResult, type IListOptions, type IPipelineListOptions } from './classes.baseprovider.ts';
 
 /**
  * GitLab API v4 provider implementation
@@ -85,6 +85,59 @@ export class GitLabProvider extends BaseProvider {
     return allGroups.map((g) => this.mapGroup(g));
   }
 
+  async getGroupProjects(groupId: string, opts?: IListOptions): Promise<interfaces.data.IProject[]> {
+    if (opts?.page) {
+      const projects = await this.client.getGroupProjects(groupId, opts);
+      return projects.map((p) => this.mapProject(p));
+    }
+    const allProjects: plugins.gitlabClient.IGitLabProject[] = [];
+    const perPage = opts?.perPage || 50;
+    let page = 1;
+    while (true) {
+      const projects = await this.client.getGroupProjects(groupId, { ...opts, page, perPage });
+      allProjects.push(...projects);
+      if (projects.length < perPage) break;
+      page++;
+    }
+    return allProjects.map((p) => this.mapProject(p));
+  }
+
+  // --- Branches / Tags ---
+
+  async getBranches(projectFullPath: string, opts?: IListOptions): Promise<interfaces.data.IBranch[]> {
+    if (opts?.page) {
+      const branches = await this.client.getRepoBranches(projectFullPath, opts);
+      return branches.map((b) => ({ name: b.name, commitSha: b.commit.id }));
+    }
+    const all: interfaces.data.IBranch[] = [];
+    const perPage = opts?.perPage || 50;
+    let page = 1;
+    while (true) {
+      const branches = await this.client.getRepoBranches(projectFullPath, { ...opts, page, perPage });
+      all.push(...branches.map((b) => ({ name: b.name, commitSha: b.commit.id })));
+      if (branches.length < perPage) break;
+      page++;
+    }
+    return all;
+  }
+
+  async getTags(projectFullPath: string, opts?: IListOptions): Promise<interfaces.data.ITag[]> {
+    if (opts?.page) {
+      const tags = await this.client.getRepoTags(projectFullPath, opts);
+      return tags.map((t) => ({ name: t.name, commitSha: t.commit.id }));
+    }
+    const all: interfaces.data.ITag[] = [];
+    const perPage = opts?.perPage || 50;
+    let page = 1;
+    while (true) {
+      const tags = await this.client.getRepoTags(projectFullPath, { ...opts, page, perPage });
+      all.push(...tags.map((t) => ({ name: t.name, commitSha: t.commit.id })));
+      if (tags.length < perPage) break;
+      page++;
+    }
+    return all;
+  }
+
   // --- Project Secrets (CI/CD Variables) ---
 
   async getProjectSecrets(projectId: string): Promise<interfaces.data.ISecret[]> {
@@ -147,9 +200,15 @@ export class GitLabProvider extends BaseProvider {
 
   async getPipelines(
     projectId: string,
-    opts?: IListOptions,
+    opts?: IPipelineListOptions,
   ): Promise<interfaces.data.IPipeline[]> {
-    const pipelines = await this.client.getPipelines(projectId, opts);
+    const pipelines = await this.client.getPipelines(projectId, {
+      page: opts?.page,
+      perPage: opts?.perPage,
+      status: opts?.status,
+      ref: opts?.ref,
+      source: opts?.source,
+    });
     return pipelines.map((p) => this.mapPipeline(p, projectId));
   }
 
@@ -222,11 +281,11 @@ export class GitLabProvider extends BaseProvider {
     };
   }
 
-  private mapPipeline(p: plugins.gitlabClient.IGitLabPipeline, projectId: string): interfaces.data.IPipeline {
+  private mapPipeline(p: plugins.gitlabClient.IGitLabPipeline, projectId: string, projectName?: string): interfaces.data.IPipeline {
     return {
       id: String(p.id),
       projectId,
-      projectName: projectId,
+      projectName: projectName || projectId,
       connectionId: this.connectionId,
       status: (p.status || 'pending') as interfaces.data.TPipelineStatus,
       ref: p.ref || '',

ts_interfaces/data/branch.ts

@@ -0,0 +1,9 @@
+export interface IBranch {
+  name: string;
+  commitSha: string;
+}
+
+export interface ITag {
+  name: string;
+  commitSha: string;
+}

ts_interfaces/data/index.ts

@@ -2,6 +2,7 @@ export * from './identity.ts';
 export * from './connection.ts';
 export * from './project.ts';
 export * from './group.ts';
+export * from './branch.ts';
 export * from './secret.ts';
 export * from './pipeline.ts';
 export * from './actionlog.ts';

ts_interfaces/requests/pipelines.ts

@@ -9,7 +9,12 @@ export interface IReq_GetPipelines extends plugins.typedrequestInterfaces.implem
   request: {
     identity: data.IIdentity;
     connectionId: string;
-    projectId: string;
+    projectId?: string;
+    viewMode?: 'current' | 'project' | 'group' | 'error';
+    groupId?: string;
+    status?: string;
+    sortBy?: 'created' | 'duration' | 'status';
+    timeRange?: '1h' | '6h' | '1d' | '3d' | '7d' | '30d';
     page?: number;
   };
   response: {

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/gitops',
-  version: '2.8.0',
+  version: '2.12.0',
   description: 'GitOps management app for Gitea and GitLab - manage secrets, browse projects, view CI pipelines, and stream build logs'
 }

ts_web/appstate.ts

@@ -516,7 +516,12 @@ export const deleteSecretAction = dataStatePart.createAction<{
 
 export const fetchPipelinesAction = dataStatePart.createAction<{
   connectionId: string;
-  projectId: string;
+  projectId?: string;
+  viewMode?: 'current' | 'project' | 'group' | 'error';
+  groupId?: string;
+  status?: string;
+  sortBy?: 'created' | 'duration' | 'status';
+  timeRange?: '1h' | '6h' | '1d' | '3d' | '7d' | '30d';
 }>(async (statePartArg, dataArg) => {
   const context = getActionContext();
   try {
@@ -527,6 +532,11 @@ export const fetchPipelinesAction = dataStatePart.createAction<{
       identity: context.identity!,
       connectionId: dataArg.connectionId,
       projectId: dataArg.projectId,
+      viewMode: dataArg.viewMode,
+      groupId: dataArg.groupId,
+      status: dataArg.status,
+      sortBy: dataArg.sortBy,
+      timeRange: dataArg.timeRange,
     });
     return { ...statePartArg.getState(), pipelines: response.pipelines };
   } catch (err) {
@@ -1035,11 +1045,12 @@ export async function initSyncLogSocket(): Promise<void> {
       ),
     );
 
-    await plugins.typedsocket.TypedSocket.createClient(
+    const typedsocketClient = await plugins.typedsocket.TypedSocket.createClient(
       typedrouter,
       plugins.typedsocket.TypedSocket.useWindowLocationOriginUrl(),
       { autoReconnect: true },
     );
+    await typedsocketClient.setTag('syncLogClient', {});
   } catch (err) {
     console.error('Failed to init sync log TypedSocket client:', err);
     syncLogSocketInitialized = false;

ts_web/elements/views/pipelines/index.ts

@@ -11,6 +11,10 @@ import {
   type TemplateResult,
 } from '@design.estate/dees-element';
 
+type TViewMode = 'current' | 'project' | 'group' | 'error';
+type TSortBy = 'created' | 'duration' | 'status';
+type TTimeRange = '1h' | '6h' | '1d' | '3d' | '7d' | '30d';
+
 @customElement('gitops-view-pipelines')
 export class GitopsViewPipelines extends DeesElement {
   @state()
@@ -29,13 +33,16 @@ export class GitopsViewPipelines extends DeesElement {
     currentJobLog: '',
   };
 
-  @state()
+  @state() accessor selectedConnectionId: string = '';
-  accessor selectedConnectionId: string = '';
+  @state() accessor selectedProjectId: string = '';
-
+  @state() accessor selectedGroupId: string = '';
-  @state()
+  @state() accessor viewMode: TViewMode = 'current';
-  accessor selectedProjectId: string = '';
+  @state() accessor sortBy: TSortBy = 'created';
+  @state() accessor timeRange: TTimeRange = '1d';
+  @state() accessor isLoading: boolean = false;
 
   private _autoRefreshHandler: () => void;
+  private _logPollInterval: ReturnType<typeof setInterval> | null = null;
 
   constructor() {
     super();
@@ -56,6 +63,7 @@ export class GitopsViewPipelines extends DeesElement {
   public override disconnectedCallback() {
     super.disconnectedCallback();
     document.removeEventListener('gitops-auto-refresh', this._autoRefreshHandler);
+    this.stopLogPolling();
   }
 
   private handleAutoRefresh(): void {
@@ -88,11 +96,40 @@ export class GitopsViewPipelines extends DeesElement {
       key: c.id,
     }));
 
+    const viewModeOptions = [
+      { option: 'Current', key: 'current' },
+      { option: 'Project', key: 'project' },
+      { option: 'Group', key: 'group' },
+      { option: 'Error', key: 'error' },
+    ];
+
+    const timeRangeOptions = [
+      { option: '1 hour', key: '1h' },
+      { option: '6 hours', key: '6h' },
+      { option: '1 day', key: '1d' },
+      { option: '3 days', key: '3d' },
+      { option: '7 days', key: '7d' },
+      { option: '30 days', key: '30d' },
+    ];
+
+    const sortByOptions = [
+      { option: 'Created', key: 'created' },
+      { option: 'Duration', key: 'duration' },
+      { option: 'Status', key: 'status' },
+    ];
+
     const projectOptions = this.dataState.projects.map((p) => ({
       option: p.fullPath || p.name,
       key: p.id,
     }));
 
+    const groupOptions = this.dataState.groups.map((g) => ({
+      option: g.fullPath || g.name,
+      key: g.id,
+    }));
+
+    const showMultiProjectColumns = this.viewMode !== 'project';
+
     return html`
       <div class="view-title">Pipelines</div>
       <div class="view-description">View and manage CI/CD pipelines</div>
@@ -103,15 +140,54 @@ export class GitopsViewPipelines extends DeesElement {
           .selectedOption=${connectionOptions.find((o) => o.key === this.selectedConnectionId) || connectionOptions[0]}
           @selectedOption=${(e: CustomEvent) => {
             this.selectedConnectionId = e.detail.key;
-            this.loadProjects();
+            this.onConnectionChange();
           }}
         ></dees-input-dropdown>
         <dees-input-dropdown
-          .label=${'Project'}
+          .label=${'View'}
-          .options=${projectOptions}
+          .options=${viewModeOptions}
-          .selectedOption=${projectOptions.find((o) => o.key === this.selectedProjectId) || projectOptions[0]}
+          .selectedOption=${viewModeOptions.find((o) => o.key === this.viewMode)}
           @selectedOption=${(e: CustomEvent) => {
-            this.selectedProjectId = e.detail.key;
+            this.onViewModeChange(e.detail.key);
+          }}
+        ></dees-input-dropdown>
+        ${this.viewMode === 'project' ? html`
+          <dees-input-dropdown
+            .label=${'Project'}
+            .options=${projectOptions}
+            .selectedOption=${projectOptions.find((o) => o.key === this.selectedProjectId) || projectOptions[0]}
+            @selectedOption=${(e: CustomEvent) => {
+              this.selectedProjectId = e.detail.key;
+              this.loadPipelines();
+            }}
+          ></dees-input-dropdown>
+        ` : ''}
+        ${this.viewMode === 'group' ? html`
+          <dees-input-dropdown
+            .label=${'Group'}
+            .options=${groupOptions}
+            .selectedOption=${groupOptions.find((o) => o.key === this.selectedGroupId) || groupOptions[0]}
+            @selectedOption=${(e: CustomEvent) => {
+              this.selectedGroupId = e.detail.key;
+              this.loadPipelines();
+            }}
+          ></dees-input-dropdown>
+        ` : ''}
+        <dees-input-dropdown
+          .label=${'Time'}
+          .options=${timeRangeOptions}
+          .selectedOption=${timeRangeOptions.find((o) => o.key === this.timeRange)}
+          @selectedOption=${(e: CustomEvent) => {
+            this.timeRange = e.detail.key;
+            this.loadPipelines();
+          }}
+        ></dees-input-dropdown>
+        <dees-input-dropdown
+          .label=${'Sort'}
+          .options=${sortByOptions}
+          .selectedOption=${sortByOptions.find((o) => o.key === this.sortBy)}
+          @selectedOption=${(e: CustomEvent) => {
+            this.sortBy = e.detail.key;
             this.loadPipelines();
           }}
         ></dees-input-dropdown>
@@ -119,21 +195,32 @@ export class GitopsViewPipelines extends DeesElement {
       </div>
       <dees-table
         .heading1=${'CI/CD Pipelines'}
-        .heading2=${'Pipeline runs for the selected project'}
+        .heading2=${this.isLoading ? 'Loading...' : `${this.dataState.pipelines.length} pipeline runs`}
         .data=${this.dataState.pipelines}
-        .displayFunction=${(item: any) => ({
+        .displayFunction=${(item: any) => {
-          ID: item.id,
+          const row: any = {};
-          Status: item.status,
+          row['ID'] = item.id;
-          Ref: item.ref,
+          row['Status'] = item.status;
-          Duration: item.duration ? `${Math.round(item.duration)}s` : '-',
+          if (showMultiProjectColumns) {
-          Source: item.source,
+            row['Project'] = item.projectName;
-          Created: item.createdAt ? new Date(item.createdAt).toLocaleString() : '-',
+          }
-        })}
+          row['Ref'] = item.ref;
+          row['Duration'] = item.duration ? `${Math.round(item.duration)}s` : '-';
+          row['Source'] = item.source;
+          row['Created'] = item.createdAt ? new Date(item.createdAt).toLocaleString() : '-';
+          return row;
+        }}
         .dataActions=${[
+          {
+            name: 'View Logs',
+            iconName: 'lucide:terminal',
+            type: ['inRow', 'contextmenu'],
+            actionFunc: async ({ item }: any) => { await this.openPipelineLogs(item); },
+          },
           {
             name: 'View Jobs',
             iconName: 'lucide:list',
-            type: ['inRow', 'contextmenu'],
+            type: ['contextmenu'],
             actionFunc: async ({ item }: any) => { await this.viewJobs(item); },
           },
           {
@@ -142,22 +229,24 @@ export class GitopsViewPipelines extends DeesElement {
             type: ['inRow', 'contextmenu'],
             actionFunc: async ({ item }: any) => {
               await appstate.dataStatePart.dispatchAction(appstate.retryPipelineAction, {
-                connectionId: this.selectedConnectionId,
+                connectionId: item.connectionId || this.selectedConnectionId,
-                projectId: this.selectedProjectId,
+                projectId: item.projectId,
                 pipelineId: item.id,
               });
+              await this.loadPipelines();
             },
           },
           {
             name: 'Cancel',
             iconName: 'lucide:xCircle',
-            type: ['inRow', 'contextmenu'],
+            type: ['contextmenu'],
             actionFunc: async ({ item }: any) => {
               await appstate.dataStatePart.dispatchAction(appstate.cancelPipelineAction, {
-                connectionId: this.selectedConnectionId,
+                connectionId: item.connectionId || this.selectedConnectionId,
-                projectId: this.selectedProjectId,
+                projectId: item.projectId,
                 pipelineId: item.id,
               });
+              await this.loadPipelines();
             },
           },
         ]}
@@ -173,6 +262,7 @@ export class GitopsViewPipelines extends DeesElement {
     if (navCtx?.connectionId && navCtx?.projectId) {
       this.selectedConnectionId = navCtx.connectionId;
       this.selectedProjectId = navCtx.projectId;
+      this.viewMode = 'project';
       appstate.uiStatePart.dispatchAction(appstate.clearNavigationContextAction, null);
       await this.loadProjects();
       await this.loadPipelines();
@@ -182,7 +272,39 @@ export class GitopsViewPipelines extends DeesElement {
     const conns = appstate.connectionsStatePart.getState().connections;
     if (conns.length > 0 && !this.selectedConnectionId) {
       this.selectedConnectionId = conns[0].id;
+      // In 'current' mode, load pipelines immediately
+      await this.loadPipelines();
+    }
+  }
+
+  // ---------------------------------------------------------------------------
+  // Data loading
+  // ---------------------------------------------------------------------------
+
+  private async onConnectionChange() {
+    this.selectedProjectId = '';
+    this.selectedGroupId = '';
+    if (this.viewMode === 'project') {
       await this.loadProjects();
+    } else if (this.viewMode === 'group') {
+      await this.loadGroups();
+    } else {
+      await this.loadPipelines();
+    }
+  }
+
+  private onViewModeChange(newMode: TViewMode) {
+    this.stopLogPolling();
+    this.viewMode = newMode;
+    this.selectedProjectId = '';
+    this.selectedGroupId = '';
+
+    if (newMode === 'current' || newMode === 'error') {
+      this.loadPipelines();
+    } else if (newMode === 'project') {
+      this.loadProjects();
+    } else if (newMode === 'group') {
+      this.loadGroups();
     }
   }
 
@@ -193,18 +315,221 @@ export class GitopsViewPipelines extends DeesElement {
     });
   }
 
-  private async loadPipelines() {
+  private async loadGroups() {
-    if (!this.selectedConnectionId || !this.selectedProjectId) return;
+    if (!this.selectedConnectionId) return;
-    await appstate.dataStatePart.dispatchAction(appstate.fetchPipelinesAction, {
+    await appstate.dataStatePart.dispatchAction(appstate.fetchGroupsAction, {
       connectionId: this.selectedConnectionId,
-      projectId: this.selectedProjectId,
     });
   }
 
+  private async loadPipelines() {
+    if (!this.selectedConnectionId) return;
+
+    // For project mode, require a project selection
+    if (this.viewMode === 'project' && !this.selectedProjectId) return;
+    // For group mode, require a group selection
+    if (this.viewMode === 'group' && !this.selectedGroupId) return;
+
+    this.isLoading = true;
+    try {
+      await appstate.dataStatePart.dispatchAction(appstate.fetchPipelinesAction, {
+        connectionId: this.selectedConnectionId,
+        projectId: this.viewMode === 'project' ? this.selectedProjectId : undefined,
+        viewMode: this.viewMode,
+        groupId: this.viewMode === 'group' ? this.selectedGroupId : undefined,
+        sortBy: this.sortBy,
+        timeRange: this.timeRange,
+      });
+    } finally {
+      this.isLoading = false;
+    }
+  }
+
+  // ---------------------------------------------------------------------------
+  // Pipeline log viewing
+  // ---------------------------------------------------------------------------
+
+  private async openPipelineLogs(pipeline: any) {
+    await appstate.dataStatePart.dispatchAction(appstate.fetchPipelineJobsAction, {
+      connectionId: pipeline.connectionId || this.selectedConnectionId,
+      projectId: pipeline.projectId,
+      pipelineId: pipeline.id,
+    });
+
+    const jobs = appstate.dataStatePart.getState().pipelineJobs;
+    let activeJobId: string | null = null;
+
+    const modal = await plugins.deesCatalog.DeesModal.createAndShow({
+      heading: `Pipeline #${pipeline.id} - Logs`,
+      content: html`
+        <style>
+          .log-container {
+            display: flex;
+            gap: 0;
+            min-height: 400px;
+            max-height: 70vh;
+            color: #ccc;
+            font-family: 'Intel One Mono', 'Fira Code', monospace;
+          }
+          .job-list {
+            width: 220px;
+            flex-shrink: 0;
+            border-right: 1px solid #333;
+            overflow-y: auto;
+          }
+          .job-entry {
+            padding: 10px 14px;
+            cursor: pointer;
+            border-bottom: 1px solid #282828;
+            transition: background 0.15s;
+          }
+          .job-entry:hover {
+            background: #1a1a2e;
+          }
+          .job-entry.active {
+            background: #1a2a3a;
+            border-left: 3px solid #00acff;
+            padding-left: 11px;
+          }
+          .job-name {
+            font-weight: 600;
+            font-size: 13px;
+            color: #eee;
+          }
+          .job-meta {
+            font-size: 11px;
+            color: #888;
+            margin-top: 3px;
+          }
+          .job-status-badge {
+            display: inline-block;
+            padding: 1px 6px;
+            border-radius: 3px;
+            font-size: 10px;
+            font-weight: 600;
+            text-transform: uppercase;
+          }
+          .job-status-badge.running { background: #1a2a3a; color: #00acff; }
+          .job-status-badge.success { background: #1a3a1a; color: #00ff88; }
+          .job-status-badge.failed { background: #3a1a1a; color: #ff4444; }
+          .job-status-badge.pending { background: #3a3a1a; color: #ffaa00; }
+          .job-status-badge.canceled { background: #2a2a2a; color: #999; }
+          .log-output {
+            flex: 1;
+            overflow: auto;
+            background: #0d0d0d;
+            padding: 12px;
+          }
+          .log-output pre {
+            margin: 0;
+            white-space: pre-wrap;
+            word-break: break-all;
+            font-family: 'Intel One Mono', 'Fira Code', monospace;
+            font-size: 12px;
+            line-height: 1.6;
+            color: #ccc;
+          }
+          .no-log {
+            color: #666;
+            padding: 40px 20px;
+            text-align: center;
+            font-size: 13px;
+          }
+        </style>
+        <div class="log-container">
+          <div class="job-list">
+            ${jobs.map((job: any) => html`
+              <div
+                class="job-entry"
+                data-job-id="${job.id}"
+                @click=${async (e: Event) => {
+                  // Update active state visually
+                  const container = (e.target as HTMLElement).closest('.log-container');
+                  container?.querySelectorAll('.job-entry').forEach((el: Element) => el.classList.remove('active'));
+                  (e.target as HTMLElement).closest('.job-entry')?.classList.add('active');
+                  activeJobId = job.id;
+                  await this.selectJobForLog(job, pipeline, container);
+                }}
+              >
+                <div class="job-name">${job.name}</div>
+                <div class="job-meta">
+                  <span class="job-status-badge ${job.status}">${job.status}</span>
+                  ${job.stage ? ` ${job.stage}` : ''}
+                  ${job.duration ? ` - ${Math.round(job.duration)}s` : ''}
+                </div>
+              </div>
+            `)}
+            ${jobs.length === 0 ? html`<div class="no-log">No jobs found.</div>` : ''}
+          </div>
+          <div class="log-output">
+            <pre class="job-log-pre"><span class="no-log">Select a job to view its log.</span></pre>
+          </div>
+        </div>
+      `,
+      menuOptions: [
+        {
+          name: 'Close',
+          action: async (modalRef: any) => {
+            this.stopLogPolling();
+            modalRef.destroy();
+          },
+        },
+      ],
+    });
+  }
+
+  private async selectJobForLog(job: any, pipeline: any, container: Element | null) {
+    this.stopLogPolling();
+
+    // Fetch initial log
+    await this.fetchAndDisplayLog(job, pipeline, container);
+
+    // If job is running/pending, poll every 3 seconds
+    if (job.status === 'running' || job.status === 'pending' || job.status === 'waiting') {
+      this._logPollInterval = setInterval(async () => {
+        await this.fetchAndDisplayLog(job, pipeline, container);
+      }, 3000);
+    }
+  }
+
+  private async fetchAndDisplayLog(job: any, pipeline: any, container: Element | null) {
+    try {
+      await appstate.dataStatePart.dispatchAction(appstate.fetchJobLogAction, {
+        connectionId: pipeline.connectionId || this.selectedConnectionId,
+        projectId: pipeline.projectId,
+        jobId: job.id,
+      });
+
+      const log = appstate.dataStatePart.getState().currentJobLog;
+      const pre = container?.querySelector('.job-log-pre');
+      if (pre) {
+        pre.textContent = log || '(No output yet)';
+        // Auto-scroll to bottom
+        const logOutput = pre.closest('.log-output');
+        if (logOutput) {
+          logOutput.scrollTop = logOutput.scrollHeight;
+        }
+      }
+    } catch (err) {
+      console.error('Failed to fetch job log:', err);
+    }
+  }
+
+  private stopLogPolling() {
+    if (this._logPollInterval !== null) {
+      clearInterval(this._logPollInterval);
+      this._logPollInterval = null;
+    }
+  }
+
+  // ---------------------------------------------------------------------------
+  // Legacy job view (accessible via context menu)
+  // ---------------------------------------------------------------------------
+
   private async viewJobs(pipeline: any) {
     await appstate.dataStatePart.dispatchAction(appstate.fetchPipelineJobsAction, {
-      connectionId: this.selectedConnectionId,
+      connectionId: pipeline.connectionId || this.selectedConnectionId,
-      projectId: this.selectedProjectId,
+      projectId: pipeline.projectId,
       pipelineId: pipeline.id,
     });