Vis improvement 2 (#54)

* feat: enhance UI components and improve accessibility

- Updated typography styles across various components for better readability and consistency.
- Changed heading levels and classes in DependencyDetails for improved semantic structure.
- Refined button and text styles in HeaderControls and Header for a more cohesive design.
- Enhanced error messages and loading indicators in MainContent for better user experience.
- Improved session ID generation logic in utils for better uniqueness.
- Added connection header to API requests for better performance.
- Adjusted dropdown and tooltip components for improved usability and aesthetics.
- Fixed minor bugs and improved overall code quality.

* Add backend setup script and UI/CLI tweaks

Add a backend setup-and-run.sh script and corresponding package scripts (root and backend) to automate environment creation, dependency install, DB container start, Drizzle schema generation/push, and dev server start; also add an MCP dev script and README quick-start/MCP notes. Update backend package.json and lockfile to include new dependencies required by these tools. Remove an old image optimization script. Apply assorted frontend/CLI refinements: adjust global font and diagram sizing, tweak dependency sidebar styling and tab label, enhance CodeBlock with a label and spacing, label batch commands, change save-analysis-history to deduplicate across all dates, and expand CLI command help/options and output formatting. These changes streamline local backend setup and improve UX for scanning/fixing workflows.

* merge fix

Author: viralcodex

packages/cli/src/cli.ts

@@ -8,23 +8,15 @@ import { initCommand } from "./commands/init.js";
 
 const program = new Command();
 
-<<<<<<< Updated upstream
-=======
 // Custom help formatting
 const formatOption = new Option("--format <format>", "Output format")
   .choices(["table", "json", "markdown"])
   .default("table");
 
->>>>>>> Stashed changes
 program
   .name("gds")
   .description(
     chalk.bold("GitDepSec") +
-<<<<<<< Updated upstream
-      " - Analyze dependency vulnerabilities in your projects"
-  )
-  .version("1.0.0");
-=======
     " - Analyze dependency vulnerabilities in your projects\n\n" +
     chalk.dim("Supported ecosystems: npm, pypi, maven, go, cargo, nuget, composer")
   )
@@ -49,24 +41,10 @@ ${chalk.bold("Examples:")}
 ${chalk.bold("Documentation:")}
   ${chalk.cyan("https://github.com/viralcodex/gitdepsec#readme")}
 `);
->>>>>>> Stashed changes
 
 // Analyse command
 program
   .command("analyse")
-<<<<<<< Updated upstream
-  .alias("analyze")
-  .description("Analyze dependencies for vulnerabilities")
-  .option("-f, --file <files...>", "Manifest file(s) to analyze")
-  .option("-r, --repo <repo>", "GitHub repository (owner/repo)")
-  .option("-b, --branch <branch>", "Branch to analyze (default: main)")
-  .option("-t, --token <token>", "GitHub personal access token")
-  .option("--no-transitive", "Disable transitive dependency scanning")
-  .option("--format <format>", "Output format: table, json, markdown", "table")
-  .option("-o, --output <file>", "Save output to file")
-  .option("-q, --quiet", "Minimal output")
-  .option("-v, --verbose", "Verbose output")
-=======
   .aliases(["analyze", "audit"])
   .description("Analyze dependencies for vulnerabilities")
   .option("-f, --file <files...>", "Manifest file(s) to analyze (e.g., package.json, requirements.txt)")
@@ -99,22 +77,12 @@ ${chalk.bold("Examples:")}
   $ gds analyse --format markdown            ${chalk.dim("# Output as markdown")}
   $ gds analyse --no-transitive              ${chalk.dim("# Skip transitive deps")}
 `)
->>>>>>> Stashed changes
   .action(analyseCommand);
 
 // Fix command
 program
   .command("fix")
   .description("Generate fix recommendations for vulnerabilities")
-<<<<<<< Updated upstream
-  .option("-f, --file <files...>", "Manifest file(s) to fix")
-  .option("-r, --repo <repo>", "GitHub repository (owner/repo)")
-  .option("-b, --branch <branch>", "Branch to analyze (default: main)")
-  .option("-t, --token <token>", "GitHub personal access token")
-  .option("--no-transitive", "Disable transitive dependency scanning")
-  .option("--format <format>", "Output format: table, json, markdown", "table")
-  .option("-o, --output <file>", "Save output to file")
-=======
   .option("-f, --file <files...>", "Manifest file(s) to fix (e.g., package.json)")
   .option("-r, --repo <repo>", "GitHub repository in owner/repo format")
   .option("-b, --branch <branch>", "Branch to analyze", "main")
@@ -129,16 +97,12 @@ ${chalk.bold("Examples:")}
   $ gds fix -f package.json                  ${chalk.dim("# Fix specific file")}
   $ gds fix --format markdown -o fixes.md    ${chalk.dim("# Export as markdown")}
 `)
->>>>>>> Stashed changes
   .action(fixCommand);
 
 // Init command
 program
   .command("init")
   .description("Create a .gitdepsecrc configuration file")
-<<<<<<< Updated upstream
-  .option("--force", "Overwrite existing config")
-=======
   .option("--force", "Overwrite existing config file")
   .addHelpText("after", `
 ${chalk.bold("Examples:")}
@@ -151,7 +115,6 @@ ${chalk.bold("Config File Options:")}
   ${chalk.cyan("format")}          Default output format (table|json|markdown)
   ${chalk.cyan("transitive")}      Enable transitive scanning (true|false)
 `)
->>>>>>> Stashed changes
   .action(initCommand);
 
 // Parse arguments

packages/cli/src/utils/formatters.ts

@@ -118,9 +118,6 @@ export function formatAnalysisTable(result: AnalysisResult): string {
   lines.push(statRow("Low", result.lowCount, result.lowCount > 0 ? chalk.dim : chalk.dim));
 
   if (result.totalVulnerabilities === 0) {
-<<<<<<< Updated upstream
-    lines.push(chalk.green.bold("✓ No vulnerabilities found!"));
-=======
     lines.push("");
     lines.push(rule("double"));
     lines.push(chalk.green.bold(`${INDENT}No vulnerabilities detected`));
@@ -130,7 +127,6 @@ export function formatAnalysisTable(result: AnalysisResult): string {
       lines.push(sectionHeader("Warnings"));
       result.errors.forEach((err) => lines.push(`${INDENT}${chalk.yellow(">")} ${err}`));
     }
->>>>>>> Stashed changes
     lines.push("");
     return lines.join("\n");
   }
@@ -145,15 +141,6 @@ export function formatAnalysisTable(result: AnalysisResult): string {
 
     deps.forEach((dep) => {
       if (dep.vulnerabilities && dep.vulnerabilities.length > 0) {
-<<<<<<< Updated upstream
-        lines.push("");
-        lines.push(`  ${chalk.bold(dep.name)}@${chalk.dim(dep.version)} ${chalk.dim(`(${dep.ecosystem})`)}`);
-        
-        dep.vulnerabilities.forEach((vuln) => {
-          const severity = getSeverityFromScore(vuln.severityScore);
-          const score = vuln.severityScore?.cvss_v3 || vuln.severityScore?.cvss_v4 || "N/A";
-          lines.push(`    ${colorSeverity(severity)} ${chalk.cyan(vuln.id)} (CVSS: ${score})`);
-=======
         // Package name with version
         lines.push(`\n${INDENT}${chalk.white.bold(dep.name)} ${chalk.dim("@" + dep.version)} ${chalk.dim.italic(dep.ecosystem)}`);
 
@@ -164,8 +151,6 @@ export function formatAnalysisTable(result: AnalysisResult): string {
           // Vulnerability line with aligned columns and clickable link
           const linkedId = chalk.cyan(vulnLink(vuln.id.padEnd(22)));
           lines.push(`${DOUBLE_INDENT}${severityBadge(severity)} ${linkedId} ${chalk.dim("CVSS")} ${chalk.white(score)}`);
-
->>>>>>> Stashed changes
           if (vuln.summary) {
             lines.push(`${DOUBLE_INDENT}${chalk.dim(truncate(vuln.summary, 62))}`);
           }