idolpx/meatloaf-config
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(CodeEditor, MediaManager): add initial text state for editing functionality

Browse Source
This commit is contained in:
Jaime Idolpx 2026-06-08 12:22:37 -04:00
parent 5a17c0a2e0
commit e902cc4d4a
3 changed files with 12 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/components/CodeEditor.tsx
View File

@ -41,8 +41,9 @@ function prettify(text: string, mode: CodeMode): string {
}
export default function CodeEditor({ text, mode, readOnly = false, onSave }: CodeEditorProps) {
const [editMode, setEditMode] = useState(false);
const [saving, setSaving] = useState(false);
const [editMode, setEditMode] = useState(false);
const [editInitText, setEditInitText] = useState('');
const [saving, setSaving] = useState(false);
const editorViewRef = useRef<EditorView | null>(null);
const displayText = prettify(text, mode);
@ -61,7 +62,7 @@ export default function CodeEditor({ text, mode, readOnly = false, onSave }: Cod
{!readOnly && (
<div className="flex items-center gap-2 px-3 py-1.5 bg-neutral-900 border-b border-neutral-700 flex-shrink-0 text-xs">
<button
onClick={() => setEditMode(true)}
onClick={() => { setEditInitText(displayText); setEditMode(true); }}
className="px-2 py-1 rounded bg-neutral-700 text-neutral-300 hover:bg-neutral-600 inline-flex items-center gap-1"
>
<Pencil className="w-3.5 h-3.5" /> Edit
@ -105,7 +106,7 @@ export default function CodeEditor({ text, mode, readOnly = false, onSave }: Cod
</div>
<div className="flex-1 overflow-hidden">
<CodeMirror
defaultValue={displayText}
value={editInitText}
extensions={extensions}
theme={oneDark}
height="100%"

4
src/app/components/HexEditor.tsx
View File

@ -297,11 +297,11 @@ export default function HexEditor({ data, readOnly = false, onSave }: HexEditorP
{/* top spacer — 12px mimics former p-3 top padding */}
<div style={{ height: paddingTop + 12 }} />
{cursor < 0 && firstRenderRow === 0 && (
{/* {cursor < 0 && firstRenderRow === 0 && (
<div className="px-3 text-neutral-600 text-xs mb-2 font-mono">
Click a cell to position cursor{editMode ? ' · type hex digits or ASCII to edit' : ''}
</div>
)}
)} */}
<div className="px-3 font-mono text-xs leading-5 whitespace-nowrap">
{Array.from({ length: lastRenderRow - firstRenderRow }, (_, i) => {

9
src/app/components/MediaManager.tsx
View File

@ -187,8 +187,9 @@ const CM_THEME = EditorView.theme({
});
function MarkdownEditor({ text, onSave }: { text: string; onSave?: (s: string) => Promise<void> }) {
const [editMode, setEditMode] = useState(false);
const [saving, setSaving] = useState(false);
const [editMode, setEditMode] = useState(false);
const [editInitText, setEditInitText] = useState('');
const [saving, setSaving] = useState(false);
const editorViewRef = useRef<EditorView | null>(null);
const save = async () => {
@ -203,7 +204,7 @@ function MarkdownEditor({ text, onSave }: { text: string; onSave?: (s: string) =
<div className="flex items-center gap-2 px-3 py-1.5 bg-neutral-900 border-b border-neutral-700 flex-shrink-0 text-xs">
{onSave && (
<button
onClick={() => setEditMode(v => !v)}
onClick={() => { if (!editMode) setEditInitText(text); setEditMode(v => !v); }}
className={editMode
? 'px-2 py-1 rounded bg-amber-600 text-white inline-flex items-center gap-1'
: 'px-2 py-1 rounded bg-neutral-700 text-neutral-300 hover:bg-neutral-600 inline-flex items-center gap-1'}
@ -222,7 +223,7 @@ function MarkdownEditor({ text, onSave }: { text: string; onSave?: (s: string) =
{editMode ? (
<div className="flex-1 overflow-hidden">
<CodeMirror
defaultValue={text}
value={editInitText}
extensions={[CM_THEME]}
theme={oneDark}
height="100%"