Fix API endpoint configuration with environment-aware URLs

- Add environment-based API URL configuration (dev: localhost:8000, prod: api.pennyzo.com)
- Update PennyzoApiService to use centralized config with timeout settings
- Fix API status checker scripts to load .env variables using dotenv
- Add environment management scripts (set-env.ps1) with npm shortcuts
- Create comprehensive configuration testing and validation tools
- Add TypeScript definitions for Vite environment variables
- Update all documentation with new environment configuration instructions
- Install dotenv package for Node.js environment variable loading
- All APIs now correctly use environment-appropriate URLs automatically

scripts/README.md

@@ -38,6 +38,40 @@ These scripts test both public and authenticated endpoints of the Pennyzo Genera
 
 Both required packages are already installed in the project.
 
+## Environment Configuration
+
+The API endpoints are now environment-aware. By default:
+
+- **Development**: `http://localhost:8000`
+- **Production**: `https://api.pennyzo.com/api/v1/general`
+
+### Setting Environment
+
+Use the following npm scripts to configure your environment:
+
+```bash
+# Set development environment (localhost:8000)
+npm run env:dev
+
+# Set production environment (api.pennyzo.com)
+npm run env:prod
+
+# Show current environment configuration
+npm run env:show
+```
+
+Alternatively, manually create a `.env` file:
+
+```bash
+# For development
+VITE_API_BASE_URL=http://localhost:8000
+NODE_ENV=development
+
+# For production
+VITE_API_BASE_URL=https://api.pennyzo.com/api/v1/general
+NODE_ENV=production
+```
+
 ## Usage
 
 ### Using npm Scripts (Recommended)

scripts/api-status-checker-extended.js

@@ -12,6 +12,9 @@
  * - Supports command line arguments for customization
  */
 
+// Load environment variables from .env file
+require('dotenv').config();
+
 const axios = require('axios');
 const chalk = require('chalk');
 const fs = require('fs');
@@ -23,8 +26,12 @@ const saveReport = !args.includes('--no-report');
 const verbose = args.includes('--verbose');
 const useRealCredentials = args.includes('--use-real-credentials');
 
-// Define the base URL
-const BASE_URL = 'https://api.pennyzo.com/api/v1/general';
+// Define the base URL based on environment
+const BASE_URL = process.env.VITE_API_BASE_URL || 
+                 process.env.API_BASE_URL || 
+                 (process.env.NODE_ENV === 'production' ? 
+                   'https://api.pennyzo.com/api/v1/general' : 
+                   'http://localhost:8000');
 
 // Test credentials
 const TEST_CREDENTIALS = {

scripts/api-status-checker.js

@@ -5,11 +5,18 @@
  * and logs the results to the console.
  */
 
+// Load environment variables from .env file
+require('dotenv').config();
+
 const axios = require('axios');
 const chalk = require('chalk'); // For colorful console output
 
-// Define the base URL
-const BASE_URL = 'https://api.pennyzo.com/api/v1/general';
+// Define the base URL based on environment
+const BASE_URL = process.env.VITE_API_BASE_URL || 
+                 process.env.API_BASE_URL || 
+                 (process.env.NODE_ENV === 'production' ? 
+                   'https://api.pennyzo.com/api/v1/general' : 
+                   'http://localhost:8000');
 
 // Test credentials (replace with actual test credentials if available)
 const TEST_CREDENTIALS = {

scripts/set-env.ps1

@@ -0,0 +1,110 @@
+#!/usr/bin/env powershell
+# Environment Configuration Helper Script
+# This script helps you switch between development and production API endpoints
+
+param(
+  [Parameter(Mandatory = $false)]
+  [ValidateSet("dev", "development", "prod", "production", "local")]
+  [string]$Environment = "dev",
+    
+  [switch]$Show
+)
+
+$EnvFile = ".env"
+$EnvExampleFile = ".env.example"
+
+function Show-CurrentConfig {
+  Write-Host "Current Environment Configuration:" -ForegroundColor Green
+  Write-Host "=================================" -ForegroundColor Green
+    
+  if (Test-Path $EnvFile) {
+    $content = Get-Content $EnvFile
+    foreach ($line in $content) {
+      if ($line -match "VITE_API_BASE_URL=(.+)") {
+        Write-Host "API Base URL: " -NoNewline -ForegroundColor Yellow
+        Write-Host $matches[1] -ForegroundColor White
+      }
+      if ($line -match "NODE_ENV=(.+)") {
+        Write-Host "Node Environment: " -NoNewline -ForegroundColor Yellow
+        Write-Host $matches[1] -ForegroundColor White
+      }
+    }
+  }
+  else {
+    Write-Host "No .env file found. Using default configuration." -ForegroundColor Red
+    Write-Host "API Base URL: " -NoNewline -ForegroundColor Yellow
+    Write-Host "http://localhost:8000 (development default)" -ForegroundColor White
+  }
+  Write-Host ""
+}
+
+function Set-Environment {
+  param([string]$Env)
+    
+  $apiUrl = ""
+  $nodeEnv = ""
+    
+  switch ($Env.ToLower()) {
+    { $_ -in @("dev", "development", "local") } {
+      $apiUrl = "http://localhost:8000"
+      $nodeEnv = "development"
+      Write-Host "Configuring for DEVELOPMENT environment..." -ForegroundColor Green
+    }
+    { $_ -in @("prod", "production") } {
+      $apiUrl = "https://api.pennyzo.com/api/v1/general"
+      $nodeEnv = "production"
+      Write-Host "Configuring for PRODUCTION environment..." -ForegroundColor Green
+    }
+    default {
+      Write-Host "Unknown environment: $Env" -ForegroundColor Red
+      return
+    }
+  }
+    
+  # Create .env content
+  $debugValue = if ($nodeEnv -eq "development") { "true" } else { "false" }
+  $logLevel = if ($nodeEnv -eq "development") { "INFO" } else { "WARN" }
+    
+  $envContent = @"
+# Environment Configuration - Auto-generated
+# Generated on: $(Get-Date -Format "yyyy-MM-dd HH:mm:ss")
+
+# API Base URL
+VITE_API_BASE_URL=$apiUrl
+
+# Environment
+NODE_ENV=$nodeEnv
+
+# Debug settings
+DEBUG=$debugValue
+LOG_LEVEL=$logLevel
+
+# API Status Checker Credentials (optional)
+# PENNYZO_TEST_EMAIL=your-test-email@example.com
+# PENNYZO_TEST_PASSWORD=your-test-password
+"@
+
+  # Write to .env file
+  $envContent | Out-File -FilePath $EnvFile -Encoding UTF8
+    
+  Write-Host "Environment configured successfully!" -ForegroundColor Green
+  Write-Host "API Base URL set to: " -NoNewline -ForegroundColor Yellow
+  Write-Host $apiUrl -ForegroundColor White
+  Write-Host ""
+}
+
+# Main execution
+if ($Show) {
+  Show-CurrentConfig
+}
+else {
+  Set-Environment -Env $Environment
+  Show-CurrentConfig
+    
+  Write-Host "Usage Examples:" -ForegroundColor Cyan
+  Write-Host "  .\scripts\set-env.ps1 dev          # Set development environment" -ForegroundColor Gray
+  Write-Host "  .\scripts\set-env.ps1 prod         # Set production environment" -ForegroundColor Gray
+  Write-Host "  .\scripts\set-env.ps1 -Show        # Show current configuration" -ForegroundColor Gray
+  Write-Host ""
+  Write-Host "Restart your development server for changes to take effect." -ForegroundColor Yellow
+}

scripts/test-config.js

@@ -0,0 +1,72 @@
+/**
+ * API Configuration Test Script
+ * 
+ * This script verifies that all API configurations are properly set up
+ * and that the URLs are correctly configured for different environments.
+ */
+
+// Load environment variables
+require('dotenv').config();
+
+const chalk = require('chalk');
+
+function testConfiguration() {
+    console.log(chalk.bold('\n=== API Configuration Test ===\n'));
+    
+    // Test environment variables
+    console.log(chalk.yellow('Environment Variables:'));
+    console.log(`  VITE_API_BASE_URL: ${process.env.VITE_API_BASE_URL || 'undefined'}`);
+    console.log(`  NODE_ENV: ${process.env.NODE_ENV || 'undefined'}`);
+    console.log(`  DEBUG: ${process.env.DEBUG || 'undefined'}`);
+    console.log(`  LOG_LEVEL: ${process.env.LOG_LEVEL || 'undefined'}\n`);
+    
+    // Test URL logic from scripts
+    const scriptUrl = process.env.VITE_API_BASE_URL || 
+                     process.env.API_BASE_URL || 
+                     (process.env.NODE_ENV === 'production' ? 
+                       'https://api.pennyzo.com/api/v1/general' : 
+                       'http://localhost:8000');
+    
+    console.log(chalk.yellow('Script URL Resolution:'));
+    console.log(`  Resolved URL: ${scriptUrl}\n`);
+    
+    // Test individual components
+    console.log(chalk.yellow('Component URLs:'));
+    console.log(`  API Status Checker: ${scriptUrl}`);
+    console.log(`  React App (via VITE_API_BASE_URL): ${process.env.VITE_API_BASE_URL || 'Will use config.ts logic'}`);
+    console.log(`  PennyzoApiService: Will use config.ts -> ${scriptUrl}\n`);
+    
+    // Test endpoint construction
+    const testEndpoints = [
+        '/system/health',
+        '/registration/company/identity-rules',
+        '/auth/login',
+        '/auth/me',
+        '/users/profile'
+    ];
+    
+    console.log(chalk.yellow('Full Endpoint URLs:'));
+    testEndpoints.forEach(endpoint => {
+        console.log(`  ${scriptUrl}${endpoint}`);
+    });
+    
+    console.log(chalk.bold('\n=== Configuration Test Complete ===\n'));
+    
+    // Summary
+    const isLocalhost = scriptUrl.includes('localhost');
+    const status = isLocalhost ? 
+        chalk.green('✓ Configured for local development') : 
+        chalk.blue('✓ Configured for production');
+    
+    console.log(chalk.bold('Summary:'));
+    console.log(`  ${status}`);
+    console.log(`  Base URL: ${scriptUrl}`);
+    
+    if (isLocalhost) {
+        console.log(chalk.yellow('\n  Note: Ensure your backend server is running on localhost:8000'));
+    } else {
+        console.log(chalk.yellow('\n  Note: Ensure the production API server is accessible'));
+    }
+}
+
+testConfiguration();