mirror of
https://github.com/duckietm/Nitro-V3.git
synced 2026-06-20 07:26:19 +00:00
wired-tools: hoist inline editor state (variables + managed holder) to the store
Move the four inline-editor useStates out of WiredCreatorToolsView and into useWiredCreatorToolsUiStore: - editingVariable / editingValue — Inspection-tab variables-table inline edit (current key being edited + in-flight input text). - editingManagedHolderVariableId / editingManagedHolderValue — same pair for the Variable Manage panel's holder rows (id 0 = none). WiredInspectionTabView drops three more props (editingVariable, editingValue, onEditingValueChange) and consumes the store directly for the read sides + the per-keystroke setEditingValue. The cancel / keydown / begin handlers stay in the parent because they wrap shouldPauseVariableSnapshotRefresh-aware logic plus selection bookkeeping that doesn't belong to a pure tab body. The shouldPauseVariableSnapshotRefresh derived flag still reads from the same store now-backed values; no behaviour change on the polling suppression path. Tests: three new cases (set+read pair, null-clear, managed-holder 0-as-sentinel reset). 193/193 passing.
This commit is contained in:
@@ -34,10 +34,10 @@ export interface WiredInspectionTabViewProps
|
||||
selectedInspectionVariableKey: string;
|
||||
onSelectInspectionVariable: (variable: InspectionVariable) => void;
|
||||
|
||||
// inline editor
|
||||
editingVariable: string;
|
||||
editingValue: string;
|
||||
onEditingValueChange: (value: string) => void;
|
||||
// inline editor — `editingVariable` / `editingValue` come from the
|
||||
// store; this tab only needs the cancel / keydown / begin handlers
|
||||
// since each tab consumer wraps `onBeginVariableEdit` with its own
|
||||
// bookkeeping (variable-key tracking).
|
||||
onCancelVariableEdit: () => void;
|
||||
onVariableInputKeyDown: (event: KeyboardEvent<HTMLInputElement>) => void;
|
||||
onBeginVariableEdit: (variable: InspectionVariable) => void;
|
||||
@@ -73,9 +73,6 @@ export const WiredInspectionTabView = (props: WiredInspectionTabViewProps) =>
|
||||
displayedVariables,
|
||||
selectedInspectionVariableKey,
|
||||
onSelectInspectionVariable,
|
||||
editingVariable,
|
||||
editingValue,
|
||||
onEditingValueChange,
|
||||
onCancelVariableEdit,
|
||||
onVariableInputKeyDown,
|
||||
onBeginVariableEdit,
|
||||
@@ -94,6 +91,9 @@ export const WiredInspectionTabView = (props: WiredInspectionTabViewProps) =>
|
||||
const setInspectionType = useWiredCreatorToolsUiStore(s => s.setInspectionType);
|
||||
const isInspectionGiveOpen = useWiredCreatorToolsUiStore(s => s.isInspectionGiveOpen);
|
||||
const setIsInspectionGiveOpen = useWiredCreatorToolsUiStore(s => s.setIsInspectionGiveOpen);
|
||||
const editingVariable = useWiredCreatorToolsUiStore(s => s.editingVariable);
|
||||
const editingValue = useWiredCreatorToolsUiStore(s => s.editingValue);
|
||||
const setEditingValue = useWiredCreatorToolsUiStore(s => s.setEditingValue);
|
||||
|
||||
return (
|
||||
<div className="p-3 min-h-[360px] flex gap-4">
|
||||
@@ -173,7 +173,7 @@ export const WiredInspectionTabView = (props: WiredInspectionTabViewProps) =>
|
||||
value={ editingValue }
|
||||
onClick={ event => event.stopPropagation() }
|
||||
onBlur={ onCancelVariableEdit }
|
||||
onChange={ event => onEditingValueChange(event.target.value) }
|
||||
onChange={ event => setEditingValue(event.target.value) }
|
||||
onKeyDownCapture={ onVariableInputKeyDown } /> }
|
||||
{ (editingVariable !== variable.key) && !variable.editable && <span className={ variable.valueClassName }>{ variable.value }</span> }
|
||||
{ (editingVariable !== variable.key) && variable.editable &&
|
||||
|
||||
Reference in New Issue
Block a user