mirror of
https://github.com/johndoe6345789/low-code-react-app-b.git
synced 2026-04-24 21:54:56 +00:00
Remove legacy App files and obsolete documentation
Co-authored-by: johndoe6345789 <224850594+johndoe6345789@users.noreply.github.com>
This commit is contained in:
@@ -1,11 +0,0 @@
|
||||
import { JSONUIShowcase } from '@/components/organisms/JSONUIShowcase'
|
||||
import { Toaster } from '@/components/ui/sonner'
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<div className="h-screen bg-background text-foreground">
|
||||
<JSONUIShowcase />
|
||||
<Toaster />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,35 +0,0 @@
|
||||
import { useState } from 'react'
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
|
||||
import { Button } from '@/components/ui/button'
|
||||
import { toast } from 'sonner'
|
||||
|
||||
function AppMinimal() {
|
||||
const [count, setCount] = useState(0)
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-background p-8">
|
||||
<Card className="max-w-2xl mx-auto">
|
||||
<CardHeader>
|
||||
<CardTitle>CodeForge - Minimal Test</CardTitle>
|
||||
<CardDescription>Testing if the basic app loads</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<p className="text-foreground">Count: {count}</p>
|
||||
<div className="flex gap-2">
|
||||
<Button onClick={() => setCount(c => c + 1)}>
|
||||
Increment
|
||||
</Button>
|
||||
<Button variant="outline" onClick={() => toast.success('Toast works!')}>
|
||||
Test Toast
|
||||
</Button>
|
||||
</div>
|
||||
<p className="text-sm text-muted-foreground">
|
||||
If you can see this, the basic React app is loading correctly.
|
||||
</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default AppMinimal
|
||||
353
src/App.new.tsx
353
src/App.new.tsx
@@ -1,353 +0,0 @@
|
||||
/**
|
||||
* LEGACY FILE - NOT USED IN PRODUCTION
|
||||
*
|
||||
* This file is a legacy demo app that is not actively used.
|
||||
* The JSON components used here manage their own state internally via hooks (e.g., useKV)
|
||||
* and don't accept props like the old stub components did.
|
||||
*
|
||||
* The production app (App.tsx) uses the component registry pattern instead.
|
||||
*/
|
||||
import { useState } from 'react'
|
||||
import { toast } from 'sonner'
|
||||
import { Tabs, TabsContent } from '@/components/ui/tabs'
|
||||
import { AppHeader, PageHeader } from '@/components/organisms'
|
||||
import { ProjectDashboard } from '@/components/ProjectDashboard'
|
||||
import { CodeEditor } from '@/components/CodeEditor'
|
||||
import { JSONModelDesigner } from '@/components/JSONModelDesigner'
|
||||
import { ComponentTreeBuilder } from '@/components/ComponentTreeBuilder'
|
||||
import { JSONComponentTreeManager } from '@/components/JSONComponentTreeManager'
|
||||
import { JSONWorkflowDesigner } from '@/components/JSONWorkflowDesigner'
|
||||
import { JSONLambdaDesigner } from '@/components/JSONLambdaDesigner'
|
||||
import { JSONStyleDesigner } from '@/components/JSONStyleDesigner'
|
||||
import { FileExplorer } from '@/components/FileExplorer'
|
||||
import { PlaywrightDesigner } from '@/components/PlaywrightDesigner'
|
||||
import { StorybookDesigner } from '@/components/StorybookDesigner'
|
||||
import { UnitTestDesigner } from '@/components/UnitTestDesigner'
|
||||
import { JSONFlaskDesigner } from '@/components/JSONFlaskDesigner'
|
||||
import { ProjectSettingsDesigner } from '@/components/ProjectSettingsDesigner'
|
||||
import { ErrorPanel } from '@/components/ErrorPanel'
|
||||
import { DocumentationView } from '@/components/DocumentationView'
|
||||
import { SassStylesShowcase } from '@/components/SassStylesShowcase'
|
||||
import { FeatureToggleSettings } from '@/components/FeatureToggleSettings'
|
||||
import { PWAInstallPrompt } from '@/components/PWAInstallPrompt'
|
||||
import { PWAUpdatePrompt } from '@/components/PWAUpdatePrompt'
|
||||
import { PWAStatusBar } from '@/components/PWAStatusBar'
|
||||
import { PWASettings } from '@/components/PWASettings'
|
||||
import { FaviconDesigner } from '@/components/FaviconDesigner'
|
||||
import { FeatureIdeaCloud } from '@/components/FeatureIdeaCloud'
|
||||
import { GlobalSearch } from '@/components/GlobalSearch'
|
||||
import { KeyboardShortcutsDialog } from '@/components/KeyboardShortcutsDialog'
|
||||
import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from '@/components/ui/resizable'
|
||||
import { useProjectState } from '@/hooks/use-project-state'
|
||||
import { useFileOperations } from '@/hooks/use-file-operations'
|
||||
import { useProjectExport } from '@/hooks/use-project-export'
|
||||
import { useKeyboardShortcuts } from '@/hooks/use-keyboard-shortcuts'
|
||||
import { useAutoRepair } from '@/hooks/use-auto-repair'
|
||||
|
||||
function App() {
|
||||
const {
|
||||
files,
|
||||
models,
|
||||
components,
|
||||
componentTrees,
|
||||
workflows,
|
||||
lambdas,
|
||||
theme,
|
||||
playwrightTests,
|
||||
storybookStories,
|
||||
unitTests,
|
||||
flaskConfig,
|
||||
nextjsConfig,
|
||||
npmSettings,
|
||||
featureToggles,
|
||||
setFiles,
|
||||
setModels,
|
||||
setComponents,
|
||||
setComponentTrees,
|
||||
setWorkflows,
|
||||
setLambdas,
|
||||
setTheme,
|
||||
setPlaywrightTests,
|
||||
setStorybookStories,
|
||||
setUnitTests,
|
||||
setFlaskConfig,
|
||||
setNextjsConfig,
|
||||
setNpmSettings,
|
||||
setFeatureToggles,
|
||||
} = useProjectState()
|
||||
|
||||
const [lastSaved] = useState<number | null>(Date.now())
|
||||
|
||||
const getCurrentProject = () => ({
|
||||
name: nextjsConfig.appName,
|
||||
files,
|
||||
models,
|
||||
components,
|
||||
componentTrees,
|
||||
workflows,
|
||||
lambdas,
|
||||
theme,
|
||||
playwrightTests,
|
||||
storybookStories,
|
||||
unitTests,
|
||||
flaskConfig,
|
||||
nextjsConfig,
|
||||
npmSettings,
|
||||
featureToggles,
|
||||
})
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
const loadProject = (project: any) => {
|
||||
if (project.files) setFiles(project.files)
|
||||
if (project.models) setModels(project.models)
|
||||
if (project.components) setComponents(project.components)
|
||||
if (project.componentTrees) setComponentTrees(project.componentTrees)
|
||||
if (project.workflows) setWorkflows(project.workflows)
|
||||
if (project.lambdas) setLambdas(project.lambdas)
|
||||
if (project.theme) setTheme(project.theme)
|
||||
if (project.playwrightTests) setPlaywrightTests(project.playwrightTests)
|
||||
if (project.storybookStories) setStorybookStories(project.storybookStories)
|
||||
if (project.unitTests) setUnitTests(project.unitTests)
|
||||
if (project.flaskConfig) setFlaskConfig(project.flaskConfig)
|
||||
if (project.nextjsConfig) setNextjsConfig(project.nextjsConfig)
|
||||
if (project.npmSettings) setNpmSettings(project.npmSettings)
|
||||
if (project.featureToggles) setFeatureToggles(project.featureToggles)
|
||||
toast.success('Project loaded')
|
||||
}
|
||||
|
||||
const {
|
||||
activeFileId,
|
||||
setActiveFileId,
|
||||
handleFileChange,
|
||||
handleFileAdd,
|
||||
handleFileClose,
|
||||
} = useFileOperations(files, setFiles)
|
||||
|
||||
const { handleExportProject } = useProjectExport(
|
||||
files,
|
||||
models,
|
||||
components,
|
||||
theme,
|
||||
playwrightTests,
|
||||
storybookStories,
|
||||
unitTests,
|
||||
flaskConfig,
|
||||
nextjsConfig,
|
||||
npmSettings
|
||||
)
|
||||
|
||||
const [activeTab, setActiveTab] = useState('dashboard')
|
||||
const [searchDialogOpen, setSearchDialogOpen] = useState(false)
|
||||
const [shortcutsDialogOpen, setShortcutsDialogOpen] = useState(false)
|
||||
|
||||
const { errors: autoDetectedErrors = [] } = useAutoRepair(files, false)
|
||||
const errorCount = Array.isArray(autoDetectedErrors) ? autoDetectedErrors.length : 0
|
||||
|
||||
useKeyboardShortcuts([
|
||||
{ key: '1', ctrl: true, description: 'Dashboard', action: () => setActiveTab('dashboard') },
|
||||
{ key: '2', ctrl: true, description: 'Code Editor', action: () => setActiveTab('code') },
|
||||
{ key: '3', ctrl: true, description: 'Models', action: () => setActiveTab('models') },
|
||||
{ key: 'k', ctrl: true, description: 'Search', action: () => setSearchDialogOpen(true) },
|
||||
{ key: 'e', ctrl: true, description: 'Export', action: () => handleExportProject() },
|
||||
{ key: '/', ctrl: true, description: 'Shortcuts', action: () => setShortcutsDialogOpen(true) },
|
||||
])
|
||||
|
||||
return (
|
||||
<div className="h-screen flex flex-col bg-background text-foreground">
|
||||
<PWAStatusBar />
|
||||
<PWAUpdatePrompt />
|
||||
|
||||
<AppHeader
|
||||
activeTab={activeTab}
|
||||
onTabChange={setActiveTab}
|
||||
featureToggles={featureToggles}
|
||||
errorCount={errorCount}
|
||||
lastSaved={lastSaved}
|
||||
currentProject={getCurrentProject()}
|
||||
onProjectLoad={loadProject}
|
||||
onSearch={() => setSearchDialogOpen(true)}
|
||||
onShowShortcuts={() => setShortcutsDialogOpen(true)}
|
||||
onGenerateAI={() => {}}
|
||||
onExport={handleExportProject}
|
||||
onShowErrors={() => setActiveTab('errors')}
|
||||
/>
|
||||
|
||||
<Tabs value={activeTab} onValueChange={setActiveTab} className="flex-1 flex flex-col">
|
||||
<PageHeader activeTab={activeTab} />
|
||||
|
||||
<div className="flex-1 overflow-hidden">
|
||||
<TabsContent value="dashboard" className="h-full m-0">
|
||||
<ProjectDashboard
|
||||
files={files}
|
||||
models={models}
|
||||
components={components}
|
||||
theme={theme}
|
||||
playwrightTests={playwrightTests}
|
||||
storybookStories={storybookStories}
|
||||
unitTests={unitTests}
|
||||
flaskConfig={flaskConfig}
|
||||
nextjsConfig={nextjsConfig}
|
||||
/>
|
||||
</TabsContent>
|
||||
|
||||
{featureToggles.codeEditor && (
|
||||
<TabsContent value="code" className="h-full m-0">
|
||||
<ResizablePanelGroup direction="horizontal">
|
||||
<ResizablePanel defaultSize={20} minSize={15} maxSize={30}>
|
||||
<FileExplorer
|
||||
files={files}
|
||||
activeFileId={activeFileId}
|
||||
onFileSelect={setActiveFileId}
|
||||
onFileAdd={handleFileAdd}
|
||||
/>
|
||||
</ResizablePanel>
|
||||
<ResizableHandle />
|
||||
<ResizablePanel defaultSize={80}>
|
||||
<CodeEditor
|
||||
files={files}
|
||||
activeFileId={activeFileId}
|
||||
onFileChange={handleFileChange}
|
||||
onFileSelect={setActiveFileId}
|
||||
onFileClose={handleFileClose}
|
||||
/>
|
||||
</ResizablePanel>
|
||||
</ResizablePanelGroup>
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.models && (
|
||||
<TabsContent value="models" className="h-full m-0">
|
||||
<JSONModelDesigner models={models} onModelsChange={setModels} />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.components && (
|
||||
<TabsContent value="components" className="h-full m-0">
|
||||
<ComponentTreeBuilder components={components} onComponentsChange={setComponents} />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.componentTrees && (
|
||||
<TabsContent value="component-trees" className="h-full m-0">
|
||||
<JSONComponentTreeManager trees={componentTrees} onTreesChange={setComponentTrees} />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.workflows && (
|
||||
<TabsContent value="workflows" className="h-full m-0">
|
||||
<JSONWorkflowDesigner workflows={workflows} onWorkflowsChange={setWorkflows} />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.lambdas && (
|
||||
<TabsContent value="lambdas" className="h-full m-0">
|
||||
<JSONLambdaDesigner />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.styling && (
|
||||
<TabsContent value="styling" className="h-full m-0">
|
||||
<JSONStyleDesigner />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.flaskApi && (
|
||||
<TabsContent value="flask" className="h-full m-0">
|
||||
<JSONFlaskDesigner />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
<TabsContent value="settings" className="h-full m-0">
|
||||
<ProjectSettingsDesigner
|
||||
nextjsConfig={nextjsConfig}
|
||||
npmSettings={npmSettings}
|
||||
onNextjsConfigChange={setNextjsConfig}
|
||||
onNpmSettingsChange={setNpmSettings}
|
||||
/>
|
||||
</TabsContent>
|
||||
|
||||
<TabsContent value="pwa" className="h-full m-0">
|
||||
<PWASettings />
|
||||
</TabsContent>
|
||||
|
||||
<TabsContent value="features" className="h-full m-0">
|
||||
<FeatureToggleSettings features={featureToggles} onFeaturesChange={setFeatureToggles} />
|
||||
</TabsContent>
|
||||
|
||||
{featureToggles.playwright && (
|
||||
<TabsContent value="playwright" className="h-full m-0">
|
||||
<PlaywrightDesigner tests={playwrightTests} onTestsChange={setPlaywrightTests} />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.storybook && (
|
||||
<TabsContent value="storybook" className="h-full m-0">
|
||||
<StorybookDesigner stories={storybookStories} onStoriesChange={setStorybookStories} />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.unitTests && (
|
||||
<TabsContent value="unit-tests" className="h-full m-0">
|
||||
<UnitTestDesigner tests={unitTests} onTestsChange={setUnitTests} />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.errorRepair && (
|
||||
<TabsContent value="errors" className="h-full m-0">
|
||||
<ErrorPanel
|
||||
files={files}
|
||||
onFileChange={handleFileChange}
|
||||
onFileSelect={setActiveFileId}
|
||||
/>
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.documentation && (
|
||||
<TabsContent value="docs" className="h-full m-0">
|
||||
<DocumentationView />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.sassStyles && (
|
||||
<TabsContent value="sass" className="h-full m-0">
|
||||
<SassStylesShowcase />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.faviconDesigner && (
|
||||
<TabsContent value="favicon" className="h-full m-0">
|
||||
<FaviconDesigner />
|
||||
</TabsContent>
|
||||
)}
|
||||
|
||||
{featureToggles.ideaCloud && (
|
||||
<TabsContent value="ideas" className="h-full m-0">
|
||||
<FeatureIdeaCloud />
|
||||
</TabsContent>
|
||||
)}
|
||||
</div>
|
||||
</Tabs>
|
||||
|
||||
<GlobalSearch
|
||||
open={searchDialogOpen}
|
||||
onOpenChange={setSearchDialogOpen}
|
||||
files={files}
|
||||
models={models}
|
||||
components={components}
|
||||
componentTrees={componentTrees}
|
||||
workflows={workflows}
|
||||
lambdas={lambdas}
|
||||
playwrightTests={playwrightTests}
|
||||
storybookStories={storybookStories}
|
||||
unitTests={unitTests}
|
||||
onNavigate={(tab) => setActiveTab(tab)}
|
||||
onFileSelect={setActiveFileId}
|
||||
/>
|
||||
|
||||
<KeyboardShortcutsDialog open={shortcutsDialogOpen} onOpenChange={setShortcutsDialogOpen} />
|
||||
<PWAInstallPrompt />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default App
|
||||
@@ -1,17 +0,0 @@
|
||||
import { Provider } from 'react-redux'
|
||||
import { store } from '@/store'
|
||||
import { ReduxIntegrationDemo } from '@/components/ReduxIntegrationDemo'
|
||||
import { Toaster } from '@/components/ui/sonner'
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<Provider store={store}>
|
||||
<div className="min-h-screen bg-background text-foreground">
|
||||
<ReduxIntegrationDemo />
|
||||
<Toaster />
|
||||
</div>
|
||||
</Provider>
|
||||
)
|
||||
}
|
||||
|
||||
export default App
|
||||
@@ -1,166 +0,0 @@
|
||||
/**
|
||||
* LEGACY FILE - NOT USED IN PRODUCTION
|
||||
*
|
||||
* This file is a legacy demo app that is not actively used.
|
||||
* The JSON components used here manage their own state internally via hooks (e.g., useKV)
|
||||
* and don't accept props like the old stub components did.
|
||||
*
|
||||
* The production app (App.tsx) uses the component registry pattern instead.
|
||||
*/
|
||||
import { useState } from 'react'
|
||||
import { useKV } from '@/hooks/use-kv'
|
||||
import { Tabs, TabsContent } from '@/components/ui/tabs'
|
||||
import { AppHeader, PageHeader } from '@/components/organisms'
|
||||
import { ProjectDashboard } from '@/components/ProjectDashboard'
|
||||
import { CodeEditor } from '@/components/CodeEditor'
|
||||
import { JSONModelDesigner } from '@/components/JSONModelDesigner'
|
||||
import { ComponentTreeBuilder } from '@/components/ComponentTreeBuilder'
|
||||
import { JSONComponentTreeManager } from '@/components/JSONComponentTreeManager'
|
||||
import { JSONWorkflowDesigner } from '@/components/JSONWorkflowDesigner'
|
||||
import { JSONLambdaDesigner } from '@/components/JSONLambdaDesigner'
|
||||
import { JSONStyleDesigner } from '@/components/JSONStyleDesigner'
|
||||
import { FileExplorer } from '@/components/FileExplorer'
|
||||
import { PlaywrightDesigner } from '@/components/PlaywrightDesigner'
|
||||
import { StorybookDesigner } from '@/components/StorybookDesigner'
|
||||
import { UnitTestDesigner } from '@/components/UnitTestDesigner'
|
||||
import { JSONFlaskDesigner } from '@/components/JSONFlaskDesigner'
|
||||
import { ProjectSettingsDesigner } from '@/components/ProjectSettingsDesigner'
|
||||
import { ErrorPanel } from '@/components/ErrorPanel'
|
||||
import { DocumentationView } from '@/components/DocumentationView'
|
||||
import { SassStylesShowcase } from '@/components/SassStylesShowcase'
|
||||
import { FeatureToggleSettings } from '@/components/FeatureToggleSettings'
|
||||
import { PWAInstallPrompt } from '@/components/PWAInstallPrompt'
|
||||
import { PWAUpdatePrompt } from '@/components/PWAUpdatePrompt'
|
||||
import { PWAStatusBar } from '@/components/PWAStatusBar'
|
||||
import { PWASettings } from '@/components/PWASettings'
|
||||
import { FaviconDesigner } from '@/components/FaviconDesigner'
|
||||
import { FeatureIdeaCloud } from '@/components/FeatureIdeaCloud'
|
||||
import { GlobalSearch } from '@/components/GlobalSearch'
|
||||
import { KeyboardShortcutsDialog } from '@/components/KeyboardShortcutsDialog'
|
||||
import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from '@/components/ui/resizable'
|
||||
import { useProjectState } from '@/hooks/use-project-state'
|
||||
import { useFileOperations } from '@/hooks/use-file-operations'
|
||||
import { useKeyboardShortcuts } from '@/hooks/use-keyboard-shortcuts'
|
||||
import { useAutoRepair } from '@/hooks/use-auto-repair'
|
||||
import { toast } from 'sonner'
|
||||
|
||||
function App() {
|
||||
const projectState = useProjectState()
|
||||
const { files, models, components, componentTrees, workflows, lambdas, theme, playwrightTests, storybookStories, unitTests, flaskConfig, nextjsConfig, npmSettings, featureToggles } = projectState
|
||||
const { setFiles, setModels, setComponents, setComponentTrees, setWorkflows, setLambdas, setTheme, setPlaywrightTests, setStorybookStories, setUnitTests, setFlaskConfig, setNextjsConfig, setNpmSettings, setFeatureToggles } = projectState
|
||||
|
||||
const fileOps = useFileOperations(files, setFiles)
|
||||
const { activeFileId, setActiveFileId, handleFileChange, handleFileAdd, handleFileClose } = fileOps
|
||||
|
||||
const [activeTab, setActiveTab] = useState('dashboard')
|
||||
const [searchOpen, setSearchOpen] = useState(false)
|
||||
const [shortcutsOpen, setShortcutsOpen] = useState(false)
|
||||
const [lastSaved] = useState(Date.now())
|
||||
|
||||
const { errors = [] } = useAutoRepair(files, false)
|
||||
const errorCount = errors.length
|
||||
|
||||
useKeyboardShortcuts([
|
||||
{ key: '1', ctrl: true, description: 'Dashboard', action: () => setActiveTab('dashboard') },
|
||||
{ key: '2', ctrl: true, description: 'Code', action: () => setActiveTab('code') },
|
||||
{ key: 'k', ctrl: true, description: 'Search', action: () => setSearchOpen(true) },
|
||||
{ key: '/', ctrl: true, description: 'Shortcuts', action: () => setShortcutsOpen(true) },
|
||||
])
|
||||
|
||||
const getCurrentProject = () => ({
|
||||
name: nextjsConfig.appName,
|
||||
files,
|
||||
models,
|
||||
components,
|
||||
componentTrees,
|
||||
workflows,
|
||||
lambdas,
|
||||
theme,
|
||||
playwrightTests,
|
||||
storybookStories,
|
||||
unitTests,
|
||||
flaskConfig,
|
||||
nextjsConfig,
|
||||
npmSettings,
|
||||
featureToggles,
|
||||
})
|
||||
|
||||
const handleProjectLoad = (project: any) => {
|
||||
if (project.files) setFiles(project.files)
|
||||
if (project.models) setModels(project.models)
|
||||
if (project.components) setComponents(project.components)
|
||||
if (project.componentTrees) setComponentTrees(project.componentTrees)
|
||||
if (project.workflows) setWorkflows(project.workflows)
|
||||
if (project.lambdas) setLambdas(project.lambdas)
|
||||
if (project.theme) setTheme(project.theme)
|
||||
if (project.playwrightTests) setPlaywrightTests(project.playwrightTests)
|
||||
if (project.storybookStories) setStorybookStories(project.storybookStories)
|
||||
if (project.unitTests) setUnitTests(project.unitTests)
|
||||
if (project.flaskConfig) setFlaskConfig(project.flaskConfig)
|
||||
if (project.nextjsConfig) setNextjsConfig(project.nextjsConfig)
|
||||
if (project.npmSettings) setNpmSettings(project.npmSettings)
|
||||
if (project.featureToggles) setFeatureToggles(project.featureToggles)
|
||||
toast.success('Project loaded')
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="h-screen flex flex-col bg-background">
|
||||
<PWAStatusBar />
|
||||
<PWAUpdatePrompt />
|
||||
<AppHeader
|
||||
activeTab={activeTab}
|
||||
onTabChange={setActiveTab}
|
||||
featureToggles={featureToggles}
|
||||
errorCount={errorCount}
|
||||
lastSaved={lastSaved}
|
||||
currentProject={getCurrentProject()}
|
||||
onProjectLoad={handleProjectLoad}
|
||||
onSearch={() => setSearchOpen(true)}
|
||||
onShowShortcuts={() => setShortcutsOpen(true)}
|
||||
onGenerateAI={() => toast.info('AI generation coming soon')}
|
||||
onExport={() => toast.info('Export coming soon')}
|
||||
onShowErrors={() => setActiveTab('errors')}
|
||||
/>
|
||||
<Tabs value={activeTab} onValueChange={setActiveTab} className="flex-1 flex flex-col">
|
||||
<PageHeader activeTab={activeTab} />
|
||||
<div className="flex-1 overflow-hidden">
|
||||
<TabsContent value="dashboard" className="h-full m-0">
|
||||
<ProjectDashboard files={files} models={models} components={components} theme={theme} playwrightTests={playwrightTests} storybookStories={storybookStories} unitTests={unitTests} flaskConfig={flaskConfig} nextjsConfig={nextjsConfig} />
|
||||
</TabsContent>
|
||||
{featureToggles.codeEditor && (
|
||||
<TabsContent value="code" className="h-full m-0">
|
||||
<ResizablePanelGroup direction="horizontal">
|
||||
<ResizablePanel defaultSize={20}><FileExplorer files={files} activeFileId={activeFileId} onFileSelect={setActiveFileId} onFileAdd={handleFileAdd} /></ResizablePanel>
|
||||
<ResizableHandle />
|
||||
<ResizablePanel defaultSize={80}><CodeEditor files={files} activeFileId={activeFileId} onFileChange={handleFileChange} onFileSelect={setActiveFileId} onFileClose={handleFileClose} /></ResizablePanel>
|
||||
</ResizablePanelGroup>
|
||||
</TabsContent>
|
||||
)}
|
||||
{featureToggles.models && <TabsContent value="models" className="h-full m-0"><JSONModelDesigner models={models} onModelsChange={setModels} /></TabsContent>}
|
||||
{featureToggles.components && <TabsContent value="components" className="h-full m-0"><ComponentTreeBuilder components={components} onComponentsChange={setComponents} /></TabsContent>}
|
||||
{featureToggles.componentTrees && <TabsContent value="component-trees" className="h-full m-0"><JSONComponentTreeManager trees={componentTrees} onTreesChange={setComponentTrees} /></TabsContent>}
|
||||
{featureToggles.workflows && <TabsContent value="workflows" className="h-full m-0"><JSONWorkflowDesigner workflows={workflows} onWorkflowsChange={setWorkflows} /></TabsContent>}
|
||||
{featureToggles.lambdas && <TabsContent value="lambdas" className="h-full m-0"><JSONLambdaDesigner /></TabsContent>}
|
||||
{featureToggles.styling && <TabsContent value="styling" className="h-full m-0"><JSONStyleDesigner /></TabsContent>}
|
||||
{featureToggles.flaskApi && <TabsContent value="flask" className="h-full m-0"><JSONFlaskDesigner /></TabsContent>}
|
||||
<TabsContent value="settings" className="h-full m-0"><ProjectSettingsDesigner nextjsConfig={nextjsConfig} npmSettings={npmSettings} onNextjsConfigChange={setNextjsConfig} onNpmSettingsChange={setNpmSettings} /></TabsContent>
|
||||
<TabsContent value="pwa" className="h-full m-0"><PWASettings /></TabsContent>
|
||||
<TabsContent value="features" className="h-full m-0"><FeatureToggleSettings features={featureToggles} onFeaturesChange={setFeatureToggles} /></TabsContent>
|
||||
{featureToggles.playwright && <TabsContent value="playwright" className="h-full m-0"><PlaywrightDesigner tests={playwrightTests} onTestsChange={setPlaywrightTests} /></TabsContent>}
|
||||
{featureToggles.storybook && <TabsContent value="storybook" className="h-full m-0"><StorybookDesigner stories={storybookStories} onStoriesChange={setStorybookStories} /></TabsContent>}
|
||||
{featureToggles.unitTests && <TabsContent value="unit-tests" className="h-full m-0"><UnitTestDesigner tests={unitTests} onTestsChange={setUnitTests} /></TabsContent>}
|
||||
{featureToggles.errorRepair && <TabsContent value="errors" className="h-full m-0"><ErrorPanel files={files} onFileChange={handleFileChange} onFileSelect={setActiveFileId} /></TabsContent>}
|
||||
{featureToggles.documentation && <TabsContent value="docs" className="h-full m-0"><DocumentationView /></TabsContent>}
|
||||
{featureToggles.sassStyles && <TabsContent value="sass" className="h-full m-0"><SassStylesShowcase /></TabsContent>}
|
||||
{featureToggles.faviconDesigner && <TabsContent value="favicon" className="h-full m-0"><FaviconDesigner /></TabsContent>}
|
||||
{featureToggles.ideaCloud && <TabsContent value="ideas" className="h-full m-0"><FeatureIdeaCloud /></TabsContent>}
|
||||
</div>
|
||||
</Tabs>
|
||||
<GlobalSearch open={searchOpen} onOpenChange={setSearchOpen} files={files} models={models} components={components} componentTrees={componentTrees} workflows={workflows} lambdas={lambdas} playwrightTests={playwrightTests} storybookStories={storybookStories} unitTests={unitTests} onNavigate={setActiveTab} onFileSelect={setActiveFileId} />
|
||||
<KeyboardShortcutsDialog open={shortcutsOpen} onOpenChange={setShortcutsOpen} />
|
||||
<PWAInstallPrompt />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default App
|
||||
@@ -1,11 +0,0 @@
|
||||
import { ComprehensiveDemoPage } from '@/components/ComprehensiveDemoPage'
|
||||
import { Toaster } from '@/components/ui/sonner'
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<>
|
||||
<ComprehensiveDemoPage />
|
||||
<Toaster />
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -1,13 +0,0 @@
|
||||
import { JSONUIShowcasePage } from './components/JSONUIShowcasePage'
|
||||
import { Toaster } from 'sonner'
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<>
|
||||
<JSONUIShowcasePage />
|
||||
<Toaster position="top-right" />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default App
|
||||
@@ -1,112 +0,0 @@
|
||||
import { useState } from 'react'
|
||||
import { useKV } from '@/hooks/use-kv'
|
||||
import { Tabs, TabsContent } from '@/components/ui/tabs'
|
||||
import { Button } from '@/components/ui/button'
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
|
||||
import { AppHeader, PageHeader } from '@/components/organisms'
|
||||
import { FeatureToggles, Project } from '@/types/project'
|
||||
import { toast } from 'sonner'
|
||||
|
||||
const DEFAULT_FEATURE_TOGGLES: FeatureToggles = {
|
||||
codeEditor: true,
|
||||
models: true,
|
||||
components: true,
|
||||
componentTrees: true,
|
||||
workflows: true,
|
||||
lambdas: true,
|
||||
styling: true,
|
||||
flaskApi: true,
|
||||
playwright: true,
|
||||
storybook: true,
|
||||
unitTests: true,
|
||||
errorRepair: true,
|
||||
documentation: true,
|
||||
sassStyles: true,
|
||||
faviconDesigner: true,
|
||||
ideaCloud: true,
|
||||
schemaEditor: true,
|
||||
dataBinding: true,
|
||||
}
|
||||
|
||||
function App() {
|
||||
const [featureToggles] = useKV<FeatureToggles>('feature-toggles', DEFAULT_FEATURE_TOGGLES)
|
||||
const [activeTab, setActiveTab] = useState('dashboard')
|
||||
const [lastSaved] = useState(Date.now())
|
||||
|
||||
const safeFeatureToggles = featureToggles || DEFAULT_FEATURE_TOGGLES
|
||||
|
||||
const getCurrentProject = (): Project => {
|
||||
return {
|
||||
name: 'Test Project',
|
||||
files: [],
|
||||
models: [],
|
||||
components: [],
|
||||
componentTrees: [],
|
||||
workflows: [],
|
||||
lambdas: [],
|
||||
theme: {
|
||||
variants: [],
|
||||
activeVariantId: 'light',
|
||||
fontFamily: 'Inter',
|
||||
fontSize: { small: 12, medium: 14, large: 20 },
|
||||
spacing: 8,
|
||||
borderRadius: 4,
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
const handleProjectLoad = (project: Project) => {
|
||||
toast.success('Project loaded')
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="h-screen flex flex-col bg-background text-foreground">
|
||||
<AppHeader
|
||||
activeTab={activeTab}
|
||||
onTabChange={setActiveTab}
|
||||
featureToggles={safeFeatureToggles}
|
||||
errorCount={0}
|
||||
lastSaved={lastSaved}
|
||||
currentProject={getCurrentProject()}
|
||||
onProjectLoad={handleProjectLoad}
|
||||
onSearch={() => {}}
|
||||
onShowShortcuts={() => {}}
|
||||
onGenerateAI={() => {}}
|
||||
onExport={() => {}}
|
||||
onShowErrors={() => {}}
|
||||
/>
|
||||
|
||||
<Tabs value={activeTab} onValueChange={setActiveTab} className="flex-1 flex flex-col">
|
||||
<PageHeader activeTab={activeTab} />
|
||||
|
||||
<div className="flex-1 overflow-hidden p-6">
|
||||
<TabsContent value="dashboard" className="h-full m-0">
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Dashboard</CardTitle>
|
||||
<CardDescription>Welcome to CodeForge</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<p>The application is loading successfully!</p>
|
||||
<Button onClick={() => toast.success('Test toast')}>Test Toast</Button>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</TabsContent>
|
||||
|
||||
<TabsContent value="code" className="h-full m-0">
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Code Editor</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<p>Code editor will load here</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</TabsContent>
|
||||
</div>
|
||||
</Tabs>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default App
|
||||
Reference in New Issue
Block a user