Added memory editing functionality

web/src/components/editors/MemoryEditor.jsx

@@ -1,8 +1,30 @@
 import React, { useState } from 'react';
+import { BackgroundEntryEditor } from './BackgroundEntryEditor';
+import { ParseErrorEntryEditor } from './ParseErrorEntryEditor';
+import { ReadEntryEditor } from './ReadEntryEditor';
+import { ReasoningEntryEditor } from './ReasoningEntryEditor';
+import { RepeatEntryEditor } from './RepeatEntryEditor';
 import { SingleEntryEditor } from './SingleEntryEditor';
+import { WriteEntryEditor } from './WriteEntryEditor';
 
 const EntryTypes = {
-  SINGLE: 'single'
+  BACKGROUND: 'background',
+  PARSE_ERROR: 'parse_error',
+  READ_STDIN: 'read_stdin',
+  REASONING: 'reasoning',
+  REPEAT: 'repeat',
+  SINGLE: 'single',
+  WRITE: 'write'
+};
+
+const EntryEditors = {
+  [EntryTypes.BACKGROUND]: BackgroundEntryEditor,
+  [EntryTypes.PARSE_ERROR]: ParseErrorEntryEditor,
+  [EntryTypes.READ_STDIN]: ReadEntryEditor,
+  [EntryTypes.REASONING]: ReasoningEntryEditor,
+  [EntryTypes.REPEAT]: RepeatEntryEditor,
+  [EntryTypes.SINGLE]: SingleEntryEditor,
+  [EntryTypes.WRITE]: WriteEntryEditor
 };
 
 export const MemoryEditor = ({
@@ -14,33 +36,74 @@ export const MemoryEditor = ({
   onUpdateEntry
 }) => {
   const [showCreateDialog, setShowCreateDialog] = useState(false);
+  const [selectedType, setSelectedType] = useState(EntryTypes.SINGLE);
 
   const handleCreate = (_id, entry) => {
     onCreateEntry(entry);
     setShowCreateDialog(false);
   };
 
-  const renderCreateDialog = () => {
+  const generateId = () => {
     const now = new Date();
-    const id = now.getFullYear() +
-    String(now.getMonth() + 1).padStart(2, '0') +
-    String(now.getDate()).padStart(2, '0') + '_' +
-    String(now.getHours()).padStart(2, '0') +
-    String(now.getMinutes()).padStart(2, '0') +
-    String(now.getSeconds()).padStart(2, '0') + '_' +
-    String(now.getMilliseconds()).padStart(3, '0');
+    return now.getFullYear() +
+      String(now.getMonth() + 1).padStart(2, '0') +
+      String(now.getDate()).padStart(2, '0') + '_' +
+      String(now.getHours()).padStart(2, '0') +
+      String(now.getMinutes()).padStart(2, '0') +
+      String(now.getSeconds()).padStart(2, '0') + '_' +
+      String(now.getMilliseconds()).padStart(3, '0');
+  };
 
-    const entry = {
-      type: EntryTypes.SINGLE,
-      id: id,
-      script: '',
-      timeout: null,
-      limit: null,
-      executed: false
+  const getInitialEntry = (type) => {
+    const baseEntry = {
+      type: type,
+      id: generateId()
     };
 
+    switch (type) {
+      case EntryTypes.BACKGROUND:
+      case EntryTypes.REPEAT:
+      case EntryTypes.SINGLE:
+        return {
+          ...baseEntry,
+          script: '',
+          timeout: null,
+          limit: null
+        };
+      case EntryTypes.PARSE_ERROR:
+        return {
+          ...baseEntry,
+          content: '',
+          error: ''
+        };
+      case EntryTypes.READ_STDIN:
+        return {
+          ...baseEntry,
+          content: '',
+          read: false
+        };
+      case EntryTypes.REASONING:
+        return {
+          ...baseEntry,
+          content: ''
+        };
+      case EntryTypes.WRITE:
+        return {
+          ...baseEntry,
+          content: '',
+          written: false
+        };
+      default:
+        return baseEntry;
+    }
+  };
+
+  const renderCreateDialog = () => {
+    const EditorComponent = EntryEditors[selectedType];
+    const entry = getInitialEntry(selectedType);
+
     return (
-      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center">
+      <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-[100]">
         <div className="bg-white p-4 rounded-lg max-w-2xl w-full m-4">
           <div className="flex justify-between items-center mb-4">
             <h2 className="text-lg font-medium">Create New Entry</h2>
@@ -51,10 +114,23 @@ export const MemoryEditor = ({
               ✕
             </button>
           </div>
-          <SingleEntryEditor
+          <div className="mb-4">
+            <label className="block text-sm font-medium text-gray-700">Entry Type</label>
+            <select
+              value={selectedType}
+              onChange={(e) => setSelectedType(e.target.value)}
+              className="mt-1 block w-full rounded-md border-gray-300 shadow-sm"
+            >
+              {Object.entries(EntryTypes).map(([key, value]) => (
+                <option key={value} value={value}>
+                  {key.toLowerCase().replace('_', ' ')}
+                </option>
+              ))}
+            </select>
+          </div>
+          <EditorComponent
             entry={entry}
             isNew={true}
-            isEditing={true}
             onSave={handleCreate}
             onCancel={() => setShowCreateDialog(false)}
           />
@@ -63,6 +139,25 @@ export const MemoryEditor = ({
     );
   };
 
+  const renderEntry = (entry) => {
+    const EditorComponent = EntryEditors[entry.type];
+    if (!EditorComponent) {
+      console.warn(`Unknown entry type: ${entry.type}`);
+      return null;
+    }
+
+    return (
+      <EditorComponent
+        key={entry.id}
+        entry={entry}
+        onSave={onSaveEntry}
+        onDelete={onDeleteEntry}
+        onReset={onResetEntry}
+        onUpdate={onUpdateEntry}
+      />
+    );
+  };
+
   return (
     <div className="p-4">
       <div className="flex justify-end mb-4">
@@ -75,17 +170,7 @@ export const MemoryEditor = ({
       </div>
 
       <div className="space-y-4">
-        {entries.map(entry => (
-          <SingleEntryEditor
-            key={entry.id}
-            entry={entry}
-            isEditing={true}
-            onSave={onSaveEntry}
-            onDelete={onDeleteEntry}
-            onReset={onResetEntry}
-            onUpdate={onUpdateEntry}
-          />
-        ))}
+        {entries.map(renderEntry)}
       </div>
 
       {showCreateDialog && renderCreateDialog()}