Skip to content

fix(commandline): improve caching to fix stale checkmark and UI state (@byseif21, @fehmer) #6586

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Miodec merged 4 commits into from
May 27, 2025
Merged

fix(commandline): improve caching to fix stale checkmark and UI state (@byseif21, @fehmer) #6586

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
c54acb3
fix: language selection checkmark not updating in commandline list vi…
byseif21 May 22, 2025
0adeba8
impr: update commandline caching to include active state and single-l…
byseif21 May 22, 2025
95b7955
impr: apply changes
byseif21 May 22, 2025
a8889c5
cleanup
byseif21 May 22, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
87 changes: 50 additions & 37 deletions frontend/src/ts/commandline/commandline.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,15 @@ let subgroupOverride: CommandsSubgroup | null = null;
let isAnimating = false;
let lastSingleListModeInputValue = "";

type CommandWithActiveState = Omit<Command, "active"> & { isActive: boolean };

let lastState:
| {
list: CommandWithActiveState[];
usingSingleList: boolean;
}
| undefined;

function removeCommandlineBackground(): void {
$("#commandLine").addClass("noBackground");
if (Config.showOutOfFocusWarning) {
Expand Down Expand Up @@ -328,7 +337,7 @@ function hideCommands(): void {
throw new Error("Commandline element not found");
}
element.innerHTML = "";
lastList = undefined;
lastState = undefined;
}

let cachedSingleSubgroup: CommandsSubgroup | null = null;
Expand All @@ -353,8 +362,6 @@ async function getList(): Promise<Command[]> {
return (await getSubgroup()).list;
}

let lastList: Command[] | undefined;

async function showCommands(): Promise<void> {
const element = document.querySelector("#commandLine .suggestions");
if (element === null) {
Expand All @@ -366,11 +373,42 @@ async function showCommands(): Promise<void> {
return;
}

const list = (await getList()).filter((c) => c.found === true);
if (lastList && areSortedArraysEqual(list, lastList)) {
const subgroup = await getSubgroup();

const list = subgroup.list
.filter((c) => c.found === true)
.map((command) => {
let isActive = false;
if (command.active !== undefined) {
isActive = command.active();
} else {
const configKey = command.configKey ?? subgroup.configKey;
if (configKey !== undefined) {
if (command.configValueMode === "include") {
isActive = (Config[configKey] as unknown[]).includes(
command.configValue
);
} else {
isActive = Config[configKey] === command.configValue;
}
}
}
const { active: _active, ...restOfCommand } = command;
return { ...restOfCommand, isActive } as CommandWithActiveState;
});

if (
lastState &&
usingSingleList === lastState.usingSingleList &&
areSortedArraysEqual(list, lastState.list)
) {
return;
}
lastList = list;

lastState = {
list: list,
usingSingleList: usingSingleList,
};
Comment thread
byseif21 marked this conversation as resolved.

let html = "";
let index = 0;
Expand All @@ -387,38 +425,13 @@ async function showCommands(): Promise<void> {
icon = `<i class="fas fa-fw ${icon}"></i>`;
}
let configIcon = "";
const configKey = command.configKey ?? (await getSubgroup()).configKey;
if (command.active !== undefined) {
if (command.active()) {
firstActive = firstActive ?? index;
configIcon = `<i class="fas fa-fw fa-check"></i>`;
} else {
configIcon = `<i class="fas fa-fw"></i>`;
}
} else if (configKey !== undefined) {
let isActive;

if (command.configValueMode === "include") {
isActive = (
Config[configKey] as (
| string
| number
| boolean
| number[]
| undefined
)[]
).includes(command.configValue);
} else {
isActive = Config[configKey] === command.configValue;
}

if (isActive) {
firstActive = firstActive ?? index;
configIcon = `<i class="fas fa-fw fa-check"></i>`;
} else {
configIcon = `<i class="fas fa-fw"></i>`;
}
if (command.isActive) {
firstActive = firstActive ?? index;
configIcon = `<i class="fas fa-fw fa-check"></i>`;
} else {
configIcon = `<i class="fas fa-fw"></i>`;
}

const iconHTML = `<div class="icon">${
usingSingleList || configIcon === "" ? icon : configIcon
}</div>`;
Expand Down