Feature/notebook_prompt_ai

frontend/src/components/tabs/notebooks/CellDivider.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import { Code2, Type } from "lucide-react";
+import { Code2, Type, Sparkles } from "lucide-react";
 import { usePythonStore } from "@/store/pythonStore";
 
 interface CellDividerProps {
@@ -14,7 +14,7 @@ const CellDivider: React.FC<CellDividerProps> = ({ insertIndex, isLastCell = fal
   const { createCell } = usePythonStore();
   const [isHovered, setIsHovered] = useState(false);
 
-  const handleCreateCell = (type: 'code' | 'markdown') => {
+  const handleCreateCell = (type: 'code' | 'markdown' | 'prompt') => {
     createCell(type, "", insertIndex);
   };
 
@@ -45,12 +45,20 @@ const CellDivider: React.FC<CellDividerProps> = ({ insertIndex, isLastCell = fal
         </button>
         <button
           onClick={() => handleCreateCell('markdown')}
-          className="flex items-center gap-2 px-3 py-2 text-xs text-white/70 hover:text-white hover:bg-white/10 transition-colors rounded-r-md"
+          className="flex items-center gap-2 px-3 py-2 text-xs text-white/70 hover:text-white hover:bg-white/10 transition-colors border-r border-white/10"
           title="Add Text Cell"
         >
           <Type size={12} />
           <span>Text</span>
         </button>
+        <button
+          onClick={() => handleCreateCell('prompt')}
+          className="flex items-center gap-2 px-3 py-2 text-xs text-purple-400/70 hover:text-purple-300 hover:bg-purple-500/10 transition-colors rounded-r-md"
+          title="Add AI Prompt Cell"
+        >
+          <Sparkles size={12} />
+          <span>Prompt</span>
+        </button>
       </div>
     </div>
   );

frontend/src/components/tabs/notebooks/NotebooksWorkspace.tsx

@@ -16,6 +16,7 @@ import {
   Clock,
   AlertCircle,
   RefreshCw,
+  Sparkles,
 } from 'lucide-react';
 
 import { usePythonStore } from '@/store/pythonStore';
@@ -35,6 +36,7 @@ import {
 } from '@/utils/notebookExport';
 
 import PythonCell from './PythonCell';
+import PromptCell from './PromptCell';
 import CellDivider from './CellDivider';
 import ScriptHistory from './ScriptHistory';
 import PackageManager from './PackageManager';
@@ -617,6 +619,18 @@ const NotebooksWorkspace: React.FC = () => {
               </Button>
             </Tooltip>
 
+            <Tooltip content="Add New AI Prompt Cell" placement="bottom">
+              <Button
+                variant="ghost"
+                size="sm"
+                onClick={() => createCell('prompt')}
+                className="h-8 bg-gradient-to-r from-purple-500/10 to-pink-500/10 hover:from-purple-500/20 hover:to-pink-500/20 border border-purple-500/20"
+              >
+                <Sparkles size={14} className="mr-1 text-purple-400" />
+                <span>Prompt</span>
+              </Button>
+            </Tooltip>
+
             <Tooltip
               content="Execute All Cells (⌘+Shift+Enter)"
               placement="bottom"
@@ -696,12 +710,21 @@ const NotebooksWorkspace: React.FC = () => {
           <div className="flex-1 overflow-y-auto overflow-x-visible p-8 space-y-0">
             {cells.map((cell, index) => (
               <React.Fragment key={cell.id}>
-                <PythonCell
-                  cell={cell}
-                  isActive={cell.id === activeCellId}
-                  onActivate={() => setActiveCellId(cell.id)}
-                  cellNumber={index + 1}
-                />
+                {cell.type === 'prompt' ? (
+                  <PromptCell
+                    cell={cell}
+                    isActive={cell.id === activeCellId}
+                    onActivate={() => setActiveCellId(cell.id)}
+                    cellNumber={index + 1}
+                  />
+                ) : (
+                  <PythonCell
+                    cell={cell}
+                    isActive={cell.id === activeCellId}
+                    onActivate={() => setActiveCellId(cell.id)}
+                    cellNumber={index + 1}
+                  />
+                )}
                 {/* Cell Divider - always show after each cell */}
                 <CellDivider
                   insertIndex={index + 1}