@rimori/client 2.4.0-next.6 → 2.4.0-next.7

package/src/cli/scripts/init/router-transformer.ts

@@ -1,332 +0,0 @@
-import * as fs from 'fs';
-import * as path from 'path';
-
-/**
- * Interface representing a detected route component
- */
-interface RouteComponent {
-  /** Component name as used in JSX */
-  componentName: string;
-  /** Original import statement */
-  importStatement: string;
-  /** Import path */
-  importPath: string;
-  /** Whether it's a default import */
-  isDefaultImport: boolean;
-}
-
-/**
- * Transform App.tsx to use PluginProvider with HashRouter instead of BrowserRouter.
- * Also converts route components to lazy loading with Suspense.
- * @param pluginId - The plugin ID to use in PluginProvider
- */
-export function transformAppRouter(pluginId: string): void {
-  const appTsxPath = path.resolve('./src/App.tsx');
-
-  if (!fs.existsSync(appTsxPath)) {
-    console.warn('Warning: App.tsx not found, skipping router transformation');
-    return;
-  }
-
-  let content = fs.readFileSync(appTsxPath, 'utf8');
-
-  // Check if PluginProvider is already applied
-  if (content.includes('PluginProvider')) {
-    console.log('✅ PluginProvider already applied, skipping router transformation');
-    return;
-  }
-
-  // Check if BrowserRouter exists
-  if (!content.includes('BrowserRouter')) {
-    console.log('✅ BrowserRouter not found, skipping router transformation');
-    return;
-  }
-
-  console.log('🔄 Transforming App.tsx to use PluginProvider with HashRouter...');
-
-  // Step 1: Detect and extract route components
-  const routeComponents = detectRouteComponents(content);
-
-  if (routeComponents.length > 0) {
-    console.log(`🔄 Found ${routeComponents.length} route components, converting to lazy loading...`);
-
-    // Step 2: Transform imports to lazy loading
-    content = transformToLazyImports(content, routeComponents);
-
-    // Step 3: Add Suspense wrapper around Routes
-    content = addSuspenseWrapper(content);
-  }
-
-  // Step 4: Transform router imports and JSX (existing functionality)
-  content = transformImports(content);
-  content = transformJSX(content, pluginId);
-
-  // Write the transformed content back
-  fs.writeFileSync(appTsxPath, content, 'utf8');
-  console.log('✅ App.tsx transformed successfully with lazy loading');
-}
-
-/**
- * Detects route components in the JSX by parsing Route elements.
- * Looks for patterns like: <Route path="/" element={<ComponentName />} />
- * @param content - The file content to analyze
- * @returns Array of detected route components with their import information
- */
-function detectRouteComponents(content: string): RouteComponent[] {
-  const routeComponents: RouteComponent[] = [];
-
-  // Regex to match Route elements with component references
-  // Matches: <Route ... element={<ComponentName .../>} ... />
-  const routeRegex = /<Route[^>]*element=\{\s*<(\w+)[^}]*\}[^>]*\/?>/g;
-
-  let match;
-  const componentNames = new Set<string>();
-
-  // Extract all unique component names from routes
-  while ((match = routeRegex.exec(content)) !== null) {
-    const componentName = match[1];
-    componentNames.add(componentName);
-  }
-
-  // For each component, find its corresponding import statement
-  componentNames.forEach((componentName) => {
-    const importInfo = findImportForComponent(content, componentName);
-    if (importInfo) {
-      routeComponents.push({
-        componentName,
-        importStatement: importInfo.importStatement,
-        importPath: importInfo.importPath,
-        isDefaultImport: importInfo.isDefaultImport,
-      });
-    }
-  });
-
-  return routeComponents;
-}
-
-/**
- * Finds the import statement for a given component name.
- * Handles both default imports and named imports.
- * @param content - The file content to search
- * @param componentName - The component name to find import for
- * @returns Import information or null if not found
- */
-function findImportForComponent(
-  content: string,
-  componentName: string,
-): {
-  importStatement: string;
-  importPath: string;
-  isDefaultImport: boolean;
-} | null {
-  // Check for default import: import ComponentName from "path"
-  const defaultImportRegex = new RegExp(`import\\s+${componentName}\\s+from\\s+["']([^"']+)["'];?`, 'g');
-  const defaultMatch = defaultImportRegex.exec(content);
-
-  if (defaultMatch) {
-    return {
-      importStatement: defaultMatch[0],
-      importPath: defaultMatch[1],
-      isDefaultImport: true,
-    };
-  }
-
-  // Check for named import: import { ComponentName } from "path"
-  const namedImportRegex = /import\s*\{\s*([^}]*)\s*\}\s*from\s*["']([^"']+)["'];?/g;
-  let namedMatch;
-
-  while ((namedMatch = namedImportRegex.exec(content)) !== null) {
-    const imports = namedMatch[1].split(',').map((imp) => imp.trim());
-    if (imports.includes(componentName)) {
-      return {
-        importStatement: namedMatch[0],
-        importPath: namedMatch[2],
-        isDefaultImport: false,
-      };
-    }
-  }
-
-  return null;
-}
-
-/**
- * Transforms regular component imports to lazy imports.
- * Converts: import ComponentName from "./path"
- * To: const ComponentName = lazy(() => import("./path"))
- * @param content - The file content to transform
- * @param routeComponents - Array of route components to transform
- * @returns Transformed content with lazy imports
- */
-function transformToLazyImports(content: string, routeComponents: RouteComponent[]): string {
-  let transformedContent = content;
-
-  // Add lazy import if not already present
-  if (!content.includes('lazy')) {
-    transformedContent = addLazyImport(transformedContent);
-  }
-
-  // Transform each route component import
-  routeComponents.forEach((component, index) => {
-    const { componentName, importStatement, importPath, isDefaultImport } = component;
-
-    // Create lazy import statement
-    const lazyImport = isDefaultImport
-      ? `const ${componentName} = lazy(() => import("${importPath}"));`
-      : `const ${componentName} = lazy(() => import("${importPath}").then(module => ({ default: module.${componentName} })));`;
-
-    // Replace the original import with lazy import
-    transformedContent = transformedContent.replace(importStatement, (index === 0 ? '\n' : '') + lazyImport);
-  });
-
-  return transformedContent;
-}
-
-/**
- * Adds lazy import from React if not already present.
- * @param content - The file content to modify
- * @returns Content with lazy import added
- */
-function addLazyImport(content: string): string {
-  // Check if React import exists and update it
-  const reactImportRegex = /import\s+(?:\*\s+as\s+)?React(?:\s*,\s*\{\s*([^}]*)\s*\})?\s+from\s+["']react["'];?/;
-  const reactImportMatch = content.match(reactImportRegex);
-
-  if (reactImportMatch) {
-    // React import exists, add lazy to it
-    const existingImports = reactImportMatch[1] || '';
-    const importList = existingImports
-      .split(',')
-      .map((imp) => imp.trim())
-      .filter(Boolean);
-
-    if (!importList.includes('lazy')) {
-      importList.push('lazy');
-    }
-    if (!importList.includes('Suspense')) {
-      importList.push('Suspense');
-    }
-
-    const newImport =
-      importList.length > 0 ? `import React, { ${importList.join(', ')} } from "react";` : `import React from "react";`;
-
-    return content.replace(reactImportMatch[0], newImport);
-  } else {
-    // No React import found, add it
-    const firstImportMatch = content.match(/^import.*$/m);
-    if (firstImportMatch) {
-      return content.replace(
-        firstImportMatch[0],
-        `import React, { lazy, Suspense } from "react";\n${firstImportMatch[0]}`,
-      );
-    } else {
-      // No imports found, add at the beginning
-      return `import React, { lazy, Suspense } from "react";\n${content}`;
-    }
-  }
-}
-
-/**
- * Wraps the Routes component with Suspense for lazy loading fallback.
- * Converts: <Routes>...</Routes>
- * To: <Suspense fallback={<div>Loading...</div>}><Routes>...</Routes></Suspense>
- * @param content - The file content to modify
- * @returns Content with Suspense wrapper added
- */
-function addSuspenseWrapper(content: string): string {
-  // Check if Suspense is already wrapping Routes
-  if (content.includes('<Suspense') && content.match(/<Suspense[^>]*>[\s\S]*<Routes/)) {
-    console.log('✅ Suspense wrapper already present');
-    return content;
-  }
-
-  // Find Routes component and wrap with Suspense
-  // Handle both self-closing and regular Routes tags
-  const routesRegex = /(<Routes(?:[^>]*)>)([\s\S]*?)(<\/Routes>)/;
-  const selfClosingRoutesRegex = /(<Routes[^>]*\/>)/;
-
-  const routesMatch = content.match(routesRegex);
-  const selfClosingMatch = content.match(selfClosingRoutesRegex);
-
-  if (routesMatch) {
-    // Regular Routes with children
-    const [fullMatch, openTag, children, closeTag] = routesMatch;
-    const suspenseWrapper = `<Suspense fallback={<div className="flex items-center justify-center min-h-screen"><div className="text-lg">Loading...</div></div>}>\n        ${openTag}${children}${closeTag}\n      </Suspense>`;
-    return content.replace(fullMatch, suspenseWrapper);
-  } else if (selfClosingMatch) {
-    // Self-closing Routes
-    const suspenseWrapper = `<Suspense fallback={<div className="flex items-center justify-center min-h-screen"><div className="text-lg">Loading...</div></div>}>\n        ${selfClosingMatch[1]}\n      </Suspense>`;
-    return content.replace(selfClosingMatch[1], suspenseWrapper);
-  }
-
-  console.log('✅ Routes component not found, skipping Suspense wrapper');
-  return content;
-}
-
-/**
- * Transform the import statements to include PluginProvider and change BrowserRouter to HashRouter.
- * This is the original functionality for router transformation.
- * @param content - The file content to transform
- * @returns Transformed content with updated imports
- */
-function transformImports(content: string): string {
-  // Add PluginProvider import
-  if (!content.includes('import') || !content.includes('@rimori/client')) {
-    // Add new import line for PluginProvider
-    const importMatch = content.match(/^(import.*from\s+["']react["'];?\s*\n)/m);
-    if (importMatch) {
-      content = content.replace(importMatch[0], `${importMatch[0]}import { PluginProvider } from "@rimori/client";\n`);
-    } else {
-      // If no React import found, add at the beginning
-      content = `import { PluginProvider } from "@rimori/client";\n${content}`;
-    }
-  } else {
-    // Update existing @rimori/client import to include PluginProvider
-    content = content.replace(/import\s*{\s*([^}]*)\s*}\s*from\s*["']@rimori\/client["'];?/, (match, imports) => {
-      const importList = imports
-        .split(',')
-        .map((imp: string) => imp.trim())
-        .filter(Boolean);
-      if (!importList.includes('PluginProvider')) {
-        importList.push('PluginProvider');
-      }
-      return `import { ${importList.join(', ')} } from "@rimori/client";`;
-    });
-  }
-
-  // Transform react-router-dom import: replace BrowserRouter with HashRouter
-  content = content.replace(/import\s*{\s*([^}]*)\s*}\s*from\s*["']react-router-dom["'];?/, (match, imports) => {
-    const importList = imports
-      .split(',')
-      .map((imp: string) => imp.trim())
-      .filter(Boolean);
-    const updatedImports = importList.map((imp: string) => (imp === 'BrowserRouter' ? 'HashRouter' : imp));
-    return `import { ${updatedImports.join(', ')} } from "react-router-dom";`;
-  });
-
-  return content;
-}
-
-/**
- * Transform the JSX to wrap with PluginProvider and change BrowserRouter to HashRouter.
- * This is the original functionality for router transformation.
- * @param content - The file content to transform
- * @param pluginId - The plugin ID to use in PluginProvider
- * @returns Transformed content with updated JSX
- */
-function transformJSX(content: string, pluginId: string): string {
-  // Replace opening BrowserRouter tag
-  content = content.replace(
-    /<BrowserRouter(\s[^>]*)?>/,
-    `<PluginProvider pluginId="${pluginId}">
-      <HashRouter future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>`,
-  );
-
-  // Replace closing BrowserRouter tag
-  content = content.replace(
-    /<\/BrowserRouter>/,
-    `</HashRouter>
-    </PluginProvider>`,
-  );
-
-  return content;
-}

package/src/cli/scripts/init/tailwind-config.ts

@@ -1,66 +0,0 @@
-import * as fs from 'fs';
-import * as path from 'path';
-
-/**
- * Updates the tailwind.config.ts file to set darkMode to "class" and add the Rimori client package to content.
- */
-export function updateTailwindConfig(): void {
-  console.log('Updating Tailwind CSS configuration...');
-
-  const tailwindConfigPath = path.resolve('./tailwind.config.ts');
-
-  if (!fs.existsSync(tailwindConfigPath)) {
-    console.log('Warning: tailwind.config.ts not found, skipping Tailwind CSS update');
-    return;
-  }
-
-  try {
-    const configContent = fs.readFileSync(tailwindConfigPath, 'utf8');
-
-    let updatedContent = configContent;
-
-    // Set darkMode to "class" if it exists, otherwise add it
-    if (updatedContent.includes('darkMode:')) {
-      updatedContent = updatedContent.replace(/darkMode:\s*\[?"[^"]*"?\]?,?/g, 'darkMode: ["class"],');
-    } else {
-      // Add darkMode after the opening brace
-      updatedContent = updatedContent.replace(/export default \{/, 'export default {\n  darkMode: ["class"],');
-    }
-
-    // Add Rimori client package to content array if not already present
-    if (!updatedContent.includes('node_modules/@rimori/client')) {
-      // Find the content array and add the Rimori client path
-      if (updatedContent.includes('content:')) {
-        // More precise regex to handle the content array properly
-        updatedContent = updatedContent.replace(/(content:\s*\[)([\s\S]*?)(\])/, (match, start, content, end) => {
-          // Clean up any existing double commas first
-          let cleanContent = content.replace(/,\s*,/g, ',');
-
-          // Remove trailing comma and whitespace
-          cleanContent = cleanContent.replace(/,\s*$/, '');
-
-          // Add the new path with proper formatting
-          const newPath = '"node_modules/@rimori/client/dist/components/**/*.{js,jsx}"';
-
-          // If content is not empty, add comma before new entry
-          if (cleanContent.trim()) {
-            return `${start}${cleanContent},\n    ${newPath}\n  ${end}`;
-          } else {
-            return `${start}\n    ${newPath}\n  ${end}`;
-          }
-        });
-      } else {
-        // Add content array if it doesn't exist
-        updatedContent = updatedContent.replace(
-          /darkMode: \["class"\],/,
-          'darkMode: ["class"],\n  content: [\n    "./src/**/*.{js,jsx,ts,tsx}",\n    "node_modules/@rimori/client/dist/components/**/*.{js,jsx}"\n  ],',
-        );
-      }
-    }
-
-    fs.writeFileSync(tailwindConfigPath, updatedContent, 'utf8');
-    console.log('✅ Tailwind CSS configuration updated');
-  } catch (error) {
-    console.warn(`Warning: Could not update tailwind.config.ts: ${error instanceof Error ? error.message : error}`);
-  }
-}

package/src/cli/scripts/init/vite-config.ts

@@ -1,73 +0,0 @@
-import * as fs from 'fs';
-import * as path from 'path';
-
-/**
- * Updates the vite.config.ts file to set the base property.
- * @param param
- * @param param.basePath - The base path to set in vite config (defaults to './')
- * @param param.configPath - Path to the vite.config.ts file (defaults to './vite.config.ts')
- * @throws {Error} if vite.config.ts file is not found or cannot be modified.
- */
-export function updateViteConfigBase({
-  basePath = './',
-  configPath = './vite.config.ts',
-}: {
-  basePath?: string;
-  configPath?: string;
-} = {}): void {
-  const viteConfigPath = path.resolve(configPath);
-
-  if (!fs.existsSync(viteConfigPath)) {
-    throw new Error(`vite.config.ts not found at ${viteConfigPath}`);
-  }
-
-  let configContent = fs.readFileSync(viteConfigPath, 'utf8');
-
-  // Check if base property already exists
-  const baseRegex = /base:\s*['"][^'"]*['"],?\s*/;
-  const hasBase = baseRegex.test(configContent);
-
-  if (hasBase) {
-    // Update existing base property
-    configContent = configContent.replace(baseRegex, `base: '${basePath}',`);
-    console.log(`Updated existing base property in vite.config.ts to '${basePath}'`);
-  } else {
-    // Add base property before server config
-    const serverRegex = /(\s*)(server:\s*\{)/;
-    const serverMatch = configContent.match(serverRegex);
-
-    if (serverMatch) {
-      const indentation = serverMatch[1] || '  '; // Use existing indentation or default to 2 spaces
-      const replacement = `${indentation}base: '${basePath}',${indentation}${serverMatch[2]}`;
-      configContent = configContent.replace(serverRegex, replacement);
-      console.log(`Added base property to vite.config.ts with value '${basePath}'`);
-    } else {
-      throw new Error('Could not find server config in vite.config.ts to add base property before it');
-    }
-  }
-
-  fs.writeFileSync(viteConfigPath, configContent, 'utf8');
-}
-
-/**
- * Reads the current base value from vite.config.ts.
- * @param param
- * @param param.configPath - Path to the vite.config.ts file (defaults to './vite.config.ts')
- * @returns The current base value or null if not found.
- */
-export function getCurrentViteBase({
-  configPath = './vite.config.ts',
-}: {
-  configPath?: string;
-} = {}): string | null {
-  const viteConfigPath = path.resolve(configPath);
-
-  if (!fs.existsSync(viteConfigPath)) {
-    return null;
-  }
-
-  const configContent = fs.readFileSync(viteConfigPath, 'utf8');
-  const baseMatch = configContent.match(/base:\s*['"]([^'"]*)['"]/);
-
-  return baseMatch ? baseMatch[1] : null;
-}

package/src/cli/scripts/release/detect-translation-languages.ts

@@ -1,37 +0,0 @@
-import fs from 'fs';
-
-/**
- * Detect available translation languages from public/locales directory
- * @returns Promise<string[]> Array of language codes found in the locales directory
- */
-export async function detectTranslationLanguages(): Promise<string[]> {
-  const localesPath = './public/locales';
-
-  try {
-    await fs.promises.access(localesPath);
-  } catch (e) {
-    console.log('⚠️ No locales directory found, no translations available');
-    return [];
-  }
-
-  try {
-    const files = await fs.promises.readdir(localesPath);
-
-    // Filter out local- files and only include .json files
-    const translationFiles = files.filter((file) => file.endsWith('.json') && !file.startsWith('local-'));
-
-    if (translationFiles.length === 0) {
-      console.log('⚠️ No translation files found (excluding local- files)');
-      return [];
-    }
-
-    // Extract language codes from filenames (e.g., en.json -> en)
-    const languages = translationFiles.map((file) => file.replace('.json', ''));
-
-    console.log(`🌐 Found ${languages.length} translation languages: ${languages.join(', ')}`);
-    return languages;
-  } catch (error: any) {
-    console.error(`❌ Error reading locales directory:`, error.message);
-    return [];
-  }
-}

package/src/cli/scripts/release/release-config-upload.ts

@@ -1,119 +0,0 @@
-import fs from 'fs';
-import path from 'path';
-import ts from 'typescript';
-import { Config } from './release.js';
-import { detectTranslationLanguages } from './detect-translation-languages.js';
-
-/**
- * Read and send the rimori configuration to the release endpoint
- * @param config - Configuration object
- */
-export async function sendConfiguration(config: Config): Promise<string> {
-  const configPath = path.resolve('./rimori/rimori.config.ts');
-
-  // Check if config file exists
-  try {
-    await fs.promises.access(configPath);
-  } catch (e) {
-    throw new Error('Could not find rimori.config.ts in ./rimori/ directory');
-  }
-
-  try {
-    let configObject;
-
-    // Use TypeScript compiler to transpile and load
-    const configContent = await fs.promises.readFile(configPath, 'utf8');
-
-    // Transpile TypeScript to JavaScript
-    const result = ts.transpile(configContent, {
-      target: ts.ScriptTarget.ES2020,
-      module: ts.ModuleKind.ES2020,
-    });
-
-    // Create a temporary file to import the transpiled code
-    const tempFile = path.join(process.cwd(), 'temp_config.js');
-    await fs.promises.writeFile(tempFile, result);
-
-    try {
-      // Use dynamic import to load the config
-      const config = await import(`file://${tempFile}`);
-      configObject = config.default || config;
-
-      // Clean up temp file
-      await fs.promises.unlink(tempFile);
-    } catch (error) {
-      // Clean up temp file even on error
-      try {
-        await fs.promises.unlink(tempFile);
-      } catch (e) {}
-      throw error;
-    }
-
-    if (!configObject) {
-      throw new Error('Configuration object is empty or undefined');
-    }
-
-    // Detect available translation languages
-    const availableLanguages = await detectTranslationLanguages();
-
-    console.log(`🚀 Sending configuration...`);
-
-    const requestBody = {
-      config: configObject,
-      version: config.version,
-      plugin_id: config.plugin_id,
-      release_channel: config.release_channel,
-      rimori_client_version: config.rimori_client_version,
-      provided_languages: availableLanguages.join(','),
-    };
-
-    try {
-      const response = await fetch(`${config.domain}/release`, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-          Authorization: `Bearer ${config.token}`,
-        },
-        body: JSON.stringify(requestBody),
-      });
-
-      const responseText = await response.text();
-      console.log('Configuration response status:', response.status);
-      console.log('Configuration response text:', responseText);
-
-      const responseData = JSON.parse(responseText);
-      if (response.ok) {
-        console.log('✅ Configuration deployed successfully!');
-        return responseData.release_id;
-      } else {
-        console.log('❌ Configuration failed!');
-        console.log('Error:', responseData.error || 'Unknown error');
-        console.log('Response data:', JSON.stringify(responseData, null, 2));
-        throw new Error('Configuration upload failed');
-      }
-    } catch (e) {
-      console.log('error', e);
-      throw new Error('Error sending configuration');
-    }
-  } catch (error: any) {
-    console.error('❌ Error sending configuration:', error.message);
-    throw error;
-  }
-}
-
-export async function releasePlugin(config: Config, release_id: string): Promise<void> {
-  const response = await fetch(`${config.domain}/release/${release_id}/release`, {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${config.token}`,
-    },
-    body: JSON.stringify({ plugin_id: config.plugin_id }),
-  });
-
-  if (!response.ok) {
-    console.log('Response:', await response.text());
-    throw new Error('Failed to release plugin');
-  }
-  console.log('✅ Plugin released successfully');
-}