feat: add bandwidth saved stat to dashboard (#65)

Shows total bytes served from cache (instead of upstream) over the last 30 days. Queries `SUM(size_bytes) WHERE cache_hit = TRUE` from access_log.

Reviewed-on: #65
Co-authored-by: Ben Vincent <ben@unkin.net>
Co-committed-by: Ben Vincent <ben@unkin.net>

.pre-commit-config.yaml

@@ -0,0 +1,24 @@
+repos:
+  - repo: https://github.com/pre-commit/pre-commit-hooks
+    rev: v5.0.0
+    hooks:
+      - id: trailing-whitespace
+      - id: end-of-file-fixer
+      - id: check-yaml
+      - id: check-added-large-files
+      - id: check-merge-conflict
+
+  - repo: https://github.com/dnephin/pre-commit-golang
+    rev: v0.5.1
+    hooks:
+      - id: go-fmt
+      - id: go-mod-tidy
+
+  - repo: local
+    hooks:
+      - id: go-vet
+        name: go vet
+        entry: go vet ./...
+        language: system
+        types: [go]
+        pass_filenames: false

.woodpecker/docker.yaml

@@ -8,6 +8,8 @@ steps:
     settings:
       registry: git.unkin.net
       repo: git.unkin.net/unkin/artifactapi
+      build_args:
+        VERSION: ${CI_COMMIT_TAG}
       username: droneci
       password:
         from_secret: DRONECI_PASSWORD
@@ -22,6 +24,8 @@ steps:
       repo: git.unkin.net/unkin/artifactapi-ui
       dockerfile: ui/Dockerfile.ui
       context: ui
+      build_args:
+        BASE_PATH: /ui
       username: droneci
       password:
         from_secret: DRONECI_PASSWORD

.woodpecker/pre-commit.yaml

@@ -3,7 +3,15 @@ when:
 
 steps:
   - name: pre-commit
-    image: golang:1.25
+    image: git.unkin.net/unkin/almalinux9-gobuilder:20260606
     commands:
-      - test -z "$(gofmt -l .)"
-      - go vet ./...
+      - uvx pre-commit run --all-files
+    backend_options:
+      kubernetes:
+        resources:
+          requests:
+            memory: 512Mi
+            cpu: 1
+          limits:
+            memory: 2Gi
+            cpu: 2

Dockerfile

@@ -9,7 +9,8 @@ RUN go mod download
 
 COPY . .
 
-RUN CGO_ENABLED=0 go build -ldflags="-s -w" -o artifactapi ./cmd/artifactapi
+ARG VERSION=dev
+RUN CGO_ENABLED=0 go build -ldflags="-s -w -X main.version=${VERSION}" -o artifactapi ./cmd/artifactapi
 
 FROM gcr.io/distroless/static-debian12:nonroot
 

Makefile

@@ -12,7 +12,7 @@ check-go:
 	fi
 
 build: check-go tidy
-	go build -ldflags="-s -w" -o $(BINARY) ./cmd/artifactapi
+	go build -ldflags="-s -w -X main.version=$(VERSION)" -o $(BINARY) ./cmd/artifactapi
 
 test: check-go
 	go test -race -count=1 ./pkg/... ./internal/...

cmd/artifactapi/main.go

@@ -13,6 +13,8 @@ import (
 	"git.unkin.net/unkin/artifactapi/internal/tui"
 )
 
+var version = "dev"
+
 func main() {
 	if len(os.Args) > 1 && os.Args[1] == "tui" {
 		endpoint := os.Getenv("ARTIFACTAPI_ENDPOINT")
@@ -42,7 +44,7 @@ func main() {
 	ctx, cancel := signal.NotifyContext(context.Background(), syscall.SIGINT, syscall.SIGTERM)
 	defer cancel()
 
-	srv, err := server.New(cfg)
+	srv, err := server.New(cfg, version)
 	if err != nil {
 		slog.Error("failed to create server", "error", err)
 		os.Exit(1)

internal/api/v1/proxy.go

@@ -37,6 +37,20 @@ func (h *ProxyHandler) Routes() chi.Router {
 	return r
 }
 
+func (h *ProxyHandler) DockerV2Routes() chi.Router {
+	r := chi.NewRouter()
+	r.Get("/", h.handleDockerPing)
+	r.Head("/", h.handleDockerPing)
+	r.Get("/{remoteName}/*", h.handleProxy)
+	r.Head("/{remoteName}/*", h.handleProxy)
+	return r
+}
+
+func (h *ProxyHandler) handleDockerPing(w http.ResponseWriter, r *http.Request) {
+	w.Header().Set("Docker-Distribution-Api-Version", "registry/2.0")
+	w.WriteHeader(http.StatusOK)
+}
+
 func (h *ProxyHandler) handleProxy(w http.ResponseWriter, r *http.Request) {
 	remoteName := chi.URLParam(r, "remoteName")
 	path := chi.URLParam(r, "*")
@@ -53,7 +67,7 @@ func (h *ProxyHandler) handleProxy(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 
-	result, err := h.engine.Fetch(r.Context(), *remote, path, prov)
+	result, err := h.engine.Fetch(r.Context(), *remote, path, prov, r.Header)
 	if err != nil {
 		var proxyErr *proxy.ProxyError
 		if errors.As(err, &proxyErr) {

internal/database/stats.go

@@ -30,6 +30,15 @@ func (db *DB) GetOverviewStats(ctx context.Context) (*models.OverviewStats, erro
 		return nil, err
 	}
 
+	err = db.Pool.QueryRow(ctx, `
+		SELECT COALESCE(SUM(size_bytes), 0)
+		FROM access_log
+		WHERE cache_hit = TRUE AND created_at > NOW() - INTERVAL '30 days'
+	`).Scan(&stats.BandwidthSaved30d)
+	if err != nil {
+		return nil, err
+	}
+
 	return &stats, nil
 }
 

internal/proxy/engine.go

@@ -4,10 +4,12 @@ import (
 	"context"
 	"crypto/sha256"
 	"encoding/hex"
+	"encoding/json"
 	"fmt"
 	"io"
 	"log/slog"
 	"net/http"
+	"strings"
 	"time"
 
 	"git.unkin.net/unkin/artifactapi/internal/cache"
@@ -42,7 +44,7 @@ type FetchResult struct {
 	Source      string // "cache" or "remote"
 }
 
-func (e *Engine) Fetch(ctx context.Context, remote models.Remote, path string, prov provider.Provider) (*FetchResult, error) {
+func (e *Engine) Fetch(ctx context.Context, remote models.Remote, path string, prov provider.Provider, clientHeaders ...http.Header) (*FetchResult, error) {
 	classifier := NewClassifier(prov)
 	class := classifier.Classify(remote, path)
 
@@ -103,8 +105,13 @@ func (e *Engine) Fetch(ctx context.Context, remote models.Remote, path string, p
 		}
 	}
 
+	var fwdHeaders http.Header
+	if len(clientHeaders) > 0 && clientHeaders[0] != nil {
+		fwdHeaders = clientHeaders[0]
+	}
+
 	start := time.Now()
-	result, err := e.fetchFromUpstream(ctx, remote, path, prov, class, ttl)
+	result, err := e.fetchFromUpstream(ctx, remote, path, prov, class, ttl, fwdHeaders)
 	upstreamMS := int(time.Since(start).Milliseconds())
 	if err != nil {
 		if remote.StaleOnError && isNetworkError(err) {
@@ -124,7 +131,7 @@ func (e *Engine) Fetch(ctx context.Context, remote models.Remote, path string, p
 	return result, nil
 }
 
-func (e *Engine) fetchFromUpstream(ctx context.Context, remote models.Remote, path string, prov provider.Provider, class Classification, ttl time.Duration) (*FetchResult, error) {
+func (e *Engine) fetchFromUpstream(ctx context.Context, remote models.Remote, path string, prov provider.Provider, class Classification, ttl time.Duration, clientHeaders http.Header) (*FetchResult, error) {
 	url := prov.UpstreamURL(remote, path)
 
 	authHeaders, err := prov.AuthHeaders(ctx, remote)
@@ -141,12 +148,37 @@ func (e *Engine) fetchFromUpstream(ctx context.Context, remote models.Remote, pa
 			req.Header.Add(k, v)
 		}
 	}
+	if clientHeaders != nil {
+		if accept := clientHeaders.Get("Accept"); accept != "" {
+			req.Header.Set("Accept", accept)
+		}
+	}
 
 	resp, err := http.DefaultClient.Do(req)
 	if err != nil {
 		return nil, &UpstreamError{Err: err}
 	}
 
+	if resp.StatusCode == http.StatusUnauthorized {
+		resp.Body.Close()
+		token, err := fetchBearerToken(ctx, resp.Header.Get("Www-Authenticate"), remote)
+		if err == nil && token != "" {
+			req2, _ := http.NewRequestWithContext(ctx, http.MethodGet, url, nil)
+			req2.Header.Set("Authorization", "Bearer "+token)
+			if clientHeaders != nil {
+				if accept := clientHeaders.Get("Accept"); accept != "" {
+					req2.Header.Set("Accept", accept)
+				}
+			}
+			resp, err = http.DefaultClient.Do(req2)
+			if err != nil {
+				return nil, &UpstreamError{Err: err}
+			}
+		} else {
+			return nil, &ProxyError{Status: http.StatusUnauthorized, Message: "upstream returned 401"}
+		}
+	}
+
 	if resp.StatusCode != http.StatusOK {
 		resp.Body.Close()
 		return nil, &ProxyError{Status: resp.StatusCode, Message: fmt.Sprintf("upstream returned %d", resp.StatusCode)}
@@ -167,7 +199,7 @@ func (e *Engine) fetchFromUpstream(ctx context.Context, remote models.Remote, pa
 	}
 
 	contentType := prov.ContentType(path)
-	if ct := resp.Header.Get("Content-Type"); ct != "" && contentType == "application/octet-stream" {
+	if ct := resp.Header.Get("Content-Type"); ct != "" {
 		contentType = ct
 	}
 
@@ -319,6 +351,71 @@ func (r readerAt) ReadAt(p []byte, off int64) (n int, err error) {
 	return
 }
 
+func fetchBearerToken(ctx context.Context, wwwAuth string, remote models.Remote) (string, error) {
+	if !strings.HasPrefix(wwwAuth, "Bearer ") {
+		return "", fmt.Errorf("not a Bearer challenge")
+	}
+
+	params := map[string]string{}
+	for _, part := range strings.Split(wwwAuth[7:], ",") {
+		part = strings.TrimSpace(part)
+		eq := strings.Index(part, "=")
+		if eq < 0 {
+			continue
+		}
+		key := part[:eq]
+		val := strings.Trim(part[eq+1:], `"`)
+		params[key] = val
+	}
+
+	realm := params["realm"]
+	if realm == "" {
+		return "", fmt.Errorf("no realm in Bearer challenge")
+	}
+
+	tokenURL := realm
+	sep := "?"
+	if s, ok := params["service"]; ok {
+		tokenURL += sep + "service=" + s
+		sep = "&"
+	}
+	if s, ok := params["scope"]; ok {
+		tokenURL += sep + "scope=" + s
+	}
+
+	req, err := http.NewRequestWithContext(ctx, http.MethodGet, tokenURL, nil)
+	if err != nil {
+		return "", err
+	}
+
+	if remote.Username != "" && remote.Password != "" {
+		req.SetBasicAuth(remote.Username, remote.Password)
+	}
+
+	resp, err := http.DefaultClient.Do(req)
+	if err != nil {
+		return "", err
+	}
+	defer resp.Body.Close()
+
+	if resp.StatusCode != http.StatusOK {
+		return "", fmt.Errorf("token endpoint returned %d", resp.StatusCode)
+	}
+
+	var tokenResp struct {
+		Token       string `json:"token"`
+		AccessToken string `json:"access_token"`
+	}
+	if err := json.NewDecoder(resp.Body).Decode(&tokenResp); err != nil {
+		return "", err
+	}
+
+	if tokenResp.Token != "" {
+		return tokenResp.Token, nil
+	}
+	return tokenResp.AccessToken, nil
+}
+
 type ProxyError struct {
 	Status  int
 	Message string

internal/server/server.go

@@ -35,6 +35,7 @@ import (
 
 type Server struct {
 	cfg          *config.Config
+	version      string
 	router       chi.Router
 	db           *database.DB
 	cache        *cache.Redis
@@ -45,7 +46,7 @@ type Server struct {
 	gc           *gc.Collector
 }
 
-func New(cfg *config.Config) (*Server, error) {
+func New(cfg *config.Config, version string) (*Server, error) {
 	db, err := database.New(cfg.DatabaseDSN())
 	if err != nil {
 		return nil, fmt.Errorf("database: %w", err)
@@ -68,6 +69,7 @@ func New(cfg *config.Config) (*Server, error) {
 
 	s := &Server{
 		cfg:          cfg,
+		version:      version,
 		db:           db,
 		cache:        redis,
 		store:        s3,
@@ -96,6 +98,7 @@ func (s *Server) routes() chi.Router {
 
 	proxyHandler := v1.NewProxyHandler(s.engine, s.virtEngine, s.db, s.store, s.localHandler)
 	r.Mount("/api/v1", proxyHandler.Routes())
+	r.Mount("/v2", proxyHandler.DockerV2Routes())
 
 	remotesHandler := v2.NewRemotesHandler(s.db)
 	virtualsHandler := v2.NewVirtualsHandler(s.db)
@@ -137,7 +140,7 @@ func (s *Server) handleHealth(w http.ResponseWriter, r *http.Request) {
 func (s *Server) handleRoot(w http.ResponseWriter, r *http.Request) {
 	w.Header().Set("Content-Type", "application/json")
 	w.WriteHeader(http.StatusOK)
-	fmt.Fprint(w, `{"name":"artifactapi","version":"3.0.0-dev"}`)
+	fmt.Fprintf(w, `{"name":"artifactapi","version":"%s"}`, s.version)
 }
 
 func (s *Server) newHTTPServer() *http.Server {

internal/virtual/engine.go

@@ -79,7 +79,7 @@ func (e *Engine) fetchMemberIndexes(ctx context.Context, virt models.Virtual, pa
 					results[idx] = result{err: fmt.Errorf("local index %q: %w", name, err)}
 					return
 				}
-				results[idx] = result{index: MemberIndex{RemoteName: name, RepoType: remote.RepoType, Body: body}}
+				results[idx] = result{index: MemberIndex{RemoteName: name, RepoType: remote.RepoType, BaseURL: remote.BaseURL, Body: body}}
 				return
 			}
 
@@ -102,7 +102,7 @@ func (e *Engine) fetchMemberIndexes(ctx context.Context, virt models.Virtual, pa
 				return
 			}
 
-			results[idx] = result{index: MemberIndex{RemoteName: name, RepoType: remote.RepoType, Body: body}}
+			results[idx] = result{index: MemberIndex{RemoteName: name, RepoType: remote.RepoType, BaseURL: remote.BaseURL, Body: body}}
 		}(i, memberName)
 	}
 

internal/virtual/helm_merger.go

@@ -54,15 +54,27 @@ func (m *HelmMerger) MergeIndexes(members []MemberIndex, proxyBaseURL string) ([
 				seen[chart][ver.Version] = true
 
 				if proxyBaseURL != "" {
+					routePrefix := "remote"
+					if member.RepoType == "local" {
+						routePrefix = "local"
+					}
+					baseHost := extractHost(member.BaseURL)
+
 					for i, u := range ver.URLs {
 						if strings.HasPrefix(u, "http://") || strings.HasPrefix(u, "https://") {
-							ver.URLs[i] = fmt.Sprintf("%s/api/v1/remote/%s/%s",
+							if baseHost != "" && extractHost(u) != baseHost {
+								continue
+							}
+							relPath := extractPathRelativeToBase(u, member.BaseURL)
+							ver.URLs[i] = fmt.Sprintf("%s/api/v1/%s/%s/%s",
 								strings.TrimRight(proxyBaseURL, "/"),
+								routePrefix,
 								member.RemoteName,
-								extractPath(u))
+								relPath)
 						} else {
-							ver.URLs[i] = fmt.Sprintf("%s/api/v1/remote/%s/%s",
+							ver.URLs[i] = fmt.Sprintf("%s/api/v1/%s/%s/%s",
 								strings.TrimRight(proxyBaseURL, "/"),
+								routePrefix,
 								member.RemoteName,
 								u)
 						}
@@ -78,6 +90,31 @@ func (m *HelmMerger) MergeIndexes(members []MemberIndex, proxyBaseURL string) ([
 	return yaml.Marshal(merged)
 }
 
+func extractHost(rawURL string) string {
+	idx := strings.Index(rawURL, "://")
+	if idx == -1 {
+		return ""
+	}
+	rest := rawURL[idx+3:]
+	slashIdx := strings.Index(rest, "/")
+	if slashIdx == -1 {
+		return rest
+	}
+	return rest[:slashIdx]
+}
+
+func extractPathRelativeToBase(rawURL, baseURL string) string {
+	fullPath := extractPath(rawURL)
+	basePath := extractPath(baseURL)
+	if basePath != "" {
+		basePath = strings.TrimRight(basePath, "/") + "/"
+		if strings.HasPrefix(fullPath, basePath) {
+			return fullPath[len(basePath):]
+		}
+	}
+	return fullPath
+}
+
 func extractPath(rawURL string) string {
 	idx := strings.Index(rawURL, "://")
 	if idx == -1 {

internal/virtual/merger.go

@@ -9,6 +9,7 @@ import (
 type MemberIndex struct {
 	RemoteName string
 	RepoType   models.RepoType
+	BaseURL    string
 	Body       []byte
 }
 

ui/Dockerfile.ui

@@ -6,13 +6,20 @@ COPY package.json package-lock.json* ./
 RUN npm ci
 
 COPY . .
+
+ARG BASE_PATH=/
+ENV BASE_PATH=${BASE_PATH}
 RUN npm run build
 
 FROM nginx:alpine
 
+ARG BASE_PATH=/
+
 COPY --from=builder /app/dist /usr/share/nginx/html
 COPY nginx.conf /etc/nginx/conf.d/default.conf
 
+RUN sed -i "s|\${BASE_PATH}|${BASE_PATH}|g" /etc/nginx/conf.d/default.conf
+
 EXPOSE 80
 
 CMD ["nginx", "-g", "daemon off;"]

ui/nginx.conf

@@ -5,33 +5,12 @@ server {
     root /usr/share/nginx/html;
     index index.html;
 
-    location /api/ {
-        proxy_pass http://artifactapi:8000;
-        proxy_set_header Host $host;
-        proxy_set_header X-Real-IP $remote_addr;
-        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-        proxy_set_header X-Forwarded-Proto $scheme;
-        proxy_buffering off;
-    }
-
-    location /v2/ {
-        proxy_pass http://artifactapi:8000;
-        proxy_set_header Host $host;
-        proxy_set_header X-Real-IP $remote_addr;
-        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-        proxy_set_header X-Forwarded-Proto $scheme;
-        proxy_buffering off;
-    }
-
-    location /health {
-        proxy_pass http://artifactapi:8000;
-    }
-
-    location /metrics {
-        proxy_pass http://artifactapi:8000;
-    }
-
-    location / {
+    location ${BASE_PATH}/ {
+        rewrite ^${BASE_PATH}(/.*)$ $1 break;
         try_files $uri $uri/ /index.html;
     }
+
+    location = ${BASE_PATH} {
+        return 301 ${BASE_PATH}/;
+    }
 }

ui/src/App.tsx

@@ -2,6 +2,8 @@ import { Routes, Route, NavLink } from 'react-router-dom';
 import { Dashboard } from './pages/Dashboard';
 import { Remotes } from './pages/Remotes';
 import { RemoteDetail } from './pages/RemoteDetail';
+import { Locals } from './pages/Locals';
+import { LocalDetail } from './pages/LocalDetail';
 import { Virtuals } from './pages/Virtuals';
 import { Objects } from './pages/Objects';
 import { Probe } from './pages/Probe';
@@ -18,6 +20,7 @@ export function App() {
         <div className="sidebar-nav">
           <NavLink to="/" end>Dashboard</NavLink>
           <NavLink to="/remotes">Remotes</NavLink>
+          <NavLink to="/locals">Locals</NavLink>
           <NavLink to="/virtuals">Virtuals</NavLink>
           <NavLink to="/probe">Test Remote</NavLink>
         </div>
@@ -31,6 +34,9 @@ export function App() {
           <Route path="/remotes" element={<Remotes />} />
           <Route path="/remotes/:name" element={<RemoteDetail />} />
           <Route path="/remotes/:name/objects" element={<Objects />} />
+          <Route path="/locals" element={<Locals />} />
+          <Route path="/locals/:name" element={<LocalDetail />} />
+          <Route path="/locals/:name/objects" element={<Objects />} />
           <Route path="/virtuals" element={<Virtuals />} />
           <Route path="/probe" element={<Probe />} />
         </Routes>

ui/src/main.tsx

@@ -4,9 +4,13 @@ import { BrowserRouter } from 'react-router-dom';
 import { App } from './App';
 import './index.css';
 
+declare const __BASE_PATH__: string;
+
+const basename = __BASE_PATH__.replace(/\/+$/, '') || '/';
+
 createRoot(document.getElementById('root')!).render(
   <StrictMode>
-    <BrowserRouter>
+    <BrowserRouter basename={basename}>
       <App />
     </BrowserRouter>
   </StrictMode>,

ui/src/pages/Dashboard.tsx

@@ -50,6 +50,11 @@ export function Dashboard() {
           value={formatNumber(stats.total_blobs_deduped)}
           sub="shared blobs"
         />
+        <StatsCard
+          label="Bandwidth Saved"
+          value={formatBytes(stats.bandwidth_saved_30d)}
+          sub="last 30 days"
+        />
       </div>
 
       {health && (

ui/src/pages/LocalDetail.tsx

@@ -0,0 +1,46 @@
+import { useEffect, useState } from 'react';
+import { useParams, Link } from 'react-router-dom';
+import { api } from '../api/client';
+import type { Remote } from '../api/types';
+import { Badge } from '../components/Badge';
+import './RemoteDetail.css';
+
+export function LocalDetail() {
+  const { name } = useParams<{ name: string }>();
+  const [remote, setRemote] = useState<Remote | null>(null);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (!name) return;
+    api.getRemote(name)
+      .then(setRemote)
+      .catch(e => setError(e.message));
+  }, [name]);
+
+  if (error) return <div className="error-banner">{error}</div>;
+  if (!remote) return <div className="loading">Loading...</div>;
+
+  return (
+    <div>
+      <div className="detail-header">
+        <Link to="/locals" className="back-link">&larr; Locals</Link>
+        <h1 className="page-title">{remote.name}</h1>
+        <div className="detail-badges">
+          <Badge variant="blue">{remote.package_type}</Badge>
+          <Badge variant="default">local</Badge>
+          {remote.managed_by && <Badge variant="green">managed by {remote.managed_by}</Badge>}
+        </div>
+      </div>
+
+      {remote.description && (
+        <p className="detail-description">{remote.description}</p>
+      )}
+
+      <div className="detail-actions">
+        <Link to={`/locals/${remote.name}/objects`} className="btn btn-primary">
+          Browse Files
+        </Link>
+      </div>
+    </div>
+  );
+}

ui/src/pages/Locals.tsx

@@ -0,0 +1,93 @@
+import { useEffect, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { api } from '../api/client';
+import type { Remote } from '../api/types';
+import { Badge } from '../components/Badge';
+import { DataTable } from '../components/DataTable';
+import './Remotes.css';
+
+const typeColors: Record<string, 'blue' | 'green' | 'yellow' | 'red' | 'default'> = {
+  docker: 'blue',
+  helm: 'green',
+  rpm: 'yellow',
+  pypi: 'blue',
+  npm: 'red',
+  generic: 'default',
+  alpine: 'green',
+  puppet: 'yellow',
+  terraform: 'blue',
+  goproxy: 'green',
+};
+
+export function Locals() {
+  const navigate = useNavigate();
+  const [remotes, setRemotes] = useState<Remote[]>([]);
+  const [filter, setFilter] = useState('');
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    api.listRemotes()
+      .then(r => setRemotes((r || []).filter(x => x.repo_type === 'local')))
+      .finally(() => setLoading(false));
+  }, []);
+
+  const filtered = remotes.filter(r => {
+    if (filter && !r.name.toLowerCase().includes(filter.toLowerCase())) return false;
+    return true;
+  });
+
+  return (
+    <div>
+      <h1 className="page-title">Local Repositories</h1>
+
+      <div className="remotes-toolbar">
+        <input
+          className="search-input"
+          placeholder="Filter by name..."
+          value={filter}
+          onChange={e => setFilter(e.target.value)}
+        />
+        <span className="result-count">{filtered.length} locals</span>
+      </div>
+
+      {loading ? (
+        <div className="loading">Loading...</div>
+      ) : (
+        <DataTable
+          columns={[
+            {
+              key: 'name',
+              header: 'Name',
+              render: (r: Remote) => <span className="mono">{r.name}</span>,
+            },
+            {
+              key: 'type',
+              header: 'Type',
+              render: (r: Remote) => (
+                <Badge variant={typeColors[r.package_type] || 'default'}>
+                  {r.package_type}
+                </Badge>
+              ),
+              width: '110px',
+            },
+            {
+              key: 'description',
+              header: 'Description',
+              render: (r: Remote) => r.description || <span className="text-muted">—</span>,
+            },
+            {
+              key: 'managed',
+              header: 'Managed',
+              render: (r: Remote) =>
+                r.managed_by ? <Badge variant="blue">{r.managed_by}</Badge> : <span className="text-muted">—</span>,
+              width: '100px',
+            },
+          ]}
+          data={filtered}
+          emptyMessage="No local repositories configured"
+          onRowClick={(r) => navigate(`/locals/${r.name}`)}
+        />
+      )}
+    </div>
+  );
+}

ui/src/pages/Objects.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState, useCallback, useMemo } from 'react';
-import { useParams, Link } from 'react-router-dom';
+import { useParams, useLocation, Link } from 'react-router-dom';
 import { api } from '../api/client';
 import type { Artifact } from '../api/types';
 import { formatBytes, timeAgo, truncateHash } from '../components/format';
@@ -171,6 +171,9 @@ function TreeRow({ node, depth, expanded, onToggle, onEvict }: TreeRowProps) {
 
 export function Objects() {
   const { name } = useParams<{ name: string }>();
+  const location = useLocation();
+  const isLocal = location.pathname.startsWith('/locals/');
+  const backLink = isLocal ? `/locals/${name}` : `/remotes/${name}`;
   const [artifacts, setArtifacts] = useState<Artifact[]>([]);
   const [loading, setLoading] = useState(true);
   const [filter, setFilter] = useState('');
@@ -233,7 +236,7 @@ export function Objects() {
   return (
     <div>
       <div className="detail-header">
-        <Link to={`/remotes/${name}`} className="back-link">&larr; {name}</Link>
+        <Link to={backLink} className="back-link">&larr; {name}</Link>
         <h1 className="page-title">Cached Objects</h1>
       </div>
 

ui/src/pages/Remotes.tsx

@@ -32,9 +32,10 @@ export function Remotes() {
       .finally(() => setLoading(false));
   }, []);
 
-  const types = [...new Set(remotes.map(r => r.package_type))].sort();
+  const remoteOnly = remotes.filter(r => r.repo_type !== 'local');
+  const types = [...new Set(remoteOnly.map(r => r.package_type))].sort();
 
-  const filtered = remotes.filter(r => {
+  const filtered = remoteOnly.filter(r => {
     if (typeFilter && r.package_type !== typeFilter) return false;
     if (filter && !r.name.toLowerCase().includes(filter.toLowerCase())) return false;
     return true;

ui/src/pages/Virtuals.tsx

@@ -1,21 +1,38 @@
 import { useEffect, useState } from 'react';
+import { Link } from 'react-router-dom';
 import { api } from '../api/client';
-import type { Virtual } from '../api/types';
+import type { Remote, Virtual } from '../api/types';
 import { Badge } from '../components/Badge';
 import { DataTable } from '../components/DataTable';
 import './Virtuals.css';
 
 export function Virtuals() {
   const [virtuals, setVirtuals] = useState<Virtual[]>([]);
+  const [remoteMap, setRemoteMap] = useState<Record<string, Remote>>({});
   const [loading, setLoading] = useState(true);
   const [expanded, setExpanded] = useState<string | null>(null);
 
   useEffect(() => {
-    api.listVirtuals()
-      .then(v => setVirtuals(v || []))
+    Promise.all([api.listVirtuals(), api.listRemotes()])
+      .then(([v, r]) => {
+        setVirtuals(v || []);
+        const map: Record<string, Remote> = {};
+        for (const remote of r || []) {
+          map[remote.name] = remote;
+        }
+        setRemoteMap(map);
+      })
       .finally(() => setLoading(false));
   }, []);
 
+  function memberLink(name: string) {
+    const remote = remoteMap[name];
+    if (remote?.repo_type === 'local') {
+      return `/locals/${name}`;
+    }
+    return `/remotes/${name}`;
+  }
+
   return (
     <div>
       <h1 className="page-title">Virtual Repositories</h1>
@@ -40,7 +57,7 @@ export function Virtuals() {
               key: 'members',
               header: 'Members',
               render: (v: Virtual) => (
-                <span className="member-count">{v.members?.length || 0} remotes</span>
+                <span className="member-count">{v.members?.length || 0} repos</span>
               ),
               width: '110px',
             },
@@ -69,12 +86,17 @@ export function Virtuals() {
           <ul className="member-list">
             {virtuals
               .find(v => v.name === expanded)
-              ?.members?.map((m, i) => (
-                <li key={m}>
-                  <span className="member-priority">{i + 1}</span>
-                  <a href={`/remotes/${m}`} className="mono">{m}</a>
-                </li>
-              ))}
+              ?.members?.map((m, i) => {
+                const remote = remoteMap[m];
+                const typeLabel = remote?.repo_type === 'local' ? 'local' : 'remote';
+                return (
+                  <li key={m}>
+                    <span className="member-priority">{i + 1}</span>
+                    <Link to={memberLink(m)} className="mono">{m}</Link>
+                    <Badge variant={typeLabel === 'local' ? 'yellow' : 'default'}>{typeLabel}</Badge>
+                  </li>
+                );
+              })}
           </ul>
         </div>
       )}

ui/vite.config.ts

@@ -1,7 +1,10 @@
 import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 
+const basePath = process.env.BASE_PATH || '/'
+
 export default defineConfig({
+  base: basePath,
   plugins: [react()],
   server: {
     proxy: {
@@ -11,4 +14,7 @@ export default defineConfig({
       '/metrics': 'http://localhost:8000',
     },
   },
+  define: {
+    '__BASE_PATH__': JSON.stringify(basePath),
+  },
 })