From c54acb37e77f29be410fa12a8f49fc17a266a875 Mon Sep 17 00:00:00 2001 From: byseif21 Date: Thu, 22 May 2025 15:30:03 +0300 Subject: [PATCH 1/4] fix: language selection checkmark not updating in commandline list via language textButton (@byseif21) --- frontend/src/ts/commandline/commandline.ts | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/frontend/src/ts/commandline/commandline.ts b/frontend/src/ts/commandline/commandline.ts index bde1617eb651..6860a47fa024 100644 --- a/frontend/src/ts/commandline/commandline.ts +++ b/frontend/src/ts/commandline/commandline.ts @@ -14,6 +14,7 @@ import { Command, CommandsSubgroup } from "./types"; import { areSortedArraysEqual } from "../utils/arrays"; import { parseIntOptional } from "../utils/numbers"; import { debounce } from "throttle-debounce"; +import * as ConfigEvent from "../observables/config-event"; type CommandlineMode = "search" | "input"; type InputModeParams = { @@ -355,6 +356,13 @@ async function getList(): Promise { let lastList: Command[] | undefined; +// cear the cached list when language changes to ensure UI updates correctly +ConfigEvent.subscribe((eventKey) => { + if (eventKey === "language") { + lastList = undefined; + } +}); + async function showCommands(): Promise { const element = document.querySelector("#commandLine .suggestions"); if (element === null) { @@ -367,7 +375,17 @@ async function showCommands(): Promise { } const list = (await getList()).filter((c) => c.found === true); - if (lastList && areSortedArraysEqual(list, lastList)) { + + if ( + lastList && + areSortedArraysEqual(list, lastList) && + list.every((cmd) => { + if (cmd.configKey === "language") { + return cmd.configValue === Config.language; + } + return true; + }) + ) { return; } lastList = list; From 0adeba8ffa9671815eadbe2cdd170d130dc35bc5 Mon Sep 17 00:00:00 2001 From: byseif21 Date: Thu, 22 May 2025 17:25:57 +0300 Subject: [PATCH 2/4] impr: update commandline caching to include active state and single-list mode - replaced lastList with lastState to cache command list and usingSingleList. - added illActiveState to compute command active state. - updated showCommands to check active state and mode in cache comparison. - removed ConfigEvent subscription as cache now handles language changes. - ensures checkmark updates for language selection via text button. --- frontend/src/ts/commandline/commandline.ts | 64 ++++++++++++++++------ 1 file changed, 46 insertions(+), 18 deletions(-) diff --git a/frontend/src/ts/commandline/commandline.ts b/frontend/src/ts/commandline/commandline.ts index 6860a47fa024..3438669ff9d3 100644 --- a/frontend/src/ts/commandline/commandline.ts +++ b/frontend/src/ts/commandline/commandline.ts @@ -14,7 +14,6 @@ import { Command, CommandsSubgroup } from "./types"; import { areSortedArraysEqual } from "../utils/arrays"; import { parseIntOptional } from "../utils/numbers"; import { debounce } from "throttle-debounce"; -import * as ConfigEvent from "../observables/config-event"; type CommandlineMode = "search" | "input"; type InputModeParams = { @@ -40,6 +39,15 @@ let subgroupOverride: CommandsSubgroup | null = null; let isAnimating = false; let lastSingleListModeInputValue = ""; +type CommandWithActiveState = Omit & { active: boolean }; + +let lastState: + | { + list: CommandWithActiveState[]; + usingSingleList: boolean; + } + | undefined; + function removeCommandlineBackground(): void { $("#commandLine").addClass("noBackground"); if (Config.showOutOfFocusWarning) { @@ -194,6 +202,7 @@ async function goBackOrHide(): Promise { await filterSubgroup(); await showCommands(); await updateActiveCommand(); + lastSingleListModeInputValue = ""; return; } @@ -329,7 +338,7 @@ function hideCommands(): void { throw new Error("Commandline element not found"); } element.innerHTML = ""; - lastList = undefined; + lastState = undefined; } let cachedSingleSubgroup: CommandsSubgroup | null = null; @@ -354,14 +363,32 @@ async function getList(): Promise { return (await getSubgroup()).list; } -let lastList: Command[] | undefined; - -// cear the cached list when language changes to ensure UI updates correctly -ConfigEvent.subscribe((eventKey) => { - if (eventKey === "language") { - lastList = undefined; +function fillActiveState(command: Command): CommandWithActiveState { + let isActive = false; + + if (command.active !== undefined) { + isActive = command.active(); + } else if (command.configKey !== undefined) { + if (command.configValueMode === "include") { + isActive = ( + Config[command.configKey as keyof typeof Config] as ( + | string + | number + | boolean + | number[] + | undefined + )[] + ).includes(command.configValue); + } else { + isActive = + Config[command.configKey as keyof typeof Config] === + command.configValue; + } } -}); + + const { active: _originalActive, ...restOfCommand } = command; + return { ...restOfCommand, active: isActive }; +} async function showCommands(): Promise { const element = document.querySelector("#commandLine .suggestions"); @@ -376,19 +403,20 @@ async function showCommands(): Promise { const list = (await getList()).filter((c) => c.found === true); + const listWithActiveState = list.map(fillActiveState); + if ( - lastList && - areSortedArraysEqual(list, lastList) && - list.every((cmd) => { - if (cmd.configKey === "language") { - return cmd.configValue === Config.language; - } - return true; - }) + lastState && + usingSingleList === lastState.usingSingleList && + areSortedArraysEqual(listWithActiveState, lastState.list) ) { return; } - lastList = list; + + lastState = { + list: listWithActiveState, + usingSingleList: usingSingleList, + }; let html = ""; let index = 0; From 95b7955e1e2167599235696fa80148b49a7d2737 Mon Sep 17 00:00:00 2001 From: byseif21 Date: Thu, 22 May 2025 18:39:46 +0300 Subject: [PATCH 3/4] impr: apply changes --- frontend/src/ts/commandline/commandline.ts | 96 ++++++++-------------- 1 file changed, 32 insertions(+), 64 deletions(-) diff --git a/frontend/src/ts/commandline/commandline.ts b/frontend/src/ts/commandline/commandline.ts index 3438669ff9d3..991e140c83b2 100644 --- a/frontend/src/ts/commandline/commandline.ts +++ b/frontend/src/ts/commandline/commandline.ts @@ -39,7 +39,7 @@ let subgroupOverride: CommandsSubgroup | null = null; let isAnimating = false; let lastSingleListModeInputValue = ""; -type CommandWithActiveState = Omit & { active: boolean }; +type CommandWithActiveState = Omit & { isActive: boolean }; let lastState: | { @@ -202,7 +202,7 @@ async function goBackOrHide(): Promise { await filterSubgroup(); await showCommands(); await updateActiveCommand(); - lastSingleListModeInputValue = ""; + //lastSingleListModeInputValue = ""; return; } @@ -363,33 +363,6 @@ async function getList(): Promise { return (await getSubgroup()).list; } -function fillActiveState(command: Command): CommandWithActiveState { - let isActive = false; - - if (command.active !== undefined) { - isActive = command.active(); - } else if (command.configKey !== undefined) { - if (command.configValueMode === "include") { - isActive = ( - Config[command.configKey as keyof typeof Config] as ( - | string - | number - | boolean - | number[] - | undefined - )[] - ).includes(command.configValue); - } else { - isActive = - Config[command.configKey as keyof typeof Config] === - command.configValue; - } - } - - const { active: _originalActive, ...restOfCommand } = command; - return { ...restOfCommand, active: isActive }; -} - async function showCommands(): Promise { const element = document.querySelector("#commandLine .suggestions"); if (element === null) { @@ -401,20 +374,40 @@ async function showCommands(): Promise { return; } - const list = (await getList()).filter((c) => c.found === true); + const subgroup = await getSubgroup(); - const listWithActiveState = list.map(fillActiveState); + 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(listWithActiveState, lastState.list) + areSortedArraysEqual(list, lastState.list) ) { return; } lastState = { - list: listWithActiveState, + list: list, usingSingleList: usingSingleList, }; @@ -433,38 +426,13 @@ async function showCommands(): Promise { icon = ``; } let configIcon = ""; - const configKey = command.configKey ?? (await getSubgroup()).configKey; - if (command.active !== undefined) { - if (command.active()) { - firstActive = firstActive ?? index; - configIcon = ``; - } else { - configIcon = ``; - } - } 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 = ``; - } else { - configIcon = ``; - } + if (command.isActive) { + firstActive = firstActive ?? index; + configIcon = ``; + } else { + configIcon = ``; } + const iconHTML = `
${ usingSingleList || configIcon === "" ? icon : configIcon }
`; From a8889c5539cb38ec78b0d9b7ddb71f6da8baa3d0 Mon Sep 17 00:00:00 2001 From: byseif21 Date: Thu, 22 May 2025 18:41:07 +0300 Subject: [PATCH 4/4] cleanup --- frontend/src/ts/commandline/commandline.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/frontend/src/ts/commandline/commandline.ts b/frontend/src/ts/commandline/commandline.ts index 991e140c83b2..30df67254e8c 100644 --- a/frontend/src/ts/commandline/commandline.ts +++ b/frontend/src/ts/commandline/commandline.ts @@ -202,7 +202,6 @@ async function goBackOrHide(): Promise { await filterSubgroup(); await showCommands(); await updateActiveCommand(); - //lastSingleListModeInputValue = ""; return; }