@postxl/generators 0.2.2

package/dist/frontend-admin/generators/data-management-page.generator.js

@@ -0,0 +1,778 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateDataManagementPage = generateDataManagementPage;
+const Generator = __importStar(require("@postxl/generator"));
+/**
+ * Generator function that generates the Data Management page
+ */
+function generateDataManagementPage({ context: { admin } }) {
+    const imports = Generator.ImportGenerator
+        //
+        .from(admin.pages.dataManagement.pageComponent.location)
+        .add(admin.components.sidebar);
+    return `import { useState } from 'react'
+
+import { APP_CONFIG } from '@lib/config'
+${imports.generate()}
+
+export default function DataManagementPage() {
+  const [loading, setLoading] = useState<Record<string, boolean>>({})
+  const [status, setStatus] = useState<Record<string, { type: 'success' | 'error'; message: string }>>({})
+
+  // Helper to construct API URLs
+  const getDataManagementUrl = (endpoint: string) => \`\${APP_CONFIG.apiURL}/data-management/\${endpoint}\`
+
+  // Helper function to handle file download
+  const downloadFile = (blob: Blob, filename: string) => {
+    const url = URL.createObjectURL(blob)
+    const a = document.createElement('a')
+    a.href = url
+    a.download = filename
+    a.click()
+    URL.revokeObjectURL(url)
+  }
+
+  // Helper function to get filename from Content-Disposition header
+  const getFilename = (contentDisposition: string | null): string => {
+    if (!contentDisposition) {
+      return 'export.json'
+    }
+    const match = /filename="(.+)"/.exec(contentDisposition)
+    return match ? match[1] : 'export.json'
+  }
+
+  // ============================================================================
+  // Export Functions
+  // ============================================================================
+
+  const handleExportRawExcel = async (file: File) => {
+    const key = 'export-raw-excel'
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('export-raw-excel'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const blob = await response.blob()
+        const filename = getFilename(response.headers.get('Content-Disposition'))
+        downloadFile(blob, filename)
+        setStatus({ ...status, [key]: { type: 'success', message: 'Export successful!' } })
+      } else {
+        throw new Error('Export failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  const handleExportProcessedExcel = async (file: File) => {
+    const key = 'export-processed-excel'
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('export-processed-excel'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const blob = await response.blob()
+        const filename = getFilename(response.headers.get('Content-Disposition'))
+        downloadFile(blob, filename)
+        setStatus({ ...status, [key]: { type: 'success', message: 'Export successful!' } })
+      } else {
+        throw new Error('Export failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  const handleExportDatabaseExcelFormat = async () => {
+    const key = 'export-db-excel'
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const response = await fetch(getDataManagementUrl('export-database-excel-format'))
+
+      if (response.ok) {
+        const blob = await response.blob()
+        const filename = getFilename(response.headers.get('Content-Disposition'))
+        downloadFile(blob, filename)
+        setStatus({ ...status, [key]: { type: 'success', message: 'Export successful!' } })
+      } else {
+        throw new Error('Export failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  const handleExportDatabaseJsonFormat = async () => {
+    const key = 'export-db-json'
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const response = await fetch(getDataManagementUrl('export-database-json-format'))
+
+      if (response.ok) {
+        const blob = await response.blob()
+        const filename = getFilename(response.headers.get('Content-Disposition'))
+        downloadFile(blob, filename)
+        setStatus({ ...status, [key]: { type: 'success', message: 'Export successful!' } })
+      } else {
+        throw new Error('Export failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  // ============================================================================
+  // Seed Functions (Clear DB + Import)
+  // ============================================================================
+
+  const handleSeedFromRawExcel = async (file: File) => {
+    const key = 'seed-raw-excel'
+    if (!confirm('⚠️ This will DELETE ALL DATA and seed from the uploaded Excel file. Are you sure?')) {
+      return
+    }
+
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('seed-from-raw-excel'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const result = await response.json()
+        setStatus({
+          ...status,
+          [key]: { type: 'success', message: \`Seeded: \${JSON.stringify(result.result, null, 2)}\` },
+        })
+      } else {
+        const error = await response.json()
+        throw new Error(error.error || 'Seed failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  const handleSeedFromDecodedJson = async (file: File) => {
+    const key = 'seed-decoded-json'
+    if (!confirm('⚠️ This will DELETE ALL DATA and seed from the uploaded JSON file. Are you sure?')) {
+      return
+    }
+
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('seed-from-decoded-json'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const result = await response.json()
+        setStatus({
+          ...status,
+          [key]: { type: 'success', message: \`Seeded: \${JSON.stringify(result.result, null, 2)}\` },
+        })
+      } else {
+        const error = await response.json()
+        throw new Error(error.error || 'Seed failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  const handleSeedFromExcelFormattedJson = async (file: File) => {
+    const key = 'seed-excel-json'
+    if (!confirm('⚠️ This will DELETE ALL DATA and seed from the uploaded JSON file. Are you sure?')) {
+      return
+    }
+
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('seed-from-excel-formatted-json'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const result = await response.json()
+        setStatus({
+          ...status,
+          [key]: { type: 'success', message: \`Seeded: \${JSON.stringify(result.result, null, 2)}\` },
+        })
+      } else {
+        const error = await response.json()
+        throw new Error(error.error || 'Seed failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  const handleSeedFromJsonFormattedJson = async (file: File) => {
+    const key = 'seed-json-json'
+    if (!confirm('⚠️ This will DELETE ALL DATA and seed from the uploaded JSON file. Are you sure?')) {
+      return
+    }
+
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('seed-from-json-formatted-json'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const result = await response.json()
+        setStatus({
+          ...status,
+          [key]: { type: 'success', message: \`Seeded: \${JSON.stringify(result.result, null, 2)}\` },
+        })
+      } else {
+        const error = await response.json()
+        throw new Error(error.error || 'Seed failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  // ============================================================================
+  // Update Functions (Delta Detection + Import)
+  // ============================================================================
+
+  const handleUpdateFromRawExcel = async (file: File) => {
+    const key = 'update-raw-excel'
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('update-from-raw-excel'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const result = await response.json()
+        if (result.success) {
+          setStatus({
+            ...status,
+            [key]: { type: 'success', message: \`Updated! Delta: \${JSON.stringify(result.result, null, 2)}\` },
+          })
+        } else {
+          setStatus({ ...status, [key]: { type: 'error', message: \`Errors: \${JSON.stringify(result.errors)}\` } })
+        }
+      } else {
+        const error = await response.json()
+        throw new Error(error.error || 'Update failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  const handleUpdateFromDecodedJson = async (file: File) => {
+    const key = 'update-decoded-json'
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('update-from-decoded-json'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const result = await response.json()
+        if (result.success) {
+          setStatus({
+            ...status,
+            [key]: { type: 'success', message: \`Updated! Delta: \${JSON.stringify(result.result, null, 2)}\` },
+          })
+        } else {
+          setStatus({ ...status, [key]: { type: 'error', message: \`Errors: \${JSON.stringify(result.errors)}\` } })
+        }
+      } else {
+        const error = await response.json()
+        throw new Error(error.error || 'Update failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  const handleUpdateFromExcelFormattedJson = async (file: File) => {
+    const key = 'update-excel-json'
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('update-from-excel-formatted-json'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const result = await response.json()
+        if (result.success) {
+          setStatus({
+            ...status,
+            [key]: { type: 'success', message: \`Updated! Delta: \${JSON.stringify(result.result, null, 2)}\` },
+          })
+        } else {
+          setStatus({ ...status, [key]: { type: 'error', message: \`Errors: \${JSON.stringify(result.errors)}\` } })
+        }
+      } else {
+        const error = await response.json()
+        throw new Error(error.error || 'Update failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  const handleUpdateFromJsonFormattedJson = async (file: File) => {
+    const key = 'update-json-json'
+    setLoading({ ...loading, [key]: true })
+    setStatus({ ...status, [key]: undefined! })
+
+    try {
+      const formData = new FormData()
+      formData.append('file', file)
+
+      const response = await fetch(getDataManagementUrl('update-from-json-formatted-json'), {
+        method: 'POST',
+        body: formData,
+      })
+
+      if (response.ok) {
+        const result = await response.json()
+        if (result.success) {
+          setStatus({
+            ...status,
+            [key]: { type: 'success', message: \`Updated! Delta: \${JSON.stringify(result.result, null, 2)}\` },
+          })
+        } else {
+          setStatus({ ...status, [key]: { type: 'error', message: \`Errors: \${JSON.stringify(result.errors)}\` } })
+        }
+      } else {
+        const error = await response.json()
+        throw new Error(error.error || 'Update failed')
+      }
+    } catch (error) {
+      setStatus({ ...status, [key]: { type: 'error', message: \`Error: \${String(error)}\` } })
+    } finally {
+      setLoading({ ...loading, [key]: false })
+    }
+  }
+
+  return (
+    <div className="flex min-h-screen">
+      <AdminSidebar />
+
+      <div className="flex-1 p-8">
+        <div className="max-w-7xl mx-auto">
+          <h1 className="text-4xl font-bold mb-4">Data Management</h1>
+          <p className="text-gray-600 dark:text-gray-400 mb-8">
+            Advanced tools for importing and exporting data. Only available in development mode.
+          </p>
+
+          {/* 3x4 Grid */}
+          <div className="overflow-x-auto">
+            <table className="w-full border-collapse border border-gray-300 dark:border-gray-700">
+              <thead>
+                <tr className="bg-gray-100 dark:bg-gray-800">
+                  <th className="border border-gray-300 dark:border-gray-700 p-4 text-left font-semibold">Data Type</th>
+                  <th className="border border-gray-300 dark:border-gray-700 p-4 text-left font-semibold">
+                    Export to JSON
+                  </th>
+                  <th className="border border-gray-300 dark:border-gray-700 p-4 text-left font-semibold">
+                    Seed from JSON (Empty DB)
+                  </th>
+                  <th className="border border-gray-300 dark:border-gray-700 p-4 text-left font-semibold">
+                    Update from JSON (Delta)
+                  </th>
+                </tr>
+              </thead>
+              <tbody>
+                {/* Row 1: Raw Excel */}
+                <tr>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4 font-medium">Raw Excel</td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Export Raw Excel File">
+                      <input
+                        type="file"
+                        accept=".xlsx,.xls"
+                        onChange={(e) => e.target.files?.[0] && handleExportRawExcel(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['export-raw-excel']}
+                      />
+                    </label>
+                    {status['export-raw-excel'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 \${status['export-raw-excel'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['export-raw-excel'].message}
+                      </div>
+                    )}
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Seed from Raw Excel File">
+                      <input
+                        type="file"
+                        accept=".xlsx,.xls"
+                        onChange={(e) => e.target.files?.[0] && handleSeedFromRawExcel(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['seed-raw-excel']}
+                      />
+                    </label>
+                    {status['seed-raw-excel'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 whitespace-pre-wrap \${status['seed-raw-excel'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['seed-raw-excel'].message}
+                      </div>
+                    )}
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Update from Raw Excel File">
+                      <input
+                        type="file"
+                        accept=".xlsx,.xls"
+                        onChange={(e) => e.target.files?.[0] && handleUpdateFromRawExcel(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['update-raw-excel']}
+                      />
+                    </label>
+                    {status['update-raw-excel'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 whitespace-pre-wrap \${status['update-raw-excel'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['update-raw-excel'].message}
+                      </div>
+                    )}
+                  </td>
+                </tr>
+
+                {/* Row 2: Decoded */}
+                <tr>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4 font-medium">Decoded</td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Export Decoded Excel File">
+                      <input
+                        type="file"
+                        accept=".xlsx,.xls"
+                        onChange={(e) => e.target.files?.[0] && handleExportProcessedExcel(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['export-processed-excel']}
+                      />
+                    </label>
+                    {status['export-processed-excel'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 \${status['export-processed-excel'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['export-processed-excel'].message}
+                      </div>
+                    )}
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Seed from Decoded JSON File">
+                      <input
+                        type="file"
+                        accept=".json"
+                        onChange={(e) => e.target.files?.[0] && handleSeedFromDecodedJson(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['seed-decoded-json']}
+                      />
+                    </label>
+                    {status['seed-decoded-json'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 whitespace-pre-wrap \${status['seed-decoded-json'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['seed-decoded-json'].message}
+                      </div>
+                    )}
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Update from Decoded JSON File">
+                      <input
+                        type="file"
+                        accept=".json"
+                        onChange={(e) => e.target.files?.[0] && handleUpdateFromDecodedJson(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['update-decoded-json']}
+                      />
+                    </label>
+                    {status['update-decoded-json'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 whitespace-pre-wrap \${status['update-decoded-json'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['update-decoded-json'].message}
+                      </div>
+                    )}
+                  </td>
+                </tr>
+
+                {/* Row 3: Current DB (Excel Format) */}
+                <tr>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4 font-medium">
+                    Current DB
+                    <br />
+                    <span className="text-xs text-gray-500">(Excel Format)</span>
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <button
+                      onClick={handleExportDatabaseExcelFormat}
+                      disabled={loading['export-db-excel']}
+                      className="px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700 disabled:bg-gray-400 text-sm"
+                    >
+                      {loading['export-db-excel'] ? 'Exporting...' : 'Export Database'}
+                    </button>
+                    {status['export-db-excel'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 \${status['export-db-excel'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['export-db-excel'].message}
+                      </div>
+                    )}
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Seed from Excel Formatted JSON File">
+                      <input
+                        type="file"
+                        accept=".json"
+                        onChange={(e) => e.target.files?.[0] && handleSeedFromExcelFormattedJson(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['seed-excel-json']}
+                      />
+                    </label>
+                    {status['seed-excel-json'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 whitespace-pre-wrap \${status['seed-excel-json'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['seed-excel-json'].message}
+                      </div>
+                    )}
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Update from Excel Formatted JSON File">
+                      <input
+                        type="file"
+                        accept=".json"
+                        onChange={(e) => e.target.files?.[0] && handleUpdateFromExcelFormattedJson(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['update-excel-json']}
+                      />
+                    </label>
+                    {status['update-excel-json'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 whitespace-pre-wrap \${status['update-excel-json'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['update-excel-json'].message}
+                      </div>
+                    )}
+                  </td>
+                </tr>
+
+                {/* Row 4: Current DB (JSON Format) */}
+                <tr>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4 font-medium">
+                    Current DB
+                    <br />
+                    <span className="text-xs text-gray-500">(JSON Format)</span>
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <button
+                      onClick={handleExportDatabaseJsonFormat}
+                      disabled={loading['export-db-json']}
+                      className="px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700 disabled:bg-gray-400 text-sm"
+                    >
+                      {loading['export-db-json'] ? 'Exporting...' : 'Export Database'}
+                    </button>
+                    {status['export-db-json'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 \${status['export-db-json'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['export-db-json'].message}
+                      </div>
+                    )}
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Seed from JSON Formatted JSON File">
+                      <input
+                        type="file"
+                        accept=".json"
+                        onChange={(e) => e.target.files?.[0] && handleSeedFromJsonFormattedJson(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['seed-json-json']}
+                      />
+                    </label>
+                    {status['seed-json-json'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 whitespace-pre-wrap \${status['seed-json-json'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['seed-json-json'].message}
+                      </div>
+                    )}
+                  </td>
+                  <td className="border border-gray-300 dark:border-gray-700 p-4">
+                    <label className="block" aria-label="Update from JSON Formatted JSON File">
+                      <input
+                        type="file"
+                        accept=".json"
+                        onChange={(e) => e.target.files?.[0] && handleUpdateFromJsonFormattedJson(e.target.files[0])}
+                        className="block w-full text-sm"
+                        disabled={loading['update-json-json']}
+                      />
+                    </label>
+                    {status['update-json-json'] && (
+                      <div
+                        className={\`text-xs mt-2 max-h-32 overflow-y-auto border rounded p-2 whitespace-pre-wrap \${status['update-json-json'].type === 'success' ? 'text-green-600 border-green-300 bg-green-50' : 'text-red-600 border-red-300 bg-red-50'}\`}
+                      >
+                        {status['update-json-json'].message}
+                      </div>
+                    )}
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          {/* Legend */}
+          <div className="mt-8 p-4 bg-gray-50 dark:bg-gray-900 rounded">
+            <h3 className="font-semibold mb-2">Legend:</h3>
+            <ul className="text-sm space-y-1 text-gray-600 dark:text-gray-400">
+              <li>
+                <strong>Raw Excel:</strong> Upload Excel file → returns cleaned tables as JSON
+              </li>
+              <li>
+                <strong>Decoded:</strong> Upload Excel file → decode to DataModel → returns as JSON
+              </li>
+              <li>
+                <strong>Current DB (Excel Format):</strong> Export all data from database as ExcelDataModelFlattened
+                (PascalCase keys)
+              </li>
+              <li>
+                <strong>Current DB (JSON Format):</strong> Export all data from database as DataModelFlattened
+                (camelCase keys)
+              </li>
+              <li>
+                <strong>Seed:</strong> Clears all data in database, then imports from uploaded file
+              </li>
+              <li>
+                <strong>Update:</strong> Runs delta detection and updates database accordingly (no data loss)
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}
+`;
+}
+//# sourceMappingURL=data-management-page.generator.js.map