Add version update notifications and server version display

[AbianS]

Summary

Add version checking and update notifications to webview-ui, including:

1. Display current server version connected to
2. Notify when new UI version is available
3. Notify when new server version is available

Motivation

Self-hosted users may not know when updates are available for Rustrak. Proactive notifications help users:

• Stay current with security patches
• Access new features
• Identify version mismatches between UI and server

Proposed Solution

1. Server Version Endpoint

Add a version endpoint to the server:

apps/server/src/routes/health.rs:

#[derive(Serialize)]
pub struct VersionResponse {
    version: &'static str,
    commit: Option<&'static str>,
}

pub async fn version() -> HttpResponse {
    HttpResponse::Ok().json(VersionResponse {
        version: env!("CARGO_PKG_VERSION"),
        commit: option_env!("GIT_COMMIT"),
    })
}

Route: GET /version (no auth required)

2. Update Check Service

Create a service that checks for updates against GitHub releases:

apps/webview-ui/src/lib/version-check.ts:

interface VersionInfo {
  ui: {
    current: string;
    latest: string;
    updateAvailable: boolean;
  };
  server: {
    current: string;
    latest: string;
    updateAvailable: boolean;
  };
}

export async function checkForUpdates(): Promise<VersionInfo> {
  // Fetch latest from GitHub API
  const releases = await fetch(
    'https://api.github.com/repos/AbianS/rustrak/releases/latest'
  );
  // Compare with current versions
}

3. UI Components

About Page Enhancement

Update apps/webview-ui/src/app/(main)/settings/about/page.tsx:

<Card>
  <CardHeader>
    <CardTitle>Versions</CardTitle>
  </CardHeader>
  <CardContent>
    <div className="grid grid-cols-2 gap-4 text-sm">
      <div>
        <p className="text-muted-foreground">UI Version</p>
        <div className="flex items-center gap-2">
          <p className="font-mono font-medium">{APP_VERSION}</p>
          {uiUpdateAvailable && (
            <Badge variant="outline" className="text-yellow-600">
              Update available
            </Badge>
          )}
        </div>
      </div>
      <div>
        <p className="text-muted-foreground">Server Version</p>
        <div className="flex items-center gap-2">
          <p className="font-mono font-medium">{serverVersion}</p>
          {serverUpdateAvailable && (
            <Badge variant="outline" className="text-yellow-600">
              Update available
            </Badge>
          )}
        </div>
      </div>
    </div>
  </CardContent>
</Card>

Header Notification Banner

Show a dismissible banner when updates are available:

{updateAvailable && (
  <div className="bg-yellow-500/10 border-b border-yellow-500/20 px-4 py-2 text-sm text-yellow-600">
    <span>A new version of Rustrak is available!</span>
    <a href="..." className="ml-2 underline">View release notes</a>
    <button onClick={dismiss} className="ml-2">×</button>
  </div>
)}

4. Server Action

apps/webview-ui/src/actions/version.ts:

'use server';

export async function getServerVersion(): Promise<string | null> {
  try {
    const client = await createClient();
    const response = await fetch(`${process.env.RUSTRAK_API_URL}/version`);
    return response.json();
  } catch {
    return null;
  }
}

Files to Create/Update

Server:

• apps/server/src/routes/health.rs - Add /version endpoint
• apps/server/src/routes/mod.rs - Register route

WebView UI:

• apps/webview-ui/src/lib/version-check.ts - Version checking logic
• apps/webview-ui/src/actions/version.ts - Server action
• apps/webview-ui/src/app/(main)/settings/about/page.tsx - Enhanced about page
• apps/webview-ui/src/app/(main)/header.tsx - Optional notification banner
• apps/webview-ui/src/components/update-banner.tsx - Dismissible banner component

Considerations

• Rate limiting: Cache GitHub API responses (releases don't change often)
• Offline: Gracefully handle when GitHub API is unreachable
• Dismissible: Users should be able to dismiss notifications
• localStorage: Remember dismissed versions to avoid re-showing
• Semantic versioning: Use proper semver comparison

Additional Context

Current version infrastructure:

• UI version: apps/webview-ui/src/lib/constants.ts reads from package.json
• About page: apps/webview-ui/src/app/(main)/settings/about/page.tsx
• Health endpoints: apps/server/src/routes/health.rs (no version info yet)