Claude API × Electron: Production Desktop AI Apps — Secure Key Storage, Streaming, Auto-Updates, and Monetization

// src/main/keyManager.ts
import keytar from 'keytar'
 
const SERVICE_NAME = 'Claude Desktop AI'
const ACCOUNT_NAME = 'anthropic-api-key'
 
export const keyManager = {
  async saveApiKey(apiKey: string): Promise<void> {
    await keytar.setPassword(SERVICE_NAME, ACCOUNT_NAME, apiKey)
  },
 
  async getApiKey(): Promise<string | null> {
    return await keytar.getPassword(SERVICE_NAME, ACCOUNT_NAME)
  },
 
  async deleteApiKey(): Promise<void> {
    await keytar.deletePassword(SERVICE_NAME, ACCOUNT_NAME)
  },
 
  async hasApiKey(): Promise<boolean> {
    const key = await keytar.getPassword(SERVICE_NAME, ACCOUNT_NAME)
    return key !== null && key.length > 0
  }
}

// src/main/ipcHandlers.ts
import { ipcMain } from 'electron'
import { keyManager } from './keyManager'
import { claudeService } from './claudeService'
 
export function registerIpcHandlers(): void {
  ipcMain.handle('api-key:save', async (_, apiKey: string) => {
    await keyManager.saveApiKey(apiKey)
    await claudeService.initialize(apiKey)
    return { success: true }
  })
 
  ipcMain.handle('api-key:check', async () => {
    return { hasKey: await keyManager.hasApiKey() }
  })
 
  ipcMain.handle('api-key:delete', async () => {
    await keyManager.deleteApiKey()
    claudeService.reset()
    return { success: true }
  })
}

// src/preload/index.ts
import { contextBridge, ipcRenderer } from 'electron'
 
// Expose a typed, minimal API surface to the Renderer
contextBridge.exposeInMainWorld('electronAPI', {
  saveApiKey: (apiKey: string) =>
    ipcRenderer.invoke('api-key:save', apiKey),
  checkApiKey: () =>
    ipcRenderer.invoke('api-key:check'),
  deleteApiKey: () =>
    ipcRenderer.invoke('api-key:delete'),
  sendMessage: (params: MessageParams) =>
    ipcRenderer.invoke('claude:message', params),
  onStreamChunk: (callback: (chunk: string) => void) => {
    const handler = (_: unknown, chunk: string) => callback(chunk)
    ipcRenderer.on('stream:chunk', handler)
    return () => ipcRenderer.removeListener('stream:chunk', handler)
  },
  onStreamEnd: (callback: () => void) => {
    ipcRenderer.once('stream:end', callback)
  },
  onStreamError: (callback: (error: string) => void) => {
    ipcRenderer.once('stream:error', (_, error) => callback(error))
  }
})

// src/main/claudeService.ts
import Anthropic from '@anthropic-ai/sdk'
import { BrowserWindow } from 'electron'
 
interface MessageParams {
  messages: Array<{
    role: 'user' | 'assistant'
    content: string
  }>
  model?: string
  maxTokens?: number
}
 
class ClaudeService {
  private client: Anthropic | null = null
 
  async initialize(apiKey: string): Promise<void> {
    this.client = new Anthropic({ apiKey })
    // Lightweight validation request
    await this.client.messages.create({
      model: 'claude-haiku-4-5-20251001',
      max_tokens: 10,
      messages: [{ role: 'user', content: 'ping' }]
    })
  }
 
  reset(): void {
    this.client = null
  }
 
  async streamMessage(
    params: MessageParams,
    webContents: Electron.WebContents
  ): Promise<void> {
    if (!this.client) {
      webContents.send('stream:error', 'API key not configured')
      return
    }
 
    const model = params.model ?? 'claude-sonnet-4-6'
 
    try {
      const stream = await this.client.messages.stream({
        model,
        max_tokens: params.maxTokens ?? 4096,
        messages: params.messages
      })
 
      for await (const event of stream) {
        if (
          event.type === 'content_block_delta' &&
          event.delta.type === 'text_delta'
        ) {
          webContents.send('stream:chunk', event.delta.text)
        }
      }
 
      webContents.send('stream:end')
    } catch (error) {
      const message =
        error instanceof Anthropic.APIError
          ? `API Error ${error.status}: ${error.message}`
          : String(error)
      webContents.send('stream:error', message)
    }
  }
}
 
export const claudeService = new ClaudeService()

// src/renderer/hooks/useClaudeStream.ts
import { useState, useCallback, useRef } from 'react'
 
export function useClaudeStream() {
  const [response, setResponse] = useState('')
  const [isStreaming, setIsStreaming] = useState(false)
  const [error, setError] = useState<string | null>(null)
  const cleanupRef = useRef<(() => void) | null>(null)
 
  const sendMessage = useCallback(async (messages: Message[]) => {
    setResponse('')
    setIsStreaming(true)
    setError(null)
 
    cleanupRef.current?.()
 
    cleanupRef.current = window.electronAPI.onStreamChunk((chunk) => {
      setResponse(prev => prev + chunk)
    })
 
    window.electronAPI.onStreamEnd(() => {
      setIsStreaming(false)
      cleanupRef.current?.()
    })
 
    window.electronAPI.onStreamError((err) => {
      setError(err)
      setIsStreaming(false)
      cleanupRef.current?.()
    })
 
    await window.electronAPI.sendMessage({ messages })
  }, [])
 
  return { response, isStreaming, error, sendMessage }
}

// src/main/networkMonitor.ts
import { net } from 'electron'
 
export class NetworkMonitor {
  private listeners: Set<(online: boolean) => void> = new Set()
  private _isOnline: boolean = true
 
  constructor() {
    setInterval(() => {
      const wasOnline = this._isOnline
      this._isOnline = net.isOnline()
      if (wasOnline !== this._isOnline) {
        this.listeners.forEach(fn => fn(this._isOnline))
      }
    }, 30_000)
  }
 
  get isOnline(): boolean {
    return this._isOnline
  }
 
  onChange(callback: (online: boolean) => void): () => void {
    this.listeners.add(callback)
    return () => this.listeners.delete(callback)
  }
}
 
export const networkMonitor = new NetworkMonitor()

// src/main/retryUtils.ts
interface RetryOptions {
  maxAttempts: number
  baseDelayMs: number
  maxDelayMs: number
}
 
export async function withRetry<T>(
  fn: () => Promise<T>,
  options: RetryOptions = {
    maxAttempts: 3,
    baseDelayMs: 1000,
    maxDelayMs: 10000
  }
): Promise<T> {
  let lastError: Error
 
  for (let attempt = 1; attempt <= options.maxAttempts; attempt++) {
    try {
      return await fn()
    } catch (error) {
      lastError = error as Error
 
      // Rate limit: retry with backoff
      if (error instanceof Anthropic.RateLimitError) {
        const delay = Math.min(
          options.baseDelayMs * 2 ** (attempt - 1),
          options.maxDelayMs
        )
        await new Promise(resolve => setTimeout(resolve, delay))
        continue
      }
 
      // Non-rate-limit 4xx: fail immediately
      if (error instanceof Anthropic.APIError && error.status < 500) {
        throw error
      }
 
      // 5xx: retry
      if (attempt < options.maxAttempts) {
        const delay = Math.min(
          options.baseDelayMs * 2 ** (attempt - 1),
          options.maxDelayMs
        )
        await new Promise(resolve => setTimeout(resolve, delay))
      }
    }
  }
 
  throw lastError!
}

// src/main/updater.ts
import { autoUpdater } from 'electron-updater'
import { BrowserWindow, ipcMain } from 'electron'
import log from 'electron-log'
 
autoUpdater.logger = log
autoUpdater.autoDownload = false       // Ask user before downloading
autoUpdater.autoInstallOnAppQuit = true
 
export function initUpdater(mainWindow: BrowserWindow): void {
  // Check on launch (after 3s delay)
  setTimeout(() => {
    autoUpdater.checkForUpdates().catch(log.error)
  }, 3000)
 
  // Check every hour
  setInterval(() => {
    autoUpdater.checkForUpdates().catch(log.error)
  }, 60 * 60 * 1000)
 
  autoUpdater.on('update-available', (info) => {
    mainWindow.webContents.send('update:available', {
      version: info.version,
      releaseNotes: info.releaseNotes
    })
  })
 
  autoUpdater.on('download-progress', (progress) => {
    mainWindow.webContents.send('update:progress', {
      percent: Math.round(progress.percent)
    })
  })
 
  autoUpdater.on('update-downloaded', () => {
    mainWindow.webContents.send('update:ready')
  })
 
  autoUpdater.on('error', (error) => {
    log.error('Auto update error:', error)
  })
 
  ipcMain.handle('update:download', async () => {
    await autoUpdater.downloadUpdate()
  })
 
  ipcMain.handle('update:install', () => {
    autoUpdater.quitAndInstall()
  })
}

// src/main/licenseManager.ts
import Store from 'electron-store'
 
interface LicenseData {
  licenseKey: string
  email: string
  expiresAt: string | null  // null = lifetime
  plan: 'trial' | 'monthly' | 'lifetime'
}
 
class LicenseManager {
  private store: Store<{ license?: LicenseData }>
  private readonly LEMON_SQUEEZY_API = 'https://api.lemonsqueezy.com/v1'
 
  constructor() {
    this.store = new Store({ name: 'license' })
  }
 
  async activate(licenseKey: string, email: string): Promise<boolean> {
    try {
      const response = await fetch(
        `${this.LEMON_SQUEEZY_API}/licenses/activate`,
        {
          method: 'POST',
          headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
          },
          body: JSON.stringify({
            license_key: licenseKey,
            instance_name: `${email}-${process.platform}`
          })
        }
      )
 
      if (!response.ok) return false
 
      const data = await response.json()
      this.store.set('license', {
        licenseKey,
        email,
        expiresAt: data.license_key.expires_at,
        plan: this.detectPlan(data)
      })
 
      return true
    } catch {
      return false
    }
  }
 
  async validate(): Promise<boolean> {
    const license = this.store.get('license')
    if (!license) return false
 
    if (license.plan === 'lifetime') return true
 
    if (license.expiresAt) {
      const expiresAt = new Date(license.expiresAt)
      if (expiresAt < new Date()) {
        return await this.revalidateWithServer(license.licenseKey)
      }
    }
 
    return true
  }
 
  private detectPlan(data: Record<string, unknown>): LicenseData['plan'] {
    const variantId = (data as Record<string, Record<string, string>>)
      .license_key?.variant_id
    if (variantId === 'YOUR_LIFETIME_VARIANT_ID') return 'lifetime'
    if (variantId === 'YOUR_MONTHLY_VARIANT_ID') return 'monthly'
    return 'trial'
  }
 
  private async revalidateWithServer(key: string): Promise<boolean> {
    try {
      const response = await fetch(
        `${this.LEMON_SQUEEZY_API}/licenses/validate`,
        {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({ license_key: key })
        }
      )
      const data = await response.json()
      return data.valid === true
    } catch {
      // Offline: trust cached license (prioritize UX)
      return true
    }
  }
 
  isTrialActive(): boolean {
    const installDate = this.store.get('installDate' as never) as string | undefined
    if (!installDate) {
      this.store.set('installDate' as never, new Date().toISOString() as never)
      return true
    }
    const daysSinceInstall =
      (Date.now() - new Date(installDate).getTime()) / (1000 * 60 * 60 * 24)
    return daysSinceInstall <= 14
  }
}
 
export const licenseManager = new LicenseManager()

{
  "build": {
    "mac": {
      "hardenedRuntime": true,
      "gatekeeperAssess": false,
      "entitlements": "build/entitlements.mac.plist",
      "notarize": {
        "teamId": "YOUR_TEAM_ID"
      }
    }
  }
}

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN"
  "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <key>com.apple.security.cs.allow-jit</key>
  <true/>
  <key>com.apple.security.cs.allow-unsigned-executable-memory</key>
  <true/>
  <key>com.apple.security.network.client</key>
  <true/>
  <key>com.apple.security.cs.allow-dyld-environment-variables</key>
  <true/>
</dict>
</plist>

# .github/workflows/release.yml
name: Release
 
on:
  push:
    tags:
      - 'v*'
 
jobs:
  release:
    strategy:
      matrix:
        os: [macos-latest, windows-latest]
    runs-on: ${{ matrix.os }}
 
    steps:
      - uses: actions/checkout@v4
 
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '22'
          cache: 'npm'
 
      - run: npm ci
 
      - name: Build & Release
        env:
          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          APPLE_ID: ${{ secrets.APPLE_ID }}
          APPLE_APP_SPECIFIC_PASSWORD: ${{ secrets.APPLE_APP_SPECIFIC_PASSWORD }}
          APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
          CSC_LINK: ${{ secrets.CSC_LINK }}
          CSC_KEY_PASSWORD: ${{ secrets.CSC_KEY_PASSWORD }}
        run: npm run release

const mainWindow = new BrowserWindow({
  webPreferences: {
    nodeIntegration: false,      // Never enable in production
    contextIsolation: true,      // Required for security
    preload: path.join(__dirname, '../preload/index.js'),
    sandbox: true
  }
})
 
// Open external links in the default browser
mainWindow.webContents.setWindowOpenHandler(({ url }) => {
  shell.openExternal(url)
  return { action: 'deny' }
})

mainWindow.webContents.session.webRequest.onHeadersReceived(
  (details, callback) => {
    callback({
      responseHeaders: {
        ...details.responseHeaders,
        'Content-Security-Policy': [
          "default-src 'self';" +
          "script-src 'self';" +
          "style-src 'self' 'unsafe-inline';" +
          "connect-src 'self' https://api.anthropic.com https://api.lemonsqueezy.com;"
        ]
      }
    })
  }
)