@manojkmfsi/monodog 1.1.38 → 1.1.39

package/monodog-dashboard/src/components/configuration/components/MonorepoSettings.tsx

@@ -1,179 +0,0 @@
-import { SettingsComponentProps } from '../types/config.types';
-import { stringToArray, arrayToString } from '../utils/config.utils';
-
-export default function MonorepoSettings({
-  config,
-  onConfigChange,
-}: SettingsComponentProps) {
-  const handleMonorepoChange = (field: string, value: any) => {
-    onConfigChange({
-      monorepo: { ...config.monorepo, [field]: value },
-    });
-  };
-
-  return (
-    <div className="space-y-6">
-      <div>
-        <h3 className="text-lg font-medium text-gray-900 mb-4">
-          Monorepo Configuration
-        </h3>
-        <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
-          <div>
-            <label className="block text-sm font-medium text-gray-700 mb-2">
-              Structure Type
-            </label>
-            <select
-              value={config.monorepo?.structure || 'standard'}
-              onChange={e => handleMonorepoChange('structure', e.target.value)}
-              className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-            >
-              <option value="standard">Standard (apps/packages/libs)</option>
-              <option value="custom">Custom Structure</option>
-            </select>
-            <p className="text-xs text-gray-500 mt-1">
-              Choose your monorepo directory structure
-            </p>
-          </div>
-          <div>
-            <label className="block text-sm font-medium text-gray-700 mb-2">
-              Package Manager
-            </label>
-            <select
-              value={config.monorepo?.packageManager || 'pnpm'}
-              onChange={e =>
-                handleMonorepoChange('packageManager', e.target.value)
-              }
-              className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-            >
-              <option value="pnpm">pnpm</option>
-              <option value="npm">npm</option>
-              <option value="yarn">Yarn</option>
-              <option value="lerna">Lerna</option>
-              <option value="nx">Nx</option>
-            </select>
-            <p className="text-xs text-gray-500 mt-1">
-              Package manager used in your monorepo
-            </p>
-          </div>
-          <div>
-            <label className="block text-sm font-medium text-gray-700 mb-2">
-              Package Directories
-            </label>
-            <input
-              type="text"
-              value={arrayToString(config.monorepo?.directories)}
-              onChange={e =>
-                handleMonorepoChange(
-                  'directories',
-                  stringToArray(e.target.value)
-                )
-              }
-              className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-              placeholder="apps, packages, libs, services"
-            />
-            <p className="text-xs text-gray-500 mt-1">
-              Directories containing packages
-            </p>
-          </div>
-          <div>
-            <label className="block text-sm font-medium text-gray-700 mb-2">
-              Ignore Patterns
-            </label>
-            <input
-              type="text"
-              value={arrayToString(config.monorepo?.ignorePatterns)}
-              onChange={e =>
-                handleMonorepoChange(
-                  'ignorePatterns',
-                  stringToArray(e.target.value)
-                )
-              }
-              className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-              placeholder="node_modules, dist, .git"
-            />
-            <p className="text-xs text-gray-500 mt-1">
-              Patterns to ignore when scanning
-            </p>
-          </div>
-        </div>
-
-        {/* Configuration Preview */}
-        <div className="mt-6 p-4 bg-gray-50 border border-gray-200 rounded-lg">
-          <h4 className="text-sm font-medium text-gray-900 mb-3">
-            Configuration Preview
-          </h4>
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm">
-            <div>
-              <span className="font-medium text-gray-700">Structure:</span>
-              <span className="ml-2 text-gray-600 capitalize">
-                {config.monorepo?.structure || 'standard'}
-              </span>
-            </div>
-            <div>
-              <span className="font-medium text-gray-700">
-                Package Manager:
-              </span>
-              <span className="ml-2 text-gray-600">
-                {config.monorepo?.packageManager || 'pnpm'}
-              </span>
-            </div>
-            <div>
-              <span className="font-medium text-gray-700">Directories:</span>
-              <span className="ml-2 text-gray-600">
-                {config.monorepo?.directories?.length || 0} configured
-              </span>
-            </div>
-            <div>
-              <span className="font-medium text-gray-700">
-                Ignore Patterns:
-              </span>
-              <span className="ml-2 text-gray-600">
-                {config.monorepo?.ignorePatterns?.length || 0} patterns
-              </span>
-            </div>
-          </div>
-        </div>
-
-        {/* Package Manager Specific Tips */}
-        {config.monorepo?.packageManager && (
-          <div className="mt-4 p-4 bg-blue-50 border border-blue-200 rounded-lg">
-            <h4 className="text-sm font-medium text-blue-900 mb-2">
-              {config.monorepo.packageManager.toUpperCase()} Configuration Tips
-            </h4>
-            <div className="text-xs text-blue-800">
-              {config.monorepo.packageManager === 'pnpm' && (
-                <p>
-                  Make sure you have a pnpm-workspace.yaml file in your root
-                  directory.
-                </p>
-              )}
-              {config.monorepo.packageManager === 'npm' && (
-                <p>
-                  Configure workspaces in your package.json with the
-                  "workspaces" field.
-                </p>
-              )}
-              {config.monorepo.packageManager === 'yarn' && (
-                <p>
-                  Ensure you have workspaces configured in your package.json.
-                </p>
-              )}
-              {config.monorepo.packageManager === 'lerna' && (
-                <p>
-                  Make sure you have a lerna.json configuration file in your
-                  root.
-                </p>
-              )}
-              {config.monorepo.packageManager === 'nx' && (
-                <p>
-                  Ensure you have an nx.json configuration file in your
-                  workspace root.
-                </p>
-              )}
-            </div>
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}

package/monodog-dashboard/src/components/configuration/components/index.ts

@@ -1,8 +0,0 @@
-// Export all configuration components for easier imports
-export { default as ConfigurationModal } from './ConfigurationModal';
-export { default as ConfigurationHeader } from './ConfigurationHeader';
-export { default as ConfigurationTabs } from './ConfigurationTabs';
-export { default as GeneralSettings } from './GeneralSettings';
-export { default as FeatureToggles } from './FeatureToggles';
-export { default as BrandingSettings } from './BrandingSettings';
-export { default as MonorepoSettings } from './MonorepoSettings';

package/monodog-dashboard/src/components/configuration/types/config.types.ts

@@ -1,52 +0,0 @@
-// Shared types for configuration components
-
-export interface DashboardConfig {
-  title?: string;
-  description?: string;
-  packageTypes?: string[];
-  customFields?: string[];
-  features?: {
-    healthChecks?: boolean;
-    ciIntegration?: boolean;
-    dependencyGraph?: boolean;
-    publishControl?: boolean;
-    searchAndFilter?: boolean;
-    configurationInspector?: boolean;
-  };
-  branding?: {
-    logo?: string;
-    primaryColor?: string;
-    secondaryColor?: string;
-  };
-  monorepo?: {
-    structure?: 'standard' | 'custom';
-    packageManager?: 'pnpm' | 'npm' | 'yarn' | 'lerna' | 'nx';
-    directories?: string[];
-    ignorePatterns?: string[];
-  };
-}
-
-export interface ConfigurationProps {
-  isOpen: boolean;
-  onClose: () => void;
-  onSave: (config: DashboardConfig) => void;
-  currentConfig: DashboardConfig;
-}
-
-export type ConfigurationTab = 'general' | 'features' | 'branding' | 'monorepo';
-
-export interface TabDefinition {
-  id: ConfigurationTab;
-  label: string;
-  icon: string|React.ReactNode;
-}
-
-export interface ConfigurationTabsProps {
-  activeTab: ConfigurationTab;
-  onTabChange: (tab: ConfigurationTab) => void;
-}
-
-export interface SettingsComponentProps {
-  config: DashboardConfig;
-  onConfigChange: (updates: Partial<DashboardConfig>) => void;
-}

package/monodog-dashboard/src/components/configuration/utils/config.utils.tsx

@@ -1,115 +0,0 @@
-import type {
-  DashboardConfig,
-  TabDefinition,
-  ConfigurationTab,
-} from '../types/config.types';
-import { RocketLaunchIcon, CubeIcon, Cog6ToothIcon } from '../../../icons/heroicons';
-
-// Get tab definitions
-export const getTabDefinitions = (): TabDefinition[] => [
-  { id: 'general', label: 'General', icon: <Cog6ToothIcon className="w-6 h-6 text-primary-600" /> },
-  { id: 'features', label: 'Features', icon: <RocketLaunchIcon className="w-6 h-6 text-primary-600" /> },
-  { id: 'branding', label: 'Branding', icon: '🎨' },
-  { id: 'monorepo', label: 'Monorepo', icon: <CubeIcon className="w-6 h-6 text-primary-600" /> },
-];
-
-// Get default configuration
-export const getDefaultConfig = (): DashboardConfig => ({
-  title: 'monodog Dashboard',
-  description: 'Visual management of our monorepo packages',
-  packageTypes: ['app', 'lib', 'tool', 'service'],
-  customFields: ['team', 'priority', 'environment'],
-  features: {
-    healthChecks: true,
-    ciIntegration: true,
-    dependencyGraph: true,
-    publishControl: true,
-    searchAndFilter: true,
-    configurationInspector: true,
-  },
-  branding: {
-    logo: '',
-    primaryColor: '#3B82F6',
-    secondaryColor: '#1E40AF',
-  },
-  monorepo: {
-    structure: 'standard',
-    packageManager: 'pnpm',
-    directories: ['apps', 'packages', 'libs'],
-    ignorePatterns: ['node_modules', 'dist', '.git'],
-  },
-});
-
-// Merge configurations with defaults
-export const mergeWithDefaults = (
-  config: Partial<DashboardConfig>
-): DashboardConfig => {
-  const defaults = getDefaultConfig();
-  return {
-    ...defaults,
-    ...config,
-    features: { ...defaults.features, ...config.features },
-    branding: { ...defaults.branding, ...config.branding },
-    monorepo: { ...defaults.monorepo, ...config.monorepo },
-  };
-};
-
-// Validate configuration
-export const validateConfig = (
-  config: DashboardConfig
-): { isValid: boolean; errors: string[] } => {
-  const errors: string[] = [];
-
-  if (!config.title || config.title.trim() === '') {
-    errors.push('Dashboard title is required');
-  }
-
-  if (
-    config.monorepo?.directories &&
-    config.monorepo.directories.length === 0
-  ) {
-    errors.push('At least one package directory is required');
-  }
-
-  if (
-    config.branding?.primaryColor &&
-    !isValidHexColor(config.branding.primaryColor)
-  ) {
-    errors.push('Primary color must be a valid hex color');
-  }
-
-  if (
-    config.branding?.secondaryColor &&
-    !isValidHexColor(config.branding.secondaryColor)
-  ) {
-    errors.push('Secondary color must be a valid hex color');
-  }
-
-  return {
-    isValid: errors.length === 0,
-    errors,
-  };
-};
-
-// Helper function to validate hex colors
-const isValidHexColor = (color: string): boolean => {
-  return /^#[0-9A-F]{6}$/i.test(color);
-};
-
-// Convert comma-separated string to array
-export const stringToArray = (value: string): string[] => {
-  return value
-    .split(',')
-    .map(s => s.trim())
-    .filter(s => s.length > 0);
-};
-
-// Convert array to comma-separated string
-export const arrayToString = (arr: string[] | undefined): string => {
-  return arr ? arr.join(', ') : '';
-};
-
-// Format feature key for display
-export const formatFeatureKey = (key: string): string => {
-  return key.replace(/([A-Z])/g, ' $1').trim();
-};

package/monodog-dashboard/src/components/main-dashboard/Dashboard.tsx

@@ -1,242 +0,0 @@
-import { useState, useEffect } from 'react';
-import Configuration, { DashboardConfig } from '../configuration/Configuration';
-import SetupGuide from '../setup-guide/SetupGuide';
-import { DASHBOARD_ERROR_MESSAGES } from '../../constants/messages';
-import { cookieUtils } from '../../utils/cookies';
-
-// Import sub-components
-import {
-  Header,
-  StatsCards,
-  PackageDistribution,
-  QuickActions,
-  PackageSearchFilter,
-  PackageTable,
-} from './components';
-import { monorepoService } from '../../services/monorepoService';
-// Import types and utilities
-import { Package, PackageStats } from './types/dashboard.types';
-import {
-  calculatePackageStats,
-  getUniquePackageTypes,
-  filterPackages,
-  getStatusColor,
-  getTypeIcon,
-} from './utils/dashboard.utils';
-import { LoadingState, ErrorState } from '../modules/packages/components';
-
-// Configuration interface for customization - imported from Configuration component
-
-// Default configuration that can be overridden
-const defaultConfig: DashboardConfig = {
-  title: 'Monorepo Dashboard',
-  description: 'Visual management and monitoring of your monorepo packages',
-  packageTypes: ['app', 'lib', 'tool'],
-  features: {
-    healthChecks: true,
-    ciIntegration: true,
-    dependencyGraph: true,
-    publishControl: true,
-    searchAndFilter: true,
-    configurationInspector: true,
-  },
-  branding: {
-    primaryColor: '#3B82F6',
-    secondaryColor: '#1E40AF',
-  },
-};
-
-// Mock data - this would be replaced by actual monorepo scanning
-// const mockPackages: Package[] = [
-//   {
-//     name: 'dashboard',
-//     version: '1.0.0',
-//     type: 'app',
-//     path: 'apps/dashboard',
-//     dependencies: { react: '^18.0.0', utils: 'workspace:*' },
-//     devDependencies: { typescript: '^5.0.0' },
-//     scripts: { dev: 'vite', build: 'tsc', test: 'jest' },
-//     description: 'Main dashboard application',
-//     license: 'MIT',
-//     maintainers: ['team@company.com'],
-//   },
-//   {
-//     name: 'utils',
-//     version: '1.0.0',
-//     type: 'lib',
-//     path: 'libs/utils',
-//     dependencies: {},
-//     devDependencies: { typescript: '^5.0.0' },
-//     scripts: { build: 'tsc', test: 'jest' },
-//     description: 'Shared utility functions',
-//     license: 'MIT',
-//     maintainers: ['team@company.com'],
-//   },
-//   {
-//     name: 'backend',
-//     version: '1.0.0',
-//     type: 'app',
-//     path: 'packages/backend',
-//     dependencies: { express: '^4.18.0', utils: 'workspace:*' },
-//     devDependencies: { typescript: '^5.0.0' },
-//     scripts: { dev: 'tsx watch', start: 'tsx', build: 'tsc' },
-//     description: 'Backend API server',
-//     license: 'MIT',
-//     maintainers: ['team@company.com'],
-//   },
-// ];
-
-export default function Dashboard() {
-  const [packages, setPackages] = useState<Package[]>();
-  const [searchTerm, setSearchTerm] = useState('');
-  const [selectedType, setSelectedType] = useState<string>('all');
-  const [config, setConfig] = useState<DashboardConfig>(defaultConfig);
-  const [showConfig, setShowConfig] = useState(false);
-  const [showSetupGuide, setShowSetupGuide] = useState(false);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const [refreshing, setRefreshing] = useState(false);
-
-  // Fetch packages
-  useEffect(() => {
-    const fetchPackages = async () => {
-      try {
-        setLoading(true);
-        const data = await monorepoService.getPackages();
-        setPackages(data);
-        setError(null);
-      } catch (err) {
-        setError(DASHBOARD_ERROR_MESSAGES.FAILED_TO_FETCH_PACKAGES);
-        console.error('Error fetching packages:', err);
-      } finally {
-        setLoading(false);
-      }
-    };
-
-    fetchPackages();
-  }, []);
-
-  // Load configuration from cookies or environment
-  useEffect(() => {
-    const savedConfig = cookieUtils.get('monodog-config');
-    if (savedConfig) {
-      setConfig({ ...defaultConfig, ...JSON.parse(savedConfig) });
-    }
-  }, []);
-
-  // Save configuration to cookies
-  const handleConfigSave = (newConfig: DashboardConfig) => {
-    setConfig(newConfig);
-    cookieUtils.set('monodog-config', JSON.stringify(newConfig));
-  };
-
-  // Handle refresh action
-  const handleRefresh = async () => {
-    try {
-      setRefreshing(true);
-      setError(null);
-      setLoading(true);
-      try {
-        const data = await monorepoService.refreshPackages();
-        // console.log('package data:', data);
-        setPackages(data);
-        setError(null);
-      } catch (err) {
-        setError(DASHBOARD_ERROR_MESSAGES.FAILED_TO_FETCH_PACKAGES);
-        console.error('Error fetching package data:', err);
-      } finally {
-        setLoading(false);
-      }
-    } catch (err) {
-      setError(DASHBOARD_ERROR_MESSAGES.FAILED_TO_FETCH_PACKAGES);
-      console.error('Error refreshing package data:', err);
-    } finally {
-      setRefreshing(false);
-    }
-  };
-
- // Loading state
-  if (loading && !packages) {
-    return <LoadingState />;
-  }
-
-  // Error state
-  if (error) {
-    return <ErrorState error={error} onRetry={handleRefresh} />;
-  }
-
-  // Calculate derived data using utility functions
-  const filteredPackages = filterPackages(
-    packages ?? [],
-    searchTerm,
-    selectedType
-  );
-  const packageTypes = getUniquePackageTypes(packages ?? []);
-  const stats = calculatePackageStats(packages ?? []);
-
-  return (
-    <div className="p-6 space-y-6">
-      {/* Show refreshing overlay when refreshing with existing data */}
-      {refreshing && packages && (
-        <div className="fixed inset-0 bg-black bg-opacity-70 flex items-center justify-center z-50">
-          <div className="bg-white p-6 rounded-lg shadow-lg text-center">
-            <div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-600 mx-auto"></div>
-            <p className="mt-4 text-gray-700">Refreshing packages...</p>
-          </div>
-        </div>
-      )}
-      {/* Header Section */}
-      <Header
-        config={config}
-        onShowSetupGuide={() => setShowSetupGuide(true)}
-        onShowConfig={() => setShowConfig(true)}
-        onRefresh={handleRefresh}
-      />
-
-      {/* Statistics Cards */}
-      <StatsCards stats={stats} />
-
-      {/* Package Type Distribution */}
-      {/* <PackageDistribution
-        packages={packages ?? []}
-        packageTypes={packageTypes}
-        getTypeIcon={getTypeIcon}
-      /> */}
-
-      {/* Quick Actions */}
-      <QuickActions />
-
-      {/* Search, Filter and Package Table */}
-      <div className="bg-white p-6 rounded-lg shadow border">
-        <PackageSearchFilter
-          searchTerm={searchTerm}
-          selectedType={selectedType}
-          packageTypes={packageTypes}
-          onSearchChange={setSearchTerm}
-          onTypeChange={setSelectedType}
-        />
-
-        <PackageTable
-          packages={filteredPackages}
-          getTypeIcon={getTypeIcon}
-          getStatusColor={getStatusColor}
-        />
-      </div>
-
-      {/* Configuration Modal */}
-      <Configuration
-        isOpen={showConfig}
-        onClose={() => setShowConfig(false)}
-        onSave={handleConfigSave}
-        currentConfig={config}
-      />
-
-      {/* Setup Guide Modal */}
-      <SetupGuide
-        isOpen={showSetupGuide}
-        onClose={() => setShowSetupGuide(false)}
-        onComplete={() => setShowSetupGuide(false)}
-      />
-    </div>
-  );
-}