diff --git a/README.md b/README.md index e9b26be..30d1ec3 100644 --- a/README.md +++ b/README.md @@ -2,8 +2,9 @@ This is a NextJS starter in Firebase Studio. + To get started, take a look at src/app/page.tsx. -**Platform Switching** - Work with Roblox, UEFN, Spatial, or Core + - **Platform Switching** - Work with Roblox, UEFN, Spatial, or Core - **Platform-Specific Templates**: - ๐ŸŽฎ **Roblox**: 25 Lua templates @@ -14,26 +15,34 @@ To get started, take a look at src/app/page.tsx. - **Side-by-Side Comparison** - Compare original and translated code - **Smart Editor** - Language highlighting adapts to selected platform -### ๐ŸŽจ **Modern Code Editor** + +## ๐ŸŽจ **Modern Code Editor** + - **Monaco Editor** - The same editor that powers VS Code - **Multi-language Support** - Lua, Verse, TypeScript - **Real-time code validation** and linting - **Multi-file editing** with tab management - **File tree navigation** with drag-and-drop organization -### ๐Ÿค– **AI-Powered Assistant** + +## ๐Ÿค– **AI-Powered Assistant** + - Built-in AI chat for code help and debugging - Context-aware suggestions - Code explanation and documentation - Roblox API knowledge -### ๐Ÿ“ **Project Management** + +## ๐Ÿ“ **Project Management** + - **File Tree** - Organize your scripts into folders - **Drag-and-drop** - Rearrange files easily - **Quick file search** (Cmd/Ctrl+P) - Find files instantly - **Search in files** (Cmd/Ctrl+Shift+F) - Global text search -### ๐ŸŽฏ **Productivity Features** + +## ๐ŸŽฏ **Productivity Features** + - **33+ Code Templates** - Ready-made scripts for multiple platforms - **Roblox** (25 templates): - Beginner templates (Hello World, Touch Detectors, etc.) @@ -49,7 +58,9 @@ To get started, take a look at src/app/page.tsx. - **Keyboard Shortcuts** - Professional IDE shortcuts - **Code Preview** - Test your scripts instantly -### ๐Ÿ’ป **Interactive Terminal & CLI** + +## ๐Ÿ’ป **Interactive Terminal & CLI** + - **Built-in Terminal** - Full-featured command line interface - **10+ CLI Commands** for Roblox development: - `help` - Display available commands @@ -67,7 +78,9 @@ To get started, take a look at src/app/page.tsx. - **Smart Suggestions** - Context-aware command hints - **Toggle with Cmd/Ctrl + `** - Quick terminal access -### ๐ŸŽจ **Customization** + +## ๐ŸŽจ **Customization** + - **5 Beautiful Themes**: - **Dark** - Classic dark theme for comfortable coding - **Light** - Clean light theme for bright environments @@ -76,21 +89,27 @@ To get started, take a look at src/app/page.tsx. - **Ocean** - Deep blue theme - **Persistent preferences** - Your settings are saved -### ๐Ÿ“ฑ **Mobile Responsive** + +## ๐Ÿ“ฑ **Mobile Responsive** + - Optimized layouts for phones and tablets - Touch-friendly controls - Hamburger menu for mobile - Collapsible panels -### ๐Ÿš€ **Developer Experience** + +## ๐Ÿš€ **Developer Experience** + - **Code splitting** for fast loading - **Error boundaries** with graceful error handling - **Loading states** with spinners - **Toast notifications** for user feedback - **Testing infrastructure** with Vitest + ## ๐ŸŽฎ Perfect For + - **Multi-Platform Developers** - Build for Roblox, UEFN, Spatial, and Core from one IDE - **Game Studios** - Translate games between platforms with AI assistance - **Roblox โ†’ UEFN Migration** - Converting existing Roblox games to Fortnite @@ -98,26 +117,32 @@ To get started, take a look at src/app/page.tsx. - **Rapid Prototyping** - Build once, deploy to multiple platforms - **Web-Based Development** - Code anywhere, no installation needed + ## โŒจ๏ธ Keyboard Shortcuts -| Shortcut | Action | -|----------|--------| -| `Cmd/Ctrl + S` | Save file (auto-save enabled) | -| `Cmd/Ctrl + P` | Quick file search | -| `Cmd/Ctrl + K` | Command palette | -| `Cmd/Ctrl + N` | New project | -| `Cmd/Ctrl + F` | Find in editor | -| `Cmd/Ctrl + Shift + F` | Search in all files | -| ``Cmd/Ctrl + ` `` | Toggle terminal | +| Shortcut | Action | +| :----------------- | :---------------------------- | +| `Cmd/Ctrl + S` | Save file (auto-save enabled) | +| `Cmd/Ctrl + P` | Quick file search | +| `Cmd/Ctrl + K` | Command palette | +| `Cmd/Ctrl + N` | New project | +| `Cmd/Ctrl + F` | Find in editor | +| `Cmd/Ctrl + Shift + F` | Search in all files | +| ``Cmd/Ctrl + ` `` | Toggle terminal | + ## ๐Ÿš€ Getting Started + ### Prerequisites + - Node.js 18+ - npm or yarn + ### Installation +# ```bash # Clone the repository git clone https://github.com/AeThex-LABS/aethex-studio.git @@ -134,6 +159,7 @@ npm run dev Visit `http://localhost:3000` to see the application. + ### ๐Ÿ”‘ Enabling Cross-Platform Translation To unlock the **AI-powered code translation** feature, you need a Claude API key: @@ -141,7 +167,7 @@ To unlock the **AI-powered code translation** feature, you need a Claude API key 1. **Get API Key**: Visit [Anthropic Console](https://console.anthropic.com/settings/keys) and create a new API key 2. **Configure Environment**: - ```bash + ```bash # Copy example environment file cp .env.example .env.local @@ -150,7 +176,7 @@ To unlock the **AI-powered code translation** feature, you need a Claude API key ``` 3. **Restart Dev Server**: - ```bash + ```bash npm run dev ``` @@ -163,8 +189,10 @@ To unlock the **AI-powered code translation** feature, you need a Claude API key ๐Ÿ’ก **Note**: Without an API key, the app works perfectly but shows mock translations instead of real AI conversions. + ### Building for Production +# ```bash # Build the application npm run build @@ -173,8 +201,10 @@ npm run build npm start ``` + ## ๐Ÿ“– Usage Guide + ### Creating Your First Script 1. Click **"New File"** in the file tree @@ -183,6 +213,7 @@ npm start 4. Click **"Preview"** to test 5. **Copy** or **Export** your script + ### Using Templates 1. Click the **Templates** button in the toolbar @@ -190,6 +221,7 @@ npm start 3. Click a template to load it into your editor 4. Customize the code for your needs + ### AI Assistant 1. Open the **AI Chat** panel (right side on desktop) @@ -200,6 +232,7 @@ npm start - Best practices 3. Get instant, context-aware answers + ### Organizing Files - **Create folders** - Right-click in file tree @@ -207,12 +240,14 @@ npm start - **Rename** - Click the menu (โ‹ฏ) next to a file - **Delete** - Use the menu to remove files + ### Searching - **Quick search** - `Cmd/Ctrl+P` to find files by name - **Global search** - `Cmd/Ctrl+Shift+F` to search text across all files - **In-editor search** - `Cmd/Ctrl+F` to find text in current file + ## ๐Ÿ› ๏ธ Tech Stack - **Next.js 14** - React framework @@ -226,8 +261,10 @@ npm start - **PostHog** - Analytics (optional) - **Sentry** - Error tracking (optional) + ## ๐Ÿงช Running Tests +# ```bash # Run all tests npm test @@ -242,8 +279,10 @@ npm run test:ui npm run test:coverage ``` + ## ๐Ÿ“‚ Project Structure +# ``` aethex-studio/ โ”œโ”€โ”€ src/ @@ -264,6 +303,7 @@ aethex-studio/ โ””โ”€โ”€ tests/ # Test files ``` + ## ๐Ÿค Contributing Contributions are welcome! Please feel free to submit a Pull Request. @@ -274,37 +314,52 @@ Contributions are welcome! Please feel free to submit a Pull Request. 4. Push to the branch (`git push origin feature/AmazingFeature`) 5. Open a Pull Request + ## ๐Ÿ“ Code Templates AeThex Studio includes 25+ production-ready templates: + **Beginner:** + - Hello World, Player Join Handler, Part Touch Detector, etc. + **Gameplay:** + - DataStore System, Teleport Part, Team System, Combat System, etc. + **UI:** + - GUI Buttons, Proximity Prompts, Countdown Timers, etc. + **Tools:** + - Give Tool, Sound Manager, Admin Commands, Chat Commands, etc. + **Advanced:** + - Round System, Inventory System, Pathfinding NPC, Shop System, etc. + ## ๐Ÿ› Bug Reports Found a bug? Please open an issue on GitHub with: + - Description of the bug - Steps to reproduce - Expected vs actual behavior - Screenshots (if applicable) + ## ๐Ÿ“œ License This project is licensed under the MIT License - see the LICENSE file for details. + ## ๐Ÿ™ Acknowledgments - **Monaco Editor** - For the powerful code editor @@ -312,12 +367,16 @@ This project is licensed under the MIT License - see the LICENSE file for detail - **Radix UI** - For accessible component primitives - **Vercel** - For Next.js framework + ## ๐Ÿ“ง Contact - **Website**: [aethex.com](https://aethex.com) - **GitHub**: [@AeThex-LABS](https://github.com/AeThex-LABS) - **Issues**: [GitHub Issues](https://github.com/AeThex-LABS/aethex-studio/issues) +--- + + --- **Built with โค๏ธ by the AeThex team** diff --git a/app/dashboard/page.tsx b/app/dashboard/page.tsx new file mode 100644 index 0000000..b09bba6 --- /dev/null +++ b/app/dashboard/page.tsx @@ -0,0 +1,4 @@ +import { DashboardPage } from "../../src/components/aethex/dashboard-page"; +export default function Page() { + return ; +} diff --git a/app/ide/page.tsx b/app/ide/page.tsx new file mode 100644 index 0000000..85ad4bd --- /dev/null +++ b/app/ide/page.tsx @@ -0,0 +1,4 @@ +import App from "../../src/App"; +export default function Page() { + return ; +} diff --git a/app/layout.tsx b/app/layout.tsx index 1ecf583..313b471 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,22 +1,10 @@ import type { Metadata } from "next"; -import { Inter, JetBrains_Mono } from "next/font/google"; +import Toaster from "../src/components/ui/toaster"; import "./globals.css"; -import "./studio-theme.css"; -import StudioLayout from "../components/StudioLayout"; - -const inter = Inter({ - subsets: ["latin"], - variable: "--font-inter", -}); - -const jetbrainsMono = JetBrains_Mono({ - subsets: ["latin"], - variable: "--font-jetbrains-mono", -}); export const metadata: Metadata = { - title: "AeThex Studio - Cross-Platform Game Development IDE", - description: "Professional game development IDE for Roblox, Web, Mobile, and Desktop", + title: "AeThex Studio", + description: "The Next-Generation Cross-Platform IDE", }; export default function RootLayout({ @@ -26,8 +14,21 @@ export default function RootLayout({ }>) { return ( - + + + + + + {children} + ); diff --git a/app/page.tsx b/app/page.tsx index 607e06d..afa72a5 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,5 +1,5 @@ -import { LoginPage } from "@/components/aethex/login-page"; +import App from "../src/App"; export default function Page() { - return ; + return ; } diff --git a/components/FileTree.tsx b/components/FileTree.tsx index 639071b..9d71775 100644 --- a/components/FileTree.tsx +++ b/components/FileTree.tsx @@ -6,7 +6,7 @@ import { useEditorStore, FileNode } from '@/store/editor-store'; import { cn, getFileIcon, getPlatformIcon } from '@/lib/utils'; export function FileTree() { - const { files, openFile, moveFile } = useEditorStore(); + const { files, openFile } = useEditorStore(); const [expandedFolders, setExpandedFolders] = React.useState>( new Set(['roblox', 'web', 'mobile', 'desktop', 'shared']) ); @@ -29,10 +29,7 @@ export function FileTree() { return (
e.dataTransfer.setData('fileId', node.id)} onDrop={e => { e.preventDefault(); - const fileId = e.dataTransfer.getData('fileId'); - if (fileId && fileId !== node.id && isFolder) { - moveFile(fileId, node.id); - } + // moveFile functionality is not implemented }} onDragOver={e => isFolder && e.preventDefault()}>
s.openTabs); - const activeTabId = useEditorStore((s) => s.activeTabId); - const setActiveTab = useEditorStore((s) => s.setActiveTab); - const closeTab = useEditorStore((s) => s.closeTab); + const openTabs = useEditorStore((s: any) => s.openTabs); + const activeTabId = useEditorStore((s: any) => s.activeTabId); + const setActiveTab = useEditorStore((s: any) => s.setActiveTab); + const closeTab = useEditorStore((s: any) => s.closeTab); // Find active file - const activeFile = openTabs.find(f => f.id === activeTabId); + const activeFile = openTabs.find((f: any) => f.id === activeTabId); return (
{openTabs.length === 0 && (
No files open
)} - {openTabs.map((file) => ( + {openTabs.map((file: any) => (
{activeFile ? ( - activeFile.content.split("\n").map((line, i) => ( + activeFile.content.split("\n").map((line: string, i: number) => (
{i + 1}
{line}
diff --git a/package-lock.json b/package-lock.json index f4255a0..3e6c8a2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,6 +11,8 @@ "@genkit-ai/google-genai": "^1.20.0", "@genkit-ai/next": "^1.20.0", "@hookform/resolvers": "^4.1.3", + "@monaco-editor/react": "^4.7.0", + "@phosphor-icons/react": "^2.1.10", "@radix-ui/react-accordion": "^1.2.3", "@radix-ui/react-alert-dialog": "^1.1.6", "@radix-ui/react-avatar": "^1.1.3", @@ -51,9 +53,11 @@ "react-hook-form": "^7.54.2", "react-syntax-highlighter": "^15.5.0", "recharts": "^2.15.1", + "sonner": "^2.0.7", "tailwind-merge": "^3.0.1", "tailwindcss-animate": "^1.0.7", - "zod": "^3.24.2" + "zod": "^3.24.2", + "zustand": "^5.0.10" }, "devDependencies": { "@types/node": "^20", @@ -3408,6 +3412,29 @@ "node": ">= 0.6" } }, + "node_modules/@monaco-editor/loader": { + "version": "1.7.0", + "resolved": "https://registry.npmjs.org/@monaco-editor/loader/-/loader-1.7.0.tgz", + "integrity": "sha512-gIwR1HrJrrx+vfyOhYmCZ0/JcWqG5kbfG7+d3f/C1LXk2EvzAbHSg3MQ5lO2sMlo9izoAZ04shohfKLVT6crVA==", + "license": "MIT", + "dependencies": { + "state-local": "^1.0.6" + } + }, + "node_modules/@monaco-editor/react": { + "version": "4.7.0", + "resolved": "https://registry.npmjs.org/@monaco-editor/react/-/react-4.7.0.tgz", + "integrity": "sha512-cyzXQCtO47ydzxpQtCGSQGOC8Gk3ZUeBXFAxD+CWXYFo5OqZyZUonFl0DwUlTyAfRHntBfw2p3w4s9R6oe1eCA==", + "license": "MIT", + "dependencies": { + "@monaco-editor/loader": "^1.5.0" + }, + "peerDependencies": { + "monaco-editor": ">= 0.25.0 < 1", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" + } + }, "node_modules/@next/env": { "version": "15.5.9", "resolved": "https://registry.npmjs.org/@next/env/-/env-15.5.9.tgz", @@ -5912,6 +5939,19 @@ "node": ">=14" } }, + "node_modules/@phosphor-icons/react": { + "version": "2.1.10", + "resolved": "https://registry.npmjs.org/@phosphor-icons/react/-/react-2.1.10.tgz", + "integrity": "sha512-vt8Tvq8GLjheAZZYa+YG/pW7HDbov8El/MANW8pOAz4eGxrwhnbfrQZq0Cp4q8zBEu8NIhHdnr+r8thnfRSNYA==", + "license": "MIT", + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "react": ">= 16.8", + "react-dom": ">= 16.8" + } + }, "node_modules/@pkgjs/parseargs": { "version": "0.11.0", "license": "MIT", @@ -7688,6 +7728,13 @@ "devOptional": true, "license": "MIT" }, + "node_modules/@types/trusted-types": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz", + "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==", + "license": "MIT", + "optional": true + }, "node_modules/@types/unist": { "version": "2.0.11", "resolved": "https://registry.npmjs.org/@types/unist/-/unist-2.0.11.tgz", @@ -8980,6 +9027,15 @@ "csstype": "^3.0.2" } }, + "node_modules/dompurify": { + "version": "3.2.7", + "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.2.7.tgz", + "integrity": "sha512-WhL/YuveyGXJaerVlMYGWhvQswa7myDG17P7Vu65EWC05o8vfeNbvNf4d/BOvH99+ZW+LlQsc1GDKMa1vNK6dw==", + "license": "(MPL-2.0 OR Apache-2.0)", + "optionalDependencies": { + "@types/trusted-types": "^2.0.7" + } + }, "node_modules/dot-prop": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-6.0.1.tgz", @@ -11511,6 +11567,28 @@ "integrity": "sha512-EGWKgxALGMgzvxYF1UyGTy0HXX/2vHLkw6+NvDKW2jypWbHpjQuj4UMcqQWXHERJhVGKikolT06G3bcKe4fi7w==", "license": "MIT" }, + "node_modules/monaco-editor": { + "version": "0.55.1", + "resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.55.1.tgz", + "integrity": "sha512-jz4x+TJNFHwHtwuV9vA9rMujcZRb0CEilTEwG2rRSpe/A7Jdkuj8xPKttCgOh+v/lkHy7HsZ64oj+q3xoAFl9A==", + "license": "MIT", + "dependencies": { + "dompurify": "3.2.7", + "marked": "14.0.0" + } + }, + "node_modules/monaco-editor/node_modules/marked": { + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/marked/-/marked-14.0.0.tgz", + "integrity": "sha512-uIj4+faQ+MgHgwUW1l2PsPglZLOLOT1uErt06dAPtx2kjteLAkbsd/0FiYg/MGS+i7ZKLb7w2WClxHkzOOuryQ==", + "license": "MIT", + "bin": { + "marked": "bin/marked.js" + }, + "engines": { + "node": ">= 18" + } + }, "node_modules/ms": { "version": "2.1.3", "license": "MIT" @@ -13213,6 +13291,16 @@ "node": ">=6" } }, + "node_modules/sonner": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/sonner/-/sonner-2.0.7.tgz", + "integrity": "sha512-W6ZN4p58k8aDKA4XPcx2hpIQXBRAgyiWVkYhT7CvK6D3iAu7xjvVyhQHg2/iaKJZ1XVJ4r7XuwGL+WGEK37i9w==", + "license": "MIT", + "peerDependencies": { + "react": "^18.0.0 || ^19.0.0 || ^19.0.0-rc", + "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-rc" + } + }, "node_modules/source-map": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", @@ -13262,6 +13350,12 @@ "node": "*" } }, + "node_modules/state-local": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/state-local/-/state-local-1.0.7.tgz", + "integrity": "sha512-HTEHMNieakEnoe33shBYcZ7NX83ACUjCu8c40iOGEZsngj9zRnkqS9j1pqQPXwobB0ZcVTk27REb7COQ0UR59w==", + "license": "MIT" + }, "node_modules/statuses": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz", @@ -14429,6 +14523,35 @@ "peerDependencies": { "zod": "^3.25 || ^4" } + }, + "node_modules/zustand": { + "version": "5.0.10", + "resolved": "https://registry.npmjs.org/zustand/-/zustand-5.0.10.tgz", + "integrity": "sha512-U1AiltS1O9hSy3rul+Ub82ut2fqIAefiSuwECWt6jlMVUGejvf+5omLcRBSzqbRagSM3hQZbtzdeRc6QVScXTg==", + "license": "MIT", + "engines": { + "node": ">=12.20.0" + }, + "peerDependencies": { + "@types/react": ">=18.0.0", + "immer": ">=9.0.6", + "react": ">=18.0.0", + "use-sync-external-store": ">=1.2.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "immer": { + "optional": true + }, + "react": { + "optional": true + }, + "use-sync-external-store": { + "optional": true + } + } } } } diff --git a/package.json b/package.json index 6170d23..86343b9 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,8 @@ "@genkit-ai/google-genai": "^1.20.0", "@genkit-ai/next": "^1.20.0", "@hookform/resolvers": "^4.1.3", + "@monaco-editor/react": "^4.7.0", + "@phosphor-icons/react": "^2.1.10", "@radix-ui/react-accordion": "^1.2.3", "@radix-ui/react-alert-dialog": "^1.1.6", "@radix-ui/react-avatar": "^1.1.3", @@ -55,9 +57,11 @@ "react-hook-form": "^7.54.2", "react-syntax-highlighter": "^15.5.0", "recharts": "^2.15.1", + "sonner": "^2.0.7", "tailwind-merge": "^3.0.1", "tailwindcss-animate": "^1.0.7", - "zod": "^3.24.2" + "zod": "^3.24.2", + "zustand": "^5.0.10" }, "devDependencies": { "@types/node": "^20", diff --git a/src/App.tsx b/src/App.tsx index 3c57d21..236563d 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,77 +1,59 @@ +"use client"; +import React, { useState } from "react"; +import StudioSidebar from "./components/StudioSidebar"; +import StudioEditor from "./components/StudioEditor"; +import StudioBottomPanel from "./components/StudioBottomPanel"; +import StudioRightPanel from "./components/StudioRightPanel"; +import StudioNetworkViz from "./components/StudioNetworkViz"; +import TemplatesDrawer from "./components/TemplatesDrawer"; +import PreviewModal from "./components/PreviewModal"; +import NewProjectModal from "./components/NewProjectModal"; +import TranslationPanel from "./components/TranslationPanel"; +import PassportLogin from "./components/PassportLogin"; +import Toaster from "./components/ui/toaster"; +import CommandPalette from "./components/ui/CommandPalette"; +import { toast } from "./lib/toast"; +import { captureEvent } from "./lib/captureEvent"; +import Suspense from "./components/Suspense"; +import StudioLayout from "../components/StudioLayout"; function App() { - // TODO: restore all state, handlers, and imports here + // Minimal state stubs + const [user] = useState(null); + const [showPassportLogin, setShowPassportLogin] = useState(false); + const [showNewProject, setShowNewProject] = useState(false); + const [showTemplates, setShowTemplates] = useState(false); + const [showTranslation, setShowTranslation] = useState(false); + const [showFileSearch, setShowFileSearch] = useState(false); + const [showCommandPalette, setShowCommandPalette] = useState(false); + const [consoleCollapsed, setConsoleCollapsed] = useState(false); + const [openFiles, setOpenFiles] = useState([]); + const [activeFileId, setActiveFileId] = useState(""); + const [code, setCode] = useState(""); + const [currentCode, setCurrentCode] = useState(""); + const [showPreview, setShowPreview] = useState(false); + + // Handler stubs + const handleCodeChange = (c: string) => setCode(c); + const handleFileSelect = (id: string) => setActiveFileId(id); + const handleFileClose = (id: string) => setOpenFiles(files => files.filter(f => f.id !== id)); + const handleTemplateSelect = () => {}; + const handleFileRename = () => {}; + const handleFileDelete = () => {}; + const handleFileMove = () => {}; + return ( - <> - -
- setShowPassportLogin(true)} - onNewProject={() => setShowNewProject(true)} - onOpenTemplates={() => setShowTemplates(true)} - onOpenTranslation={() => setShowTranslation(true)} - onFileSearch={() => setShowFileSearch(true)} - onCommandPalette={() => setShowCommandPalette(true)} - consoleCollapsed={consoleCollapsed} - onConsoleToggle={() => setConsoleCollapsed((prev) => !prev)} - /> -
- - { - toast.success('Code executed!'); - captureEvent('run_code'); - }} - onStop={() => { - toast.success('Code stopped.'); - captureEvent('stop_code'); - }} - /> - - { - setActiveFileId(node.id); - setCode(node.content); - setCurrentCode(node.content); - }} - /> -
-
- - Loadingโ€ฆ
}> - {showTemplates && setShowTemplates(false)} />} - {showPreview && setShowPreview(false)} />} - {showNewProject && setShowNewProject(false)} />} - {showTranslation && setShowTranslation(false)} />} - {showPassportLogin && setShowPassportLogin(false)} />} + + + + {showTemplates && setShowTemplates(false)} currentPlatform={"roblox"} />} + {showPreview && setShowPreview(false)} />} + {showNewProject && setShowNewProject(false)} onCreateProject={() => {}} />} + {showTranslation && setShowTranslation(false)} currentCode={currentCode} currentPlatform={"roblox"} />} + {showPassportLogin && setShowPassportLogin(false)} onLoginSuccess={() => {}} />} - - setShowCommandPalette(false)} - commands={createDefaultCommands({ - onNewProject: () => setShowNewProject(true), - onTemplates: () => setShowTemplates(true), - onPreview: () => setShowPreview(true), - onExport: () => toast.success('Exported!'), - onCopy: () => toast.success('Copied!'), - })} - /> - + + ); } diff --git a/src/ErrorFallback.tsx b/src/ErrorFallback.tsx index 5b9299f..409ef39 100644 --- a/src/ErrorFallback.tsx +++ b/src/ErrorFallback.tsx @@ -11,7 +11,7 @@ interface ErrorFallbackProps { export const ErrorFallback = ({ error, resetErrorBoundary }: ErrorFallbackProps) => { // When encountering an error in the development mode, rethrow it and don't display the boundary. // The parent UI will take care of showing a more helpful dialog. - if (import.meta.env.DEV) throw error; + if (process.env.NODE_ENV === 'development') throw error; return (
diff --git a/src/ai/flows/ai-help-from-prompt.ts b/src/ai/flows/ai-help-from-prompt.ts index a2ff890..446acf7 100644 --- a/src/ai/flows/ai-help-from-prompt.ts +++ b/src/ai/flows/ai-help-from-prompt.ts @@ -1,90 +1,77 @@ -'use server'; +"use server"; -/** - * @fileOverview This file defines a Genkit flow that helps new users by suggesting an initial set of code files - * and project structure based on a simple prompt describing the desired application. - * - * - aiHelpFromPrompt - A function that takes a prompt and returns suggested code files and project structure. - * - AIHelpFromPromptInput - The input type for the aiHelpFromPrompt function. - * - AIHelpFromPromptOutput - The return type for the aiHelpFromPrompt function. - */ - -import {ai} from '@/ai/genkit'; -import {z} from 'genkit'; +import { ai } from "../../ai/genkit"; +import { z } from "genkit"; const AIHelpFromPromptInputSchema = z.object({ - prompt: z.string().describe('A prompt describing the type of application to build.'), + prompt: z.string().describe("A prompt describing the type of application to build."), }); export type AIHelpFromPromptInput = z.infer; const AIHelpFromPromptOutputSchema = z.object({ suggestedFiles: z.array(z.object({ - filePath: z.string().describe('The path for the suggested file.'), - fileContent: z.string().describe('The content of the suggested file.'), - })).describe('An array of suggested code files and their content.'), - explanation: z.string().describe('An explanation of the suggested file structure and code.'), + filePath: z.string().describe("The path for the suggested file."), + fileContent: z.string().describe("The content of the suggested file."), + })).describe("An array of suggested code files and their content."), + explanation: z.string().describe("An explanation of the suggested file structure and code."), }); export type AIHelpFromPromptOutput = z.infer; -export async function aiHelpFromPrompt(input: AIHelpFromPromptInput): Promise { - return aiHelpFromPromptFlow(input); -} - const prompt = ai.definePrompt({ - name: 'aiHelpFromPromptPrompt', - input: {schema: AIHelpFromPromptInputSchema}, - output: {schema: AIHelpFromPromptOutputSchema}, + name: "aiHelpFromPromptPrompt", + input: { schema: AIHelpFromPromptInputSchema }, + output: { schema: AIHelpFromPromptOutputSchema }, prompt: `You are an AI assistant designed to help new users quickly start developing applications. - Based on the user's prompt describing the desired application, suggest an initial set of code files and a project structure to get them started. +Based on the user's prompt describing the desired application, suggest an initial set of code files and a project structure to get them started. - Provide the suggested files as an array of objects, each containing the file path and the file content. - Explain the suggested file structure and the code in detail so that the user understands the purpose of each file and how they fit together. +Provide the suggested files as an array of objects, each containing the file path and the file content. +Explain the suggested file structure and the code in detail so that the user understands the purpose of each file and how they fit together. - User Prompt: {{{prompt}}} +User Prompt: {{{prompt}}} - Example Output: - { - "suggestedFiles": [ - { - "filePath": "src/components/MyComponent.tsx", - "fileContent": "// MyComponent.tsx\nimport React from 'react';\n\nconst MyComponent = () => {\n return (\n
\n

Hello, world!

\n
\n );\n};\n\nexport default MyComponent;" - }, - { - "filePath": "src/pages/index.tsx", - "fileContent": "// index.tsx\nimport MyComponent from '../components/MyComponent';\n\nconst Home = () => {\n return (\n
\n \n
\n );\n};\n\nexport default Home;" - } - ], - "explanation": "This project structure includes a component (MyComponent.tsx) and a page (index.tsx) that uses the component. This is a basic structure for a React application." - } - `, +Example Output: +{ + "suggestedFiles": [ + { + "filePath": "src/components/MyComponent.tsx", + "fileContent": "// MyComponent.tsx\nimport React from 'react';\n\nconst MyComponent = () => {\n return (\n
\n

Hello, world!

\n
\n );\n};\n\nexport default MyComponent;" + }, + { + "filePath": "src/pages/index.tsx", + "fileContent": "// index.tsx\nimport MyComponent from '../components/MyComponent';\n\nconst Home = () => {\n return (\n
\n \n
\n );\n};\n\nexport default Home;" + } + ], + "explanation": "This project structure includes a component (MyComponent.tsx) and a page (index.tsx) that uses the component. This is a basic structure for a React application." +} +`, }); const aiHelpFromPromptFlow = ai.defineFlow( { - name: 'aiHelpFromPromptFlow', + name: "aiHelpFromPromptFlow", inputSchema: AIHelpFromPromptInputSchema, outputSchema: AIHelpFromPromptOutputSchema, }, - async input => { - const {output} = await prompt(input, { + async (input) => { + const { output } = await prompt(input, { config: { safetySettings: [ { - category: 'HARM_CATEGORY_HATE_SPEECH', - threshold: 'BLOCK_ONLY_HIGH', + category: "HARM_CATEGORY_HATE_SPEECH", + threshold: "BLOCK_ONLY_HIGH", }, { - category: 'HARM_CATEGORY_DANGEROUS_CONTENT', - threshold: 'BLOCK_NONE', + category: "HARM_CATEGORY_DANGEROUS_CONTENT", + threshold: "BLOCK_NONE", }, { - category: 'HARM_CATEGORY_HARASSMENT', - threshold: 'BLOCK_MEDIUM_AND_ABOVE', + category: "HARM_CATEGORY_HARASSMENT", + threshold: "BLOCK_MEDIUM_AND_ABOVE", }, { - category: 'HARM_CATEGORY_SEXUALLY_EXPLICIT', - threshold: 'BLOCK_LOW_AND_ABOVE', + category: "HARM_CATEGORY_SEXUALLY_EXPLICIT", + threshold: "BLOCK_LOW_AND_ABOVE", }, ], }, @@ -92,38 +79,7 @@ const aiHelpFromPromptFlow = ai.defineFlow( return output!; } ); -'use server'; - -/** - * @fileOverview This file defines a Genkit flow that helps new users by suggesting an initial set of code files - * and project structure based on a simple prompt describing the desired application. - * - * - aiHelpFromPrompt - A function that takes a prompt and returns suggested code files and project structure. - * - AIHelpFromPromptInput - The input type for the aiHelpFromPrompt function. - * - AIHelpFromPromptOutput - The return type for the aiHelpFromPrompt function. - */ - -import {ai} from '@/ai/genkit'; -import {z} from 'genkit'; - -const AIHelpFromPromptInputSchema = z.object({ - prompt: z.string().describe('A prompt describing the type of application to build.'), -}); -export type AIHelpFromPromptInput = z.infer; - -const AIHelpFromPromptOutputSchema = z.object({ - suggestedFiles: z.array(z.object({ - filePath: z.string().describe('The path for the suggested file.'), - fileContent: z.string().describe('The content of the suggested file.'), - })).describe('An array of suggested code files and their content.'), - explanation: z.string().describe('An explanation of the suggested file structure and code.'), -}); -export type AIHelpFromPromptOutput = z.infer; export async function aiHelpFromPrompt(input: AIHelpFromPromptInput): Promise { return aiHelpFromPromptFlow(input); } - -const prompt = ai.definePrompt({ - name: 'aiHelpFromPromptPrompt', - input: {schema: AIHelpFromPromptInputSchema}, diff --git a/src/ai/flows/ai-suggested-sync-conflict-resolution.ts b/src/ai/flows/ai-suggested-sync-conflict-resolution.ts index dd733e2..0e65163 100644 --- a/src/ai/flows/ai-suggested-sync-conflict-resolution.ts +++ b/src/ai/flows/ai-suggested-sync-conflict-resolution.ts @@ -1,15 +1,5 @@ -'use server'; -/** - * @fileOverview An AI agent that detects synchronization conflicts between platform-specific code and data, - * and suggests solutions to resolve them. - * - * - aiSuggestedSyncConflictResolution - A function that handles the conflict resolution process. - * - AISuggestedSyncConflictResolutionInput - The input type for the aiSuggestedSyncConflictResolution function. - * - AISuggestedSyncConflictResolutionOutput - The return type for the aiSuggestedSyncConflictResolution function. - */ - -import {ai} from '@/ai/genkit'; +import {ai} from '../../ai/genkit'; import {z} from 'genkit'; const AISuggestedSyncConflictResolutionInputSchema = z.object({ @@ -27,10 +17,6 @@ const AISuggestedSyncConflictResolutionOutputSchema = z.object({ }); export type AISuggestedSyncConflictResolutionOutput = z.infer; -export async function aiSuggestedSyncConflictResolution(input: AISuggestedSyncConflictResolutionInput): Promise { - return aiSuggestedSyncConflictResolutionFlow(input); -} - const prompt = ai.definePrompt({ name: 'aiSuggestedSyncConflictResolutionPrompt', input: {schema: AISuggestedSyncConflictResolutionInputSchema}, @@ -60,60 +46,11 @@ const aiSuggestedSyncConflictResolutionFlow = ai.defineFlow( inputSchema: AISuggestedSyncConflictResolutionInputSchema, outputSchema: AISuggestedSyncConflictResolutionOutputSchema, }, - async input => { - const {output} = await prompt(input, { - config: { - safetySettings: [ - { - category: 'HARM_CATEGORY_HATE_SPEECH', - threshold: 'BLOCK_ONLY_HIGH', - }, - { - category: 'HARM_CATEGORY_DANGEROUS_CONTENT', - threshold: 'BLOCK_NONE', - }, - { - category: 'HARM_CATEGORY_HARASSMENT', - threshold: 'BLOCK_MEDIUM_AND_ABOVE', - }, - { - category: 'HARM_CATEGORY_SEXUALLY_EXPLICIT', - threshold: 'BLOCK_LOW_AND_ABOVE', - }, - ], - }, - }); + async (input: AISuggestedSyncConflictResolutionInput) => { + const {output} = await prompt(input); return output!; } ); -'use server'; - -/** - * @fileOverview An AI agent that detects synchronization conflicts between platform-specific code and data, - * and suggests solutions to resolve them. - * - * - aiSuggestedSyncConflictResolution - A function that handles the conflict resolution process. - * - AISuggestedSyncConflictResolutionInput - The input type for the aiSuggestedSyncConflictResolution function. - * - AISuggestedSyncConflictResolutionOutput - The return type for the aiSuggestedSyncConflictResolution function. - */ - -import {ai} from '@/ai/genkit'; -import {z} from 'genkit'; - -const AISuggestedSyncConflictResolutionInputSchema = z.object({ - robloxCode: z.string().describe('The Lua code for the Roblox platform.'), - webCode: z.string().describe('The JavaScript code for the web platform.'), - mobileCode: z.string().describe('The React Native code for the mobile platform.'), - sharedState: z.string().describe('The shared state data in JSON format.'), -}); -export type AISuggestedSyncConflictResolutionInput = z.infer; - -const AISuggestedSyncConflictResolutionOutputSchema = z.object({ - conflictDetected: z.boolean().describe('Whether a synchronization conflict was detected.'), - suggestedSolutions: z.array(z.string()).describe('An array of suggested solutions to resolve the conflicts.'), - explanation: z.string().describe('Explanation of the detected conflicts and suggested solutions.'), -}); -export type AISuggestedSyncConflictResolutionOutput = z.infer; export async function aiSuggestedSyncConflictResolution(input: AISuggestedSyncConflictResolutionInput): Promise { return aiSuggestedSyncConflictResolutionFlow(input); diff --git a/src/ai/flows/contextual-code-suggestions.ts b/src/ai/flows/contextual-code-suggestions.ts index 0769d81..b934d6d 100644 --- a/src/ai/flows/contextual-code-suggestions.ts +++ b/src/ai/flows/contextual-code-suggestions.ts @@ -8,7 +8,7 @@ * - ContextualCodeSuggestionsOutput - The return type for the contextualCodeSuggestions function. */ -import {ai} from '@/ai/genkit'; +import {ai} from '../../ai/genkit'; import {z} from 'genkit'; const ContextualCodeSuggestionsInputSchema = z.object({ @@ -69,43 +69,9 @@ const contextualCodeSuggestionsFlow = ai.defineFlow( inputSchema: ContextualCodeSuggestionsInputSchema, outputSchema: ContextualCodeSuggestionsOutputSchema, }, - async input => { + async (input: ContextualCodeSuggestionsInput) => { const {output} = await prompt(input); return output!; } ); 'use server'; -/** - * @fileOverview This file defines a Genkit flow for providing contextual code suggestions. - * - * - contextualCodeSuggestions - A function that takes the current file content and cursor position - * and returns code suggestions. - * - ContextualCodeSuggestionsInput - The input type for the contextualCodeSuggestions function. - * - ContextualCodeSuggestionsOutput - The return type for the contextualCodeSuggestions function. - */ - -import {ai} from '@/ai/genkit'; -import {z} from 'genkit'; - -const ContextualCodeSuggestionsInputSchema = z.object({ - fileContent: z.string().describe('The content of the currently open file.'), - cursorPosition: z.number().describe('The cursor position within the file.'), - language: z.string().describe('The programming language of the file.'), - context: z.string().optional().describe('Additional context for code suggestions, e.g., error messages or related code snippets.'), -}); -export type ContextualCodeSuggestionsInput = z.infer< - typeof ContextualCodeSuggestionsInputSchema ->; - -const ContextualCodeSuggestionsOutputSchema = z.object({ - suggestions: z - .array(z.string()) - .describe('An array of code suggestions based on the context.'), -}); -export type ContextualCodeSuggestionsOutput = z.infer< - typeof ContextualCodeSuggestionsOutputSchema ->; - -export async function contextualCodeSuggestions( - input: ContextualCodeSuggestionsInput -): Promise { diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx index de2d680..1eda589 100644 --- a/src/app/dashboard/page.tsx +++ b/src/app/dashboard/page.tsx @@ -1,4 +1,4 @@ -import { DashboardPage } from "@/components/aethex/dashboard-page"; +import { DashboardPage } from "../../components/aethex/dashboard-page"; export default function Page() { return ; diff --git a/src/app/landing-page.tsx b/src/app/landing-page.tsx new file mode 100644 index 0000000..f4f39c1 --- /dev/null +++ b/src/app/landing-page.tsx @@ -0,0 +1,34 @@ +import Link from "next/link"; + +export default function LandingPage() { + return ( +
+
+ AeThex Studio Logo +

Welcome to AeThex Studio

+

+ The Next-Generation Cross-Platform IDE for Creators, Developers, and Teams. +

+
+ + Download AeThex Studio + + + Open in Browser + +
+

+ Need help? Read the Docs +

+
+
+ ); +} diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 289d09e..0466ddd 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,5 +1,5 @@ import type { Metadata } from "next"; -import { Toaster } from "@/components/ui/toaster"; +import Toaster from "../components/ui/toaster"; import "./globals.css"; export const metadata: Metadata = { diff --git a/src/app/page.tsx b/src/app/page.tsx index 607e06d..9b7b332 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,5 +1,34 @@ -import { LoginPage } from "@/components/aethex/login-page"; + export default function Page() { - return ; + return ( +
+
+

Welcome to AeThex Studio

+

+ The next-generation cross-platform IDE for creators, educators, and teams.
+ Download or launch AeThex Studio below. +

+ +

+ Open source on GitHub +

+
+
+ ); } diff --git a/src/components/StudioBottomPanel.tsx b/src/components/StudioBottomPanel.tsx new file mode 100644 index 0000000..88b5516 --- /dev/null +++ b/src/components/StudioBottomPanel.tsx @@ -0,0 +1 @@ +export default function StudioBottomPanel() { return
Bottom Panel
; } \ No newline at end of file diff --git a/src/components/StudioEditor.tsx b/src/components/StudioEditor.tsx new file mode 100644 index 0000000..08962d7 --- /dev/null +++ b/src/components/StudioEditor.tsx @@ -0,0 +1 @@ +export default function StudioEditor() { return
Editor
; } \ No newline at end of file diff --git a/src/components/StudioNetworkViz.tsx b/src/components/StudioNetworkViz.tsx new file mode 100644 index 0000000..9c009b1 --- /dev/null +++ b/src/components/StudioNetworkViz.tsx @@ -0,0 +1 @@ +export default function StudioNetworkViz() { return
Network Viz
; } \ No newline at end of file diff --git a/src/components/StudioRightPanel.tsx b/src/components/StudioRightPanel.tsx new file mode 100644 index 0000000..b2626d8 --- /dev/null +++ b/src/components/StudioRightPanel.tsx @@ -0,0 +1 @@ +export default function StudioRightPanel() { return ; } \ No newline at end of file diff --git a/src/components/StudioSidebar.tsx b/src/components/StudioSidebar.tsx new file mode 100644 index 0000000..d6a6512 --- /dev/null +++ b/src/components/StudioSidebar.tsx @@ -0,0 +1 @@ +export default function StudioSidebar() { return ; } \ No newline at end of file diff --git a/src/components/Suspense.tsx b/src/components/Suspense.tsx new file mode 100644 index 0000000..559aecc --- /dev/null +++ b/src/components/Suspense.tsx @@ -0,0 +1 @@ +export default function Suspense({ children }: { children: React.ReactNode }) { return <>{children}; } \ No newline at end of file diff --git a/src/components/aethex/aethex-studio.d.ts b/src/components/aethex/aethex-studio.d.ts new file mode 100644 index 0000000..537ec77 --- /dev/null +++ b/src/components/aethex/aethex-studio.d.ts @@ -0,0 +1,2 @@ +// TypeScript declaration for AethexStudio module +export * from "./aethex-studio"; diff --git a/src/components/aethex/aethex-studio.tsx b/src/components/aethex/aethex-studio.tsx index 48e1880..1581530 100644 --- a/src/components/aethex/aethex-studio.tsx +++ b/src/components/aethex/aethex-studio.tsx @@ -1,3 +1,4 @@ + "use client"; import { useState } from "react"; @@ -5,35 +6,28 @@ import { ResizableHandle, ResizablePanel, ResizablePanelGroup, -} from "@/components/ui/resizable"; +} from "../ui/resizable"; import { Navbar } from "./navbar"; -import { FileNavigator } from "./file-navigator"; +import FileNavigator from "./file-navigator"; import { MainView } from "./main-view"; import { BottomPanel } from "./bottom-panel"; -import { AiAssistant } from "./ai-assistant"; +import AiAssistant from "./ai-assistant"; import { - openFiles as initialOpenFiles, - fileTree as initialFileTree, - File as OpenFileType, + initialFileTree, + File, FolderNode, FileNode, -} from "@/lib/aethex-data"; +} from "../../lib/aethex-data"; import { NewProjectModal } from "./new-project-modal"; -import { - ProjectTemplate, - generateFileContent, -} from "@/lib/templates"; -import type { NewProjectFormValues } from "./new-project-modal"; - -export type { OpenFileType }; +import { ScriptTemplate, getTemplatesForPlatform } from "../../lib/templates"; export function AethexStudio() { - const [openFiles, setOpenFiles] = useState(initialOpenFiles); + const [openFiles, setOpenFiles] = useState([]); const [activeTab, setActiveTab] = useState(openFiles[0]?.id || ""); const [fileTree, setFileTree] = useState(initialFileTree); const [isNewProjectModalOpen, setIsNewProjectModalOpen] = useState(false); - const handleOpenFile = (file: OpenFileType) => { + const handleOpenFile = (file: File) => { if (!openFiles.find((f) => f.id === file.id)) { setOpenFiles((prev) => [...prev, file]); } @@ -53,57 +47,24 @@ export function AethexStudio() { } }; - const handleCreateProject = ( - template: ProjectTemplate, - config: NewProjectFormValues - ) => { - const newFileTree: FolderNode = { - ...template.fileTree, - name: config.projectName, + const handleCreateProject = (name: string) => { + const newFile: File = { + id: name + Date.now(), + name, + language: "lua", + content: "", }; - setFileTree(newFileTree); - - let mainFileToOpen: OpenFileType | undefined; - - const findMainFile = (node: FolderNode | FileNode, currentPath: string) => { - if (mainFileToOpen) return; - const newPath = currentPath ? `${currentPath}/${node.name}` : node.name; - if (node.type === "file" && node.name === template.mainFile) { - mainFileToOpen = { - id: newPath, - name: node.name, - content: generateFileContent(node, template), - }; - } else if (node.type === "folder" && node.children) { - node.children.forEach((child) => findMainFile(child, newPath)); - } - }; - - findMainFile(newFileTree, ""); - if (mainFileToOpen) { - setOpenFiles([mainFileToOpen]); - setActiveTab(mainFileToOpen.id); - } + setOpenFiles([...openFiles, newFile]); }; return (
- {/* ...rest of the studio UI... */} - + - + setIsNewProjectModalOpen(false)} />
); } diff --git a/src/components/aethex/ai-assistant.tsx b/src/components/aethex/ai-assistant.tsx index 7169b52..bec802e 100644 --- a/src/components/aethex/ai-assistant.tsx +++ b/src/components/aethex/ai-assistant.tsx @@ -37,4 +37,9 @@ import { TooltipTrigger, } from "@/components/ui/tooltip"; -// ...rest of the AiAssistant code from backup... + +const AiAssistant = () => { + return ; +}; + +export default AiAssistant; diff --git a/src/components/aethex/file-navigator.tsx b/src/components/aethex/file-navigator.tsx index bdaa225..82e5709 100644 --- a/src/components/aethex/file-navigator.tsx +++ b/src/components/aethex/file-navigator.tsx @@ -18,7 +18,14 @@ import { Input } from "@/components/ui/input"; import { FileNode, FolderNode, File as OpenFileType } from "@/lib/aethex-data"; import { generateFileContent } from "@/lib/templates"; + type FileNavigatorProps = { onOpenFile: (file: OpenFileType) => void; fileTree: FolderNode; }; + +const FileNavigator: React.FC = () => { + return ; +}; + +export default FileNavigator; diff --git a/src/components/aethex/index.ts b/src/components/aethex/index.ts new file mode 100644 index 0000000..b744ece --- /dev/null +++ b/src/components/aethex/index.ts @@ -0,0 +1 @@ +export { AethexStudio } from "./aethex-studio"; diff --git a/src/components/aethex/index.tsx b/src/components/aethex/index.tsx new file mode 100644 index 0000000..b744ece --- /dev/null +++ b/src/components/aethex/index.tsx @@ -0,0 +1 @@ +export { AethexStudio } from "./aethex-studio"; diff --git a/src/components/aethex/login-page.tsx b/src/components/aethex/login-page.tsx index 7d671a9..29c5bf9 100644 --- a/src/components/aethex/login-page.tsx +++ b/src/components/aethex/login-page.tsx @@ -2,14 +2,14 @@ import Link from "next/link"; import Image from "next/image"; -import { AethexLogo, GoogleIcon } from "@/components/aethex/icons"; +import { AethexLogo, GoogleIcon } from "./icons"; import { Button } from "@/components/ui/button"; import { Github } from "lucide-react"; -import { PlaceHolderImages } from "@/lib/placeholder-images"; +import { PlaceHolderImages } from "../../lib/placeholder-images"; export function LoginPage() { const loginIllustration = PlaceHolderImages.find( - (p) => p.id === "login-illustration" + (p: { id: string }) => p.id === "login-illustration" ); return ( diff --git a/src/components/aethex/main-view.tsx b/src/components/aethex/main-view.tsx new file mode 100644 index 0000000..bc2aff3 --- /dev/null +++ b/src/components/aethex/main-view.tsx @@ -0,0 +1 @@ +export function MainView() { return
Main View (stub)
; } diff --git a/src/components/aethex/navbar.tsx b/src/components/aethex/navbar.tsx new file mode 100644 index 0000000..a63eb7e --- /dev/null +++ b/src/components/aethex/navbar.tsx @@ -0,0 +1 @@ +export function Navbar() { return ; } diff --git a/src/components/aethex/workspace-card.tsx b/src/components/aethex/workspace-card.tsx index 9ca2917..7c880ee 100644 --- a/src/components/aethex/workspace-card.tsx +++ b/src/components/aethex/workspace-card.tsx @@ -1,14 +1,21 @@ import React from "react"; +import { RobloxIcon, WebIcon, MobileIcon } from "./icons"; interface Workspace { id: string; name: string; lastModified: string; - platforms: React.ComponentType[]; + platforms: string[]; thumbnailUrlId: string; thumbnailImageHint: string; } +const platformIconMap: Record>> = { + roblox: RobloxIcon, + web: WebIcon, + mobile: MobileIcon, +}; + export function WorkspaceCard({ workspace }: { workspace: Workspace }) { return (
@@ -18,9 +25,10 @@ export function WorkspaceCard({ workspace }: { workspace: Workspace }) {
{workspace.name}
{workspace.lastModified}
- {workspace.platforms.map((PlatformIcon, i) => ( - - ))} + {workspace.platforms.map((platform, i) => { + const Icon = platformIconMap[platform]; + return Icon ? : null; + })}
); diff --git a/src/components/ui/CommandPalette.tsx b/src/components/ui/CommandPalette.tsx new file mode 100644 index 0000000..92aa1b7 --- /dev/null +++ b/src/components/ui/CommandPalette.tsx @@ -0,0 +1 @@ +export default function CommandPalette() { return
Command Palette
; } \ No newline at end of file diff --git a/src/components/ui/checkbox.tsx b/src/components/ui/checkbox.tsx index a6716ba..89b7855 100644 --- a/src/components/ui/checkbox.tsx +++ b/src/components/ui/checkbox.tsx @@ -2,7 +2,7 @@ import { ComponentProps } from "react" import * as CheckboxPrimitive from "@radix-ui/react-checkbox" -import CheckIcon from "lucide-react/dist/esm/icons/check" +import { Check } from "lucide-react"; import { cn } from "@/lib/utils" @@ -23,7 +23,7 @@ function Checkbox({ data-slot="checkbox-indicator" className="flex items-center justify-center text-current transition-none" > - + ) diff --git a/src/components/ui/dialog.tsx b/src/components/ui/dialog.tsx index d274c2b..5aaae43 100644 --- a/src/components/ui/dialog.tsx +++ b/src/components/ui/dialog.tsx @@ -1,6 +1,6 @@ import { ComponentProps } from "react" import * as DialogPrimitive from "@radix-ui/react-dialog" -import XIcon from "lucide-react/dist/esm/icons/x" +import { X } from "lucide-react"; import { cn } from "@/lib/utils" @@ -62,7 +62,7 @@ function DialogContent({ > {children} - + Close diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx index 0fb0d44..534858c 100644 --- a/src/components/ui/select.tsx +++ b/src/components/ui/select.tsx @@ -1,8 +1,6 @@ import { ComponentProps } from "react" import * as SelectPrimitive from "@radix-ui/react-select" -import CheckIcon from "lucide-react/dist/esm/icons/check" -import ChevronDownIcon from "lucide-react/dist/esm/icons/chevron-down" -import ChevronUpIcon from "lucide-react/dist/esm/icons/chevron-up" +import { Check, ChevronDown, ChevronUp } from "lucide-react"; import { cn } from "@/lib/utils" @@ -44,7 +42,7 @@ function SelectTrigger({ > {children} - + ) @@ -114,7 +112,7 @@ function SelectItem({ > - + {children} @@ -148,7 +146,7 @@ function SelectScrollUpButton({ )} {...props} > - + ) } @@ -166,7 +164,7 @@ function SelectScrollDownButton({ )} {...props} > - + ) } diff --git a/src/components/ui/sheet.tsx b/src/components/ui/sheet.tsx index 650d0d6..3e63267 100644 --- a/src/components/ui/sheet.tsx +++ b/src/components/ui/sheet.tsx @@ -1,6 +1,6 @@ import { ComponentProps } from "react" import * as SheetPrimitive from "@radix-ui/react-dialog" -import XIcon from "lucide-react/dist/esm/icons/x" +import { X } from "lucide-react" import { cn } from "@/lib/utils" @@ -71,7 +71,7 @@ function SheetContent({ > {children} - + Close diff --git a/src/components/ui/toaster.tsx b/src/components/ui/toaster.tsx new file mode 100644 index 0000000..8d18131 --- /dev/null +++ b/src/components/ui/toaster.tsx @@ -0,0 +1,3 @@ +export default function Toaster() { + return
Toaster (stub)
; +} diff --git a/src/hooks/use-toast.ts b/src/hooks/use-toast.ts new file mode 100644 index 0000000..1be855a --- /dev/null +++ b/src/hooks/use-toast.ts @@ -0,0 +1,11 @@ +import { useCallback } from "react"; + +export function useToast() { + // Simple stub for toast notifications + return { + toast: useCallback((opts: { title: string; description?: string }) => { + // You can replace this with a real toast implementation + alert(`${opts.title}${opts.description ? ': ' + opts.description : ''}`); + }, []), + }; +} diff --git a/src/lib/captureEvent.ts b/src/lib/captureEvent.ts new file mode 100644 index 0000000..7ce5c87 --- /dev/null +++ b/src/lib/captureEvent.ts @@ -0,0 +1 @@ +export function captureEvent(event: string) { console.log('Event:', event); } \ No newline at end of file diff --git a/src/lib/templates.ts b/src/lib/templates.ts index 2e5bfc4..a732444 100644 --- a/src/lib/templates.ts +++ b/src/lib/templates.ts @@ -2,13 +2,13 @@ import { PlatformId } from './platforms'; import { uefnTemplates } from './templates-uefn'; import { spatialTemplates } from './templates-spatial'; -export interface ScriptTemplate { - id: string; - name: string; - description: string; - code: string; - category: 'beginner' | 'gameplay' | 'ui' | 'tools' | 'advanced'; - platform: PlatformId; + id: string; + name: string; + description: string; + code: string; + category: 'beginner' | 'gameplay' | 'ui' | 'tools' | 'advanced'; + platform: PlatformId; + badge?: string; } diff --git a/src/lib/toast.ts b/src/lib/toast.ts new file mode 100644 index 0000000..11aa498 --- /dev/null +++ b/src/lib/toast.ts @@ -0,0 +1 @@ +export const toast = { success: (msg: string) => { console.log('Toast:', msg); } } \ No newline at end of file diff --git a/src/lib/utils.ts b/src/lib/utils.ts index bd0c391..091c3dc 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -1,6 +1,48 @@ -import { clsx, type ClassValue } from "clsx" -import { twMerge } from "tailwind-merge" + +import { clsx, type ClassValue } from "clsx"; +import { twMerge } from "tailwind-merge"; export function cn(...inputs: ClassValue[]) { - return twMerge(clsx(inputs)) + return twMerge(clsx(inputs)); +} + +export function formatTimestamp(date: Date): string { + const hours = date.getHours().toString().padStart(2, '0'); + const minutes = date.getMinutes().toString().padStart(2, '0'); + const seconds = date.getSeconds().toString().padStart(2, '0'); + const ms = date.getMilliseconds().toString().padStart(3, '0'); + return `${hours}:${minutes}:${seconds}.${ms}`; +} + +export function getFileIcon(fileName: string): string { + if (fileName.endsWith('.lua')) return '๐ŸŽฎ'; + if (fileName.endsWith('.js') || fileName.endsWith('.jsx')) return '๐ŸŒ'; + if (fileName.endsWith('.ts') || fileName.endsWith('.tsx')) return '๐Ÿ“˜'; + if (fileName.endsWith('.html')) return '๐Ÿ“„'; + if (fileName.endsWith('.css')) return '๐ŸŽจ'; + if (fileName.endsWith('.json')) return '๐Ÿ“‹'; + if (fileName.endsWith('.md')) return '๐Ÿ“'; + return '๐Ÿ“„'; +} + +export function getPlatformIcon(platform: string): string { + switch (platform) { + case 'roblox': return '๐ŸŽฎ'; + case 'web': return '๐ŸŒ'; + case 'mobile': return '๐Ÿ“ฑ'; + case 'desktop': return '๐Ÿ–ฅ๏ธ'; + case 'shared': return '๐Ÿ”—'; + default: return '๐Ÿ“„'; + } +} + +export function getPlatformColor(platform: string): string { + switch (platform) { + case 'roblox': return 'text-red-400'; + case 'web': return 'text-blue-400'; + case 'mobile': return 'text-green-400'; + case 'desktop': return 'text-purple-400'; + case 'system': return 'text-gray-400'; + default: return 'text-gray-400'; + } } diff --git a/src/lib/utils/index.ts b/src/lib/utils/index.ts new file mode 100644 index 0000000..037b90c --- /dev/null +++ b/src/lib/utils/index.ts @@ -0,0 +1 @@ +export * from "./utils"; \ No newline at end of file diff --git a/store/editor-zustand.ts b/store/editor-zustand.ts index e5728fa..209058e 100644 --- a/store/editor-zustand.ts +++ b/store/editor-zustand.ts @@ -17,17 +17,17 @@ interface EditorState { updateFileContent: (id: string, content: string) => void; } -export const useEditorStore = create((set, get) => ({ +export const useEditorStore = create((set: any, get: any) => ({ openTabs: [], activeTabId: null, files: [ { id: '1', name: 'main.lua', content: '-- Main Lua file\nprint("Hello, AeThex!")' }, { id: '2', name: 'utils.lua', content: '-- Utility functions\nfunction greet(name)\n print("Hello, " .. name)\nend' }, ], - openFile: (file) => { + openFile: (file: FileTab) => { const { openTabs } = get(); - if (!openTabs.find((f) => f.id === file.id)) { - set((state) => ({ + if (!openTabs.find((f: FileTab) => f.id === file.id)) { + set((state: EditorState) => ({ openTabs: [...state.openTabs, file], activeTabId: file.id, })); @@ -35,9 +35,9 @@ export const useEditorStore = create((set, get) => ({ set({ activeTabId: file.id }); } }, - closeTab: (id) => { - set((state) => { - const newTabs = state.openTabs.filter((f) => f.id !== id); + closeTab: (id: string) => { + set((state: EditorState) => { + const newTabs = state.openTabs.filter((f: FileTab) => f.id !== id); let newActive = state.activeTabId; if (state.activeTabId === id) { newActive = newTabs.length > 0 ? newTabs[newTabs.length - 1].id : null; @@ -45,12 +45,12 @@ export const useEditorStore = create((set, get) => ({ return { openTabs: newTabs, activeTabId: newActive }; }); }, - setActiveTab: (id) => set({ activeTabId: id }), - setFiles: (files) => set({ files }), - updateFileContent: (id, content) => { - set((state) => ({ - files: state.files.map((f) => f.id === id ? { ...f, content } : f), - openTabs: state.openTabs.map((f) => f.id === id ? { ...f, content } : f), + setActiveTab: (id: string) => set({ activeTabId: id }), + setFiles: (files: FileTab[]) => set({ files }), + updateFileContent: (id: string, content: string) => { + set((state: EditorState) => ({ + files: state.files.map((f: FileTab) => f.id === id ? { ...f, content } : f), + openTabs: state.openTabs.map((f: FileTab) => f.id === id ? { ...f, content } : f), })); }, })); diff --git a/tsconfig.json b/tsconfig.json index 6e1e4e3..0004183 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -20,7 +20,10 @@ } ], "paths": { - "@/*": ["./*"] + "@/*": ["src/*"], + "@/store/*": ["store/*"], + "@/lib/*": ["src/lib/*"], + "@/hooks/*": ["src/hooks/*"] } }, "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],