UI: Add disambiguation to the confusing "1s / ls" tutorial step (#1972)

* UI: Add disambiguation to the confusing "1s / ls" tutorial step, and a general "did you mean" to the terminal

* UI: Add disambiguation to the confusing "1s / ls" tutorial step, and a general "did you mean" to the terminal

* Prevent duplicate suggestions

* Update src/Terminal/Terminal.ts

Co-authored-by: David Walker <d0sboots@gmail.com>

* Prevent duplicate suggestions

---------

Co-authored-by: David Walker <d0sboots@gmail.com>
This commit is contained in:
Michael Ficocelli
2025-02-27 13:34:16 -05:00
committed by GitHub
parent 6461d5f247
commit 1982e7195b
2 changed files with 26 additions and 2 deletions

View File

@@ -656,6 +656,9 @@ export class Terminal {
case iTutorialSteps.TerminalLs:
if (commandArray.length === 1 && commandArray[0] == "ls") {
iTutorialNextStep();
} else if (commandArray[0] == "1s") {
this.error("Command '1s' not found. Did you mean 'ls' with a lowercase L?");
return;
} else {
this.error(errorMessageForBadCommand);
return;
@@ -800,7 +803,11 @@ export class Terminal {
commandArray.shift();
const f = TerminalCommands[commandName.toLowerCase()];
if (!f) return this.error(`Command ${commandName} not found`);
if (!f) {
const similarCommands = findSimilarCommands(commandName);
const didYouMeanString = similarCommands.length ? ` Did you mean: ${similarCommands.join(" or ")}?` : "";
return this.error(`Command ${commandName} not found.${didYouMeanString}`);
}
f(commandArray, currentServer);
}
@@ -813,3 +820,17 @@ export class Terminal {
});
}
}
function findSimilarCommands(command: string): string[] {
const commands = Object.keys(TerminalCommands);
const offByOneLetter = commands.filter((c) => {
if (c.length !== command.length) return false;
let diff = 0;
for (let i = 0; i < c.length; i++) {
if (c[i] !== command[i]) diff++;
}
return diff === 1;
});
const subset = commands.filter((c) => c.includes(command)).sort((a, b) => a.length - b.length);
return Array.from(new Set([...offByOneLetter, ...subset])).slice(0, 3);
}

View File

@@ -146,6 +146,9 @@ export function InteractiveTutorialRoot(): React.ReactElement {
</Typography>
<Typography classes={{ root: classes.textfield }}>{"[home /]> ls"}</Typography>
<Typography>
<br />( "ls" is short for "list" )
</Typography>
</>
),
canNext: false,
@@ -156,7 +159,7 @@ export function InteractiveTutorialRoot(): React.ReactElement {
<Typography classes={{ root: classes.textfield }}>{"[home /]> ls"}</Typography>
<Typography>
{" "}
is a basic command that shows files on the computer. Right now, it shows that you have a program called{" "}
is a basic command that lists the files on the computer. Right now, it shows that you have a program called{" "}
NUKE.exe on your computer. We'll get to what this does later. <br />
<br />
Using your home computer's terminal, you can connect to other machines throughout the world. Let's do that