init

src/apps/ai-editor/index.tsx

@@ -0,0 +1,50 @@
+import Sidebar from './sidebar';
+import { Content } from './content';
+import { Panel, Group, Separator } from 'react-resizable-panels';
+import { Toolbar } from './modules/Nav';
+import { Toaster } from 'sonner';
+const Provider = ({ children }: { children: React.ReactNode }) => {
+  return (
+    <>
+      {children}
+      <Toaster position="bottom-right" richColors />
+    </>
+  );
+};
+export const App = () => {
+  return (
+    <Provider>
+      <AIEditor />
+    </Provider>
+  );
+};
+
+export const SidebarApp = () => {
+  return (
+    <Provider>
+      <Sidebar />
+    </Provider>
+  );
+};
+
+export const AIEditor = () => {
+  return (
+    <div className='h-screen w-full flex flex-col bg-white dark:bg-black text-gray-900 dark:text-gray-100'>
+      <div className='h-16 shrink-0 text-xl font-bold border-b border-gray-200 dark:border-gray-800 p-3 flex gap-2 items-center bg-gray-50 dark:bg-gray-950'>
+        <span className='font-mono text-sm tracking-tight'>Codepod</span>
+        <Toolbar />
+      </div>
+      <div className='flex-1 min-h-0'>
+        <Group orientation="horizontal">
+          <Panel minSize={200} defaultSize={240} maxSize={400}>
+            <Sidebar />
+          </Panel>
+          <Separator className='bg-gray-200 dark:bg-gray-800 w-px' />
+          <Panel minSize={30}>
+            <Content />
+          </Panel>
+        </Group>
+      </div>
+    </div>
+  );
+};