@thevinci/web 1.0.0

package/server/lib/opencode/project-icon-routes.js

@@ -0,0 +1,399 @@
+export const registerProjectIconRoutes = (app, dependencies) => {
+  const {
+    fsPromises,
+    path,
+    crypto,
+    vinciDataDir,
+    sanitizeProjects,
+    readSettingsFromDiskMigrated,
+    persistSettings,
+    createFsSearchRuntime,
+    spawn,
+    resolveGitBinaryForSpawn,
+  } = dependencies;
+
+  const projectIconsDirPath = path.join(vinciDataDir, 'project-icons');
+  const projectIconMimeToExtension = {
+    'image/png': 'png',
+    'image/jpeg': 'jpg',
+    'image/svg+xml': 'svg',
+    'image/webp': 'webp',
+    'image/x-icon': 'ico',
+  };
+  const projectIconExtensionToMime = Object.fromEntries(
+    Object.entries(projectIconMimeToExtension).map(([mime, ext]) => [ext, mime])
+  );
+  const projectIconSupportedMimes = new Set(Object.keys(projectIconMimeToExtension));
+  const projectIconMaxBytes = 5 * 1024 * 1024;
+  const projectIconThemeColors = {
+    light: '#111111',
+    dark: '#f5f5f5',
+  };
+  const projectIconHexColorPattern = /^#(?:[\da-fA-F]{3}|[\da-fA-F]{4}|[\da-fA-F]{6}|[\da-fA-F]{8})$/;
+
+  const normalizeProjectIconMime = (value) => {
+    if (typeof value !== 'string') {
+      return null;
+    }
+
+    const normalized = value.trim().toLowerCase();
+    if (normalized === 'image/jpg') {
+      return 'image/jpeg';
+    }
+    if (projectIconSupportedMimes.has(normalized)) {
+      return normalized;
+    }
+    return null;
+  };
+
+  const projectIconBaseName = (projectId) => {
+    const hash = crypto.createHash('sha1').update(projectId).digest('hex');
+    return `project-${hash}`;
+  };
+
+  const projectIconPathForMime = (projectId, mime) => {
+    const normalizedMime = normalizeProjectIconMime(mime);
+    if (!normalizedMime) {
+      return null;
+    }
+    const ext = projectIconMimeToExtension[normalizedMime];
+    return path.join(projectIconsDirPath, `${projectIconBaseName(projectId)}.${ext}`);
+  };
+
+  const projectIconPathCandidates = (projectId) => {
+    const base = projectIconBaseName(projectId);
+    return Object.values(projectIconMimeToExtension).map((ext) => path.join(projectIconsDirPath, `${base}.${ext}`));
+  };
+
+  const removeProjectIconFiles = async (projectId, keepPath) => {
+    const candidates = projectIconPathCandidates(projectId);
+    await Promise.all(candidates.map(async (candidatePath) => {
+      if (keepPath && candidatePath === keepPath) {
+        return;
+      }
+      try {
+        await fsPromises.unlink(candidatePath);
+      } catch (error) {
+        if (!error || typeof error !== 'object' || error.code !== 'ENOENT') {
+          throw error;
+        }
+      }
+    }));
+  };
+
+  const parseProjectIconDataUrl = (value) => {
+    if (typeof value !== 'string') {
+      return { ok: false, error: 'dataUrl is required' };
+    }
+
+    const trimmed = value.trim();
+    const match = trimmed.match(/^data:([^;,]+);base64,([A-Za-z0-9+/=\s]+)$/i);
+    if (!match) {
+      return { ok: false, error: 'Invalid dataUrl format' };
+    }
+
+    const mime = normalizeProjectIconMime(match[1]);
+    if (!mime || !['image/png', 'image/jpeg', 'image/svg+xml'].includes(mime)) {
+      return { ok: false, error: 'Icon must be PNG, JPEG, or SVG' };
+    }
+
+    try {
+      const base64 = match[2].replace(/\s+/g, '');
+      const bytes = Buffer.from(base64, 'base64');
+      if (bytes.length === 0) {
+        return { ok: false, error: 'Icon content is empty' };
+      }
+      if (bytes.length > projectIconMaxBytes) {
+        return { ok: false, error: 'Icon exceeds size limit (5 MB)' };
+      }
+      return { ok: true, mime, bytes };
+    } catch {
+      return { ok: false, error: 'Failed to decode icon data' };
+    }
+  };
+
+  const normalizeProjectIconThemeVariant = (value) => {
+    if (typeof value !== 'string') {
+      return null;
+    }
+
+    const normalized = value.trim().toLowerCase();
+    if (normalized === 'light' || normalized === 'dark') {
+      return normalized;
+    }
+    return null;
+  };
+
+  const normalizeProjectIconColor = (value) => {
+    if (typeof value !== 'string') {
+      return null;
+    }
+
+    const normalized = value.trim();
+    if (!projectIconHexColorPattern.test(normalized)) {
+      return null;
+    }
+    return normalized;
+  };
+
+  const applyProjectIconSvgTheme = (svgMarkup, themeVariant, iconColor) => {
+    if (typeof svgMarkup !== 'string') {
+      return svgMarkup;
+    }
+
+    const color = iconColor || projectIconThemeColors[themeVariant];
+    if (!color) {
+      return svgMarkup;
+    }
+
+    const svgTagIndex = svgMarkup.search(/<svg\b/i);
+    if (svgTagIndex === -1) {
+      return svgMarkup;
+    }
+
+    const svgOpenTagEndIndex = svgMarkup.indexOf('>', svgTagIndex);
+    if (svgOpenTagEndIndex === -1) {
+      return svgMarkup;
+    }
+
+    const overrideStyle = `<style data-vinci-theme-icon="1">:root{color:${color}!important;}</style>`;
+    return `${svgMarkup.slice(0, svgOpenTagEndIndex + 1)}${overrideStyle}${svgMarkup.slice(svgOpenTagEndIndex + 1)}`;
+  };
+
+  const findProjectById = (settings, projectId) => {
+    const projects = sanitizeProjects(settings?.projects) || [];
+    const index = projects.findIndex((project) => project.id === projectId);
+    if (index === -1) {
+      return { projects, index: -1, project: null };
+    }
+    return { projects, index, project: projects[index] };
+  };
+
+  const fsSearchRuntime = createFsSearchRuntime({
+    fsPromises,
+    path,
+    spawn,
+    resolveGitBinaryForSpawn,
+  });
+
+  app.get('/api/projects/:projectId/icon', async (req, res) => {
+    const projectId = typeof req.params.projectId === 'string' ? req.params.projectId.trim() : '';
+    if (!projectId) {
+      return res.status(400).json({ error: 'projectId is required' });
+    }
+
+    try {
+      const settings = await readSettingsFromDiskMigrated();
+      const { project } = findProjectById(settings, projectId);
+      if (!project) {
+        return res.status(404).json({ error: 'Project not found' });
+      }
+
+      const metadataMime = normalizeProjectIconMime(project.iconImage?.mime);
+      const preferredPath = metadataMime ? projectIconPathForMime(projectId, metadataMime) : null;
+      const candidates = preferredPath
+        ? [preferredPath, ...projectIconPathCandidates(projectId).filter((candidate) => candidate !== preferredPath)]
+        : projectIconPathCandidates(projectId);
+
+      const themeQuery = Array.isArray(req.query?.theme) ? req.query.theme[0] : req.query?.theme;
+      const requestedThemeVariant = normalizeProjectIconThemeVariant(themeQuery);
+      const iconColorQuery = Array.isArray(req.query?.iconColor) ? req.query.iconColor[0] : req.query?.iconColor;
+      const requestedIconColor = normalizeProjectIconColor(iconColorQuery);
+
+      for (const iconPath of candidates) {
+        try {
+          const data = await fsPromises.readFile(iconPath);
+          const ext = path.extname(iconPath).slice(1).toLowerCase();
+          const resolvedMime = iconPath === preferredPath && metadataMime
+            ? metadataMime
+            : projectIconExtensionToMime[ext] || 'application/octet-stream';
+          const contentType = resolvedMime === 'image/svg+xml' ? 'image/svg+xml; charset=utf-8' : resolvedMime;
+
+          if (resolvedMime === 'image/svg+xml' && requestedThemeVariant) {
+            const svgMarkup = data.toString('utf8');
+            const themedSvgMarkup = applyProjectIconSvgTheme(svgMarkup, requestedThemeVariant, requestedIconColor);
+            res.setHeader('Content-Type', contentType);
+            res.setHeader('Cache-Control', 'public, max-age=31536000, immutable');
+            return res.send(themedSvgMarkup);
+          }
+
+          if (resolvedMime === 'image/svg+xml' && requestedIconColor) {
+            const svgMarkup = data.toString('utf8');
+            const themedSvgMarkup = applyProjectIconSvgTheme(svgMarkup, requestedThemeVariant, requestedIconColor);
+            res.setHeader('Content-Type', contentType);
+            res.setHeader('Cache-Control', 'public, max-age=31536000, immutable');
+            return res.send(themedSvgMarkup);
+          }
+
+          res.setHeader('Content-Type', contentType);
+          res.setHeader('Cache-Control', 'public, max-age=31536000, immutable');
+          return res.send(data);
+        } catch (error) {
+          if (!error || typeof error !== 'object' || error.code !== 'ENOENT') {
+            console.warn('Failed to read project icon:', error);
+            return res.status(500).json({ error: 'Failed to read project icon' });
+          }
+        }
+      }
+
+      return res.status(404).json({ error: 'Project icon not found' });
+    } catch (error) {
+      console.warn('Failed to load project icon:', error);
+      return res.status(500).json({ error: 'Failed to load project icon' });
+    }
+  });
+
+  app.put('/api/projects/:projectId/icon', async (req, res) => {
+    const projectId = typeof req.params.projectId === 'string' ? req.params.projectId.trim() : '';
+    if (!projectId) {
+      return res.status(400).json({ error: 'projectId is required' });
+    }
+
+    const parsed = parseProjectIconDataUrl(req.body?.dataUrl);
+    if (!parsed.ok) {
+      return res.status(400).json({ error: parsed.error });
+    }
+
+    try {
+      const settings = await readSettingsFromDiskMigrated();
+      const { projects, project } = findProjectById(settings, projectId);
+      if (!project) {
+        return res.status(404).json({ error: 'Project not found' });
+      }
+
+      const iconPath = projectIconPathForMime(projectId, parsed.mime);
+      if (!iconPath) {
+        return res.status(400).json({ error: 'Unsupported icon format' });
+      }
+
+      await fsPromises.mkdir(projectIconsDirPath, { recursive: true });
+      await fsPromises.writeFile(iconPath, parsed.bytes);
+      await removeProjectIconFiles(projectId, iconPath);
+
+      const updatedAt = Date.now();
+      const nextProjects = projects.map((entry) => (
+        entry.id === projectId
+          ? { ...entry, iconImage: { mime: parsed.mime, updatedAt, source: 'custom' } }
+          : entry
+      ));
+      const updatedSettings = await persistSettings({ projects: nextProjects });
+      const updatedProject = (updatedSettings.projects || []).find((entry) => entry.id === projectId) || null;
+
+      return res.json({ project: updatedProject, settings: updatedSettings });
+    } catch (error) {
+      console.warn('Failed to upload project icon:', error);
+      return res.status(500).json({ error: 'Failed to upload project icon' });
+    }
+  });
+
+  app.delete('/api/projects/:projectId/icon', async (req, res) => {
+    const projectId = typeof req.params.projectId === 'string' ? req.params.projectId.trim() : '';
+    if (!projectId) {
+      return res.status(400).json({ error: 'projectId is required' });
+    }
+
+    try {
+      const settings = await readSettingsFromDiskMigrated();
+      const { projects, project } = findProjectById(settings, projectId);
+      if (!project) {
+        return res.status(404).json({ error: 'Project not found' });
+      }
+
+      await removeProjectIconFiles(projectId);
+
+      const nextProjects = projects.map((entry) => (
+        entry.id === projectId
+          ? { ...entry, iconImage: null }
+          : entry
+      ));
+      const updatedSettings = await persistSettings({ projects: nextProjects });
+      const updatedProject = (updatedSettings.projects || []).find((entry) => entry.id === projectId) || null;
+
+      return res.json({ project: updatedProject, settings: updatedSettings });
+    } catch (error) {
+      console.warn('Failed to remove project icon:', error);
+      return res.status(500).json({ error: 'Failed to remove project icon' });
+    }
+  });
+
+  app.post('/api/projects/:projectId/icon/discover', async (req, res) => {
+    const projectId = typeof req.params.projectId === 'string' ? req.params.projectId.trim() : '';
+    if (!projectId) {
+      return res.status(400).json({ error: 'projectId is required' });
+    }
+
+    try {
+      const settings = await readSettingsFromDiskMigrated();
+      const { projects, project } = findProjectById(settings, projectId);
+      if (!project) {
+        return res.status(404).json({ error: 'Project not found' });
+      }
+
+      const force = req.body?.force === true;
+      if (project.iconImage?.source === 'custom' && !force) {
+        return res.json({
+          project,
+          skipped: true,
+          reason: 'custom-icon-present',
+        });
+      }
+
+      const faviconCandidates = await fsSearchRuntime.searchFilesystemFiles(project.path, {
+        limit: 200,
+        query: 'favicon',
+        includeHidden: true,
+        respectGitignore: false,
+      });
+
+      const filtered = faviconCandidates
+        .filter((entry) => /(^|\/)favicon\.(ico|png|svg|jpg|jpeg|webp)$/i.test(entry.path))
+        .sort((a, b) => a.path.length - b.path.length);
+
+      const selected = filtered[0];
+      if (!selected) {
+        return res.status(404).json({ error: 'No favicon found in project' });
+      }
+
+      const ext = path.extname(selected.path).slice(1).toLowerCase();
+      const mime = projectIconExtensionToMime[ext] || null;
+      if (!mime) {
+        return res.status(415).json({ error: 'Unsupported favicon format' });
+      }
+
+      const bytes = await fsPromises.readFile(selected.path);
+      if (bytes.length === 0) {
+        return res.status(400).json({ error: 'Discovered icon is empty' });
+      }
+      if (bytes.length > projectIconMaxBytes) {
+        return res.status(400).json({ error: 'Discovered icon exceeds size limit (5 MB)' });
+      }
+
+      const iconPath = projectIconPathForMime(projectId, mime);
+      if (!iconPath) {
+        return res.status(415).json({ error: 'Unsupported favicon format' });
+      }
+
+      await fsPromises.mkdir(projectIconsDirPath, { recursive: true });
+      await fsPromises.writeFile(iconPath, bytes);
+      await removeProjectIconFiles(projectId, iconPath);
+
+      const updatedAt = Date.now();
+      const nextProjects = projects.map((entry) => (
+        entry.id === projectId
+          ? { ...entry, iconImage: { mime, updatedAt, source: 'auto' } }
+          : entry
+      ));
+      const updatedSettings = await persistSettings({ projects: nextProjects });
+      const updatedProject = (updatedSettings.projects || []).find((entry) => entry.id === projectId) || null;
+
+      return res.json({
+        project: updatedProject,
+        settings: updatedSettings,
+        discoveredPath: selected.path,
+      });
+    } catch (error) {
+      console.warn('Failed to discover project icon:', error);
+      return res.status(500).json({ error: 'Failed to discover project icon' });
+    }
+  });
+};

package/server/lib/opencode/project-icon-routes.test.js

@@ -0,0 +1,107 @@
+import { describe, expect, it, vi } from 'vitest';
+import crypto from 'crypto';
+import path from 'path';
+
+import { registerProjectIconRoutes } from './project-icon-routes.js';
+
+const createRouteRegistry = () => {
+  const routes = new Map();
+
+  return {
+    app: {
+      get(routePath, handler) {
+        routes.set(`GET ${routePath}`, handler);
+      },
+      post(routePath, handler) {
+        routes.set(`POST ${routePath}`, handler);
+      },
+      put(routePath, handler) {
+        routes.set(`PUT ${routePath}`, handler);
+      },
+      delete(routePath, handler) {
+        routes.set(`DELETE ${routePath}`, handler);
+      },
+    },
+    getRoute(method, routePath) {
+      return routes.get(`${method} ${routePath}`);
+    },
+  };
+};
+
+const createMockResponse = () => {
+  const headers = new Map();
+  let statusCode = 200;
+  let body = null;
+
+  return {
+    setHeader(name, value) {
+      headers.set(name.toLowerCase(), value);
+    },
+    getHeader(name) {
+      return headers.get(name.toLowerCase());
+    },
+    status(code) {
+      statusCode = code;
+      return this;
+    },
+    json(payload) {
+      body = payload;
+      return this;
+    },
+    send(payload) {
+      body = payload;
+      return this;
+    },
+    get statusCode() {
+      return statusCode;
+    },
+    get body() {
+      return body;
+    },
+  };
+};
+
+describe('project icon routes', () => {
+  it('uses fallback file extension MIME when metadata points to a missing icon', async () => {
+    const { app, getRoute } = createRouteRegistry();
+    const jpgBytes = Buffer.from('jpg-bytes');
+    const enoent = Object.assign(new Error('missing'), { code: 'ENOENT' });
+    const fsPromises = {
+      readFile: vi.fn(async (iconPath) => {
+        if (iconPath.endsWith('.jpg')) {
+          return jpgBytes;
+        }
+        throw enoent;
+      }),
+    };
+
+    registerProjectIconRoutes(app, {
+      fsPromises,
+      path,
+      crypto,
+      vinciDataDir: '/tmp/vinci-test',
+      sanitizeProjects: (projects) => projects,
+      readSettingsFromDiskMigrated: async () => ({
+        projects: [{
+          id: 'proj-1',
+          path: '/repo',
+          iconImage: { mime: 'image/png', updatedAt: 1, source: 'custom' },
+        }],
+      }),
+      persistSettings: async () => ({}),
+      createFsSearchRuntime: () => ({ searchFilesystemFiles: async () => [] }),
+      spawn: vi.fn(),
+      resolveGitBinaryForSpawn: vi.fn(),
+    });
+
+    const res = createMockResponse();
+    await getRoute('GET', '/api/projects/:projectId/icon')({
+      params: { projectId: 'proj-1' },
+      query: {},
+    }, res);
+
+    expect(res.statusCode).toBe(200);
+    expect(res.getHeader('Content-Type')).toBe('image/jpeg');
+    expect(res.body).toBe(jpgBytes);
+  });
+});

package/server/lib/opencode/providers.js

@@ -0,0 +1,96 @@
+import {
+  CONFIG_FILE,
+  readConfigLayers,
+  isPlainObject,
+  getConfigForPath,
+  writeConfig,
+} from './shared.js';
+
+function getProviderSources(providerId, workingDirectory) {
+  const layers = readConfigLayers(workingDirectory);
+  const { userConfig, projectConfig, customConfig, paths } = layers;
+
+  const customProviders = isPlainObject(customConfig?.provider) ? customConfig.provider : {};
+  const customProvidersAlias = isPlainObject(customConfig?.providers) ? customConfig.providers : {};
+  const projectProviders = isPlainObject(projectConfig?.provider) ? projectConfig.provider : {};
+  const projectProvidersAlias = isPlainObject(projectConfig?.providers) ? projectConfig.providers : {};
+  const userProviders = isPlainObject(userConfig?.provider) ? userConfig.provider : {};
+  const userProvidersAlias = isPlainObject(userConfig?.providers) ? userConfig.providers : {};
+
+  const customExists =
+    Object.prototype.hasOwnProperty.call(customProviders, providerId) ||
+    Object.prototype.hasOwnProperty.call(customProvidersAlias, providerId);
+  const projectExists =
+    Object.prototype.hasOwnProperty.call(projectProviders, providerId) ||
+    Object.prototype.hasOwnProperty.call(projectProvidersAlias, providerId);
+  const userExists =
+    Object.prototype.hasOwnProperty.call(userProviders, providerId) ||
+    Object.prototype.hasOwnProperty.call(userProvidersAlias, providerId);
+
+  return {
+    sources: {
+      auth: { exists: false },
+      user: { exists: userExists, path: paths.userPath },
+      project: { exists: projectExists, path: paths.projectPath || null },
+      custom: { exists: customExists, path: paths.customPath }
+    }
+  };
+}
+
+function removeProviderConfig(providerId, workingDirectory, scope = 'user') {
+  if (!providerId || typeof providerId !== 'string') {
+    throw new Error('Provider ID is required');
+  }
+
+  const layers = readConfigLayers(workingDirectory);
+  let targetPath = layers.paths.userPath;
+
+  if (scope === 'project') {
+    if (!workingDirectory) {
+      throw new Error('Working directory is required for project scope');
+    }
+    targetPath = layers.paths.projectPath || targetPath;
+  } else if (scope === 'custom') {
+    if (!layers.paths.customPath) {
+      return false;
+    }
+    targetPath = layers.paths.customPath;
+  }
+
+  const targetConfig = getConfigForPath(layers, targetPath);
+  const providerConfig = isPlainObject(targetConfig.provider) ? targetConfig.provider : {};
+  const providersConfig = isPlainObject(targetConfig.providers) ? targetConfig.providers : {};
+  const removedProvider = Object.prototype.hasOwnProperty.call(providerConfig, providerId);
+  const removedProviders = Object.prototype.hasOwnProperty.call(providersConfig, providerId);
+
+  if (!removedProvider && !removedProviders) {
+    return false;
+  }
+
+  if (removedProvider) {
+    delete providerConfig[providerId];
+    if (Object.keys(providerConfig).length === 0) {
+      delete targetConfig.provider;
+    } else {
+      targetConfig.provider = providerConfig;
+    }
+  }
+
+  if (removedProviders) {
+    delete providersConfig[providerId];
+    if (Object.keys(providersConfig).length === 0) {
+      delete targetConfig.providers;
+    } else {
+      targetConfig.providers = providersConfig;
+    }
+  }
+
+  writeConfig(targetConfig, targetPath || CONFIG_FILE);
+  console.log(`Removed provider ${providerId} from config: ${targetPath}`);
+  return true;
+}
+
+export {
+  getProviderSources,
+  removeProviderConfig,
+};