fix: opening folder-menu clicking popup button, left the button visible after closing the menu
Massimo Melina committed
Aug 17, 2024 at 18:47 UTC
7f303d4b19951474bd73e62f023bc929555b69fe
2 files changed
+5
-3
frontend/src/fileMenu.ts
+1
@@ -94,6 +94,7 @@ export function openFileMenu(entry: DirEntry, ev: MouseEvent, addToMenu: (FileMe
94
icon: () => ico,
95
position: Math.min(innerWidth, innerHeight) < 800 ? undefined
96
: [ev.pageX, ev.pageY - scrollY] as [number, number],
97
+ restoreFocus: ev.screenY || ev.screenX ? false : undefined,
98
Content() {
99
const {t} = useI18N()
100
const details = useApi('get_file_details', { uris: [entry.uri] }).data?.details?.[0]
shared/dialogs.ts
+4
-3
@@ -23,12 +23,12 @@ export interface DialogOptions {
23
$id?: number
24
$opening?: NodeJS.Timeout
25
ts?: number
26
+ restoreFocus?: any
27
28
Container?: FunctionComponent<DialogOptions>
29
}
30
31
const dialogs = proxy<DialogOptions[]>([])
31
-const focusBak: (Element | null)[] = []
32
const { history } = window
33
34
export const dialogsDefaults: Partial<DialogOptions> = {
@@ -184,7 +184,8 @@ export function newDialog(options: DialogOptions) {
184
const ts = performance.now()
185
options.$id = $id // object identity is not working because of the proxy. This is a possible workaround
186
options.ts = ts
187
- focusBak.push(document.activeElement) // saving this inside options object doesn't work (didn't dig enough to say why)
187
+ if (document.activeElement)
188
+ options.restoreFocus ??= ref(document.activeElement)
189
options = objSameKeys(options, x => isValidElement(x) ? ref(x) : x) as typeof options // encapsulate elements as react will try to write, but valtio makes them readonly
190
options.$opening = setTimeout(() => { // in case dialogs were just closed, account for window.history delay. This should be harmless as ux is unaffected, and programmatically you already didn't expect this to happen immediately but at state change
191
dialogs.push(options)
@@ -223,7 +224,7 @@ export function closeDialog(v?:any, skipHistory=false) {
224
225
function closeDialogAt(i: number, value?: any) {
226
const [d] = dialogs.splice(i,1)
226
- ;(focusBak.pop() as any)?.focus?.() // if element is not HTMLElement, it doesn't have focus method
227
+ d.restoreFocus?.focus?.() // if element is not HTMLElement, it doesn't have focus method
228
d.closingValue = value
229
d?.onClose?.(value)
230
return d