@vizzly-testing/cli 0.20.0 → 0.20.1-beta.1

package/dist/commands/project.js

@@ -5,9 +5,9 @@
 
 import { resolve } from 'node:path';
 import readline from 'node:readline';
-import { AuthService } from '../services/auth-service.js';
+import { createAuthClient, createTokenStore, getAuthTokens, whoami } from '../auth/index.js';
 import { getApiUrl } from '../utils/environment-config.js';
-import { deleteProjectMapping, getAuthTokens, getProjectMapping, getProjectMappings, saveProjectMapping } from '../utils/global-config.js';
+import { deleteProjectMapping, getProjectMapping, getProjectMappings, saveProjectMapping } from '../utils/global-config.js';
 import * as output from '../utils/output.js';
 
 /**
@@ -22,43 +22,42 @@ export async function projectSelectCommand(options = {}, globalOptions = {}) {
     color: !globalOptions.noColor
   });
   try {
+    output.header('project:select');
+
     // Check authentication
-    const auth = await getAuthTokens();
+    let auth = await getAuthTokens();
     if (!auth || !auth.accessToken) {
       output.error('Not authenticated');
-      output.blank();
-      output.info('Run "vizzly login" to authenticate first');
+      output.hint('Run "vizzly login" to authenticate first');
       process.exit(1);
     }
-    const authService = new AuthService({
+    let client = createAuthClient({
       baseUrl: options.apiUrl || getApiUrl()
     });
+    let tokenStore = createTokenStore();
 
     // Get user info to show organizations
     output.startSpinner('Fetching organizations...');
-    const userInfo = await authService.whoami();
+    let userInfo = await whoami(client, tokenStore);
     output.stopSpinner();
     if (!userInfo.organizations || userInfo.organizations.length === 0) {
       output.error('No organizations found');
-      output.blank();
-      output.info('Create an organization at https://vizzly.dev');
+      output.hint('Create an organization at https://vizzly.dev');
       process.exit(1);
     }
 
     // Select organization
-    output.blank();
-    output.info('Select an organization:');
-    output.blank();
+    output.labelValue('Organizations', '');
     userInfo.organizations.forEach((org, index) => {
       output.print(`  ${index + 1}. ${org.name} (@${org.slug})`);
     });
     output.blank();
-    const orgChoice = await promptNumber('Enter number', 1, userInfo.organizations.length);
-    const selectedOrg = userInfo.organizations[orgChoice - 1];
+    let orgChoice = await promptNumber('Enter number', 1, userInfo.organizations.length);
+    let selectedOrg = userInfo.organizations[orgChoice - 1];
 
     // List projects for organization
     output.startSpinner(`Fetching projects for ${selectedOrg.name}...`);
-    const response = await makeAuthenticatedRequest(`${options.apiUrl || getApiUrl()}/api/project`, {
+    let response = await makeAuthenticatedRequest(`${options.apiUrl || getApiUrl()}/api/project`, {
       headers: {
         Authorization: `Bearer ${auth.accessToken}`,
         'X-Organization': selectedOrg.slug
@@ -67,28 +66,26 @@ export async function projectSelectCommand(options = {}, globalOptions = {}) {
     output.stopSpinner();
 
     // Handle both array response and object with projects property
-    const projects = Array.isArray(response) ? response : response.projects || [];
+    let projects = Array.isArray(response) ? response : response.projects || [];
     if (projects.length === 0) {
       output.error('No projects found');
-      output.blank();
-      output.info(`Create a project in ${selectedOrg.name} at https://vizzly.dev`);
+      output.hint(`Create a project in ${selectedOrg.name} at https://vizzly.dev`);
       process.exit(1);
     }
 
     // Select project
     output.blank();
-    output.info('Select a project:');
-    output.blank();
+    output.labelValue('Projects', '');
     projects.forEach((project, index) => {
       output.print(`  ${index + 1}. ${project.name} (${project.slug})`);
     });
     output.blank();
-    const projectChoice = await promptNumber('Enter number', 1, projects.length);
-    const selectedProject = projects[projectChoice - 1];
+    let projectChoice = await promptNumber('Enter number', 1, projects.length);
+    let selectedProject = projects[projectChoice - 1];
 
     // Create API token for project
     output.startSpinner(`Creating API token for ${selectedProject.name}...`);
-    const tokenResponse = await makeAuthenticatedRequest(`${options.apiUrl || getApiUrl()}/api/project/${selectedProject.slug}/tokens`, {
+    let tokenResponse = await makeAuthenticatedRequest(`${options.apiUrl || getApiUrl()}/api/project/${selectedProject.slug}/tokens`, {
       method: 'POST',
       headers: {
         Authorization: `Bearer ${auth.accessToken}`,
@@ -103,18 +100,20 @@ export async function projectSelectCommand(options = {}, globalOptions = {}) {
     output.stopSpinner();
 
     // Save project mapping
-    const currentDir = resolve(process.cwd());
+    let currentDir = resolve(process.cwd());
     await saveProjectMapping(currentDir, {
       token: tokenResponse.token,
       projectSlug: selectedProject.slug,
       projectName: selectedProject.name,
       organizationSlug: selectedOrg.slug
     });
-    output.success('Project configured!');
+    output.complete('Project configured');
     output.blank();
-    output.info(`Project: ${selectedProject.name}`);
-    output.info(`Organization: ${selectedOrg.name}`);
-    output.info(`Directory: ${currentDir}`);
+    output.keyValue({
+      Project: selectedProject.name,
+      Organization: selectedOrg.name,
+      Directory: currentDir
+    });
     output.cleanup();
   } catch (error) {
     output.stopSpinner();
@@ -135,12 +134,17 @@ export async function projectListCommand(_options = {}, globalOptions = {}) {
     color: !globalOptions.noColor
   });
   try {
-    const mappings = await getProjectMappings();
-    const paths = Object.keys(mappings);
+    let mappings = await getProjectMappings();
+    let paths = Object.keys(mappings);
     if (paths.length === 0) {
-      output.info('No projects configured');
-      output.blank();
-      output.info('Run "vizzly project:select" to configure a project');
+      if (globalOptions.json) {
+        output.data({});
+      } else {
+        output.header('project:list');
+        output.print('  No projects configured');
+        output.blank();
+        output.hint('Run "vizzly project:select" to configure a project');
+      }
       output.cleanup();
       return;
     }
@@ -149,22 +153,29 @@ export async function projectListCommand(_options = {}, globalOptions = {}) {
       output.cleanup();
       return;
     }
-    output.info('Configured projects:');
-    output.blank();
-    const currentDir = resolve(process.cwd());
-    for (const path of paths) {
-      const mapping = mappings[path];
-      const isCurrent = path === currentDir;
-      const marker = isCurrent ? '→' : ' ';
-
-      // Extract token string (handle both string and object formats)
-      const tokenStr = typeof mapping.token === 'string' ? mapping.token : mapping.token?.token || '[invalid token]';
-      output.print(`${marker} ${path}`);
-      output.print(`  Project: ${mapping.projectName} (${mapping.projectSlug})`);
-      output.print(`  Organization: ${mapping.organizationSlug}`);
+    output.header('project:list');
+    let colors = output.getColors();
+    let currentDir = resolve(process.cwd());
+    for (let path of paths) {
+      let mapping = mappings[path];
+      let isCurrent = path === currentDir;
+      let marker = isCurrent ? colors.brand.amber('→') : ' ';
+      output.print(`${marker} ${isCurrent ? colors.bold(path) : path}`);
+      output.keyValue({
+        Project: `${mapping.projectName} (${mapping.projectSlug})`,
+        Org: mapping.organizationSlug
+      }, {
+        indent: 4
+      });
       if (globalOptions.verbose) {
-        output.print(`  Token: ${tokenStr.substring(0, 20)}...`);
-        output.print(`  Created: ${new Date(mapping.createdAt).toLocaleString()}`);
+        // Extract token string (handle both string and object formats)
+        let tokenStr = typeof mapping.token === 'string' ? mapping.token : mapping.token?.token || '[invalid token]';
+        output.hint(`Token: ${tokenStr.substring(0, 20)}...`, {
+          indent: 4
+        });
+        output.hint(`Created: ${new Date(mapping.createdAt).toLocaleString()}`, {
+          indent: 4
+        });
       }
       output.blank();
     }
@@ -187,17 +198,16 @@ export async function projectTokenCommand(_options = {}, globalOptions = {}) {
     color: !globalOptions.noColor
   });
   try {
-    const currentDir = resolve(process.cwd());
-    const mapping = await getProjectMapping(currentDir);
+    let currentDir = resolve(process.cwd());
+    let mapping = await getProjectMapping(currentDir);
     if (!mapping) {
       output.error('No project configured for this directory');
-      output.blank();
-      output.info('Run "vizzly project:select" to configure a project');
+      output.hint('Run "vizzly project:select" to configure a project');
       process.exit(1);
     }
 
     // Extract token string (handle both string and object formats)
-    const tokenStr = typeof mapping.token === 'string' ? mapping.token : mapping.token?.token || '[invalid token]';
+    let tokenStr = typeof mapping.token === 'string' ? mapping.token : mapping.token?.token || '[invalid token]';
     if (globalOptions.json) {
       output.data({
         token: tokenStr,
@@ -207,12 +217,15 @@ export async function projectTokenCommand(_options = {}, globalOptions = {}) {
       output.cleanup();
       return;
     }
-    output.info('Project token:');
-    output.blank();
-    output.print(`  ${tokenStr}`);
+    output.header('project:token');
+    output.printBox(tokenStr, {
+      title: 'Token'
+    });
     output.blank();
-    output.info(`Project: ${mapping.projectName} (${mapping.projectSlug})`);
-    output.info(`Organization: ${mapping.organizationSlug}`);
+    output.keyValue({
+      Project: `${mapping.projectName} (${mapping.projectSlug})`,
+      Org: mapping.organizationSlug
+    });
     output.cleanup();
   } catch (error) {
     output.error('Failed to get project token', error);
@@ -275,31 +288,47 @@ export async function projectRemoveCommand(_options = {}, globalOptions = {}) {
     color: !globalOptions.noColor
   });
   try {
-    const currentDir = resolve(process.cwd());
-    const mapping = await getProjectMapping(currentDir);
+    let currentDir = resolve(process.cwd());
+    let mapping = await getProjectMapping(currentDir);
     if (!mapping) {
-      output.info('No project configured for this directory');
+      if (globalOptions.json) {
+        output.data({
+          removed: false,
+          reason: 'not_configured'
+        });
+      } else {
+        output.header('project:remove');
+        output.print('  No project configured for this directory');
+      }
       output.cleanup();
       return;
     }
 
     // Confirm removal
+    output.header('project:remove');
+    output.labelValue('Current configuration', '');
+    output.keyValue({
+      Project: `${mapping.projectName} (${mapping.projectSlug})`,
+      Org: mapping.organizationSlug,
+      Directory: currentDir
+    });
     output.blank();
-    output.info('Current project configuration:');
-    output.print(`  Project: ${mapping.projectName} (${mapping.projectSlug})`);
-    output.print(`  Organization: ${mapping.organizationSlug}`);
-    output.print(`  Directory: ${currentDir}`);
-    output.blank();
-    const confirmed = await promptConfirm('Remove this project configuration?');
+    let confirmed = await promptConfirm('Remove this project configuration?');
     if (!confirmed) {
-      output.info('Cancelled');
+      output.print('  Cancelled');
       output.cleanup();
       return;
     }
     await deleteProjectMapping(currentDir);
-    output.success('Project configuration removed');
-    output.blank();
-    output.info('Run "vizzly project:select" to configure a different project');
+    if (globalOptions.json) {
+      output.data({
+        removed: true
+      });
+    } else {
+      output.complete('Project configuration removed');
+      output.blank();
+      output.hint('Run "vizzly project:select" to configure a different project');
+    }
     output.cleanup();
   } catch (error) {
     output.error('Failed to remove project configuration', error);