Add context menu to breadcrumbs

This commit is contained in:
2026-02-26 14:47:01 +01:00
parent d756d545db
commit 00b432f3dc
4 changed files with 42 additions and 22 deletions

View File

@@ -1,6 +1,5 @@
<script lang="ts">
import { run } from 'svelte/legacy';
import { fs_delete_all, fs_rename, type FSNode } from "lib/FilesystemAPI.svelte"
import { fs_delete_all, fs_rename } from "lib/FilesystemAPI.svelte"
import { onMount } from "svelte"
import CreateDirectory from "./CreateDirectory.svelte"
import ListView from "./ListView.svelte"
@@ -225,18 +224,21 @@ const select_node = (index: number) => {
last_selected_node = index
}
const update = (children: FSNode[]) => {
// When the directory is reloaded we want to keep our selection, so this
// function watches the children array for changes and updates the selection
// when it changes
$effect.pre(() => {
creating_dir = false
// Highlight the files which were previously selected
for (let i = 0; i < children.length; i++) {
for (let i = 0; i < $nav.children.length; i++) {
for (let j = 0; j < moving_items.length; j++) {
if (moving_items[j].path === children[i].path) {
children[i].fm_selected = true
if (moving_items[j].path === $nav.children[i].path) {
$nav.children[i].fm_selected = true
}
}
}
}
})
let moving_files = $state(0)
let moving_directories = $state(0)
@@ -289,12 +291,6 @@ onMount(() => {
directory_view = "list"
}
})
// When the directory is reloaded we want to keep our selection, so this
// function watches the children array for changes and updates the selection
// when it changes
run(() => {
update($nav.children)
});
</script>
<svelte:window onkeydown={keypress} onkeyup={keypress} />

View File

@@ -10,16 +10,19 @@ import { tick } from "svelte";
let {
nav,
edit_window
edit_window = null
}: {
nav: FSNavigator;
edit_window: EditWindow;
edit_window?: EditWindow;
} = $props();
let dialog: Dialog = $state()
let node: FSNode = $state(null)
export const open = async (n: FSNode, target: EventTarget, event: Event) => {
event.preventDefault()
event.stopPropagation()
node = n
// Wait for the view to update, so the dialog gets the proper measurements
await tick()
@@ -61,9 +64,11 @@ const delete_node = async () => {
{/if}
{#if $nav.permissions.write}
<Button click={() => {dialog.close(); delete_node()}} icon="delete" label="Delete"/>
<Button click={() => {dialog.close(); edit_window.edit(node, false, "file")}} icon="edit" label="Edit"/>
<Button click={() => {dialog.close(); edit_window.edit(node, false, "share")}} icon="share" label="Share"/>
<Button click={() => {dialog.close(); edit_window.edit(node, false, "branding")}} icon="palette" label="Branding"/>
{#if edit_window !== null}
<Button click={() => {dialog.close(); edit_window.edit(node, false, "file")}} icon="edit" label="Edit"/>
<Button click={() => {dialog.close(); edit_window.edit(node, false, "share")}} icon="share" label="Share"/>
<Button click={() => {dialog.close(); edit_window.edit(node, false, "branding")}} icon="palette" label="Branding"/>
{/if}
{/if}
</div>
</Dialog>