diff --git a/components/REPL/REPLInput.tsx b/components/REPL/REPLInput.tsx index 31cb10b..441d921 100644 --- a/components/REPL/REPLInput.tsx +++ b/components/REPL/REPLInput.tsx @@ -15,7 +15,7 @@ const REPLInput: NextPage = ({historyCallback, historyClear, in const typed = createRef(); const completion = createRef(); const [currentCmd, setCurrentCmd] = useState([]); - const [justTabbed, setJustTabbed] = useState(0); + let [justTabbed, setJustTabbed] = useState(0); // Because setters are not in sync but the events are too fast const [inCmdHistory, setInCmdHistory] = useState(-1); const [cmdHistory, setCmdHistory] = useState([]); const [usrInputTmp, setUsrInputTmp] = useState(""); @@ -29,7 +29,7 @@ const REPLInput: NextPage = ({historyCallback, historyClear, in //if(typed.current) typed.current.innerHTML = input; //if(completion.current) completion.current.innerHTML = ""; inputRef.dispatchEvent(new Event("input", { bubbles: true })); - inputRef.dispatchEvent(new Event("change", { bubbles: true })); + inputRef.dispatchEvent(new Event("change", { bubbles: true, })); }; const clearInput = (inputRef: HTMLInputElement) => { @@ -52,24 +52,30 @@ const REPLInput: NextPage = ({historyCallback, historyClear, in return; } else { input.maxLength = 20; - // Get completion hint - const suggest = CommandInterface.commandCompletion(currentInput); - setCurrentCmd(suggest); - if (suggest.length === 0) suggest.push(""); - if (typed.current) typed.current.innerHTML = currentInput; - if (completion.current) completion.current.innerHTML = suggest[0].substring(currentInput.length); + if(justTabbed === 0) { + // Get completion hint + const suggest = CommandInterface.commandCompletion(currentInput); + setCurrentCmd(suggest); + + if (suggest.length === 0) suggest.push(""); + if (typed.current) typed.current.innerHTML = currentInput; + if (completion.current) completion.current.innerHTML = suggest[0].substring(currentInput.length); + } else { + if (typed.current) typed.current.innerHTML = ""; + if (completion.current) completion.current.innerHTML = ""; + } } }; const keyEvent = (e: React.KeyboardEvent) => { const input = (e.target as HTMLInputElement); - if (e.key === "Tab") { - e.preventDefault(); - } + if (e.key === "Tab") e.preventDefault(); + if (e.key === "Tab" && currentCmd.length !== 0) { const cmd = `${currentCmd[justTabbed % currentCmd.length]}${currentCmd.length === 1 ? " " : ""}`; - setInput(input, cmd); setJustTabbed(justTabbed + 1); + justTabbed += 1; // Because setters are not in sync but the events are too fast + setInput(input, cmd); return false; } else setJustTabbed(0); diff --git a/lib/commands/index.ts b/lib/commands/index.ts index 32cf3a6..7f78519 100644 --- a/lib/commands/index.ts +++ b/lib/commands/index.ts @@ -17,7 +17,7 @@ export class CommandInterface { static commandCompletion(input: string): string[] { if (input === "") return []; - const candidates = commandList.filter(cmd => cmd.name.substring(0, input.length) === input).map(cmd => cmd.name); + const candidates = commandList.filter(cmd => cmd.name.startsWith(input)).map(cmd => cmd.name); return candidates; }