diff --git a/e2e/drive-backed-apps/specs/drive-writer/integration.spec.ts b/e2e/drive-backed-apps/specs/drive-writer/integration.spec.ts
index 41b3bfe331..a2eb945b0c 100644
--- a/e2e/drive-backed-apps/specs/drive-writer/integration.spec.ts
+++ b/e2e/drive-backed-apps/specs/drive-writer/integration.spec.ts
@@ -72,13 +72,14 @@ test("renames, moves, trashes, restores, and reopens a Writer document from Driv
 	await expect(documentRow).toContainText(title);
 	await openEntityActions(owner.page, file.name);
 	await owner.page.getByRole("button", { name: "Rename", exact: true }).click();
-	const renameDialog = owner.page.getByRole("dialog", { name: "Rename" });
-	await renameDialog.getByRole("textbox").fill(renamedTitle);
+	// Renaming is inline in the row, not a dialog.
+	const renameInput = documentRow.getByRole("textbox");
+	await renameInput.fill(renamedTitle);
 	const [renameResponse] = await Promise.all([
 		owner.page.waitForResponse(
 			(response) => response.url().includes("suite.drive.api.files.rename"),
 		),
-		renameDialog.getByRole("button", { name: "Confirm" }).click(),
+		renameInput.press("Enter"),
 	]);
 	if (!renameResponse.ok()) throw new Error(await renameResponse.text());
 	await expect(documentRow).toContainText(renamedTitle);
diff --git a/e2e/drive-backed-apps/specs/drive/breadcrumbs.spec.ts b/e2e/drive-backed-apps/specs/drive/breadcrumbs.spec.ts
new file mode 100644
index 0000000000..91a9b3813d
--- /dev/null
+++ b/e2e/drive-backed-apps/specs/drive/breadcrumbs.spec.ts
@@ -0,0 +1,178 @@
+import type { Page } from "@playwright/test";
+
+import { expect, test } from "../../fixtures/test";
+import { createFolder } from "../../helpers/drive";
+
+function uniqueName(runId: string, label: string): string {
+	return `${label}-${runId}-${Date.now()}`;
+}
+
+/** The breadcrumb trail a user can read in the navbar, outermost first. */
+async function trail(page: Page): Promise<string[]> {
+	const crumbs = page.getByTestId("breadcrumbs");
+	await expect(crumbs).toBeVisible();
+	await expect(page.getByTestId("breadcrumbs-loading")).toHaveCount(0);
+	return (await crumbs.innerText())
+		.split("/")
+		.map((part: string) => part.trim())
+		.filter(Boolean);
+}
+
+async function openFolder(page: Page, entityName: string): Promise<void> {
+	const row = page.getByTestId(`drive-entity-${entityName}`);
+	await expect(row).toBeVisible();
+	await row.click();
+}
+
+test("each section shows its own name, and the navbar never vanishes while navigating", async ({
+	owner,
+}) => {
+	const page = owner.page;
+	await page.goto("/drive");
+	await expect.poll(() => trail(page)).toEqual(["Home"]);
+
+	for (const section of ["Recents", "Shared", "Favourites", "Trash"]) {
+		await page.getByRole("link", { name: section, exact: true }).click();
+		await expect(page.locator("#navbar")).toBeVisible();
+		await expect.poll(() => trail(page)).toEqual([section]);
+	}
+
+	await page.getByRole("link", { name: "Home", exact: true }).click();
+	await expect.poll(() => trail(page)).toEqual(["Home"]);
+});
+
+test("nested folders build up the trail and an ancestor crumb navigates back", async ({
+	owner,
+	run,
+}) => {
+	const page = owner.page;
+	await page.goto("/drive");
+	const parentName = uniqueName(run.run_id, "parent");
+	const parent = await createFolder(page, parentName);
+
+	await page.goto(`/drive/d/${parent.name}`);
+	await expect.poll(() => trail(page)).toEqual(["Home", parentName]);
+
+	const childName = uniqueName(run.run_id, "child");
+	const child = await createFolder(page, childName, parent.name);
+	await page.reload();
+	await openFolder(page, child.name);
+	await expect(page).toHaveURL(new RegExp(child.name));
+	await expect.poll(() => trail(page)).toEqual(["Home", parentName, childName]);
+
+	await page.locator("#navbar").getByRole("link", { name: parentName }).click();
+	await expect(page).toHaveURL(new RegExp(parent.name));
+	await expect.poll(() => trail(page)).toEqual(["Home", parentName]);
+});
+
+test("a deep link into a nested folder shows the full trail", async ({
+	owner,
+	run,
+}) => {
+	const page = owner.page;
+	await page.goto("/drive");
+	const parentName = uniqueName(run.run_id, "deep");
+	const parent = await createFolder(page, parentName);
+	await page.goto(`/drive/d/${parent.name}`);
+	const childName = uniqueName(run.run_id, "deepchild");
+	const child = await createFolder(page, childName, parent.name);
+
+	await page.goto(`/drive/d/${child.name}`);
+	await expect.poll(() => trail(page)).toEqual(["Home", parentName, childName]);
+
+	await page.reload();
+	await expect.poll(() => trail(page)).toEqual(["Home", parentName, childName]);
+});
+
+test("browser back restores the previous trail", async ({ owner, run }) => {
+	const page = owner.page;
+	await page.goto("/drive");
+	const parentName = uniqueName(run.run_id, "back");
+	const parent = await createFolder(page, parentName);
+	await page.goto(`/drive/d/${parent.name}`);
+	const childName = uniqueName(run.run_id, "backchild");
+	const child = await createFolder(page, childName, parent.name);
+	await page.reload();
+	await openFolder(page, child.name);
+	await expect.poll(() => trail(page)).toEqual(["Home", parentName, childName]);
+
+	await page.goBack();
+	await expect.poll(() => trail(page)).toEqual(["Home", parentName]);
+
+	await page.goBack();
+	await expect.poll(() => trail(page)).toEqual(["Home"]);
+});
+
+test("renaming the current folder updates its crumb", async ({ owner, run }) => {
+	const page = owner.page;
+	await page.goto("/drive");
+	const original = uniqueName(run.run_id, "renamecrumb");
+	const folder = await createFolder(page, original);
+
+	await page.goto(`/drive/d/${folder.name}`);
+	await expect.poll(() => trail(page)).toEqual(["Home", original]);
+
+	const renamed = `${original}-renamed`;
+	const crumb = page.getByTestId("breadcrumbs").getByText(original, { exact: true });
+	const input = page.locator("#navbar").getByRole("textbox");
+	await expect(async () => {
+		await crumb.click();
+		await expect(input).toBeVisible({ timeout: 2000 });
+	}).toPass({ timeout: 20000 });
+	await input.fill(renamed);
+	await Promise.all([
+		page.waitForResponse(
+			(response) =>
+				response.url().includes("suite.drive.api.files.rename") &&
+				response.ok(),
+		),
+		input.press("Enter"),
+	]);
+	await expect.poll(() => trail(page)).toEqual(["Home", renamed]);
+
+	await page.reload();
+	await expect.poll(() => trail(page)).toEqual(["Home", renamed]);
+});
+
+test("attachments pages show the doctype and document they belong to", async ({
+	owner,
+}) => {
+	const page = owner.page;
+	await page.goto("/drive/attachments");
+	await expect.poll(() => trail(page)).toEqual(["Attachments"]);
+
+	await page.goto("/drive/attachments/User");
+	await expect.poll(() => trail(page)).toEqual(["Attachments", "User"]);
+});
+
+test("moving the current folder updates its trail without a reload", async ({
+	owner,
+	run,
+}) => {
+	const page = owner.page;
+	await page.goto("/drive");
+	const destinationName = uniqueName(run.run_id, "dest");
+	const destination = await createFolder(page, destinationName);
+	const movedName = uniqueName(run.run_id, "moved");
+	const moved = await createFolder(page, movedName);
+
+	await page.goto(`/drive/d/${moved.name}`);
+	await expect.poll(() => trail(page)).toEqual(["Home", movedName]);
+
+	await page.getByRole("button", { name: "Entity actions" }).click();
+	await page.getByRole("menuitem", { name: "Move" }).click();
+	const dialog = page.getByRole("dialog");
+	await dialog.getByText(destinationName, { exact: true }).click();
+	await Promise.all([
+		page.waitForResponse(
+			(response) =>
+				response.url().includes("suite.drive.api.files.move") && response.ok(),
+		),
+		dialog.getByRole("button", { name: "Move", exact: true }).click(),
+	]);
+
+	await expect
+		.poll(() => trail(page))
+		.toEqual(["Home", destinationName, movedName]);
+	await expect(page).toHaveURL(new RegExp(moved.name));
+});
diff --git a/e2e/drive-backed-apps/specs/drive/drive.spec.ts b/e2e/drive-backed-apps/specs/drive/drive.spec.ts
index 881c3c32e9..b69b351f6d 100644
--- a/e2e/drive-backed-apps/specs/drive/drive.spec.ts
+++ b/e2e/drive-backed-apps/specs/drive/drive.spec.ts
@@ -50,9 +50,12 @@ test.describe.serial("Drive critical paths", () => {
 
 		await openEntityActions(page, uploaded.name);
 		await page.getByRole("button", { name: "Rename", exact: true }).click();
-		const renameDialog = page.getByRole("dialog", { name: "Rename" });
-		await renameDialog.getByRole("textbox").fill(renamedLabel);
-		await renameDialog.getByRole("button", { name: "Confirm" }).click();
+		// Renaming is inline in the row, not a dialog.
+		const renameInput = page
+			.getByTestId(`drive-entity-${uploaded.name}`)
+			.getByRole("textbox");
+		await renameInput.fill(renamedLabel);
+		await renameInput.press("Enter");
 		await expect(page.getByTestId(`drive-entity-${uploaded.name}`)).toContainText(renamedLabel);
 
 		await openEntityActions(page, uploaded.name);
diff --git a/e2e/drive-backed-apps/specs/drive/tree-expand.spec.ts b/e2e/drive-backed-apps/specs/drive/tree-expand.spec.ts
new file mode 100644
index 0000000000..602bd399ac
--- /dev/null
+++ b/e2e/drive-backed-apps/specs/drive/tree-expand.spec.ts
@@ -0,0 +1,109 @@
+import { readFileSync } from "node:fs";
+import { resolve } from "node:path";
+import { expect, test } from "../../fixtures/test";
+import { createFolder, driveEntities, waitForDriveEntity } from "../../helpers/drive";
+import type { Page } from "@playwright/test";
+
+const uploadFixture = resolve(__dirname, "fixtures/drive-upload.txt");
+
+// Playwright's mouse-driven dragTo doesn't start an HTML5 drag in Chromium, so
+// drive the same three events the row handlers listen for.
+async function dragRowOnto(page: Page, source: string, target: string) {
+	await page.evaluate(
+		({ source, target }) => {
+			const row = (name: string) =>
+				document.querySelector(`[data-testid="drive-entity-${name}"]`);
+			const from = row(source);
+			const to = row(target);
+			if (!from || !to) throw new Error(`missing row: ${!from ? source : target}`);
+			const dataTransfer = new DataTransfer();
+			from.dispatchEvent(new DragEvent("dragstart", { dataTransfer, bubbles: true }));
+			to.dispatchEvent(
+				new DragEvent("dragover", { dataTransfer, bubbles: true, cancelable: true }),
+			);
+			to.dispatchEvent(new DragEvent("drop", { dataTransfer, bubbles: true }));
+			from.dispatchEvent(new DragEvent("dragend", { dataTransfer, bubbles: true }));
+		},
+		{ source, target },
+	);
+}
+
+async function uploadInto(page: Page, folder: string, fileName: string) {
+	await page.goto(`/drive/d/${folder}`);
+	await Promise.all([
+		page.waitForResponse(
+			(response) => response.url().includes("upload_file") && response.ok(),
+		),
+		page.getByTestId("drive-file-input").setInputFiles({
+			name: fileName,
+			mimeType: "text/plain",
+			buffer: readFileSync(uploadFixture),
+		}),
+	]);
+	return waitForDriveEntity(page.request, fileName, folder);
+}
+
+test("expands a folder inline in the list view and moves a subfile into another folder", async ({
+	owner,
+	run,
+}) => {
+	const suffix = `${run.run_id}-${Date.now()}`;
+	const sourceName = `tree-source-${suffix}`;
+	const destinationName = `tree-dest-${suffix}`;
+	const fileName = `tree-child-${suffix}.txt`;
+
+	await owner.page.goto("/drive");
+	const source = await createFolder(owner.page, sourceName);
+	const destination = await createFolder(owner.page, destinationName);
+	const child = await uploadInto(owner.page, source.name, fileName);
+
+	await owner.page.goto("/drive");
+	const sourceRow = owner.page.getByTestId(`drive-entity-${source.name}`);
+	await expect(sourceRow).toBeVisible();
+	const childRow = owner.page.getByTestId(`drive-entity-${child.name}`);
+	await expect(childRow).toHaveCount(0);
+
+	await owner.page.getByTestId(`drive-expand-${source.name}`).click();
+	await expect(childRow).toBeVisible();
+	await expect(childRow).toContainText(fileName.replace(/\.txt$/, ""));
+	// Expanding must not navigate away from the folder listing.
+	await expect(owner.page).toHaveURL(/\/drive(\?.*)?$/);
+
+	await dragRowOnto(owner.page, child.name, destination.name);
+
+	await expect(childRow).toHaveCount(0);
+	await expect
+		.poll(async () =>
+			(await driveEntities(owner.page.request, destination.name)).map(
+				(entity) => entity.name,
+			),
+		)
+		.toContain(child.name);
+	expect(
+		(await driveEntities(owner.page.request, source.name)).map((entity) => entity.name),
+	).not.toContain(child.name);
+
+	// The destination shows the moved file once expanded.
+	await owner.page.reload();
+	await owner.page.getByTestId(`drive-expand-${destination.name}`).click();
+	await expect(childRow).toBeVisible();
+});
+
+test("collapsing a folder hides its children again", async ({ owner, run }) => {
+	const suffix = `${run.run_id}-${Date.now()}`;
+	const folderName = `tree-collapse-${suffix}`;
+	const fileName = `tree-collapse-child-${suffix}.txt`;
+
+	await owner.page.goto("/drive");
+	const folder = await createFolder(owner.page, folderName);
+	const child = await uploadInto(owner.page, folder.name, fileName);
+
+	await owner.page.goto("/drive");
+	const toggle = owner.page.getByTestId(`drive-expand-${folder.name}`);
+	const childRow = owner.page.getByTestId(`drive-entity-${child.name}`);
+
+	await toggle.click();
+	await expect(childRow).toBeVisible();
+	await toggle.click();
+	await expect(childRow).toHaveCount(0);
+});
diff --git a/e2e/drive-backed-apps/specs/writer/rename.spec.ts b/e2e/drive-backed-apps/specs/writer/rename.spec.ts
new file mode 100644
index 0000000000..905258f8b1
--- /dev/null
+++ b/e2e/drive-backed-apps/specs/writer/rename.spec.ts
@@ -0,0 +1,87 @@
+import { expect, test } from "../../fixtures/test";
+import {
+	createWriterDocument,
+	openWriterDocument,
+	uniqueWriterTitle,
+} from "../../helpers/writer";
+import type { Locator, Page } from "@playwright/test";
+
+// The editable last crumb is the only text-bearing button in the navbar — parent
+// crumbs render as links and the other navbar buttons are icon-only.
+function titleCrumb(page: Page): Locator {
+	return page
+		.locator("#navbar")
+		.getByRole("button")
+		.filter({ hasText: /\S/ })
+		.first();
+}
+
+// While renaming, the inline field is the only <input> in the navbar.
+function renameInput(page: Page): Locator {
+	return page.locator("#navbar input");
+}
+
+test("renames a document from the breadcrumb and persists", async ({ owner, run }) => {
+	const title = uniqueWriterTitle(run.run_id, "rename");
+	const file = await createWriterDocument(owner.page.request, title);
+	await openWriterDocument(owner.page, file.name);
+
+	const crumb = titleCrumb(owner.page);
+	await expect(crumb).toHaveText(title);
+
+	await crumb.click();
+
+	const input = renameInput(owner.page);
+	await expect(input).toBeVisible();
+	// Autofocuses with the current name pre-filled and selected.
+	await expect(input).toBeFocused();
+	await expect(input).toHaveValue(title);
+
+	const newTitle = `${title} renamed`;
+	await input.fill(newTitle);
+	await input.press("Enter");
+
+	await expect(input).toBeHidden();
+	await expect(titleCrumb(owner.page)).toHaveText(newTitle);
+
+	// Persisted server-side: survives a reload.
+	await owner.page.reload();
+	await expect(titleCrumb(owner.page)).toHaveText(newTitle);
+});
+
+test("keeps focus and selection when the breadcrumb rename opens", async ({ owner, run }) => {
+	const title = uniqueWriterTitle(run.run_id, "focus");
+	const file = await createWriterDocument(owner.page.request, title);
+	await openWriterDocument(owner.page, file.name);
+
+	await titleCrumb(owner.page).click();
+	const input = renameInput(owner.page);
+
+	// Regression: the field must stay focused (not blur-commit and exit) so the
+	// selection stays visible for an immediate retype.
+	await expect(input).toBeFocused();
+	await expect(input).toBeVisible();
+	await owner.page.waitForTimeout(400);
+	await expect(input).toBeFocused();
+
+	const selectionLength = await input.evaluate(
+		(el: HTMLInputElement) => (el.selectionEnd ?? 0) - (el.selectionStart ?? 0),
+	);
+	expect(selectionLength).toBe(title.length);
+});
+
+test("Escape cancels the rename without changing the name", async ({ owner, run }) => {
+	const title = uniqueWriterTitle(run.run_id, "cancel");
+	const file = await createWriterDocument(owner.page.request, title);
+	await openWriterDocument(owner.page, file.name);
+
+	await titleCrumb(owner.page).click();
+	const input = renameInput(owner.page);
+	await expect(input).toBeVisible();
+
+	await input.fill("Discarded name");
+	await input.press("Escape");
+
+	await expect(input).toBeHidden();
+	await expect(titleCrumb(owner.page)).toHaveText(title);
+});
diff --git a/e2e/drive-backed-apps/specs/writer/tabs.spec.ts b/e2e/drive-backed-apps/specs/writer/tabs.spec.ts
index 4aee749ba7..71c914e67f 100644
--- a/e2e/drive-backed-apps/specs/writer/tabs.spec.ts
+++ b/e2e/drive-backed-apps/specs/writer/tabs.spec.ts
@@ -3,7 +3,29 @@ import {
 	createWriterDocument,
 	openWriterDocument,
 	uniqueWriterTitle,
+	writerEditor,
 } from "../../helpers/writer";
+import type { Page } from "@playwright/test";
+
+// Tab buttons in the desktop ToC are the only draggable elements on the page.
+function tocTabs(page: Page) {
+	return page.locator('[draggable="true"]');
+}
+
+function tabPanel(page: Page, label: string) {
+	return page.locator(`[data-tab-label="${label}"]`);
+}
+
+// Typing a first line and pressing Enter renames an "Untitled" tab to that line.
+async function addTab(page: Page, text: string, first = false) {
+	await page
+		.getByRole("button", { name: first ? "Create tab" : "Add tab" })
+		.click();
+	await writerEditor(page).click();
+	await page.keyboard.type(text);
+	await page.keyboard.press("Enter");
+	await expect(tocTabs(page).filter({ hasText: text })).toHaveCount(1);
+}
 
 // Regression for the mobile tab bar (ToCMobile):
 //   1. a tab added while the bar is already mounted must appear in it, and
@@ -50,3 +72,58 @@ test("mobile tab bar reflects added tabs and switches the active panel", async (
 	await expect(page.locator(`[data-tab-id="${ids[0]}"]`)).toBeVisible();
 	await expect(page.locator(`[data-tab-id="${ids[1]}"]`)).toBeHidden();
 });
+
+// Reordering used to delete the tab node and re-insert a copy, which Yjs cannot
+// merge as a move: the tab could end up duplicated, with its content split
+// across both copies. Order now lives in an attribute and nodes never move.
+test("reordering tabs preserves every tab's content", async ({ owner, run }) => {
+	const { page } = owner;
+	const duplicateWarnings: string[] = [];
+	page.on("console", (message) => {
+		if (message.text().includes("duplicate tab ids")) {
+			duplicateWarnings.push(message.text());
+		}
+	});
+
+	const file = await createWriterDocument(
+		page.request,
+		uniqueWriterTitle(run.run_id, "tabs-reorder"),
+	);
+	await page.addInitScript(() => window.localStorage.setItem("showToc", "true"));
+	await openWriterDocument(page, file.name);
+
+	await addTab(page, "alpha", true);
+	await addTab(page, "bravo");
+	await addTab(page, "charlie");
+	await expect(tocTabs(page)).toHaveText(["alpha", "bravo", "charlie"]);
+
+	// Drop above the midpoint of the first tab so charlie lands at the top.
+	await tocTabs(page)
+		.nth(2)
+		.dragTo(tocTabs(page).nth(0), { targetPosition: { x: 10, y: 2 } });
+
+	await expect(tocTabs(page)).toHaveText(["charlie", "alpha", "bravo"]);
+
+	const panels = page.locator("[data-tab-id]");
+	await expect(panels).toHaveCount(3);
+	const ids = await panels.evaluateAll((els) =>
+		els.map((el) => el.getAttribute("data-tab-id")),
+	);
+	expect(new Set(ids).size).toBe(3);
+
+	for (const label of ["alpha", "bravo", "charlie"]) {
+		await expect(tabPanel(page, label)).toContainText(label);
+		await expect(tabPanel(page, label)).toHaveCount(1);
+	}
+
+	// The new order and the content survive a reload of the stored document.
+	await page.reload();
+	await expect(writerEditor(page)).toBeVisible();
+	await expect(tocTabs(page)).toHaveText(["charlie", "alpha", "bravo"]);
+	for (const label of ["alpha", "bravo", "charlie"]) {
+		await expect(tabPanel(page, label)).toContainText(label);
+	}
+	await expect(page.locator("[data-tab-id]")).toHaveCount(3);
+
+	expect(duplicateWarnings).toEqual([]);
+});
diff --git a/frontend/src/apps/drive/components/ConfirmDialog.vue b/frontend/src/apps/drive/components/ConfirmDialog.vue
deleted file mode 100644
index 2ee2489218..0000000000
--- a/frontend/src/apps/drive/components/ConfirmDialog.vue
+++ /dev/null
@@ -1,157 +0,0 @@
-<template>
-  <Dialog v-model:open="open" v-bind="dialogOptions" @close="dialogType = ''">
-    <div class="flex items-center justify-start">
-        <div class="text-base text-ink-gray-6">
-          <template v-if="props.entities.length">
-            {{ props.entities.length > 1 ? 'These items ' : `"${props.entities[0].file_name}" ` }}
-          </template>
-          <span v-html="dialogData.message" />
-        </div>
-      </div>
-      <ErrorMessage class="my-1 text-center" :message="updateResource.error" />
-  </Dialog>
-</template>
-<script setup>
-import { ref, computed } from 'vue'
-import { createResource, Dialog, ErrorMessage, toast } from 'frappe-ui'
-import { useTimeAgo } from '@vueuse/core'
-
-import { mutate, getTrash, toggleFav, clearRecent, clearTrash } from '@/apps/drive/resources/files.js'
-import { sortEntities } from '@/apps/drive/utils/files.js'
-
-import LucideRotateCcw from '~icons/lucide/rotate-ccw'
-import {} from '@/apps/drive/resources/files'
-
-const props = defineProps({
-  entities: {
-    type: Array,
-    required: true,
-  },
-})
-const emit = defineEmits(['success'])
-const dialogType = defineModel()
-const open = ref(true)
-
-const dialogData = computed(() => {
-  const itemString = props.entities.length === 1 ? 'an item' : `${props.entities.length} items`
-  const MAP = {
-    restore: {
-      title: `Restore ${itemString}`,
-      message: `will be restored to ${
-        props.entities.length === 1 ? 'its original location' : 'their original locations'
-      }.`,
-      url: 'suite.drive.api.files.remove_or_restore',
-      onSuccess: () => {
-        getTrash.setData((d) =>
-          d.filter((k) => !props.entities.map((l) => l.name).includes(k.name))
-        )
-      },
-      button: {
-        variant: 'solid',
-        label: 'Restore',
-        iconLeft: LucideRotateCcw,
-      },
-      toastMessage: `Restored ${itemString}.`,
-    },
-    remove: {
-      title: `Move ${itemString} to Trash`,
-      message:
-        'will be moved to Trash.<br/><br/> Items in trash are deleted forever after 30 days.',
-      url: 'suite.drive.api.files.remove_or_restore',
-      button: {
-        label: 'Move to Trash',
-        theme: 'red',
-        variant: 'subtle',
-      },
-      onSuccess: () => {
-        getTrash.setData(
-          sortEntities([
-            ...getTrash.data,
-            ...props.entities.map((k) => {
-              k.modified = Date()
-              k.relativeModified = useTimeAgo(k.modified)
-              return k
-            }),
-          ])
-        )
-      },
-      toastMessage: `Moved ${itemString} to Trash.`,
-    },
-    d: {
-      title: `Delete ${itemString}`,
-      url: 'suite.drive.api.files.delete_entities',
-      message:
-        ' will be deleted - you can no longer access it.<br/><br/> <span class=font-semibold>This is an irreversible action.<span>',
-      button: {
-        label: 'Delete — forever.',
-        theme: 'red',
-        iconLeft: LucideTrash,
-        variant: 'solid',
-      },
-      toastMessage: `Deleted ${itemString}.`,
-    },
-    'cta-recents': {
-      title: 'Are you sure?',
-      message: 'All your recently viewed files will be cleared.',
-      button: { label: 'Clear' },
-      resource: clearRecent,
-    },
-    'cta-favourites': {
-      title: 'Are you sure?',
-      message: 'All your favourite items will be cleared.',
-      button: { label: 'Clear' },
-      resource: toggleFav,
-    },
-    'cta-trash': {
-      title: 'Clear your Trash',
-      message:
-        'All items in your Trash will be deleted forever. <br/><br/> <span class=font-semibold>This is an irreversible process.</span>',
-      button: { label: 'Delete', variant: 'solid', iconLeft: LucideTrash },
-      resource: clearTrash,
-    },
-  }
-  return MAP[dialogType.value]
-})
-
-const loading = computed(() => (dialogData.value.resource || updateResource).loading)
-const dialogOptions = computed(() => {
-  return {
-    title: dialogData.value.file_name,
-    size: 'sm',
-    actions: [
-      {
-        onClick: async () => {
-          if (dialogData.value.resource) {
-            open.value = false
-            await dialogData.value.resource.submit()
-            emit('success')
-          } else updateResource.submit()
-        },
-        ...dialogData.value.button,
-        disabled: loading.value,
-        // loading: loading.value,
-      },
-    ],
-  }
-})
-
-const updateResource = createResource({
-  url: dialogData.value.url,
-  makeParams: () => {
-    open.value = ''
-    return {
-      entity_names:
-        typeof props.entities === 'string'
-          ? JSON.stringify([props.entities])
-          : JSON.stringify(props.entities.map((entity) => entity.name)),
-    }
-  },
-  onSuccess(data) {
-    emit('success', data)
-    updateResource.reset()
-    if (dialogData.value.mutate) mutate(props.entities, props.dialogData.mutate)
-    if (dialogData.value.onSuccess) dialogData.value.onSuccess(props.entities, data)
-    toast.success(dialogData.value.toastMessage)
-  },
-})
-</script>
diff --git a/frontend/src/apps/drive/components/CustomListRow.vue b/frontend/src/apps/drive/components/CustomListRow.vue
deleted file mode 100644
index 4b874c54ed..0000000000
--- a/frontend/src/apps/drive/components/CustomListRow.vue
+++ /dev/null
@@ -1,76 +0,0 @@
-<template>
-  <template v-for="row in rows" :key="row.name">
-    <ListRow
-      :row="row"
-      :data-testid="`drive-entity-${row.name}`"
-      class="group"
-      :class="[
-        row.name === selectedName || selections.has(row.name)
-          ? 'bg-surface-gray-2 hover:!bg-surface-gray-3'
-          : 'bg-surface-base',
-        draggedItem === row.name ? 'opacity-60 hover:shadow-none' : '',
-        dragOverItem === row.name ? '!bg-surface-gray-3' : '',
-      ]"
-      :draggable="true"
-      @contextmenu="(e) => !selections.size && contextMenu(e, row)"
-      @click="!isModKey($event) && !selections.size && open(row)"
-      @dragstart="
-        (e) => {
-          draggedItem = row.name
-          e.dataTransfer?.setData('application/x-filename', draggedItem)
-        }
-      "
-      @dragend="draggedItem = null"
-      @dragover="
-        (e) => {
-          if (row.is_folder) {
-            e.preventDefault()
-            dragOverItem = row.name
-          }
-        }
-      "
-      @dragleave="dragOverItem = null"
-      @drop="
-        $emit(
-          'dropped',
-          row,
-          $event.dataTransfer.getData('application/x-filename')
-        )
-      "
-    >
-      <template #default="{ idx, column, item }">
-        <CustomListRowItem
-          :column="column"
-          :row="row"
-          :item="item"
-          :idx="idx"
-          :context-menu="!selections.size && contextMenu"
-        />
-      </template>
-    </ListRow>
-  </template>
-</template>
-<script setup>
-import { ListRow } from 'frappe-ui'
-import CustomListRowItem from './CustomListRowItem.vue'
-import { openEntity, isModKey } from '@/apps/drive/utils/files'
-import { useRoute } from 'vue-router'
-import { activeEntity } from '@/apps/drive/data/selection'
-import { computed, ref } from 'vue'
-
-defineProps({
-  rows: Array,
-  contextMenu: Function,
-  selections: Set,
-})
-defineEmits(['dropped'])
-
-const draggedItem = ref()
-const dragOverItem = ref()
-
-const route = useRoute()
-
-// Used as right-click doesn't trigger active in frappe-ui
-const selectedName = computed(() => activeEntity.value?.name)
-const open = (row) => route.name !== 'Trash' && openEntity(row)
-</script>
diff --git a/frontend/src/apps/drive/components/DriveListRow.vue b/frontend/src/apps/drive/components/DriveListRow.vue
new file mode 100644
index 0000000000..9c2b2160a4
--- /dev/null
+++ b/frontend/src/apps/drive/components/DriveListRow.vue
@@ -0,0 +1,314 @@
+<template>
+  <template v-for="item in items" :key="item.key">
+    <ListRow v-if="item.placeholder === 'loading'" class="pointer-events-none">
+      <ListCell />
+      <ListCell>
+        <div class="flex items-center" :style="indent(item.depth)">
+          <Skeleton class="h-[16px] w-[16px] shrink-0 mr-2 rounded-sm" />
+          <Skeleton class="h-3.5 w-40 rounded" />
+        </div>
+      </ListCell>
+      <ListCell>
+        <Skeleton class="size-5 shrink-0 mr-2 rounded-full" />
+        <Skeleton class="h-3 w-16 rounded" />
+      </ListCell>
+      <ListCell><Skeleton class="h-3 w-20 rounded" /></ListCell>
+      <ListCell><Skeleton class="h-3 w-12 rounded" /></ListCell>
+      <ListCell />
+    </ListRow>
+    <ListRow v-else-if="item.placeholder" class="pointer-events-none">
+      <ListCell />
+      <ListCell>
+        <span class="text-base text-ink-gray-5" :style="indent(item.depth, 24)">
+          {{ __('Empty folder') }}
+        </span>
+      </ListCell>
+      <ListCell />
+      <ListCell />
+      <ListCell />
+      <ListCell />
+    </ListRow>
+    <template v-else>
+      <ListRow
+        v-for="row in [item.row]"
+        :key="item.key"
+        class="group"
+        :class="[
+          row.name === selectedName || selections.has(row.name)
+            ? 'bg-surface-gray-2 hover:!bg-surface-gray-3'
+            : 'bg-surface-base',
+          draggingNames.has(row.name) ? 'opacity-60 hover:shadow-none' : '',
+          dragOverItem === row.name ? '!bg-surface-gray-3' : '',
+        ]"
+        :draggable="renamingEntity !== row.name"
+        :to="routeFor(row)"
+        :data-testid="`drive-entity-${row.name}`"
+        :data-selected="selections.has(row.name) || undefined"
+        @contextmenu="(e) => !selections.size && contextMenu(e, row)"
+        @click="!isModKey($event) && !selections.size && open(row)"
+        @dragstart="onDragStart($event, row)"
+        @dragend="draggedItem = null"
+        @dragover="
+          (e) => {
+            if (row.is_folder) {
+              e.preventDefault()
+              dragOverItem = row.name
+            }
+          }
+        "
+        @dragleave="dragOverItem = null"
+        @drop="
+          $emit(
+            'dropped',
+            row,
+            $event.dataTransfer.getData('application/x-filename')
+          )
+        "
+      >
+        <ListCell>
+          <Checkbox
+            class="shrink-0"
+            :class="selections.size > 0 || selections.has(row.name) ? '' : 'invisible group-hover:visible'"
+            :model-value="selections.has(row.name)"
+            @click.stop="props.toggleSelection(row, $event)"
+          />
+        </ListCell>
+        <ListCell>
+          <div
+            class="relative h-[16px] w-[16px] shrink-0 mr-2"
+            :class="canExpand(row) ? 'cursor-pointer' : ''"
+            :data-testid="canExpand(row) ? `drive-expand-${row.name}` : undefined"
+            :style="indent(item.depth)"
+            @click.stop.prevent="canExpand(row) && toggleFolder(row)"
+          >
+            <div
+              class="absolute inset-0"
+              :class="
+                canExpand(row)
+                  ? isExpanded(row)
+                    ? 'opacity-0'
+                    : 'group-hover:opacity-0'
+                  : ''
+              "
+            >
+              <img
+                v-if="!loadedThumbnails.has(row.name)"
+                loading="lazy"
+                class="absolute inset-0 h-[16px] w-[16px] rounded-sm"
+                :src="thumbnail(row).fallback"
+                :draggable="false"
+              />
+              <img
+                loading="lazy"
+                decoding="async"
+                class="absolute inset-0 h-[16px] w-[16px] object-cover rounded-sm"
+                :class="loadedThumbnails.has(row.name) ? 'opacity-100' : 'opacity-0'"
+                :src="thumbnail(row).src"
+                :draggable="false"
+                @load="loadedThumbnails.add(row.name)"
+              />
+            </div>
+            <LucideChevronRight
+              v-if="canExpand(row)"
+              class="absolute inset-0 size-4 text-ink-gray-7 transition-transform duration-150"
+              :class="isExpanded(row) ? '' : 'opacity-0 group-hover:opacity-100'"
+              :style="{ transform: `rotate(${isExpanded(row) ? 90 : 0}deg)` }"
+            />
+          </div>
+          <InlineRenameInput :entity="row">
+            <Tooltip :text="nameTooltip(row)" :disabled="!nameTooltip(row)">
+              <div class="truncate text-base">{{ displayName(row) }}</div>
+            </Tooltip>
+          </InlineRenameInput>
+          <div class="flex flex-row grow justify-end gap-2 w-[20px]">
+            <LucideStar
+              v-if="row.is_favourite && $route.name !== 'Favourites'"
+              width="16"
+              height="16"
+              class="my-auto text-ink-amber-6 stroke-current fill-current"
+            />
+            <Tooltip v-if="shareIcon(row)" :text="shareIcon(row).tooltip">
+              <component :is="shareIcon(row).icon" class="size-4" />
+            </Tooltip>
+          </div>
+        </ListCell>
+        <ListCell>
+          <Avatar
+            v-if="row.owner"
+            shape="circle"
+            :image="row.owner_image"
+            :label="row.owner_full_name || row.owner"
+            size="sm"
+            class="mr-2 shrink-0"
+          />
+          <span class="truncate text-base">{{ ownerLabel(row) }}</span>
+        </ListCell>
+        <ListCell>
+          <Tooltip :text="formatDate(row.modified)">
+            <span class="truncate text-base">{{ row.relativeModified }}</span>
+          </Tooltip>
+        </ListCell>
+        <ListCell>
+          <span class="truncate text-base">{{ sizeLabel(row) }}</span>
+        </ListCell>
+        <ListCell class="justify-end">
+          <Button
+            v-if="!selections.size"
+            class="!bg-inherit"
+            @click="(e) => contextMenu(e, row)"
+          >
+            <LucideMoreHorizontal class="size-4" />
+          </Button>
+        </ListCell>
+        </ListRow>
+    </template>
+  </template>
+</template>
+<script setup>
+import { ListRow, ListCell } from 'frappe-ui/list'
+import { Avatar, Button, Checkbox, Skeleton, Tooltip } from 'frappe-ui'
+import { computed, ref } from 'vue'
+import { useRoute } from 'vue-router'
+import { useSessionStore } from '@/boot/session'
+import { activeEntity, renamingEntity } from '@/apps/drive/data/selection'
+import InlineRenameInput from './InlineRenameInput.vue'
+import { openEntity, isModKey, getThumbnailUrl, WRITER_CONTENT_DOCTYPE, PRESENTATION_CONTENT_DOCTYPE } from '@/apps/drive/utils/files'
+import { formatDate } from '@/apps/drive/utils/format'
+import { expandedFolders } from '@/apps/drive/data/folderTree'
+import LucideStar from '~icons/lucide/star'
+import LucideChevronRight from '~icons/lucide/chevron-right'
+import LucideMoreHorizontal from '~icons/lucide/more-horizontal'
+import LucideGlobe2 from '~icons/lucide/globe-2'
+import LucideBuilding2 from '~icons/lucide/building-2'
+import LucideUsers from '~icons/lucide/users'
+
+const props = defineProps({
+  items: Array,
+  contextMenu: Function,
+  selections: Set,
+  toggleSelection: Function,
+  toggleFolder: Function,
+  rootEntity: Object,
+})
+defineEmits(['dropped'])
+
+const route = useRoute()
+
+const draggedItem = ref()
+const dragOverItem = ref()
+
+// The set of rows visually "picked up" during a drag: the whole selection when
+// the grabbed row is part of it, otherwise just that row.
+const draggingNames = computed(() => {
+  if (!draggedItem.value) return new Set()
+  return props.selections.has(draggedItem.value)
+    ? props.selections
+    : new Set([draggedItem.value])
+})
+
+const onDragStart = (e, row) => {
+  draggedItem.value = row.name
+  e.dataTransfer?.setData('application/x-filename', row.name)
+  e.dataTransfer?.setData(
+    'application/x-filenames',
+    JSON.stringify([...draggingNames.value])
+  )
+  const count = draggingNames.value.size
+  if (count <= 1) return
+  // Native drag image is just the grabbed row; swap in a badge so a multi-file
+  // drag reads as multiple items.
+  const ghost = document.createElement('div')
+  ghost.textContent = `${count} items`
+  ghost.className =
+    'fixed -top-full left-0 rounded-md bg-surface-gray-7 px-2.5 py-1.5 text-sm font-medium text-ink-white shadow-lg'
+  document.body.appendChild(ghost)
+  e.dataTransfer.setDragImage(ghost, -8, -8)
+  requestAnimationFrame(() => ghost.remove())
+}
+
+// Used as right-click doesn't trigger active in frappe-ui
+const selectedName = computed(() => activeEntity.value?.name)
+// Folders get a real `:to` route below — RouterLink handles the navigation
+// (and gives cmd/ctrl-click-to-open-in-new-tab, right-click-copy-link for
+// free) — so this only drives non-folder clicks. Suppressed during an active
+// selection so clicking elsewhere in the row doesn't navigate away (matches
+// the existing !selections.size click guard).
+const open = (row) => !row.is_folder && route.name !== 'Trash' && openEntity(row)
+const routeFor = (row) =>
+  row.is_folder && !props.selections.size
+    ? { name: 'drive-Folder', params: { entityName: row.name } }
+    : undefined
+
+const canExpand = (row) =>
+  row.is_folder &&
+  !row.external &&
+  row.child_count !== 0 &&
+  route.name !== 'drive-Trash'
+const isExpanded = (row) => expandedFolders.value.has(row.name)
+// 24px = icon width + its gutter, so text lines up with sibling file names
+const indent = (depth, offset = 0) =>
+  depth || offset ? { marginLeft: depth * 20 + offset + 'px' } : null
+
+const loadedThumbnails = ref(new Set())
+function thumbnail(row) {
+  return getThumbnailUrl(row)
+}
+
+function displayName(row) {
+  if (!row.file_name) return row.title || ''
+  return row.file_name.lastIndexOf('.') === -1 ||
+    row.is_folder ||
+    row.content_doctype === WRITER_CONTENT_DOCTYPE ||
+    row.content_doctype === PRESENTATION_CONTENT_DOCTYPE
+    ? row.file_name
+    : row.file_name.slice(0, row.file_name.lastIndexOf('.'))
+}
+function nameTooltip(row) {
+  return !row.file_name ||
+    row.is_folder ||
+    row.content_doctype === WRITER_CONTENT_DOCTYPE ||
+    row.content_doctype === PRESENTATION_CONTENT_DOCTYPE
+    ? ''
+    : row.file_name
+}
+
+function shareIcon(row) {
+  if (row.share_count === props.rootEntity?.share_count) return null
+  if (row.share_count === -2) return { icon: LucideGlobe2, tooltip: __('Public') }
+  if (row.share_count === -1) return { icon: LucideBuilding2, tooltip: __('Organization') }
+  if (row.share_count > 0)
+    return { icon: LucideUsers, tooltip: __('Shared with {0} users', [row.share_count]) }
+  return null
+}
+
+function ownerLabel(row) {
+  return row.owner === useSessionStore().user
+    ? __('You')
+    : row.owner_full_name || row.owner || '-'
+}
+
+function sizeLabel(row) {
+  if (row.is_folder)
+    return row.child_count
+      ? row.child_count + ' item' + (row.child_count === 1 ? '' : 's')
+      : 'empty'
+  if (row.slide_count != null)
+    return row.slide_count
+      ? row.slide_count + ' slide' + (row.slide_count === 1 ? '' : 's')
+      : 'empty'
+  return row.file_size_pretty || '-'
+}
+</script>
+<style>
+[data-slot='list-row'][data-selected] + [data-slot='list-row'][data-selected] {
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+[data-slot='list-row'][data-selected]:has(+ [data-slot='list-row'][data-selected]) {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+}
+[data-slot='list-row'][data-selected] + [data-slot='list-row'][data-selected] [data-slot='list-divider'] {
+  opacity: 0;
+}
+</style>
diff --git a/frontend/src/apps/drive/components/DriveListSkeleton.vue b/frontend/src/apps/drive/components/DriveListSkeleton.vue
index 75dc8ecde9..9485220f2b 100644
--- a/frontend/src/apps/drive/components/DriveListSkeleton.vue
+++ b/frontend/src/apps/drive/components/DriveListSkeleton.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="p-5 space-y-0.5">
+  <div class="py-5 space-y-0.5">
     <div v-for="i in 10" :key="i" class="flex items-center gap-3 px-3 py-2">
       <Skeleton class="size-5 shrink-0 rounded" />
       <Skeleton class="h-3.5 rounded" :style="{ width: nameWidths[i % nameWidths.length] }" />
diff --git a/frontend/src/apps/drive/components/DriveToolBar.vue b/frontend/src/apps/drive/components/DriveToolBar.vue
index 17d53ba498..0b8aeefb8a 100644
--- a/frontend/src/apps/drive/components/DriveToolBar.vue
+++ b/frontend/src/apps/drive/components/DriveToolBar.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex p-5 pb-0 h-12">
+  <div class="flex px-5 pt-3 h-12">
     <div v-if="selections?.length" class="my-auto w-[40%] text-base text-ink-gray-8">
       {{ selections.length }}
       {{ selections.length === 1 ? __('item') : __('items') }}
@@ -24,6 +24,16 @@
         <LucideSearch class="size-4" />
       </template>
     </TextInput>
+    <Dropdown v-if="!selections?.length" class="ml-2 my-auto" :options="availableFilterTypes.map(({ name, icon }) => ({
+      label: __(name),
+      icon: h('img', { src: icon }),
+      onClick: () => activeFilters.push({ name, icon }),
+      disabled: activeFilters.includes({ name, icon }),
+    }))
+      " :button="{
+        icon: LucideFilter,
+        tooltip: 'Filter',
+      }" :disabled placement="right" />
 
     <div class="flex gap-2 ml-auto my-auto">
       <template v-if="!selections?.length">
@@ -41,17 +51,8 @@
         <TeamSelector :disabled="disabled && team === 'all'" v-if="
           ['Shared', 'Recents', 'Favourites', 'Trash'].includes($route.name)
         " v-model="team" :none="true" />
-        <Dropdown :options="availableFilterTypes.map(({ name, icon }) => ({
-          label: __(name),
-          icon: h('img', { src: icon }),
-          onClick: () => activeFilters.push({ name, icon }),
-          disabled: activeFilters.includes({ name, icon }),
-        }))
-          " :button="{
-            icon: LucideFilter,
-            tooltip: 'Filter',
-          }" :disabled placement="right" />
-        <SortControl v-if="$route.name !== 'Recents'" v-model="sortOrder" :options="columnHeaders" :menu-items="sortMenuItems" :disabled />
+        <SortControl v-if="$route.name !== 'Recents' && view !== 'list'" v-model="sortOrder" :options="columnHeaders"
+          :menu-items="sortMenuItems" :disabled />
 
         <TabButtons v-model="view" :options="[
           {
diff --git a/frontend/src/apps/drive/components/EditableBreadcrumbs.vue b/frontend/src/apps/drive/components/EditableBreadcrumbs.vue
new file mode 100644
index 0000000000..2890d39a9c
--- /dev/null
+++ b/frontend/src/apps/drive/components/EditableBreadcrumbs.vue
@@ -0,0 +1,52 @@
+<template>
+  <div class="flex min-w-0 items-center" data-testid="breadcrumbs">
+    <div v-if="loading" class="flex items-center gap-1.5" data-testid="breadcrumbs-loading">
+      <Skeleton class="h-4 w-16 rounded-sm" />
+      <span class="text-lg-medium text-ink-gray-4" aria-hidden="true">/</span>
+      <Skeleton class="h-4 w-32 rounded-sm" />
+    </div>
+    <template v-else-if="isEditing">
+      <template v-if="parentItems.length">
+        <Breadcrumbs :items="parentItems" />
+        <span class="mx-0.5 text-base text-ink-gray-4" aria-hidden="true">/</span>
+      </template>
+      <InlineRenameInput :entity="entity" class="text-lg-medium" />
+    </template>
+    <Breadcrumbs v-else :items="displayItems" />
+  </div>
+</template>
+<script setup>
+import { Breadcrumbs, Skeleton } from 'frappe-ui'
+import { computed } from 'vue'
+import { renamingEntity } from '@/apps/drive/data/selection'
+import InlineRenameInput from './InlineRenameInput.vue'
+
+const props = defineProps({
+  items: { type: Array, default: () => [] },
+  // The entity the last crumb represents; makes that crumb inline-renameable.
+  entity: { type: Object, default: null },
+})
+
+const loading = computed(
+  () => !props.items.length || props.items.some((item) => item.loading),
+)
+
+const isEditing = computed(
+  () => props.entity && renamingEntity.value === props.entity.name,
+)
+
+const parentItems = computed(() => props.items.slice(0, -1))
+
+// Keep the last crumb's label in sync with the (optimistically updated) entity
+// name so a rename shows immediately without waiting for a refetch.
+const displayItems = computed(() => {
+  if (!props.entity || !props.items.length) return props.items
+  const items = props.items.slice()
+  const last = items[items.length - 1]
+  items[items.length - 1] = {
+    ...last,
+    label: props.entity.file_name ?? last.label,
+  }
+  return items
+})
+</script>
diff --git a/frontend/src/apps/drive/components/EntityDialogs.vue b/frontend/src/apps/drive/components/EntityDialogs.vue
index 8305463255..4e0090ba60 100644
--- a/frontend/src/apps/drive/components/EntityDialogs.vue
+++ b/frontend/src/apps/drive/components/EntityDialogs.vue
@@ -1,17 +1,6 @@
 <template>
-  <RenameDialog
-    v-if="dialog === 'rn'"
-    v-model="dialog"
-    :entity="entities[0]"
-    @success="
-      ({ file_name }) => {
-        if (resource?.data) resource.data.file_name = file_name
-        resetDialog()
-      }
-    "
-  />
   <ShareDialog
-    v-else-if="dialog === 's'"
+    v-if="dialog === 's'"
     v-model="dialog"
     :file="entities[0]"
     @success="() => resource?.fetch?.(resource.params)"
@@ -20,29 +9,19 @@
     v-else-if="dialog === 'm'"
     v-model="dialog"
     :entities="entities"
-    @success="onMoveSuccess"
-    @complete="entityOpen && resource?.fetch?.(resource.params)"
+    @complete="onMoveComplete"
   />
   <InfoDialog
     v-else-if="dialog === 'i'"
     v-model="dialog"
     :entity="entities[0]"
   />
-  <ConfirmDialog
-    v-if="dialog === 'remove'"
-    v-model="dialog"
-    :entities="entities"
-    @success="onDeleteSuccess"
-  />
 </template>
 
 <script setup>
 import { computed } from 'vue'
-import { setPageBreadcrumbs } from '@/apps/drive/data/breadcrumbs'
-import { openEntity } from '@/apps/drive/utils/files'
 
-import ConfirmDialog from '@/apps/drive/components/ConfirmDialog.vue'
-import { ShareDialog, MoveDialog, RenameDialog, InfoDialog } from '@/apps/drive/ui/drive'
+import { ShareDialog, MoveDialog, InfoDialog } from '@/apps/drive/ui/drive'
 
 const props = defineProps({
   resource: Object,
@@ -62,25 +41,8 @@ const entityOpen = computed(
 
 const resetDialog = () => (dialog.value = '')
 
-function onMoveSuccess() {
-  if (entityOpen.value) {
-    setPageBreadcrumbs({ loading: true, name: props.resource.data.name })
-  }
-  resetDialog()
-}
-
-function onDeleteSuccess() {
-  if (!entityOpen.value) {
-    resetDialog()
-    return
-  }
-  const data = props.resource?.data
+function onMoveComplete() {
+  if (entityOpen.value) props.resource?.fetch?.(props.resource.params)
   resetDialog()
-  if (!data) return
-  openEntity({
-    is_folder: 1,
-    name: data.folder,
-    breadcrumbs: data.breadcrumbs?.slice(0, -1) ?? [],
-  })
 }
 </script>
diff --git a/frontend/src/apps/drive/components/ErrorPage.vue b/frontend/src/apps/drive/components/ErrorPage.vue
index f96118e60f..3966d483ba 100644
--- a/frontend/src/apps/drive/components/ErrorPage.vue
+++ b/frontend/src/apps/drive/components/ErrorPage.vue
@@ -33,7 +33,6 @@
 <script setup>
 import { Button } from 'frappe-ui'
 import { useSessionStore } from '@/boot/session'
-import { setPageBreadcrumbs } from '@/apps/drive/data/breadcrumbs'
 import router from '@/apps/drive/router'
 import { computed, watchEffect } from 'vue'
 import LucideFileUser from '~icons/lucide/file-user'
@@ -48,12 +47,8 @@ const goToLogin = () => {
 }
 
 watchEffect(() => {
-  if (
-    props.error.exc_type === 'PermissionError' &&
-    !isLoggedIn.value
-  ) {
+  if (props.error.exc_type === 'PermissionError' && !isLoggedIn.value) {
     goToLogin()
   }
-  setPageBreadcrumbs([])
 })
 </script>
diff --git a/frontend/src/apps/drive/components/GenericPage.vue b/frontend/src/apps/drive/components/GenericPage.vue
index 12b307c08d..ad65134058 100644
--- a/frontend/src/apps/drive/components/GenericPage.vue
+++ b/frontend/src/apps/drive/components/GenericPage.vue
@@ -4,15 +4,16 @@
 
   <ErrorPage v-if="verify?.error || getEntities.error" :error="verify?.error || getEntities.error" />
 
-  <div v-else id="drop-area" ref="container" class="flex flex-col overflow-auto min-h-full bg-surface-base">
+  <div v-else id="drop-area" ref="container" class="flex flex-col flex-1 min-h-0 overflow-hidden bg-surface-base"
+    @dragover="onDragOverScroll" @drop="stopAutoScroll" @dragend="stopAutoScroll">
     <DriveToolBar v-model:sort-order="sortOrder" v-model:search="search" v-model:filters="filters" v-model:team="team"
       :action-items="actionItems" :selections="selectedEntitities" :get-entities="getEntities || { data: [] }" />
 
     <DriveListSkeleton v-if="!props.getEntities.data" />
     <NoFilesSection v-else-if="!props.getEntities.data?.length" v-bind="empty" />
-    <ListView v-else-if="view === 'list'" v-model="selections" :folder-contents="rows && grouper(rows)"
-      :action-items="actionItems" :root-entity="verify?.data" @dropped="onDrop" />
-    <GridView v-else v-model="selections" :folder-contents="rows" :action-items="actionItems" @dropped="onDrop" />
+    <ListView v-else-if="view === 'list'" ref="viewEl" v-model="selections" v-model:sort-order="sortOrder" :folder-contents="rows && grouper(rows)"
+      :action-items="actionItems" :root-entity="verify?.data" :loading-more="loadingMore" @dropped="onDrop" />
+    <GridView v-else ref="viewEl" v-model="selections" :folder-contents="rows" :action-items="actionItems" @dropped="onDrop" />
   </div>
   <p class="hidden absolute text-center top-1/2 left-[calc(50%-4rem)] w-32 z-10 font-bold">
     Drop to upload
@@ -46,18 +47,28 @@ import {
   isAttachmentRef,
   isSiteFile,
 } from '@/apps/drive/utils/files'
-import { toggleFav, clearRecent } from '@/apps/drive/resources/files'
+import { toggleFav, clearRecent, PAGE_SIZE } from '@/apps/drive/resources/files'
+import { confirmRestore, confirmRemove, confirmDeleteForever } from '@/apps/drive/utils/confirmActions'
 import { entitiesDownload } from '@/apps/drive/utils/download'
-import { ref, computed, watch, watchEffect, provide, inject } from 'vue'
+import { ref, computed, watch, watchEffect, provide, inject, nextTick } from 'vue'
 import { useRoute } from 'vue-router'
-import { useEventListener } from '@vueuse/core'
+import { onKeyDown, useEventListener, useInfiniteScroll } from '@vueuse/core'
+import { request } from 'frappe-ui'
 import { useSessionStore, useCurrentUser } from '@/boot/session'
-import { activeEntity } from '@/apps/drive/data/selection'
+import { activeEntity, startRename } from '@/apps/drive/data/selection'
 import { uploads } from '@/apps/drive/data/uploads'
 const { systemUser } = useCurrentUser()
 import { pageBreadcrumbs } from '@/apps/drive/data/breadcrumbs'
 import { view, getSortOrder, setSortOrder } from '@/apps/drive/data/prefs'
 import { setCurrentFolder } from '@/apps/drive/data/currentFolder'
+import {
+  expandedFolders,
+  loadedChildRows,
+  refreshExpanded,
+  refreshFolder,
+  removeFromTree,
+  resetTree,
+} from '@/apps/drive/data/folderTree'
 import { toast } from '@/apps/drive/utils/toasts'
 import { move } from '@/apps/drive/resources/files'
 import DriveListSkeleton from '@/apps/drive/components/DriveListSkeleton.vue'
@@ -125,80 +136,181 @@ const sortOrder = ref(getSortOrder(sortId.value) || DEFAULT_SORT)
 const search = ref('')
 const filters = ref([])
 
-const rows = ref(props.getEntities.data)
-watch(sortId, (id) => {
-  const saved = getSortOrder(id)
-  if (saved) sortOrder.value = saved
+const rows = computed(() => {
+  let out = props.getEntities.data ?? []
+  out = sortEntities([...out], sortOrder.value)
+  if (filters.value.length) {
+    const file_types = filters.value.map((k) => k.name)
+    const isFolder = file_types.includes('Folder')
+    out = out.filter(
+      ({ file_type, is_folder }) =>
+        file_types.includes(file_type) || (isFolder && is_folder)
+    )
+  }
+  return out
 })
 
 watch(
-  sortOrder,
-  (order) => {
-    rows.value = sortEntities([...rows.value], order)
-    props.getEntities.setData(rows.value)
-    if (sortId.value) {
-      setSortOrder(sortId.value, order)
-    }
+  sortId,
+  (id) => {
+    resetTree()
+    const saved = getSortOrder(id)
+    if (saved) sortOrder.value = saved
   },
-  { deep: true }
+  { immediate: true }
 )
 
-watch(search, (val) => {
-  const search = new RegExp(val, 'i')
-  rows.value = props.getEntities.data.filter((k) => search.test(k.file_name))
-})
-
 watch(
-  () => filters.value,
-  (val) => {
-    if (!val.length) {
-      rows.value = props.getEntities.data
-      return
-    }
-    const file_types = val.map((k) => k.name)
-    const isFolder = file_types.find((k) => k === 'Folder')
-    rows.value = props.getEntities.data.filter(
-      ({ file_type, is_folder }) =>
-        file_types.includes(file_type) || (isFolder && is_folder)
-    )
+  sortOrder,
+  (order) => {
+    if (sortId.value) setSortOrder(sortId.value, order)
+    refreshData()
   },
   { deep: true }
 )
+watch(search, () => refreshData())
 
 watch(
-  () => props.getEntities.data,
+  rows,
   (val) => {
-    if (!val) return
-    rows.value = sortEntities([...val], sortOrder.value)
     setCurrentFolder({
-      entities: rows.value.filter?.((k) => k.file_name?.[0] !== '.'),
+      entities: val.filter?.((k) => k.file_name?.[0] !== '.'),
     })
   },
   { immediate: true, deep: true }
 )
 
 const selections = ref(new Set())
-const selectedEntitities = computed(
-  () =>
-    props.getEntities.data?.filter?.(({ name }) =>
-      selections.value.has(name)
-    ) || []
+const allRows = computed(() => [
+  ...(props.getEntities.data ?? []),
+  ...loadedChildRows.value,
+])
+const selectedEntitities = computed(() =>
+  allRows.value.filter(({ name }) => selections.value.has(name))
 )
 
+// Shared by both views, as selections is Drive's own Set-based model.
+const isTyping = (e) =>
+  e.target.classList.contains('ProseMirror') ||
+  e.target.tagName === 'INPUT' ||
+  e.target.tagName === 'TEXTAREA'
+
+onKeyDown('a', (e) => {
+  if (isTyping(e)) return
+  if (e.metaKey) {
+    selections.value = new Set(rows.value.map((k) => k.name))
+    e.preventDefault()
+  }
+})
+onKeyDown('Backspace', (e) => {
+  if (isTyping(e)) return
+  if (e.metaKey) emitter.emit('remove')
+})
+onKeyDown('m', (e) => {
+  if (isTyping(e)) return
+  if (e.ctrlKey) emitter.emit('move')
+})
+onKeyDown('Escape', (e) => {
+  if (isTyping(e)) return
+  // Let an open dialog handle its own Escape.
+  if (document.querySelector('.dialog-content[data-state="open"]')) return
+  selections.value = new Set()
+  e.preventDefault()
+})
+
 const verifyAccess = computed(() => props.verify?.data || !props.verify)
 watchEffect(() => {
   if (verifyAccess.value?.write) useEventListener('paste', pasteObj)
 })
 
+const pageStart = ref(0)
+const hasNextPage = ref(false)
+const loadingMore = ref(false)
+
 const refreshData = () => {
+  const res = props.getEntities
   const params = { team: team.value === 'home' ? '' : team.value || '' }
   if (sortOrder.value) {
     params.order_by = sortOrder.value.field
     params.ascending = sortOrder.value.ascending
   }
-  props.getEntities.fetch({ ...props.getEntities.params, ...params })
+  params.search = search.value || ''
+  pageStart.value = 0
+  hasNextPage.value = false
+  if (res.paginated) {
+    params.start = 0
+    params.limit = PAGE_SIZE
+  }
+  res.fetch(
+    { ...res.params, ...params },
+    res.paginated
+      ? {
+          onSuccess: (data) => {
+            hasNextPage.value = (data?.length || 0) >= PAGE_SIZE
+          },
+        }
+      : {}
+  )
+}
+
+async function loadMore() {
+  const res = props.getEntities
+  if (!res?.paginated || res.loading || loadingMore.value || !hasNextPage.value)
+    return
+  loadingMore.value = true
+  const next = pageStart.value + PAGE_SIZE
+  try {
+    const path = res.url.startsWith('/') ? res.url : `/api/method/${res.url}`
+    const resp = await request({
+      url: path,
+      method: 'GET',
+      params: { ...res.params, start: next, limit: PAGE_SIZE },
+      credentials: 'include',
+    })
+    // request() is a raw fetch that skips the resource's transform, so the page
+    // rows arrive unformatted — run prettyData before appending.
+    const page = prettyData(Array.isArray(resp) ? resp : resp?.message ?? [])
+    pageStart.value = next
+    hasNextPage.value = page.length >= PAGE_SIZE
+    if (page.length) res.setData([...(res.data || []), ...page])
+  } catch {
+    hasNextPage.value = false
+  } finally {
+    loadingMore.value = false
+  }
 }
 
+const viewEl = ref(null)
+const scrollHost = ref(null)
+const resolveScrollHost = () => {
+  let el = viewEl.value?.scrollEl
+  let outermost = null
+  while (el && el !== document.body) {
+    const { overflowY } = getComputedStyle(el)
+    if (/(auto|scroll)/.test(overflowY)) {
+      if (el.scrollHeight > el.clientHeight) {
+        scrollHost.value = el
+        return
+      }
+      outermost = el
+    }
+    el = el.parentElement
+  }
+  scrollHost.value = outermost
+}
+watch([() => props.getEntities.data, view], () => nextTick(resolveScrollHost), {
+  immediate: true,
+})
+useEventListener(window, 'resize', resolveScrollHost)
+useInfiniteScroll(scrollHost, () => loadMore(), {
+  distance: 200,
+  canLoadMore: () =>
+    !!props.getEntities?.paginated &&
+    hasNextPage.value &&
+    !loadingMore.value &&
+    !props.getEntities.loading,
+})
+
 watch(
   [verifyAccess, team, () => props.getEntities],
   ([data]) => {
@@ -208,10 +320,24 @@ watch(
   { immediate: true, deep: false }
 )
 emitter.on('refresh', refreshData)
+
+// Removes entities from the currently rendered list once a confirm-dialog
+// write (remove/restore/delete forever) succeeds server-side. Provided so
+// Navbar can update the list from its own remove/restore triggers.
+function removeFromList(entities) {
+  const names = entities.map((e) => e.name)
+  props.getEntities.setData(
+    props.getEntities.data.filter(({ name }) => !names.includes(name))
+  )
+  removeFromTree(names)
+}
+provide('removeFromList', removeFromList)
+
 emitter.on('remove-file', (item) => {
-  selections.value.clear()
-  selections.value.add(item)
-  listDialog.value = 'remove'
+  const names = Array.isArray(item) ? item : [item]
+  const entities = allRows.value.filter((e) => names.includes(e.name))
+  if (!entities.length) return
+  confirmRemove(entities, { onSuccess: () => removeFromList(entities) })
 })
 
 if (!settings.fetched && useSessionStore().isLoggedIn) settings.fetch()
@@ -219,22 +345,80 @@ if (!settings.fetched && useSessionStore().isLoggedIn) settings.fetch()
 // Drag and drop
 const removeFile = (file, target) => {
   const removedIndex = props.getEntities.data.findIndex((k) => k.name === file)
-  props.getEntities.data.splice(removedIndex, 1)
-  const targetRow = props.getEntities.data.find((k) => k.name === target)
-  if (targetRow) targetRow.children += 1
+  if (removedIndex !== -1) props.getEntities.data.splice(removedIndex, 1)
+  else removeFromTree([file])
+  const targetRow = allRows.value.find((k) => k.name === target)
+  if (targetRow) targetRow.child_count = (targetRow.child_count || 0) + 1
   props.getEntities.setData(props.getEntities.data)
 }
 const onDrop = (targetFile, draggedItem) => {
-  if (!targetFile.is_folder || draggedItem === targetFile.name || !draggedItem)
-    return
-  move.submit({
-    entity_names: [draggedItem],
-    new_parent: targetFile.name,
-  })
-  removeFile(draggedItem, targetFile.name)
+  if (!targetFile.is_folder || !draggedItem) return
+  // If the dragged item is part of the current selection, move the whole
+  // selection; otherwise just move the dragged item.
+  const names = selections.value.has(draggedItem)
+    ? [...selections.value]
+    : [draggedItem]
+  const toMove = names.filter((name) => name !== targetFile.name)
+  if (!toMove.length) return
+  move.submit(
+    { entity_names: toMove, new_parent: targetFile.name },
+    {
+      // The rows were removed optimistically — put them back if the server said no.
+      onError: () => {
+        refreshData()
+        refreshExpanded(sortOrder.value)
+      },
+    }
+  )
+  toMove.forEach((name) => removeFile(name, targetFile.name))
+  if (expandedFolders.value.has(targetFile.name))
+    refreshFolder(targetFile.name, sortOrder.value)
+  selections.value = new Set()
 }
 emitter.on('remove-file-ui', removeFile)
 
+// Auto-scroll the file area while dragging near its top/bottom edge, so files
+// can be dropped into folders that aren't currently in view.
+let scrollRAF = null
+let scrollTarget = null
+let scrollSpeed = 0
+function getScrollableParent(el) {
+  while (el && el !== document.body) {
+    const { overflowY } = getComputedStyle(el)
+    if (/(auto|scroll)/.test(overflowY) && el.scrollHeight > el.clientHeight)
+      return el
+    el = el.parentElement
+  }
+  return null
+}
+function autoScrollTick() {
+  if (!scrollTarget || !scrollSpeed) return stopAutoScroll()
+  scrollTarget.scrollTop += scrollSpeed
+  scrollRAF = requestAnimationFrame(autoScrollTick)
+}
+function stopAutoScroll() {
+  if (scrollRAF) cancelAnimationFrame(scrollRAF)
+  scrollRAF = null
+  scrollTarget = null
+  scrollSpeed = 0
+}
+function onDragOverScroll(e) {
+  const target = getScrollableParent(e.target)
+  if (!target) return stopAutoScroll()
+  const rect = target.getBoundingClientRect()
+  const edge = 60
+  const maxSpeed = 18
+  let speed = 0
+  if (e.clientY < rect.top + edge)
+    speed = -maxSpeed * Math.min(1, (rect.top + edge - e.clientY) / edge)
+  else if (e.clientY > rect.bottom - edge)
+    speed = maxSpeed * Math.min(1, (e.clientY - (rect.bottom - edge)) / edge)
+  scrollSpeed = speed
+  scrollTarget = target
+  if (speed && !scrollRAF) autoScrollTick()
+  else if (!speed) stopAutoScroll()
+}
+
 // Action Items
 const actionItems = computed(() => {
   if (route.name === 'drive-Trash') {
@@ -242,14 +426,14 @@ const actionItems = computed(() => {
       {
         label: 'Restore',
         icon: LucideRotateCcw,
-        action: () => (listDialog.value = 'restore'),
+        action: (entities) => confirmRestore(entities, { onSuccess: () => removeFromList(entities) }),
         multi: true,
         important: true,
       },
       {
         label: 'Delete forever',
         icon: LucideTrash,
-        action: () => (listDialog.value = 'd'),
+        action: (entities) => confirmDeleteForever(entities, { onSuccess: () => removeFromList(entities) }),
         isEnabled: () => route.name === 'drive-Trash',
         multi: true,
         danger: true,
@@ -329,7 +513,7 @@ const actionItems = computed(() => {
       {
         label: __('Rename'),
         icon: LucideSquarePen,
-        action: () => (listDialog.value = 'rn'),
+        action: ([entity]) => startRename(entity.name),
         isEnabled: (e) => isManaged(e) && e.write,
       },
       {
@@ -382,7 +566,7 @@ const actionItems = computed(() => {
       {
         label: __('Delete'),
         icon: LucideTrash,
-        action: () => (listDialog.value = 'remove'),
+        action: (entities) => confirmRemove(entities, { onSuccess: () => removeFromList(entities) }),
         isEnabled: (e) => e.write,
         important: true,
         multi: true,
@@ -400,17 +584,14 @@ async function newLink() {
     localStorage.setItem('prevClip', text)
     const url = new URL(text)
     if (url.host)
-      toast({
-        title: 'Link detected',
-        text,
-        buttons: [
-          {
-            label: 'Add',
-            onClick: () => {
-              listDialog.value = 'l'
-            },
+      toast('Link detected', {
+        description: text,
+        action: {
+          label: 'Add',
+          onClick: () => {
+            listDialog.value = 'l'
           },
-        ],
+        },
       })
   } catch { }
 }
diff --git a/frontend/src/apps/drive/components/GridItem.vue b/frontend/src/apps/drive/components/GridItem.vue
index 27fff2f533..f09af55286 100644
--- a/frontend/src/apps/drive/components/GridItem.vue
+++ b/frontend/src/apps/drive/components/GridItem.vue
@@ -26,9 +26,11 @@
   <div
     class="p-2 h-[35%] border-t border-outline-gray-1 flex flex-col justify-evenly"
   >
-    <div class="truncate w-full w-fit text-base-medium text-ink-gray-8">
-      {{ file.file_name }}
-    </div>
+    <InlineRenameInput :entity="file" class="text-base-medium">
+      <div class="truncate w-full w-fit text-base-medium text-ink-gray-8">
+        {{ file.file_name }}
+      </div>
+    </InlineRenameInput>
     <div class="mt-[5px] text-xs text-ink-gray-5">
       <div class="flex items-center justify-start gap-1">
         <img
@@ -53,6 +55,7 @@
 <script setup>
 import { getIconUrl, getThumbnailUrl } from '@/apps/drive/utils/files'
 import { ref, computed } from 'vue'
+import InlineRenameInput from './InlineRenameInput.vue'
 const props = defineProps({ file: Object })
 
 const { src, fallback } = getThumbnailUrl(props.file, 'grid')
diff --git a/frontend/src/apps/drive/components/GridView.vue b/frontend/src/apps/drive/components/GridView.vue
index f5d264bc67..9055b0657f 100644
--- a/frontend/src/apps/drive/components/GridView.vue
+++ b/frontend/src/apps/drive/components/GridView.vue
@@ -2,7 +2,8 @@
   <!-- pt-1 to accomodate borders -->
   <div
     v-if="rows?.length"
-    class="grid-container gap-5 p-5 pb-[60px] overflow-auto select-none"
+    ref="scrollContainer"
+    class="grid-container content-start gap-5 p-5 pb-[60px] overflow-auto select-none flex-1 min-h-0"
   >
     <div
       v-for="file in rows"
@@ -14,11 +15,11 @@
         selections.has(file.name) || selectedRow?.name === file.name
           ? 'bg-surface-gray-2 shadow-gray'
           : 'border-outline-elevation-2 hover:shadow-lg',
-        draggedItem === file.name ? 'opacity-60 hover:shadow-none' : '',
+        draggingNames.has(file.name) ? 'opacity-60 hover:shadow-none' : '',
         dragOverItem === file.name ? '!bg-surface-gray-3' : '',
       ]"
-      :draggable="true"
-      @dragstart="draggedItem = file.name"
+      :draggable="renamingEntity !== file.name"
+      @dragstart="onDragStart($event, file)"
       @dragend="draggedItem = null"
       @dragleave="dragOverItem = null"
       @dragover="
@@ -42,9 +43,20 @@
       <LucideStar
         v-if="$route.name !== 'Favourites' && file.is_favourite"
         class="z-10 text-ink-amber-6 stroke-current fill-current absolute top-2 left-2 h-4"
+        :class="selections.size ? 'invisible' : 'group-hover:invisible'"
         width="16"
         height="16"
       />
+      <Checkbox
+        class="z-10 absolute top-1 left-1 cursor-pointer"
+        :class="
+          selections.size > 0 || selections.has(file.name)
+            ? ''
+            : 'invisible group-hover:visible'
+        "
+        :model-value="selections.has(file.name)"
+        @click.stop="toggleSelection(file)"
+      />
       <Button
         :variant="'subtle'"
         :label="`Actions for ${file.file_name}`"
@@ -75,14 +87,12 @@
 <script setup>
 import GridItem from '@/apps/drive/components/GridItem.vue'
 import ContextMenu from '@/apps/drive/components/ContextMenu.vue'
-import emitter from '@/apps/drive/emitter'
-import { Button } from 'frappe-ui'
+import { Button, Checkbox } from 'frappe-ui'
 import { ref, computed } from 'vue'
 import { openEntity } from '@/apps/drive/utils/files'
 import { useRoute } from 'vue-router'
-import { setActiveEntity } from '@/apps/drive/data/selection'
+import { setActiveEntity, renamingEntity } from '@/apps/drive/data/selection'
 import { settings } from '@/apps/drive/resources/permissions'
-import { onKeyDown } from '@vueuse/core'
 import { onOutsideClickDirective as vOnOutsideClick } from 'frappe-ui'
 
 const props = defineProps({
@@ -95,6 +105,9 @@ const selections = defineModel(new Set())
 
 const rows = computed(() => props.folderContents)
 
+const scrollContainer = ref(null)
+defineExpose({ scrollEl: scrollContainer })
+
 const selectedRow = ref(null)
 const rowEvent = ref(null)
 
@@ -122,52 +135,46 @@ const dropdownActionItems = (row) => {
       },
     }))
 }
+const toggleSelection = (file) => {
+  if (selections.value.has(file.name)) selections.value.delete(file.name)
+  else selections.value.add(file.name)
+}
+
 const open = (row) =>
   !selections.value.size && route.name !== 'Trash' && openEntity(row)
 
 const draggedItem = ref(null)
 const dragOverItem = ref(null)
 
-onKeyDown('a', (e) => {
-  if (
-    e.target.classList.contains('ProseMirror') ||
-    e.target.tagName === 'INPUT' ||
-    e.target.tagName === 'TEXTAREA'
-  )
-    return
-  if (e.metaKey) {
-    selections.value = new Set(props.folderContents.map((k) => k.name))
-    e.preventDefault()
-  }
-})
-onKeyDown('Backspace', (e) => {
-  if (
-    e.target.classList.contains('ProseMirror') ||
-    e.target.tagName === 'INPUT' ||
-    e.target.tagName === 'TEXTAREA'
-  )
-    return
-  if (e.metaKey) emitter.emit('remove')
-})
-onKeyDown('m', (e) => {
-  if (
-    e.target.classList.contains('ProseMirror') ||
-    e.target.tagName === 'INPUT' ||
-    e.target.tagName === 'TEXTAREA'
-  )
-    return
-  if (e.ctrlKey) emitter.emit('move')
+// The set of tiles that are visually "picked up" during a drag: the whole
+// selection when the grabbed tile is part of it, otherwise just that tile.
+const draggingNames = computed(() => {
+  if (!draggedItem.value) return new Set()
+  return selections.value.has(draggedItem.value)
+    ? selections.value
+    : new Set([draggedItem.value])
 })
-onKeyDown('Escape', (e) => {
-  if (
-    e.target.classList.contains('ProseMirror') ||
-    e.target.tagName === 'INPUT' ||
-    e.target.tagName === 'TEXTAREA'
+
+const onDragStart = (e, file) => {
+  draggedItem.value = file.name
+  e.dataTransfer?.setData('application/x-filename', file.name)
+  e.dataTransfer?.setData(
+    'application/x-filenames',
+    JSON.stringify([...draggingNames.value])
   )
-    return
-  selections.value = new Set()
-  e.preventDefault()
-})
+  const count = draggingNames.value.size
+  if (count <= 1) return
+  // Native drag image is a screenshot of the grabbed tile only; swap in a
+  // small badge so a multi-file drag reads as multiple items.
+  const ghost = document.createElement('div')
+  ghost.textContent = `${count} items`
+  ghost.className =
+    'fixed -top-full left-0 rounded-md bg-surface-gray-7 px-2.5 py-1.5 text-sm font-medium text-ink-white shadow-lg'
+  document.body.appendChild(ghost)
+  e.dataTransfer.setDragImage(ghost, -8, -8)
+  requestAnimationFrame(() => ghost.remove())
+}
+
 </script>
 <style scoped>
 .grid-container {
diff --git a/frontend/src/apps/drive/components/InlineRenameInput.vue b/frontend/src/apps/drive/components/InlineRenameInput.vue
new file mode 100644
index 0000000000..d8680c8796
--- /dev/null
+++ b/frontend/src/apps/drive/components/InlineRenameInput.vue
@@ -0,0 +1,47 @@
+<template>
+  <input
+    v-if="isEditing"
+    ref="input"
+    v-model="draft"
+    type="text"
+    spellcheck="false"
+    style="field-sizing: content"
+    :class="[
+      'min-w-[4ch] max-w-full rounded-sm bg-surface-base px-1.5 py-0.5 text-ink-gray-9 border border-outline-gray-2 outline-none focus:border-outline-gray-4 focus:outline-none focus:ring-0 focus:shadow-none focus-visible:outline-none',
+      $attrs.class || 'text-base',
+    ]"
+    @click.stop
+    @mousedown.stop
+    @dblclick.stop
+    @keydown.stop
+    @keydown.enter.prevent="submit"
+    @keydown.escape.prevent="cancel"
+    @focus="selectBaseName"
+    @blur="blur"
+  />
+  <slot v-else />
+</template>
+<script setup>
+import { computed, onMounted, watch } from 'vue'
+import { renamingEntity } from '@/apps/drive/data/selection'
+import { useInlineRename } from '@/apps/drive/utils/useInlineRename'
+
+defineOptions({ inheritAttrs: false })
+
+const props = defineProps({ entity: Object })
+
+const { draft, input, start, submit, blur, selectBaseName, cancel } = useInlineRename(
+  () => props.entity,
+)
+const isEditing = computed(() => renamingEntity.value === props.entity?.name)
+
+// List/grid rows keep this component mounted and toggle isEditing, so the watch
+// catches the transition. The breadcrumb only renders it while editing, so it
+// mounts already-editing — onMounted handles that case.
+watch(isEditing, (editing) => {
+  if (editing) start()
+})
+onMounted(() => {
+  if (isEditing.value) start()
+})
+</script>
diff --git a/frontend/src/apps/drive/components/ListDialogs.vue b/frontend/src/apps/drive/components/ListDialogs.vue
index e7ac5b42b7..92de9476a6 100644
--- a/frontend/src/apps/drive/components/ListDialogs.vue
+++ b/frontend/src/apps/drive/components/ListDialogs.vue
@@ -12,18 +12,6 @@
     @success="(data) => addToList(data, 'Link')"
   />
 
-  <RenameDialog
-    v-else-if="dialog === 'rn'"
-    v-model="dialog"
-    :entity="entities[0]"
-    @success="
-      ({ name, file_name }) => {
-        const el = list?.data?.find?.((k) => k.name === name)
-        if (el) el.file_name = file_name
-        resetDialog()
-      }
-    "
-  />
   <ShareDialog
     v-else-if="dialog === 's'"
     v-model="dialog"
@@ -41,22 +29,6 @@
     v-model="dialog"
     :entity="entities[0]"
   />
-
-  <ConfirmDialog
-    v-if="
-      [
-        'remove',
-        'restore',
-        'd',
-        'cta-favourites',
-        'cta-recents',
-        'cta-trash',
-      ].includes(dialog)
-    "
-    v-model="dialog"
-    :entities="entities"
-    @success="removeFromList(entities)"
-  />
 </template>
 
 <script setup>
@@ -66,8 +38,7 @@ import { useRoute } from 'vue-router'
 
 import NewFolderDialog from '@/apps/drive/components/NewFolderDialog.vue'
 import NewLinkDialog from '@/apps/drive/components/NewLinkDialog.vue'
-import ConfirmDialog from '@/apps/drive/components/ConfirmDialog.vue'
-import { ShareDialog, MoveDialog, RenameDialog, InfoDialog } from '@/apps/drive/ui/drive'
+import { ShareDialog, MoveDialog, InfoDialog } from '@/apps/drive/ui/drive'
 
 const props = defineProps({
   list: Object,
diff --git a/frontend/src/apps/drive/components/ListView.vue b/frontend/src/apps/drive/components/ListView.vue
index 2eb1f1784f..a72043a344 100644
--- a/frontend/src/apps/drive/components/ListView.vue
+++ b/frontend/src/apps/drive/components/ListView.vue
@@ -1,87 +1,160 @@
 <template>
-  <FrappeListView ref="container" class="relative select-none p-5 md:pb-15" row-key="name" :columns="selectedColumns"
-    :rows="formattedRows" :options="{
-      selectable: true,
-      enableActive: true,
-      showTooltip: true,
-      resizeColumn: false,
-      getRowRoute: (row) => getLink(row, false, false),
-      emptyState: {
-        description: 'Nothing found - try something else?',
-      },
-    }" @update:selections="handleSelections" @update:active-row="setActive">
-    <ListHeader class="mb-[1px]" />
-    <DriveListSkeleton v-if="!folderContents" />
-    <template v-else>
-      <div class="h-full overflow-y-auto">
-        <ListEmptyState v-if="!formattedRows.length" />
-        <div v-for="group in formattedRows" v-else-if="formattedRows[0].group" :key="group.group">
-          <ListGroupHeader :group="group">
-            <slot v-if="$slots['group-header']" name="group-header" v-bind="{ group }" />
-          </ListGroupHeader>
-          <ListGroupRows :group="group">
-            <CustomListRow :rows="group.rows" :context-menu="contextMenu" :selections @dropped="emit('dropped')" />
-          </ListGroupRows>
-        </div>
-        <div v-else class="pb-8">
-          <CustomListRow
-            :rows="formattedRows"
+  <List
+    class="relative select-none pt-3 flex flex-col flex-1 min-h-0 list-row-px-3"
+    :columns="columnTracks"
+    :row-height="40"
+    divider="inset"
+  >
+    <!-- Header is inside the scroll container so it shares the rows' width -->
+    <div
+      ref="scrollContainer"
+      class="flex-1 min-h-0 overflow-y-auto px-2 isolate [scrollbar-gutter:stable]"
+    >
+      <ListHeader class="group sticky top-0 z-10 bg-surface-base">
+        <ListHeaderCell>
+          <Checkbox
+            class="shrink-0"
+            :class="selectAllState.some ? '' : 'invisible group-hover:visible'"
+            :model-value="selectAllState.all"
+            :indeterminate="selectAllState.some && !selectAllState.all"
+            @click.stop="toggleSelectAll"
+          />
+        </ListHeaderCell>
+        <ListHeaderCellSort :direction="directionFor('file_name')" @click="toggleSort('file_name', __('Name'))">
+          {{ __('Name') }}
+          <template #suffix="{ direction }">
+            <span class="block size-3.5" :class="sortIcon(direction)" />
+          </template>
+        </ListHeaderCellSort>
+        <ListHeaderCellSort :direction="directionFor('owner')" @click="toggleSort('owner', __('Owner'))">
+          {{ __('Owner') }}
+          <template #suffix="{ direction }">
+            <span class="block size-3.5" :class="sortIcon(direction)" />
+          </template>
+        </ListHeaderCellSort>
+        <ListHeaderCellSort :direction="directionFor('modified')" @click="toggleSort('modified', __('Last Modified'), false)">
+          {{ __('Last Modified') }}
+          <template #suffix="{ direction }">
+            <span class="block size-3.5" :class="sortIcon(direction)" />
+          </template>
+        </ListHeaderCellSort>
+        <ListHeaderCellSort :direction="directionFor('file_size')" @click="toggleSort('file_size', __('Size'))">
+          {{ __('Size') }}
+          <template #suffix="{ direction }">
+            <span class="block size-3.5" :class="sortIcon(direction)" />
+          </template>
+        </ListHeaderCellSort>
+        <ListHeaderCell />
+      </ListHeader>
+      <DriveListSkeleton v-if="!folderContents" />
+      <template v-else>
+        <NoFilesSection v-if="!formattedRows.length" description="Nothing found - try something else?" />
+        <template v-else-if="formattedRows[0]?.group">
+          <ListGroup v-for="group in formattedRows" :key="group.group" :label="group.group" class="mt-3 first:mt-0">
+            <DriveListRow
+              :items="flattenRows(group.rows)"
+              :context-menu="contextMenu"
+              :selections
+              :toggle-selection="toggleSelection"
+              :toggle-folder="toggleFolderRow"
+              :root-entity="rootEntity"
+              @dropped="emit('dropped')"
+            />
+          </ListGroup>
+        </template>
+        <div v-else>
+          <DriveListRow
+            :items="visibleItems"
             :context-menu="contextMenu"
             :selections
+            :toggle-selection="toggleSelection"
+            :toggle-folder="toggleFolderRow"
+            :root-entity="rootEntity"
             @dropped="(...p) => $emit('dropped', ...p)"
           />
         </div>
-      </div>
-    </template>
-  </FrappeListView>
+        <ListRow v-if="loadingMore" class="pointer-events-none">
+          <ListCell />
+          <ListCell>
+            <div class="h-[16px] w-[16px] shrink-0 mr-2">
+              <Skeleton class="h-[16px] w-[16px] rounded-sm" />
+            </div>
+            <Skeleton class="h-3.5 w-40 rounded" />
+          </ListCell>
+          <ListCell>
+            <Skeleton class="size-5 shrink-0 mr-2 rounded-full" />
+            <Skeleton class="h-3 w-16 rounded" />
+          </ListCell>
+          <ListCell><Skeleton class="h-3 w-20 rounded" /></ListCell>
+          <ListCell><Skeleton class="h-3 w-12 rounded" /></ListCell>
+          <ListCell />
+        </ListRow>
+      </template>
+    </div>
+  </List>
   <ContextMenu v-if="rowEvent && selectedRow" :key="selectedRow.name" v-on-outside-click="() => (rowEvent = false)"
     :close="() => (rowEvent = false)" :action-items="dropdownActionItems(selectedRow)" :event="rowEvent" />
 </template>
 <script setup>
-import {
-  ListHeader,
-  ListGroupRows,
-  ListGroupHeader,
-  ListEmptyState,
-  ListView as FrappeListView,
-  Avatar,
-  Tooltip,
-} from 'frappe-ui'
-import { useSessionStore } from '@/boot/session'
+import { List, ListHeader, ListHeaderCell, ListHeaderCellSort, ListGroup, ListRow, ListCell } from 'frappe-ui/list'
+import { Checkbox, Skeleton, onOutsideClickDirective as vOnOutsideClick } from 'frappe-ui'
 import { activeEntity, setActiveEntity } from '@/apps/drive/data/selection'
 import { useRoute } from 'vue-router'
-import { computed, h, ref, watch, useTemplateRef } from 'vue'
+import { computed, ref, watch } from 'vue'
 import ContextMenu from '@/apps/drive/components/ContextMenu.vue'
-import CustomListRow from './CustomListRow.vue'
+import DriveListRow from './DriveListRow.vue'
 import DriveListSkeleton from './DriveListSkeleton.vue'
-import { openEntity, isModKey, getLink, getThumbnailUrl } from '@/apps/drive/utils/files'
-import { formatDate } from '@/apps/drive/utils/format'
+import NoFilesSection from './NoFilesSection.vue'
+import { openEntity, isModKey } from '@/apps/drive/utils/files'
 import {
-  WRITER_CONTENT_DOCTYPE,
-  PRESENTATION_CONTENT_DOCTYPE,
-} from '@/apps/drive/utils/files'
+  flattenRows,
+  toggleFolder,
+  refreshExpanded,
+} from '@/apps/drive/data/folderTree'
 
-import { onKeyDown } from '@vueuse/core'
-import { onOutsideClickDirective as vOnOutsideClick } from 'frappe-ui'
-import emitter from '@/apps/drive/emitter'
-import LucideBuilding2 from '~icons/lucide/building-2'
-import LucideUsers from '~icons/lucide/users'
-import LucideGlobe2 from '~icons/lucide/globe-2'
 
 const route = useRoute()
 const props = defineProps({
   folderContents: Object,
   actionItems: Array,
   rootEntity: Object,
+  loadingMore: Boolean,
 })
 const emit = defineEmits(['dropped'])
 
-const container = useTemplateRef('container')
 const selections = defineModel(new Set())
+const sortOrder = defineModel('sortOrder')
 const selectedRow = ref(null)
 
 const rowEvent = ref(null)
 
+const scrollContainer = ref(null)
+defineExpose({ scrollEl: scrollContainer })
+
+// Sort state lives on `sortOrder` (shared with the toolbar's sort control on
+// grid view); clicking a header toggles direction on repeat-click of the same
+// field, or switches field with a sensible default direction.
+function directionFor(field) {
+  return sortOrder.value.field === field
+    ? sortOrder.value.ascending
+      ? 'asc'
+      : 'desc'
+    : null
+}
+function toggleSort(field, label, firstAscending = true) {
+  if (sortOrder.value.field === field) {
+    sortOrder.value.ascending = !sortOrder.value.ascending
+  } else {
+    sortOrder.value.field = field
+    sortOrder.value.label = label
+    sortOrder.value.ascending = firstAscending
+  }
+}
+function sortIcon(direction) {
+  if (!direction) return 'lucide-arrow-up-down'
+  return direction === 'asc' ? 'lucide-arrow-up' : 'lucide-arrow-down'
+}
+
 const formattedRows = computed(() => {
   if (!props.folderContents) return []
   if (Array.isArray(props.folderContents)) return props.folderContents
@@ -94,91 +167,74 @@ const formattedRows = computed(() => {
     .filter((g) => g.rows.length)
 })
 
-const selectedColumns = [
-  {
-    label: __('Name'),
-    key: 'file_name',
-    getLabel: ({ row: { file_name, is_folder, content_doctype } }) =>
-      file_name.lastIndexOf('.') === -1 ||
-      is_folder ||
-      content_doctype === WRITER_CONTENT_DOCTYPE ||
-      content_doctype === PRESENTATION_CONTENT_DOCTYPE
-        ? file_name
-        : file_name.slice(0, file_name.lastIndexOf('.')),
-    getTooltip: (e) =>
-      e.is_folder ||
-      e.content_doctype === WRITER_CONTENT_DOCTYPE ||
-      e.content_doctype === PRESENTATION_CONTENT_DOCTYPE
-        ? ''
-        : e.file_name,
-    prefix: ({ row }) => {
-      return getThumbnailUrl(row)
-    },
-    suffix: ({ row }) => {
-      if (row.share_count === props.rootEntity?.share_count) return
-      if (row.share_count === -2) {
-        return h(Tooltip, { text: __('Public') }, {
-          default: () => h(LucideGlobe2, { class: 'size-4' })
-        })
-      } else if (row.share_count === -1) {
-        return h(Tooltip, { text: __('Organization') }, {
-          default: () => h(LucideBuilding2, { class: 'size-4' })
-        })
-      } else if (row.share_count > 0) {
-        return h(Tooltip, { text: __('Shared with {0} users', [row.share_count]) }, {
-          default: () => h(LucideUsers, { class: 'size-4' })
-        })
-      }
-    },
-  },
-  {
-    label: __('Owner'),
-    key: '',
-    getLabel: ({ row }) =>
-      row.owner === useSessionStore().user
-        ? __('You')
-        : row.owner_full_name || row.owner || '-',
-    isEnabled: (n) => n !== 'Attachments',
-    prefix: ({ row }) => {
-      if (!row.owner) return
-      return h(Avatar, {
-        shape: 'circle',
-        image: row.owner_image,
-        label: row.owner_full_name || row.owner,
-        size: 'sm',
-      })
-    },
-    width: '10%',
-  },
-  {
-    label: __('Last Modified'),
-    getLabel: ({ row }) => row.relativeModified,
-    getTooltip: (row) => formatDate(row.modified),
-    key: 'modified',
-    isEnabled: (n) => n !== 'Recents' && n !== 'Attachments',
-    width: '15%',
-  },
-  {
-    label: __('Last Accessed'),
-    getLabel: ({ row }) => row.relativeAccessed,
-    getTooltip: (row) => formatDate(row.accessed),
-    key: 'modified',
-    isEnabled: (n) => n === 'Recents',
-    width: '15%',
-  },
-  {
-    label: __('Size'),
-    key: '',
-    getLabel: ({ row }) =>
-      row.is_folder
-        ? row.child_count
-          ? row.child_count + ' item' + (row.child_count === 1 ? '' : 's')
-          : 'empty'
-        : row.file_size_pretty || '-',
-    width: route.name === 'drive-Attachments' ? '25%' : '8%',
-  },
-  { label: '', key: 'options', align: 'right', width: '5%' },
-].filter((k) => !k.isEnabled || k.isEnabled(route.name))
+// Name is flexible; Size widens on Attachments (no Owner/Modified column
+// hiding here — that logic was already dead in the previous implementation,
+// since it compared route.name to bare labels that never match the
+// `drive-`-prefixed route names).
+const columnTracks = computed(() => [
+  '16px',
+  'minmax(0,1fr)',
+  '10%',
+  '15%',
+  route.name === 'drive-Attachments' ? '25%' : '8%',
+  '5%',
+])
+
+const visibleItems = computed(() => flattenRows(formattedRows.value))
+// Collapsing hides rows that may be selected — drop them from the selection so
+// the toolbar can't act on rows nobody can see.
+const toggleFolderRow = (row) => {
+  const collapsed = toggleFolder(row, sortOrder.value)
+  if (!collapsed.length) return
+  const next = new Set(selections.value)
+  collapsed.forEach((name) => next.delete(name))
+  selections.value = next
+}
+watch(sortOrder, () => refreshExpanded(sortOrder.value), { deep: true })
+
+// Shift-click range select: extends from the last row clicked (whichever
+// way — checkbox or plain click) through the clicked row, in on-screen
+// order. `flatRows` collapses grouped views and expanded subtrees into one
+// sequence so a range can span those boundaries.
+const lastSelectedName = ref(null)
+const flatRows = computed(() =>
+  (formattedRows.value[0]?.group
+    ? formattedRows.value.flatMap((g) => flattenRows(g.rows))
+    : visibleItems.value
+  )
+    .filter((i) => i.row)
+    .map((i) => i.row)
+)
+function toggleSelection(row, event) {
+  if (event?.shiftKey && lastSelectedName.value) {
+    const names = flatRows.value.map((r) => r.name)
+    const from = names.indexOf(lastSelectedName.value)
+    const to = names.indexOf(row.name)
+    if (from !== -1 && to !== -1) {
+      const [start, end] = from < to ? [from, to] : [to, from]
+      const next = new Set(selections.value)
+      names.slice(start, end + 1).forEach((n) => next.add(n))
+      selections.value = next
+      return
+    }
+  }
+  const next = new Set(selections.value)
+  if (next.has(row.name)) next.delete(row.name)
+  else next.add(row.name)
+  selections.value = next
+  lastSelectedName.value = row.name
+}
+
+const selectAllState = computed(() => {
+  const names = flatRows.value.map((r) => r.name)
+  const count = names.filter((n) => selections.value.has(n)).length
+  return { all: names.length > 0 && count === names.length, some: count > 0 }
+})
+function toggleSelectAll() {
+  selections.value = selectAllState.value.all
+    ? new Set()
+    : new Set(flatRows.value.map((r) => r.name))
+}
 
 const setActive = (entityName) => {
   const entity = props.folderContents.find((k) => k.name === entityName)
@@ -213,53 +269,10 @@ const contextMenu = (event, row) => {
   event.preventDefault()
 }
 
-const handleSelections = (sels) => {
-  selections.value = sels
-  selectedRow.value = null
-  setActiveEntity(null)
-}
-
-// Add keyboard shortcuts here as f-ui selections has to be mutated
-onKeyDown('a', (e) => {
-  // How do I do this nicely?
-  if (
-    e.target.classList.contains('ProseMirror') ||
-    e.target.tagName === 'INPUT' ||
-    e.target.tagName === 'TEXTAREA'
-  )
-    return
-  if (e.metaKey) {
-    container.value.selections.clear()
-    props.folderContents.map((k) => container.value.selections.add(k.name))
-    e.preventDefault()
-  }
-})
-onKeyDown('Backspace', (e) => {
-  if (
-    e.target.classList.contains('ProseMirror') ||
-    e.target.tagName === 'INPUT' ||
-    e.target.tagName === 'TEXTAREA'
-  )
-    return
-  if (e.metaKey) emitter.emit('remove')
-})
-onKeyDown('m', (e) => {
-  if (
-    e.target.classList.contains('ProseMirror') ||
-    e.target.tagName === 'INPUT' ||
-    e.target.tagName === 'TEXTAREA'
-  )
-    return
-  if (e.ctrlKey) emitter.emit('move')
-})
-onKeyDown('Escape', (e) => {
-  if (
-    e.target.classList.contains('ProseMirror') ||
-    e.target.tagName === 'INPUT' ||
-    e.target.tagName === 'TEXTAREA'
-  )
-    return
-  container.value.selections.clear()
-  e.preventDefault()
-})
 </script>
+<style>
+/* Match the inset row dividers — frappe-ui always spans this 1 / -1 */
+[data-slot='list-header-border'] {
+  grid-column: 2 / -1;
+}
+</style>
diff --git a/frontend/src/apps/drive/components/Navbar.vue b/frontend/src/apps/drive/components/Navbar.vue
index 4233afe396..b1b0c8dc10 100644
--- a/frontend/src/apps/drive/components/Navbar.vue
+++ b/frontend/src/apps/drive/components/Navbar.vue
@@ -1,12 +1,9 @@
 <template>
-  <nav v-if="breadcrumbItems?.length" id="navbar" ondragstart="return false;" ondrop="return false;"
-    class="bg-surface-base border-b px-5 py-2.5 h-12 flex justify-between">
+  <nav id="navbar" ondragstart="return false;" ondrop="return false;"
+    class="bg-surface-base border-b px-5 py-2.5 h-12 shrink-0 flex justify-between">
     <slot name="breadcrumbs">
-      <Breadcrumbs :items="breadcrumbItems" class="select-none truncate max-w-[80%]">
-        <template #prefix="{ item, index }">
-          <Skeleton v-if="item.loading" class="h-4 w-16 rounded" />
-        </template>
-      </Breadcrumbs>
+      <EditableBreadcrumbs :items="breadcrumbItems" :entity="rootEntity || null"
+        class="select-none truncate max-w-[80%]" />
     </slot>
 
     <div class="flex gap-2">
@@ -45,7 +42,7 @@
         label="Create" variant="solid" :icon-left="h(LucidePlus, { class: 'size-4' })"
         @click="newExternal($route.name === 'drive-Documents' ? 'Document' : 'Presentation')" />
       <Button v-if="button" :disabled="!button.entities.data?.length" :theme="button.theme || 'gray'"
-        @click="openListDialog('cta-' + $route.name.replace('drive-', '').toLowerCase())">
+        @click="button.onClick">
         <template #prefix>
           <component :is="button.icon" class="size-4" />
         </template>
@@ -57,9 +54,11 @@
 </template>
 <script setup>
 import EntityDialogs from '@/apps/drive/components/EntityDialogs.vue'
-import { Button, Breadcrumbs, Skeleton, Dropdown } from 'frappe-ui'
+import { Button, Dropdown } from 'frappe-ui'
+import EditableBreadcrumbs from '@/apps/drive/components/EditableBreadcrumbs.vue'
 import { useSessionStore, useCurrentUser } from '@/boot/session'
 import { isHomeContext, pageBreadcrumbs } from '@/apps/drive/data/breadcrumbs'
+import { startRename } from '@/apps/drive/data/selection'
 const { systemUser } = useCurrentUser()
 import emitter from '@/apps/drive/emitter'
 import { ref, computed, inject, h } from 'vue'
@@ -74,8 +73,15 @@ import {
   isAttachmentRef,
   isSiteFile,
   isVirtual,
+  openEntity,
 } from '@/apps/drive/utils/files'
 import { getFileLink } from '@/apps/drive/ui/drive/js/utils'
+import {
+  confirmRemove,
+  confirmClearRecents,
+  confirmClearFavourites,
+  confirmClearTrash,
+} from '@/apps/drive/utils/confirmActions'
 
 import LucideClock from '~icons/lucide/clock'
 import LucideHome from '~icons/lucide/home'
@@ -125,6 +131,9 @@ const breadcrumbItems = computed(
 
 const isLoggedIn = computed(() => useSessionStore().isLoggedIn)
 const listDialog = inject('listDialog', null)
+// Set by GenericPage when Navbar is mounted inside a list context; absent on
+// standalone entity pages (e.g. File.vue), where removal just navigates away.
+const removeFromList = inject('removeFromList', null)
 const entityDialog = ref('')
 const rootEntity = computed(() => props.rootResource?.data?.file_name && props.rootResource?.data)
 const dialogEntities = computed(() =>
@@ -144,9 +153,31 @@ function routeDialog(type) {
   else openEntityDialog(type)
 }
 
+function removeCurrentEntities() {
+  const entities = dialogEntities.value
+  confirmRemove(entities, {
+    onSuccess: () => {
+      removeFromList?.(entities)
+      const rootDeleted = entities.some((e) => e.name === rootEntity.value?.name)
+      if (rootDeleted) {
+        openEntity({
+          is_folder: 1,
+          name: rootEntity.value.folder,
+          breadcrumbs: rootEntity.value.breadcrumbs?.slice(0, -1) ?? [],
+        })
+      }
+    },
+  })
+}
+
 emitter.on('share', () => routeDialog('s'))
-emitter.on('rename', () => routeDialog('rn'))
-emitter.on('remove', () => routeDialog('remove'))
+// Rename is inline everywhere: a list row in list/grid views, the last
+// breadcrumb on an entity page.
+emitter.on('rename', () => {
+  const target = dialogEntities.value[0]
+  if (target) startRename(target.name)
+})
+emitter.on('remove', removeCurrentEntities)
 emitter.on('move', () => routeDialog('m'))
 emitter.on('newFolder', () => openListDialog('f'))
 emitter.on('newLink', () => openListDialog('l'))
@@ -213,7 +244,7 @@ const defaultActions = computed(() => {
         {
           label: __('Rename'),
           icon: LucideSquarePen,
-          onClick: () => openEntityDialog('rn'),
+          onClick: () => startRename(rootEntity.value.name),
           isEnabled: () => rootEntity.value.write && isManaged(rootEntity.value),
         },
         {
@@ -254,7 +285,7 @@ const defaultActions = computed(() => {
         {
           label: __('Delete'),
           icon: LucideTrash,
-          onClick: () => openEntityDialog('remove'),
+          onClick: removeCurrentEntities,
           isEnabled: () => rootEntity.value.write,
           theme: 'red',
         },
@@ -276,12 +307,14 @@ const possibleButtons = [
     label: __('Clear'),
     icon: LucideStar,
     entities: getFavourites,
+    onClick: confirmClearFavourites,
   },
   {
     route: 'drive-Recents',
     label: __('Clear'),
     icon: LucideClock,
     entities: getRecents,
+    onClick: confirmClearRecents,
   },
   {
     route: 'drive-Trash',
@@ -289,6 +322,7 @@ const possibleButtons = [
     icon: LucideTrash,
     entities: getTrash,
     theme: 'red',
+    onClick: confirmClearTrash,
   },
 ]
 const button = computed(() => possibleButtons.find((k) => k.route == route.name))
diff --git a/frontend/src/apps/drive/components/NoFilesSection.vue b/frontend/src/apps/drive/components/NoFilesSection.vue
index 308341da92..5d9ba80652 100644
--- a/frontend/src/apps/drive/components/NoFilesSection.vue
+++ b/frontend/src/apps/drive/components/NoFilesSection.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex flex-col items-center text-center m-auto gap-4">
+  <div class="flex flex-col items-center text-center mx-auto mt-24 gap-4">
     <div class="flex flex-col items-center gap-2">
       <component v-if="icon" :is="icon" class="size-8 text-ink-gray-5" />
       <p class="text-base-medium text-ink-gray-7">
diff --git a/frontend/src/apps/drive/components/SearchPopup.vue b/frontend/src/apps/drive/components/SearchPopup.vue
index 3c657b6019..524b187698 100644
--- a/frontend/src/apps/drive/components/SearchPopup.vue
+++ b/frontend/src/apps/drive/components/SearchPopup.vue
@@ -1,6 +1,6 @@
 <template>
-  <Dialog v-model:open="open" size="xl" position="top">
-    <template #body>
+  <Dialog v-model:open="open" size="xl" position="top" bare>
+    <template #default>
       <div class="flex px-4 py-3 gap-1 items-center border-b">
         <LucideSearch class="w-4 mr-1 h-auto" name="search" />
         <input
diff --git a/frontend/src/apps/drive/components/Settings/BackendSettings.vue b/frontend/src/apps/drive/components/Settings/BackendSettings.vue
index 936da45c7c..8eb3440e01 100644
--- a/frontend/src/apps/drive/components/Settings/BackendSettings.vue
+++ b/frontend/src/apps/drive/components/Settings/BackendSettings.vue
@@ -153,9 +153,7 @@ const updateSettings = createResource({
   makeParams: () => ({ ...generalSettings, ...s3Settings }),
   onSuccess() {
     edited.value = false
-    toast({
-      title: 'S3 settings updated successfully',
-    })
+    toast.success('S3 settings updated successfully')
   },
 })
 </script>
diff --git a/frontend/src/apps/drive/components/Settings/UserListSettings.vue b/frontend/src/apps/drive/components/Settings/UserListSettings.vue
index c320eb9282..d576a8f240 100644
--- a/frontend/src/apps/drive/components/Settings/UserListSettings.vue
+++ b/frontend/src/apps/drive/components/Settings/UserListSettings.vue
@@ -102,7 +102,7 @@
             class="flex items-center justify-start pr-4 gap-x-3 py-2"
           >
             <Avatar :image="user.user_image" :label="user.full_name" size="lg" />
-            <div class="flex flex-col">
+            <div class="flex flex-col gap-0.5">
               <span class="text-base text-ink-gray-8">{{ user.full_name }}</span>
               <span class="text-xs text-ink-gray-6">{{ user.email }}</span>
             </div>
diff --git a/frontend/src/apps/drive/components/Sidebar.vue b/frontend/src/apps/drive/components/Sidebar.vue
index 302823cc5b..df6ee5e684 100644
--- a/frontend/src/apps/drive/components/Sidebar.vue
+++ b/frontend/src/apps/drive/components/Sidebar.vue
@@ -167,7 +167,7 @@ const sidebarItems = computed(() => {
           onClick: () => emitter.emit('showSearchPopup', true),
         },
         {
-          label: __('Inbox'),
+          label: __('Notifications'),
           icon: LucideInbox,
           to: { name: 'drive-Inbox' },
           isActive: active('drive-Inbox'),
@@ -177,7 +177,6 @@ const sidebarItems = computed(() => {
       ],
     },
     {
-      label: 'Drive',
       items: [
         {
           label: 'Home',
@@ -200,6 +199,13 @@ const sidebarItems = computed(() => {
           isActive: active('drive-Shared'),
           accessKey: 's',
         },
+        {
+          label: 'Favourites',
+          to: { name: 'drive-Favourites' },
+          icon: LucideStar,
+          isActive: active('drive-Favourites'),
+          accessKey: 'f',
+        },
         {
           label: 'Trash',
           to: { name: 'drive-Trash' },
@@ -225,7 +231,7 @@ const sidebarItems = computed(() => {
         })),
     },
     {
-      label: 'Views',
+      label: 'Browse',
       collapsible: true,
       items: dynamicList([
         {
@@ -235,13 +241,6 @@ const sidebarItems = computed(() => {
           isActive: active('drive-Attachments'),
           accessKey: 'a',
         },
-        {
-          label: 'Favourites',
-          to: { name: 'drive-Favourites' },
-          icon: LucideStar,
-          isActive: active('drive-Favourites'),
-          accessKey: 'f',
-        },
         {
           label: 'Documents',
           to: { name: 'drive-Documents' },
@@ -264,20 +263,27 @@ const sidebarItems = computed(() => {
 const draggedSpace = ref(null)
 const handleDrop = (e, space) => {
   draggedSpace.value = null
-  const file_name = e.dataTransfer.getData('application/x-filename')
+  // Prefer the multi-selection payload, falling back to the single dragged file.
+  let names = []
+  try {
+    names = JSON.parse(e.dataTransfer.getData('application/x-filenames') || '[]')
+  } catch {
+    names = []
+  }
+  if (!names.length) {
+    const single = e.dataTransfer.getData('application/x-filename')
+    if (single) names = [single]
+  }
+  if (!names.length) return
+  const clearFromList = () =>
+    names.forEach((name) => emitter.emit('remove-file-ui', name))
   if (space.label === 'Trash') {
-    emitter.emit('remove-file', file_name)
+    emitter.emit('remove-file', names)
   } else if (space.label === 'Home') {
-    move.submit(
-      { entity_names: [file_name] },
-      { onSuccess: () => emitter.emit('remove-file-ui', file_name) }
-    )
+    move.submit({ entity_names: names }, { onSuccess: clearFromList })
   } else if (space.to?.name === 'drive-Team') {
     const team = space.to.params.team
-    move.submit(
-      { entity_names: [file_name], team },
-      { onSuccess: () => emitter.emit('remove-file-ui', file_name) }
-    )
+    move.submit({ entity_names: names, team }, { onSuccess: clearFromList })
   }
 }
 </script>
diff --git a/frontend/src/apps/drive/components/SyncBreakdown.vue b/frontend/src/apps/drive/components/SyncBreakdown.vue
index efe619207b..399b2a7818 100644
--- a/frontend/src/apps/drive/components/SyncBreakdown.vue
+++ b/frontend/src/apps/drive/components/SyncBreakdown.vue
@@ -126,27 +126,24 @@ watch(
 const syncFromDisk = createResource({
   url: 'suite.drive.api.scripts.sync_from_disk',
   beforeSubmit: () => {
-    toast({
+    toast('Starting syncing.', {
       icon: LucideFolderSync,
-      title: 'Starting syncing.',
-      text: "We'll give you an update when it's done.",
+      description: "We'll give you an update when it's done.",
     })
   },
   onSuccess: (d) => {
-    toast({
+    toast.success('Successfully synced', {
       icon: LucideCloudCheck,
-      title: 'Successfully synced',
-      text: d.length
+      description: d.length
         ? `Added ${d.length} item${d.length > 1 ? 's' : ''}`
         : 'No new files were added.',
     })
     emitter.emit('refresh')
   },
   onError: () => {
-    toast({
+    toast.error('There was an error.', {
       icon: LucideCloudAlert,
-      title: 'There was an error.',
-      text: 'Is there an issue with your configuration?',
+      description: 'Is there an issue with your configuration?',
     })
   },
 })
diff --git a/frontend/src/apps/drive/components/UploadTracker.vue b/frontend/src/apps/drive/components/UploadTracker.vue
index 60472ac1ab..53d7e2d954 100644
--- a/frontend/src/apps/drive/components/UploadTracker.vue
+++ b/frontend/src/apps/drive/components/UploadTracker.vue
@@ -20,12 +20,8 @@
         {{ uploadsFailed.length == 1 ? 'upload' : 'uploads' }} failed
       </div>
       <div class="ml-auto flex items-center gap-4">
-        <button class="focus:outline-none" @click.stop="collapsed = !collapsed">
-          <component :is="collapsed ? LucidePlus : LucideMinus" class="size-4 text-ink-gray-8" />
-        </button>
-        <button class="focus:outline-none" @click="clearUploads()">
-          <LucideX class="size-4 text-ink-gray-8" />
-        </button>
+        <Button variant="ghost" :icon="collapsed ? LucidePlus : LucideMinus" @click.stop="collapsed = !collapsed" />
+        <Button variant="ghost" :icon="LucideX" @click="clearUploads()" />
       </div>
     </div>
     <div v-if="!collapsed" class="max-h-64 overflow-y-auto bg-surface-base w-full">
diff --git a/frontend/src/apps/drive/data/breadcrumbs.ts b/frontend/src/apps/drive/data/breadcrumbs.ts
index be7b2b720e..744c21ed03 100644
--- a/frontend/src/apps/drive/data/breadcrumbs.ts
+++ b/frontend/src/apps/drive/data/breadcrumbs.ts
@@ -1,50 +1,113 @@
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
 import emitter from '@/apps/drive/emitter'
+import router from '@/apps/drive/router'
 import { getTeams, getPublicTeams } from '@/apps/drive/resources/files'
 import { useSessionStore } from '@/boot/session'
 
 export type DriveBreadcrumb = Record<string, unknown>
 
-/** Current page breadcrumb trail — in-memory only; derived from route + entity API. */
-export const pageBreadcrumbs = ref<DriveBreadcrumb[]>([])
+/** Published by the page that owns the entity; crumbs derive from it + route. */
+const crumbEntity = ref<Record<string, unknown> | null>(null)
 
-export type BreadcrumbUpdate =
-  | DriveBreadcrumb[]
-  | { loading: true; name: string }
+const ENTITY_ROUTES = ['drive-Folder', 'drive-File', 'drive-Document']
 
-export function setPageBreadcrumbs(items: BreadcrumbUpdate) {
-  if (!Array.isArray(items)) {
-    const crumbs = [...pageBreadcrumbs.value]
-    if (crumbs.length > 1) crumbs.splice(1)
-    crumbs.push({ loading: true, name: items.name })
-    pageBreadcrumbs.value = crumbs
-    return
+export function setCrumbEntity(entity: Record<string, unknown> | null) {
+  crumbEntity.value = entity
+}
+
+export function renameCrumbEntity(entityName: string, label: string) {
+  const entity = crumbEntity.value
+  if (!entity) return
+  if (entity.name === entityName) entity.file_name = label
+  const trail = entity.breadcrumbs as Array<Record<string, unknown>> | undefined
+  const crumb = trail?.find((folder) => folder.name === entityName)
+  if (crumb) crumb.file_name = label
+}
+
+export function clearCrumbEntity(entityName?: string) {
+  if (!entityName || crumbEntity.value?.name === entityName) {
+    crumbEntity.value = null
   }
-  pageBreadcrumbs.value = items
 }
 
-export function getRootSection(): DriveBreadcrumb {
-  return pageBreadcrumbs.value[0] || {}
+function rootCrumb(routeName: string, path: string): DriveBreadcrumb {
+  return {
+    label: __(routeName.replace(/^drive-/, '')),
+    name: routeName,
+    route: path,
+  }
 }
 
-export function isHomeContext() {
-  return getRootSection().name === 'drive-Home'
+function teamCrumbs(team: string): DriveBreadcrumb[] {
+  const data = getTeams.data?.[team] || getPublicTeams.data?.[team]
+  return data
+    ? [{ label: data.title, name: data.name }]
+    : [{ loading: true, name: team }]
 }
 
-export function appendBreadcrumb(item: DriveBreadcrumb) {
-  pageBreadcrumbs.value = [...pageBreadcrumbs.value, item]
+function attachmentCrumbs(
+  routeName: string,
+  path: string,
+  doctype?: string,
+  docname?: string,
+): DriveBreadcrumb[] {
+  const crumbs = [rootCrumb(routeName, path)]
+  if (doctype) {
+    crumbs.push({
+      label: doctype,
+      name: doctype,
+      route: { name: routeName, params: { doctype } },
+    })
+    if (docname) {
+      crumbs.push({
+        label: docname,
+        name: docname,
+        route: { name: routeName, params: { doctype, docname } },
+      })
+    }
+  }
+  return crumbs
 }
 
-export function updateLastBreadcrumbLabel(label: string, entityName?: string) {
-  const last = pageBreadcrumbs.value[pageBreadcrumbs.value.length - 1]
-  if (last && (!entityName || last.name === entityName)) {
-    last.label = label
+export const pageBreadcrumbs = computed<DriveBreadcrumb[]>(() => {
+  const route = router.currentRoute.value
+  const routeName = typeof route?.name === 'string' ? route.name : ''
+  if (!routeName.startsWith('drive-')) return []
+
+  if (routeName === 'drive-Team') return teamCrumbs(String(route.params.team || ''))
+  if (routeName === 'drive-Attachments')
+    return attachmentCrumbs(
+      routeName,
+      route.path,
+      route.params.doctype as string,
+      route.params.docname as string,
+    )
+  if (ENTITY_ROUTES.includes(routeName)) {
+    const entityName = String(route.params.entityName || '')
+    const entity = crumbEntity.value
+    return entity && entity.name === entityName
+      ? buildBreadCrumbs(entity)
+      : [{ loading: true, name: entityName }]
   }
+  return [rootCrumb(routeName, route.path)]
+})
+
+export function getRootSection(): DriveBreadcrumb {
+  return pageBreadcrumbs.value[0] || {}
+}
+
+export function isHomeContext() {
+  return getRootSection().name === 'drive-Home'
 }
 
 /** Build navbar crumbs from entity API payload — pure, no side effects. */
 export function buildBreadCrumbs(entity: Record<string, unknown>) {
-  let breadcrumbs = entity.breadcrumbs as Array<Record<string, unknown>>
+  let breadcrumbs = [
+    ...((entity.breadcrumbs as Array<Record<string, unknown>>) || []),
+  ]
+  if (!breadcrumbs.length)
+    return [{ label: entity.file_name, name: entity.name, route: null }]
+
   const in_home = entity.in_home
   const team =
     getTeams.data?.[breadcrumbs[0].team as string] ||
@@ -110,17 +173,13 @@ export function buildBreadCrumbs(entity: Record<string, unknown>) {
   }
 
   if (!breadcrumbs[0].folder) breadcrumbs.splice(0, 1)
-  const popBreadcrumbs = (item: DriveBreadcrumb) => () =>
-    res.splice(res.findIndex((k) => k.name === item.name) + 1)
 
   breadcrumbs.forEach((folder, idx) => {
     const final = idx === breadcrumbs.length - 1
     res.push({
       label: folder.file_name,
       name: folder.name,
-      onClick: final
-        ? () => entity.write && emitter.emit('rename')
-        : popBreadcrumbs(folder),
+      onClick: final ? () => entity.write && emitter.emit('rename') : undefined,
       route: final
         ? null
         : { name: 'drive-Folder', params: { entityName: folder.name } },
@@ -128,7 +187,3 @@ export function buildBreadCrumbs(entity: Record<string, unknown>) {
   })
   return res
 }
-
-export function applyBreadCrumbs(entity: Record<string, unknown>) {
-  setPageBreadcrumbs(buildBreadCrumbs(entity))
-}
diff --git a/frontend/src/apps/drive/data/folderTree.js b/frontend/src/apps/drive/data/folderTree.js
new file mode 100644
index 0000000000..c06333eca9
--- /dev/null
+++ b/frontend/src/apps/drive/data/folderTree.js
@@ -0,0 +1,114 @@
+import { computed, reactive, ref } from 'vue'
+import { request } from 'frappe-ui'
+import { prettyData, sortEntities } from '@/apps/drive/utils/files'
+
+export const expandedFolders = ref(new Set())
+export const folderChildren = reactive({})
+
+// Skeleton rows shown while a subtree loads, so a huge folder doesn't flood the DOM.
+export const MAX_SKELETONS = 20
+
+export const loadedChildRows = computed(() =>
+  Object.values(folderChildren).flatMap((node) => node.rows)
+)
+
+// Guards against an earlier fetch of the same folder resolving after a later one.
+const tokens = {}
+
+async function fetchChildren(name, sortOrder) {
+  const node = folderChildren[name]
+  const token = (tokens[name] = (tokens[name] || 0) + 1)
+  node.loading = true
+  let rows = []
+  try {
+    const data = await request({
+      url: '/api/method/suite.drive.api.list.files',
+      method: 'GET',
+      params: {
+        team: '',
+        entity_name: name,
+        order_by: sortOrder?.field || 'modified',
+        ascending: sortOrder?.ascending ?? false,
+      },
+      credentials: 'include',
+    })
+    const list = Array.isArray(data) ? data : (data?.message ?? [])
+    rows = sortEntities(
+      prettyData(list.filter((k) => !k.file_name?.startsWith('.'))),
+      sortOrder
+    )
+  } catch {
+    rows = []
+  }
+  if (tokens[name] !== token || !folderChildren[name]) return
+  folderChildren[name].rows = rows
+  folderChildren[name].loading = false
+}
+
+function descendants(name, acc = []) {
+  for (const row of folderChildren[name]?.rows ?? []) {
+    acc.push(row.name)
+    if (folderChildren[row.name]) descendants(row.name, acc)
+  }
+  return acc
+}
+
+// Returns the names dropped from view, so the caller can deselect them.
+export function toggleFolder(row, sortOrder) {
+  const next = new Set(expandedFolders.value)
+  let collapsed = []
+  if (next.has(row.name)) {
+    collapsed = descendants(row.name)
+    for (const name of [row.name, ...collapsed]) {
+      next.delete(name)
+      delete folderChildren[name]
+    }
+  } else {
+    next.add(row.name)
+    if (!folderChildren[row.name]) {
+      folderChildren[row.name] = { rows: [], loading: true }
+      fetchChildren(row.name, sortOrder)
+    }
+  }
+  expandedFolders.value = next
+  return collapsed
+}
+
+export function refreshFolder(name, sortOrder) {
+  if (folderChildren[name]) fetchChildren(name, sortOrder)
+}
+
+export function refreshExpanded(sortOrder) {
+  Object.keys(folderChildren).forEach((name) => fetchChildren(name, sortOrder))
+}
+
+export function removeFromTree(names) {
+  Object.values(folderChildren).forEach((node) => {
+    node.rows = node.rows.filter(({ name }) => !names.includes(name))
+  })
+}
+
+export function resetTree() {
+  expandedFolders.value = new Set()
+  Object.keys(folderChildren).forEach((name) => delete folderChildren[name])
+}
+
+// Rows of an expanded folder render inline under it, so a flat list of rows
+// becomes a depth-tagged sequence. Keys are path-based: the same entity can
+// legitimately appear at two depths (e.g. a folder and its child both matching
+// in Favourites).
+export function flattenRows(rows, depth = 0, parentKey = '', out = []) {
+  for (const row of rows) {
+    const key = parentKey ? `${parentKey}>${row.name}` : row.name
+    out.push({ row, depth, key })
+    if (!row.is_folder || !expandedFolders.value.has(row.name)) continue
+    const node = folderChildren[row.name]
+    if (node?.loading)
+      for (let i = 0; i < Math.min(row.child_count || 1, MAX_SKELETONS); i++)
+        out.push({ placeholder: 'loading', depth: depth + 1, key: `${key}:loading:${i}` })
+    else if (!node?.rows.length)
+      out.push({ placeholder: 'empty', depth: depth + 1, key: `${key}:empty` })
+    else flattenRows(node.rows, depth + 1, key, out)
+  }
+  return out
+}
diff --git a/frontend/src/apps/drive/data/folderTree.test.ts b/frontend/src/apps/drive/data/folderTree.test.ts
new file mode 100644
index 0000000000..77408ba277
--- /dev/null
+++ b/frontend/src/apps/drive/data/folderTree.test.ts
@@ -0,0 +1,282 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+const mocks = vi.hoisted(() => ({ request: vi.fn() }))
+
+vi.mock('frappe-ui', () => ({ request: mocks.request }))
+vi.mock('@/apps/drive/utils/files', () => ({
+  prettyData: (rows: unknown[]) => rows,
+  sortEntities: (rows: { file_name?: string }[], order?: { ascending?: boolean }) =>
+    [...rows].sort((a, b) =>
+      (order?.ascending === false ? -1 : 1) *
+      (a.file_name ?? '').localeCompare(b.file_name ?? '')
+    ),
+}))
+
+import {
+  MAX_SKELETONS,
+  expandedFolders,
+  flattenRows,
+  folderChildren,
+  loadedChildRows,
+  refreshExpanded,
+  refreshFolder,
+  removeFromTree,
+  resetTree,
+  toggleFolder,
+} from './folderTree'
+
+type Row = {
+  name: string
+  file_name?: string
+  is_folder?: boolean
+  child_count?: number
+}
+
+const folder = (name: string, child_count = 3): Row => ({
+  name,
+  file_name: name,
+  is_folder: true,
+  child_count,
+})
+const file = (name: string): Row => ({ name, file_name: name })
+
+const flush = () => new Promise((resolve) => setTimeout(resolve, 0))
+
+beforeEach(() => {
+  resetTree()
+  mocks.request.mockReset()
+})
+
+describe('toggleFolder', () => {
+  it('expands, fetches children and exposes them as loaded rows', async () => {
+    mocks.request.mockResolvedValue([file('b'), file('a')])
+
+    toggleFolder(folder('parent'), { field: 'file_name', ascending: true })
+    expect(expandedFolders.value.has('parent')).toBe(true)
+    expect(folderChildren.parent.loading).toBe(true)
+
+    await flush()
+    expect(folderChildren.parent.loading).toBe(false)
+    expect(folderChildren.parent.rows.map((r) => r.name)).toEqual(['a', 'b'])
+    expect(loadedChildRows.value.map((r) => r.name)).toEqual(['a', 'b'])
+
+    const [{ params }] = mocks.request.mock.calls[0]
+    expect(params).toMatchObject({
+      entity_name: 'parent',
+      order_by: 'file_name',
+      ascending: true,
+    })
+  })
+
+  it('unwraps a message-envelope response and drops dotfiles', async () => {
+    mocks.request.mockResolvedValue({ message: [file('.hidden'), file('shown')] })
+
+    toggleFolder(folder('parent'))
+    await flush()
+
+    expect(folderChildren.parent.rows.map((r) => r.name)).toEqual(['shown'])
+  })
+
+  it('leaves an empty subtree behind when the fetch fails', async () => {
+    mocks.request.mockRejectedValue(new Error('403'))
+
+    toggleFolder(folder('parent'))
+    await flush()
+
+    expect(folderChildren.parent).toMatchObject({ rows: [], loading: false })
+  })
+
+  it('does not refetch a subtree that is already cached', async () => {
+    mocks.request.mockResolvedValue([file('a')])
+    toggleFolder(folder('parent'))
+    await flush()
+
+    toggleFolder(folder('parent')) // collapse
+    toggleFolder(folder('parent')) // expand again
+    await flush()
+    // The collapse drops the cache, so this is a fresh fetch — but only one.
+    expect(mocks.request).toHaveBeenCalledTimes(2)
+  })
+
+  it('collapsing drops the whole subtree and reports the hidden names', async () => {
+    mocks.request.mockResolvedValueOnce([file('child'), folder('nested')])
+    toggleFolder(folder('parent'))
+    await flush()
+
+    mocks.request.mockResolvedValueOnce([file('deep')])
+    toggleFolder(folder('nested'))
+    await flush()
+
+    const collapsed = toggleFolder(folder('parent'))
+
+    expect(collapsed.sort()).toEqual(['child', 'deep', 'nested'])
+    expect(expandedFolders.value.size).toBe(0)
+    expect(folderChildren.parent).toBeUndefined()
+    expect(folderChildren.nested).toBeUndefined()
+    expect(loadedChildRows.value).toEqual([])
+  })
+
+  it('ignores a stale response that resolves after a newer one', async () => {
+    let resolveFirst: (rows: Row[]) => void = () => {}
+    mocks.request.mockReturnValueOnce(
+      new Promise<Row[]>((resolve) => (resolveFirst = resolve))
+    )
+    toggleFolder(folder('parent'))
+
+    mocks.request.mockResolvedValueOnce([file('fresh')])
+    refreshFolder('parent')
+    await flush()
+    expect(folderChildren.parent.rows.map((r) => r.name)).toEqual(['fresh'])
+
+    resolveFirst([file('stale')])
+    await flush()
+    expect(folderChildren.parent.rows.map((r) => r.name)).toEqual(['fresh'])
+  })
+})
+
+describe('removeFromTree / resetTree', () => {
+  it('removes moved or deleted rows from every loaded subtree', async () => {
+    mocks.request.mockResolvedValue([file('a'), file('b')])
+    toggleFolder(folder('parent'))
+    await flush()
+
+    removeFromTree(['a'])
+    expect(folderChildren.parent.rows.map((r) => r.name)).toEqual(['b'])
+  })
+
+  it('moving a subfile out drops it from its old subtree and into the new one', async () => {
+    mocks.request.mockResolvedValueOnce([file('moved'), file('stays')])
+    toggleFolder(folder('source'))
+    await flush()
+    mocks.request.mockResolvedValueOnce([])
+    toggleFolder(folder('destination', 0))
+    await flush()
+
+    removeFromTree(['moved'])
+    expect(folderChildren.source.rows.map((r) => r.name)).toEqual(['stays'])
+
+    mocks.request.mockResolvedValueOnce([file('moved')])
+    refreshFolder('destination')
+    await flush()
+
+    expect(folderChildren.destination.rows.map((r) => r.name)).toEqual(['moved'])
+    expect(loadedChildRows.value.map((r) => r.name).sort()).toEqual([
+      'moved',
+      'stays',
+    ])
+  })
+
+  it('a failed move restores both subtrees from the server', async () => {
+    mocks.request.mockResolvedValueOnce([file('moved')])
+    toggleFolder(folder('source'))
+    await flush()
+
+    removeFromTree(['moved'])
+    expect(folderChildren.source.rows).toEqual([])
+
+    mocks.request.mockResolvedValueOnce([file('moved')])
+    refreshExpanded()
+    await flush()
+
+    expect(folderChildren.source.rows.map((r) => r.name)).toEqual(['moved'])
+  })
+
+  it('refreshFolder is a no-op for a folder that was never expanded', () => {
+    refreshFolder('unknown')
+    expect(mocks.request).not.toHaveBeenCalled()
+  })
+
+  it('resetTree clears expansion and cached children', async () => {
+    mocks.request.mockResolvedValue([file('a')])
+    toggleFolder(folder('parent'))
+    await flush()
+
+    resetTree()
+    expect(expandedFolders.value.size).toBe(0)
+    expect(loadedChildRows.value).toEqual([])
+  })
+})
+
+describe('flattenRows', () => {
+  it('leaves a collapsed list untouched at depth 0', () => {
+    const rows = [folder('parent'), file('loose')]
+    expect(flattenRows(rows)).toEqual([
+      { row: rows[0], depth: 0, key: 'parent' },
+      { row: rows[1], depth: 0, key: 'loose' },
+    ])
+  })
+
+  it('inlines children under their folder with an incremented depth', async () => {
+    mocks.request.mockResolvedValueOnce([file('child'), folder('nested')])
+    toggleFolder(folder('parent'))
+    await flush()
+    mocks.request.mockResolvedValueOnce([file('deep')])
+    toggleFolder(folder('nested'))
+    await flush()
+
+    const items = flattenRows([folder('parent'), file('loose')])
+
+    expect(items.map((i) => [i.row?.name ?? i.placeholder, i.depth])).toEqual([
+      ['parent', 0],
+      ['child', 1],
+      ['nested', 1],
+      ['deep', 2],
+      ['loose', 0],
+    ])
+  })
+
+  it('keys rows by path so the same entity can appear at two depths', async () => {
+    mocks.request.mockResolvedValue([file('dupe')])
+    toggleFolder(folder('parent'))
+    await flush()
+
+    const items = flattenRows([folder('parent'), file('dupe')])
+    const keys = items.map((i) => i.key)
+
+    expect(keys).toEqual(['parent', 'parent>dupe', 'dupe'])
+    expect(new Set(keys).size).toBe(keys.length)
+  })
+
+  it('shows one skeleton per known child while loading, capped', () => {
+    mocks.request.mockReturnValue(new Promise(() => {}))
+
+    toggleFolder(folder('small', 2))
+    let items = flattenRows([folder('small', 2)])
+    expect(items.filter((i) => i.placeholder === 'loading')).toHaveLength(2)
+    expect(items.every((i) => !i.row || i.depth === 0)).toBe(true)
+
+    toggleFolder(folder('huge', 500))
+    items = flattenRows([folder('huge', 500)])
+    expect(items.filter((i) => i.placeholder === 'loading')).toHaveLength(
+      MAX_SKELETONS
+    )
+  })
+
+  it('falls back to a single skeleton when the child count is unknown', () => {
+    mocks.request.mockReturnValue(new Promise(() => {}))
+    const unknown = { name: 'x', file_name: 'x', is_folder: true }
+
+    toggleFolder(unknown)
+    const items = flattenRows([unknown])
+
+    expect(items.filter((i) => i.placeholder === 'loading')).toHaveLength(1)
+  })
+
+  it('marks an expanded folder that turned out to be empty', async () => {
+    mocks.request.mockResolvedValue([])
+    toggleFolder(folder('parent'))
+    await flush()
+
+    const items = flattenRows([folder('parent')])
+    expect(items[1]).toMatchObject({ placeholder: 'empty', depth: 1 })
+  })
+
+  it('does not expand a non-folder row that shares a name with an expanded folder', async () => {
+    mocks.request.mockResolvedValue([file('a')])
+    toggleFolder(folder('parent'))
+    await flush()
+
+    const items = flattenRows([{ name: 'parent', file_name: 'parent' }])
+    expect(items).toHaveLength(1)
+  })
+})
diff --git a/frontend/src/apps/drive/data/selection.ts b/frontend/src/apps/drive/data/selection.ts
index 6f38a8a3a1..8ba75d3d12 100644
--- a/frontend/src/apps/drive/data/selection.ts
+++ b/frontend/src/apps/drive/data/selection.ts
@@ -5,3 +5,15 @@ export const activeEntity = ref<Record<string, unknown> | null>(null)
 export function setActiveEntity(entity: Record<string, unknown> | null) {
   activeEntity.value = entity
 }
+
+// Name of the entity currently being renamed inline in the list view; null when
+// no rename is in progress.
+export const renamingEntity = ref<string | null>(null)
+
+export function startRename(name: string | null) {
+  renamingEntity.value = name
+}
+
+export function stopRename() {
+  renamingEntity.value = null
+}
diff --git a/frontend/src/apps/drive/index.css b/frontend/src/apps/drive/index.css
deleted file mode 100644
index 7362935bac..0000000000
--- a/frontend/src/apps/drive/index.css
+++ /dev/null
@@ -1,65 +0,0 @@
-/*
- * Drive-local styles. The standalone main.js imported this globally; in the
- * suite, frappe-ui/style.css + the @tailwind layers are already loaded by the
- * shared global css (src/main.ts), so those directives are dropped here to
- * avoid duplicate/conflicting processing. This file is imported by DriveLayout
- * (module-scoped, not from the shared main.ts).
- */
-
-.scroll-shadow {
-  /* Credit: adapted from https://css-tricks.com/books/greatest-css-tricks/scroll-shadows/ */
-  background: linear-gradient(to bottom, white, rgba(255, 255, 255, 0)) top,
-    linear-gradient(to top, white, rgba(255, 255, 255, 0)) bottom,
-    linear-gradient(to bottom, rgba(0, 0, 0, 0.06), transparent) top,
-    linear-gradient(to top, rgba(0, 0, 0, 0.06), transparent) bottom;
-
-  background-repeat: no-repeat;
-  background-size: 100% 30px, 100% 30px, 100% 15px, 100% 15px;
-  background-attachment: local, local, scroll, scroll;
-}
-
-html {
-  scrollbar-width: auto;
-}
-
-html.theme-switching,
-html.theme-switching * {
-  transition: none !important;
-}
-
-*::-webkit-scrollbar-thumb {
-  background: #c0c6cc;
-  border-radius: 6px;
-}
-
-*::-webkit-scrollbar-track,
-*::-webkit-scrollbar-corner {
-  background: #ebeef0;
-}
-
-*::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
-}
-
-body::-webkit-scrollbar {
-  width: 12px;
-  height: 12px;
-}
-
-body {
-  overflow: hidden;
-}
-
-.fade-in-enter-active {
-  transition: opacity 300ms cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-
-.fade-in-leave-active {
-  transition: opacity 225ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
-}
-
-.fade-in-enter,
-.fade-in-leave-to {
-  opacity: 0;
-}
diff --git a/frontend/src/apps/drive/pages/Attachments.vue b/frontend/src/apps/drive/pages/Attachments.vue
index 78b52951f3..a5d6140999 100644
--- a/frontend/src/apps/drive/pages/Attachments.vue
+++ b/frontend/src/apps/drive/pages/Attachments.vue
@@ -14,8 +14,6 @@ import GenericPage from '@/apps/drive/components/GenericPage.vue'
 import { getAttachments } from '@/apps/drive/resources/files'
 import LucidePaperclip from '~icons/lucide/paperclip'
 import { watch } from 'vue'
-import { useRoute } from 'vue-router'
-import { setPageBreadcrumbs } from '@/apps/drive/data/breadcrumbs'
 
 const props = defineProps({
   doctype: {
@@ -27,8 +25,6 @@ const props = defineProps({
     required: false,
   },
 })
-const route = useRoute()
-
 watch(
   () => [props.doctype, props.docname],
   ([doctype, docname]) => {
@@ -37,25 +33,6 @@ watch(
       doctype,
       docname,
     }
-    setPageBreadcrumbs(
-      [
-        {
-          label: __(route.name.replace('drive-', '')),
-          name: route.name,
-          route: { name: route.name },
-        },
-        {
-          label: doctype,
-          name: doctype,
-          route: { name: route.name, params: { doctype } },
-        },
-        {
-          label: docname,
-          name: docname,
-          route: { name: route.name, params: { doctype, docname } },
-        },
-      ].filter((k) => k.label),
-    )
   },
   { immediate: true }
 )
diff --git a/frontend/src/apps/drive/pages/DriveLayout.vue b/frontend/src/apps/drive/pages/DriveLayout.vue
index 3eb909aaad..6e56869978 100644
--- a/frontend/src/apps/drive/pages/DriveLayout.vue
+++ b/frontend/src/apps/drive/pages/DriveLayout.vue
@@ -36,7 +36,6 @@ import { initSocket } from '@/apps/drive/socket'
 import { FrappeUIProvider } from 'frappe-ui'
 import { useRoute } from 'vue-router'
 import { setupTheme } from '@/utils/setupTheme'
-import '@/apps/drive/index.css'
 
 // Provided from the route-group layout since the suite main.ts is shared.
 provide('emitter', emitter)
diff --git a/frontend/src/apps/drive/pages/File.test.ts b/frontend/src/apps/drive/pages/File.test.ts
index 3e963827ec..6a063baa52 100644
--- a/frontend/src/apps/drive/pages/File.test.ts
+++ b/frontend/src/apps/drive/pages/File.test.ts
@@ -6,7 +6,7 @@ const mocks = vi.hoisted(() => ({
   routerPush: vi.fn(),
   trackVisit: vi.fn(),
   setActiveEntity: vi.fn(),
-  setBreadCrumbs: vi.fn(),
+  setCrumbEntity: vi.fn(),
   updateURLSlug: vi.fn(),
 }))
 
@@ -21,11 +21,14 @@ vi.mock('vue-router', () => ({ useRouter: () => ({ push: mocks.routerPush }) }))
 vi.mock('@vueuse/core', () => ({ onKeyStroke: vi.fn() }))
 vi.mock('~icons/lucide/scan', () => ({ default: defineComponent({ template: '<span />' }) }))
 vi.mock('@/apps/drive/data/selection', () => ({ setActiveEntity: mocks.setActiveEntity }))
-vi.mock('@/apps/drive/data/breadcrumbs', () => ({ pageBreadcrumbs: [] }))
+vi.mock('@/apps/drive/data/breadcrumbs', () => ({
+  pageBreadcrumbs: [],
+  setCrumbEntity: mocks.setCrumbEntity,
+  clearCrumbEntity: vi.fn(),
+}))
 vi.mock('@/apps/drive/data/currentFolder', () => ({ currentFolder: { value: { entities: [] } } }))
 vi.mock('@/apps/drive/utils/files', () => ({
   prettyData: (entities: unknown[]) => entities,
-  setBreadCrumbs: mocks.setBreadCrumbs,
   enterFullScreen: vi.fn(),
   updateURLSlug: mocks.updateURLSlug,
   isWriterDocument: () => false,
diff --git a/frontend/src/apps/drive/pages/File.vue b/frontend/src/apps/drive/pages/File.vue
index 6e121b1d73..2b4d04e1c7 100644
--- a/frontend/src/apps/drive/pages/File.vue
+++ b/frontend/src/apps/drive/pages/File.vue
@@ -18,7 +18,7 @@
         <Button
           :disabled="!prevEntity?.name"
           :variant="'ghost'"
-          icon="arrow-left"
+          icon="lucide-arrow-left"
           @click="scrollEntity(true)"
         />
         <Button :variant="'ghost'" @click="enterFullScreen">
@@ -27,7 +27,7 @@
         <Button
           :disabled="!nextEntity?.name"
           :variant="'ghost'"
-          icon="arrow-right"
+          icon="lucide-arrow-right"
           @click="scrollEntity()"
         />
       </div>
@@ -37,9 +37,13 @@
 
 <script setup>
 import { setActiveEntity } from '@/apps/drive/data/selection'
-import { pageBreadcrumbs } from '@/apps/drive/data/breadcrumbs'
+import {
+  pageBreadcrumbs,
+  setCrumbEntity,
+  clearCrumbEntity,
+} from '@/apps/drive/data/breadcrumbs'
 import Navbar from '@/apps/drive/components/Navbar.vue'
-import { ref, computed, onMounted, defineProps } from 'vue'
+import { ref, computed, onMounted, onUnmounted, defineProps } from 'vue'
 import { Button } from 'frappe-ui'
 import FileRender from '@/apps/drive/components/FileRender.vue'
 import FilePreviewSkeleton from '@/apps/drive/components/FileTypePreview/FilePreviewSkeleton.vue'
@@ -49,7 +53,6 @@ import LucideScan from '~icons/lucide/scan'
 import { onKeyStroke } from '@vueuse/core'
 import {
   prettyData,
-  setBreadCrumbs,
   enterFullScreen,
   updateURLSlug,
   isWriterDocument,
@@ -107,11 +110,13 @@ const onSuccess = async (entity) => {
     window.location.href = '/writer/w/' + entity.name
   }
   document.title = entity.file_name
-  setBreadCrumbs(entity)
+  setCrumbEntity(entity)
   updateURLSlug(entity.file_name)
   trackVisit.submit({ entity_name: entity.name })
 }
 
+onUnmounted(() => clearCrumbEntity(props.entityName))
+
 const trackVisit = createResource({
   url: 'suite.drive.api.files.track_visit',
 })
diff --git a/frontend/src/apps/drive/pages/Folder.vue b/frontend/src/apps/drive/pages/Folder.vue
index c8fcb46fc9..c6fdd75621 100644
--- a/frontend/src/apps/drive/pages/Folder.vue
+++ b/frontend/src/apps/drive/pages/Folder.vue
@@ -12,10 +12,11 @@
 
 <script setup>
 import GenericPage from '@/apps/drive/components/GenericPage.vue'
-import { watch, computed } from 'vue'
+import { watch, computed, onUnmounted } from 'vue'
 import { createResource } from 'frappe-ui'
 import { COMMON_OPTIONS } from '@/apps/drive/resources/files'
-import { setBreadCrumbs, prettyData, setCache, updateURLSlug } from '@/apps/drive/utils/files'
+import { prettyData, setCache, updateURLSlug } from '@/apps/drive/utils/files'
+import { setCrumbEntity, clearCrumbEntity } from '@/apps/drive/data/breadcrumbs'
 import { setCurrentFolder } from '@/apps/drive/data/currentFolder'
 import router from '@/apps/drive/router'
 import LucideFolderClosed from '~icons/lucide/folder-closed'
@@ -39,14 +40,16 @@ const getFolderContents = createResource({
   }),
   cache: ['folder', props.entityName],
 })
+getFolderContents.paginated = true
 setCache(getFolderContents, ['folder', props.entityName])
 
 const onSuccess = (entity) => {
   if (router.currentRoute.value.params.entityName !== entity.name) return
   document.title = 'Folder - ' + entity.file_name
-  setBreadCrumbs(entity)
+  setCrumbEntity(entity)
   updateURLSlug(entity.file_name)
 }
+onUnmounted(() => clearCrumbEntity(props.entityName))
 
 const entityName = computed(() => props.entityName)
 /** Permissions + metadata for the folder in the URL — not global state. */
diff --git a/frontend/src/apps/drive/pages/Notifications.vue b/frontend/src/apps/drive/pages/Notifications.vue
index d1463a3245..85120a1b36 100644
--- a/frontend/src/apps/drive/pages/Notifications.vue
+++ b/frontend/src/apps/drive/pages/Notifications.vue
@@ -1,26 +1,23 @@
 <template>
   <div class="bg-surface-base border-b w-full px-5 py-2.5 h-12 flex items-center justify-between">
-    <div class="bg-surface-gray-2 rounded-[10px] space-x-0.5 h-7 flex items-center px-0.5 py-1">
-      <TabButtons
-        v-model="onlyUnread"
-        :options="[
-          {
-            label: 'Unread',
-            value: true,
-          },
-          { label: 'All', value: false },
-        ]"
-      />
-    </div>
-    <div>
+    <TabButtons
+      v-model="onlyUnread"
+      :options="[
+        {
+          label: 'Unread',
+          value: true,
+        },
+        { label: 'All', value: false },
+      ]"
+    />
+    <div class="flex items-center gap-2">
       <Button
         :loading="notifications.loading"
-        icon="refresh-ccw"
-        class="mr-2"
+        icon="lucide-refresh-ccw"
         @click="notifications.reload()"
       />
       <Button
-        icon-left="check-circle"
+        icon-left="lucide-check-circle"
         @click="markAllRead"
       >
         Mark all as read
@@ -28,14 +25,37 @@
     </div>
   </div>
   <DriveListSkeleton v-if="!notifications.data" />
-  <ListView
+  <List
     v-else-if="notifications.data.length"
     class="px-5 pt-5"
-    :columns="columns"
-    :options="options"
-    :rows="notifications.data"
-    row-key="name"
-  />
+    :row-height="44"
+  >
+    <ListRow
+      v-for="row in notifications.data"
+      :key="row.name"
+      :value="row.name"
+      @click="onRowClick(row)"
+    >
+      <ListCell class="w-20 shrink-0">
+        <span class="truncate text-sm text-ink-gray-6">{{ row.type }}</span>
+      </ListCell>
+      <ListCell>
+        <div class="flex items-center gap-2 min-w-0">
+          <Avatar
+            v-if="row.from_user"
+            shape="circle"
+            :label="row.from_user"
+            :image="row.user_image"
+            size="sm"
+          />
+          <span class="truncate text-p-base text-ink-gray-7">{{ row.message }}</span>
+        </div>
+      </ListCell>
+      <ListCell class="justify-end shrink-0">
+        <span class="text-sm text-ink-gray-5">{{ row.relativeTime }}</span>
+      </ListCell>
+    </ListRow>
+  </List>
   <NoFilesSection
     v-else
     :icon="LucideInbox"
@@ -44,9 +64,11 @@
   />
 </template>
 <script setup>
-import { ref, h, watch } from 'vue'
+import { ref, watch } from 'vue'
 import { formatTimeAgo } from '@vueuse/core'
-import { createResource, Avatar, ListView, TabButtons, Button} from 'frappe-ui'
+import { createResource, Avatar, TabButtons, Button } from 'frappe-ui'
+import { List, ListRow, ListCell } from 'frappe-ui/list'
+import { useRouter } from 'vue-router'
 import { notifCount } from '@/apps/drive/resources/permissions'
 import NoFilesSection from '@/apps/drive/components/NoFilesSection.vue'
 import DriveListSkeleton from '@/apps/drive/components/DriveListSkeleton.vue'
@@ -54,55 +76,23 @@ import { formatDate } from '@/apps/drive/utils/format'
 import emitter from '@/apps/drive/emitter'
 import LucideInbox from '~icons/lucide/inbox'
 
+const router = useRouter()
 const onlyUnread = ref(true)
-const options = {
-  getRowRoute: (row) =>
-    row.entity_type
-      ? {
-          name: 'drive-' + row.entity_type,
-          params: { entityName: row.notif_doctype_name },
-        }
-      : null,
-  onRowClick: (row) => {
-    if (row.type === 'Team') emitter.emit('showSettings', 'teams')
-    if (onlyUnread.value) {
-      markAsRead.submit({ name: row.name })
-      if (notifCount.data > 0) notifCount.setData(notifCount.data - 1)
-    }
-  },
-  selectable: false,
-  showTooltip: true,
-  resizeColumn: false,
-}
 
-const columns = [
-  {
-    label: 'Subject',
-    key: 'subject',
-    width: '80px',
-    getLabel: ({ row }) => row.type,
-  },
-  {
-    label: 'Message',
-    key: 'message',
-    width: 4,
-    getLabel: ({ row }) => row.message,
-    prefix: ({ row }) => {
-      if (row.from_user)
-        return h(Avatar, {
-          shape: 'circle',
-          label: row.from_user,
-          image: row.user_image,
-          size: 'sm',
-        })
-    },
-  },
-  {
-    key: 'creation',
-    align: 'end',
-    getLabel: ({ row }) => row.relativeTime,
-  },
-]
+function onRowClick(row) {
+  if (row.type === 'Team') emitter.emit('showSettings', 'teams')
+  if (!row.read) {
+    row.read = 1
+    markAsRead.submit({ name: row.name })
+    if (notifCount.data > 0) notifCount.setData(notifCount.data - 1)
+  }
+  if (row.entity_type) {
+    router.push({
+      name: 'drive-' + row.entity_type,
+      params: { entityName: row.notif_doctype_name },
+    })
+  }
+}
 
 watch(onlyUnread, (newValue) => {
   notifications.fetch({
diff --git a/frontend/src/apps/drive/pages/Team.vue b/frontend/src/apps/drive/pages/Team.vue
index 1f8f4a1a14..db75add5c5 100644
--- a/frontend/src/apps/drive/pages/Team.vue
+++ b/frontend/src/apps/drive/pages/Team.vue
@@ -19,7 +19,6 @@
 import GenericPage from '@/apps/drive/components/GenericPage.vue'
 import { getTeam, getTeams, getPublicTeams } from '@/apps/drive/resources/files'
 import { useSessionStore } from '@/boot/session'
-import { setPageBreadcrumbs } from '@/apps/drive/data/breadcrumbs'
 import { setCurrentFolder } from '@/apps/drive/data/currentFolder'
 import { useRoute } from 'vue-router'
 import LucideBuilding2 from '~icons/lucide/building-2'
@@ -43,18 +42,5 @@ const write = computed(
     teamData.value?.users?.find((k) => k.user === useSessionStore().user)
       ?.access_level > 0
 )
-watch(() => getPublicTeams.data, console.log)
 if (!getPublicTeams.data) getPublicTeams.fetch()
-watch(
-  teamData,
-  (t) =>
-    t &&
-    setPageBreadcrumbs([
-      {
-        label: t.title,
-        name: t.name,
-      },
-    ]),
-  { immediate: true }
-)
 </script>
diff --git a/frontend/src/apps/drive/resources/files.js b/frontend/src/apps/drive/resources/files.js
index f57219f371..9674b97d7c 100644
--- a/frontend/src/apps/drive/resources/files.js
+++ b/frontend/src/apps/drive/resources/files.js
@@ -2,12 +2,18 @@ import { createResource } from 'frappe-ui'
 import { toast } from '@/apps/drive/utils/toasts'
 import { openEntity, setTitle } from '@/apps/drive/utils/files'
 import { activeEntity } from '@/apps/drive/data/selection'
-import { updateLastBreadcrumbLabel } from '@/apps/drive/data/breadcrumbs'
+import { renameCrumbEntity } from '@/apps/drive/data/breadcrumbs'
 import { getSortOrder } from '@/apps/drive/data/prefs'
-import { prettyData, setCache } from '@/apps/drive/utils/files'
+import {
+  prettyData,
+  setCache,
+  PRESENTATION_CONTENT_DOCTYPE,
+} from '@/apps/drive/utils/files'
 import { updateURLSlug } from '@/apps/drive/utils/files'
 
 // GETTERS
+export const PAGE_SIZE = 50
+
 export const COMMON_OPTIONS = {
   method: 'GET',
   debounce: 500,
@@ -107,6 +113,8 @@ export const getSlides = createResource({
   transform(data) {
     data = data.map((k) => ({
       ...k,
+      file_name: k.title,
+      content_doctype: PRESENTATION_CONTENT_DOCTYPE,
       mime_type: 'frappe/slides',
       file_type: 'Presentation',
       path: k.name,
@@ -136,6 +144,18 @@ export const getTrash = createResource({
   },
 })
 
+;[
+  getTeam,
+  getFiles,
+  getPersonal,
+  getSiteFiles,
+  getRecents,
+  getFavourites,
+  getDocuments,
+  getShared,
+  getTrash,
+].forEach((r) => (r.paginated = true))
+
 // SETTERS
 export const LISTS = [
   getPersonal,
@@ -196,8 +216,8 @@ export const toggleFav = createResource({
     const entity_names = data.entities.map(({ name }) => name)
     getFavourites.setData((d) => {
       return data.entities[0].is_favourite
-        ? [...d, ...data.entities]
-        : d.filter(({ name }) => !entity_names.includes(name))
+        ? [...(d ?? []), ...data.entities]
+        : (d ?? []).filter(({ name }) => !entity_names.includes(name))
     })
     mutate(
       data.entities,
@@ -232,10 +252,7 @@ export const clearRecent = createResource({
     }
   },
   onError: () => {
-    toast({
-      message: 'There was an error while clearing recents.',
-      type: 'error',
-    })
+    toast.error('There was an error while clearing recents.')
   },
 })
 
@@ -256,10 +273,7 @@ export const clearTrash = createResource({
     )
   },
   onError(error) {
-    toast({
-      text: JSON.stringify(error),
-      error: true,
-    })
+    toast.error(JSON.stringify(error))
   },
 })
 
@@ -272,10 +286,7 @@ export const rename = createResource({
     }
   },
   onSuccess: () => {
-    updateLastBreadcrumbLabel(
-      rename.params.new_title,
-      rename.params.entity_name,
-    )
+    renameCrumbEntity(rename.params.entity_name, rename.params.new_title)
     if (activeEntity.value?.name === rename.params.entity_name) {
       activeEntity.value.file_name = rename.params.new_title
       activeEntity.value.modified = new Date()
@@ -284,12 +295,7 @@ export const rename = createResource({
     updateURLSlug(rename.params.new_title)
   },
   onError(error) {
-    toast({
-      title: error.messages[error.messages.length - 1],
-      position: 'bottom-right',
-      type: 'error',
-      timeout: 2,
-    })
+    toast.error(error.messages[error.messages.length - 1], { duration: 2000 })
   },
 })
 
@@ -309,25 +315,18 @@ export const createSheet = createResource({
 export const move = createResource({
   url: 'suite.drive.api.files.move',
   onSuccess(data) {
-    toast({
-      title: 'Moved to ' + data.file_name,
-      buttons: [
-        {
-          label: 'Go',
-          onClick: () =>
-            openEntity({
-              name: data.name,
-              is_folder: true,
-            }),
-        },
-      ],
+    toast('Moved to ' + data.file_name, {
+      action: {
+        label: 'Go',
+        onClick: () => openEntity({ name: data.name, is_folder: true }),
+      },
     })
 
     // Update moved-into folder
     updateMoved(data.team, data.name)
   },
-  onError() {
-    toast({ title: 'There was an error.', type: 'error' })
+  onError(error) {
+    toast.error(error?.messages?.at(-1) || 'Could not move this file.')
   },
 })
 
diff --git a/frontend/src/apps/drive/resources/permissions.js b/frontend/src/apps/drive/resources/permissions.js
index 620e6b9873..c4310e9100 100644
--- a/frontend/src/apps/drive/resources/permissions.js
+++ b/frontend/src/apps/drive/resources/permissions.js
@@ -11,7 +11,7 @@ export const usersWithAccess = createResource({
 export const updateAccess = createResource({
   url: 'suite.drive.api.files.share',
   makeParams: (params) => ({ ...params, method: params.method || 'share' }),
-  onError: (error) => toast({ type: 'error', title: error.messages[0] }),
+  onError: (error) => toast.error(error.messages[0]),
 })
 
 export const notifCount = createResource({
diff --git a/frontend/src/apps/drive/routes.ts b/frontend/src/apps/drive/routes.ts
index 5366aea0a3..d1a0bd9cb2 100644
--- a/frontend/src/apps/drive/routes.ts
+++ b/frontend/src/apps/drive/routes.ts
@@ -2,10 +2,6 @@ import type { RouteRecordRaw } from 'vue-router'
 import { createResource } from 'frappe-ui'
 
 import { useSessionStore } from '@/boot/session'
-import {
-  pageBreadcrumbs,
-  setPageBreadcrumbs,
-} from '@/apps/drive/data/breadcrumbs'
 import { translate } from '@/apps/drive/resources/files'
 import { setupTheme } from '@/utils/setupTheme'
 
@@ -27,26 +23,9 @@ import { setupTheme } from '@/utils/setupTheme'
  * router.ts.
  */
 
-const manageBreadcrumbs = (to: any) => {
-  if (
-    pageBreadcrumbs.value[pageBreadcrumbs.value.length - 1]?.name !==
-    to.params.entityName
-  ) {
-    setPageBreadcrumbs({ loading: true, name: to.params.entityName })
-  }
-}
-
-const setRootBreadCrumb = (to: any) => {
+const setPageTitle = (to: any) => {
   if (useSessionStore().isLoggedIn) {
     document.title = __(String(to.name).replace(/^drive-/, ''))
-    if (to.name !== 'drive-Team')
-      setPageBreadcrumbs([
-        {
-          label: __(String(to.name).replace(/^drive-/, '')),
-          name: to.name,
-          route: to.path,
-        },
-      ])
   }
 }
 
@@ -73,62 +52,63 @@ export const routes: RouteRecordRaw[] = [
         path: '',
         name: 'drive-Home',
         component: () => import('@/apps/drive/pages/Personal.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
         props: true,
       },
       {
         path: 'inbox',
         name: 'drive-Inbox',
         component: () => import('@/apps/drive/pages/Notifications.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
       },
       {
         path: 'teams',
         name: 'drive-Teams',
         component: () => import('@/apps/drive/pages/Teams.vue'),
+        beforeEnter: [setPageTitle],
       },
       {
         path: 'recents',
         name: 'drive-Recents',
         component: () => import('@/apps/drive/pages/Recents.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
       },
       {
         path: 'favourites',
         name: 'drive-Favourites',
         component: () => import('@/apps/drive/pages/Favourites.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
       },
       {
         path: 'shared',
         name: 'drive-Shared',
         component: () => import('@/apps/drive/pages/Shared.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
       },
       {
         path: 'attachments/:doctype?/:docname?',
         name: 'drive-Attachments',
         props: true,
         component: () => import('@/apps/drive/pages/Attachments.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
       },
       {
         path: 'documents',
         name: 'drive-Documents',
         component: () => import('@/apps/drive/pages/Documents.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
       },
       {
         path: 'presentations',
         name: 'drive-Presentations',
         component: () => import('@/apps/drive/pages/Slides.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
       },
       {
         path: 'trash',
         name: 'drive-Trash',
         component: () => import('@/apps/drive/pages/Trash.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
       },
       {
         path: 'g/:entityName/',
@@ -158,7 +138,7 @@ export const routes: RouteRecordRaw[] = [
         path: 't/:team/',
         name: 'drive-Team',
         component: () => import('@/apps/drive/pages/Team.vue'),
-        beforeEnter: [setRootBreadCrumb],
+        beforeEnter: [setPageTitle],
         props: true,
         meta: { allowGuest: true },
       },
@@ -167,7 +147,6 @@ export const routes: RouteRecordRaw[] = [
         name: 'drive-File',
         component: () => import('@/apps/drive/pages/File.vue'),
         meta: { allowGuest: true, filePage: true },
-        beforeEnter: [manageBreadcrumbs],
         props: true,
       },
       {
@@ -175,7 +154,6 @@ export const routes: RouteRecordRaw[] = [
         name: 'drive-Folder',
         component: () => import('@/apps/drive/pages/Folder.vue'),
         meta: { allowGuest: true },
-        beforeEnter: [manageBreadcrumbs],
         props: true,
       },
       {
diff --git a/frontend/src/apps/drive/sdk.js b/frontend/src/apps/drive/sdk.js
index beec3867a2..8ce9482251 100644
--- a/frontend/src/apps/drive/sdk.js
+++ b/frontend/src/apps/drive/sdk.js
@@ -10,7 +10,6 @@ import { call } from 'frappe-ui'
 export { default as ShareDialog } from '@/apps/drive/ui/drive/components/ShareDialog.vue'
 export { default as MoveDialog } from '@/apps/drive/ui/drive/components/MoveDialog.vue'
 export { default as InfoDialog } from '@/apps/drive/ui/drive/components/InfoDialog.vue'
-export { default as RenameDialog } from '@/apps/drive/ui/drive/components/RenameDialog.vue'
 
 export { getFileLink, prettyData, copyToClipboard } from '@/apps/drive/ui/drive/js/utils'
 export {
diff --git a/frontend/src/apps/drive/ui/drive/components/MoveDialog.vue b/frontend/src/apps/drive/ui/drive/components/MoveDialog.vue
index f6133e8b4f..31829056a5 100644
--- a/frontend/src/apps/drive/ui/drive/components/MoveDialog.vue
+++ b/frontend/src/apps/drive/ui/drive/components/MoveDialog.vue
@@ -1,7 +1,7 @@
 <template>
   <Dialog v-model:open="open" size="lg" @close="dialogType = ''">
-    <template #body-main>
-      <div class="px-4 pt-5 pb-6 sm:px-6">
+    <template #default>
+      <div>
         <div class="text-2xl-semibold flex text-nowrap overflow-hidden pr-8 mb-4">
           <template v-if="props.entities.length > 1">
             Moving {{ props.entities.length }} items
@@ -20,8 +20,10 @@
               <TeamSelector v-if="tabIndex === 1" v-model="chosenTeam" class="mb-2" />
               <Tree v-if="tree.children.length" :nodes="tree.children" node-key="value" guides="none">
                 <template #item="{ node, expanded, hasChildren, toggle }">
-                  <div class="group grow min-w-0 flex items-center gap-2"
-                    :class="entities[0].folder === node.value ? 'cursor-not-allowed' : 'cursor-pointer'"
+                  <div class="group grow min-w-0 flex items-center gap-2 rounded-md px-1 -mx-1"
+                    :class="entities[0].folder === node.value
+                      ? 'cursor-not-allowed'
+                      : 'cursor-pointer hover:bg-surface-gray-2'"
                     @click.stop="openEntity(node)">
                     <button v-if="hasChildren" class="flex shrink-0 text-ink-gray-5 hover:text-ink-gray-8"
                       @click.stop="
@@ -95,12 +97,18 @@
                 <span v-if="breadcrumbs.length > 1 && index > 0" class="text-ink-gray-5 mx-0.5">
                   {{ '/' }}
                 </span>
-                <button class="text-base cursor-pointer truncate max-w-20" :title="crumb.file_name" :class="index === slicedBreadcrumbs.length - 1
-                    ? 'text-ink-gray-9 text-base font-medium p-1'
-                    : 'text-ink-gray-5 text-base rounded-[6px] hover:bg-surface-gray-2 p-1'
-                  " @click="closeEntity(crumb.name)">
-                  {{ crumb.file_name }}
-                </button>
+                <Button
+                  variant="ghost"
+                  size="sm"
+                  :label="crumb.file_name"
+                  :title="crumb.file_name"
+                  class="truncate max-w-20"
+                  :class="index === slicedBreadcrumbs.length - 1
+                    ? 'text-ink-gray-9 font-medium'
+                    : 'text-ink-gray-5'
+                  "
+                  @click="closeEntity(crumb.name)"
+                />
               </div>
             </div>
           </div>
@@ -163,6 +171,22 @@ const open = ref(true)
 const route = useRoute()
 const tabIndex = ref(route.name == 'drive-Home' ? 0 : 1)
 const chosenTeam = ref(route.params.team || '')
+
+// Reopen at the folder the user last moved into this session, so repeated moves
+// to the same place don't start from root each time. Only restore it when it
+// belongs to the team we're currently browsing — the dialog always respects the
+// current team context.
+const LAST_MOVE_KEY = 'drive:last-move-dest'
+const lastMoveParent = (() => {
+  try {
+    const saved = JSON.parse(sessionStorage.getItem(LAST_MOVE_KEY) || 'null')
+    if (!saved || typeof saved !== 'object') return ''
+    if ((saved.team || '') !== chosenTeam.value) return ''
+    return saved.parent || ''
+  } catch {
+    return ''
+  }
+})()
 const tree = reactive({
   name: '',
   label: 'Home',
@@ -243,6 +267,18 @@ const selectedPerms = createResource({
     ]
     breadcrumbs.value = first.concat(data.breadcrumbs.slice(1))
   },
+  onError: () => {
+    // Remembered folder is gone or inaccessible — fall back to the root.
+    selected.value = ''
+    breadcrumbs.value = [
+      {
+        name: '',
+        file_name: chosenTeam.value
+          ? getTeams.data?.[chosenTeam.value]?.title || 'Team'
+          : 'Home',
+      },
+    ]
+  },
 })
 
 watch(
@@ -276,6 +312,13 @@ watch(
   { immediate: true },
 )
 
+// Preselect the last move destination (the immediate watch above resets to root
+// first). Breadcrumbs are filled in by selectedPerms.onSuccess.
+if (lastMoveParent) {
+  selected.value = lastMoveParent
+  selectedPerms.fetch({ entity_name: lastMoveParent })
+}
+
 // Breadcrumb logic
 const slicedBreadcrumbs = computed(() => {
   if (breadcrumbs.value.length > 3) {
@@ -357,6 +400,14 @@ const moveFile = async () => {
     new_parent: selected.value,
     team: chosenTeam.value,
   })
+  try {
+    sessionStorage.setItem(
+      LAST_MOVE_KEY,
+      JSON.stringify({ team: chosenTeam.value, parent: selected.value }),
+    )
+  } catch {
+    // sessionStorage unavailable — non-fatal.
+  }
   open.value = false
   emit('complete')
 }
diff --git a/frontend/src/apps/drive/ui/drive/components/RenameDialog.vue b/frontend/src/apps/drive/ui/drive/components/RenameDialog.vue
deleted file mode 100644
index ca368b7527..0000000000
--- a/frontend/src/apps/drive/ui/drive/components/RenameDialog.vue
+++ /dev/null
@@ -1,68 +0,0 @@
-<template>
-  <Dialog v-model:open="open" title="Rename" size="xs" :actions="[
-    {
-      label: 'Confirm',
-      variant: 'solid',
-      disabled: !newTitle || newTitle === entity.file_name || rename.loading,
-      onClick: submit,
-    },
-  ]" @close="dialogType = ''">
-    <div class="flex gap-3">
-      <FormControl v-model="newTitle" autofocus class="grow" type="text" @keyup.enter="submit" />
-      <div v-if="file_ext" disabled
-        class="w-12 text-ink-gray-7 bg-surface-gray-2 rounded text-center self-center py-1.5 text-sm">
-        {{ file_ext }}
-      </div>
-    </div>
-  </Dialog>
-</template>
-
-<script setup>
-import { ref } from 'vue'
-import { Dialog, FormControl } from 'frappe-ui'
-import { rename } from '../js/resources'
-
-const props = defineProps({ entity: Object, modelValue: String })
-const emit = defineEmits(['success', 'complete'])
-const dialogType = defineModel()
-const open = ref(true)
-
-const newTitle = ref('')
-const file_ext = ref('')
-
-const keepWhole =
-  props.entity.is_folder ||
-  ['Document', 'Markdown', 'Link'].includes(props.entity.file_type)
-if (keepWhole) {
-  newTitle.value = props.entity.file_name
-} else {
-  const parts = props.entity.file_name.split('.')
-  if (parts.length > 1) {
-    newTitle.value = parts.slice(0, -1).join('.')
-    file_ext.value = parts[parts.length - 1]
-  } else {
-    newTitle.value = parts[0]
-  }
-}
-
-const submit = () => {
-  const formattedTitle =
-    newTitle.value + (file_ext.value ? '.' + file_ext.value : '')
-  rename.submit(
-    {
-      entity_name: props.entity.name,
-      new_title: formattedTitle,
-    },
-    {
-      onSuccess: () => {
-        open.value = false
-        emit('complete')
-      },
-    },
-  )
-  emit('success', {
-    name: props.entity.name,
-    file_name: formattedTitle,
-  })
-}
-</script>
diff --git a/frontend/src/apps/drive/ui/drive/index.js b/frontend/src/apps/drive/ui/drive/index.js
index 2d2120e8e9..e57df851ec 100644
--- a/frontend/src/apps/drive/ui/drive/index.js
+++ b/frontend/src/apps/drive/ui/drive/index.js
@@ -1,5 +1,4 @@
 export { default as ShareDialog } from './components/ShareDialog.vue'
 export { default as MoveDialog } from './components/MoveDialog.vue'
 export { default as InfoDialog } from './components/InfoDialog.vue'
-export { default as RenameDialog } from './components/RenameDialog.vue'
 export { default as TeamSelector } from './components/TeamSelector.vue'
diff --git a/frontend/src/apps/drive/ui/drive/js/resources.js b/frontend/src/apps/drive/ui/drive/js/resources.js
index a05cdebfa4..6221b7a332 100644
--- a/frontend/src/apps/drive/ui/drive/js/resources.js
+++ b/frontend/src/apps/drive/ui/drive/js/resources.js
@@ -57,6 +57,6 @@ export const rename = createResource({
     }
   },
   onError(error) {
-    toast.error(error)
+    toast.error(error.messages?.at(-1) || 'Could not rename this file.')
   },
 })
diff --git a/frontend/src/apps/drive/utils/confirmActions.js b/frontend/src/apps/drive/utils/confirmActions.js
new file mode 100644
index 0000000000..333bfa2ac8
--- /dev/null
+++ b/frontend/src/apps/drive/utils/confirmActions.js
@@ -0,0 +1,115 @@
+import { dialog, call, toast } from 'frappe-ui'
+import { useTimeAgo } from '@vueuse/core'
+import { getTrash, toggleFav, clearRecent, clearTrash } from '@/apps/drive/resources/files.js'
+import { sortEntities } from '@/apps/drive/utils/files.js'
+
+function itemString(entities) {
+  return entities.length === 1 ? 'an item' : `${entities.length} items`
+}
+
+function entityLabel(entities) {
+  return entities.length > 1 ? 'These items' : `"${entities[0].file_name}"`
+}
+
+function entityNames(entities) {
+  return JSON.stringify(entities.map((entity) => entity.name))
+}
+
+export function confirmRestore(entities, { onSuccess } = {}) {
+  const label = itemString(entities)
+  dialog.confirm({
+    title: `Restore ${label}`,
+    message: `${entityLabel(entities)} will be restored to ${
+      entities.length === 1 ? 'its original location' : 'their original locations'
+    }.`,
+    confirmLabel: 'Restore',
+    onConfirm: async () => {
+      await call('suite.drive.api.files.remove_or_restore', {
+        entity_names: entityNames(entities),
+      })
+      const names = entities.map((entity) => entity.name)
+      getTrash.setData((d) => (d ?? []).filter((k) => !names.includes(k.name)))
+      toast.success(`Restored ${label}.`)
+      onSuccess?.()
+    },
+  })
+}
+
+export function confirmRemove(entities, { onSuccess } = {}) {
+  const label = itemString(entities)
+  dialog.confirm({
+    title: `Move ${label} to Trash`,
+    message: `${entityLabel(entities)} will be moved to Trash. Items in trash are deleted forever after 30 days.`,
+    confirmLabel: 'Move to Trash',
+    theme: 'red',
+    onConfirm: async () => {
+      await call('suite.drive.api.files.remove_or_restore', {
+        entity_names: entityNames(entities),
+      })
+      // Only patch the trash cache if it was ever fetched — `data` is null
+      // until the user opens Trash, and spreading that throws.
+      if (getTrash.data)
+        getTrash.setData(
+          sortEntities([
+            ...getTrash.data,
+            ...entities.map((entity) => {
+              entity.modified = Date()
+              entity.relativeModified = useTimeAgo(entity.modified)
+              return entity
+            }),
+          ]),
+        )
+      toast.success(`Moved ${label} to Trash.`)
+      onSuccess?.()
+    },
+  })
+}
+
+export function confirmDeleteForever(entities, { onSuccess } = {}) {
+  const label = itemString(entities)
+  dialog.danger({
+    title: `Delete ${label}`,
+    message: `${entityLabel(entities)} will be deleted — you can no longer access it. This is an irreversible action.`,
+    confirmLabel: 'Delete forever',
+    onConfirm: async () => {
+      await call('suite.drive.api.files.delete_entities', {
+        entity_names: entityNames(entities),
+      })
+      toast.success(`Deleted ${label}.`)
+      onSuccess?.()
+    },
+  })
+}
+
+export function confirmClearRecents() {
+  dialog.confirm({
+    title: 'Are you sure?',
+    message: 'All your recently viewed files will be cleared.',
+    confirmLabel: 'Clear',
+    onConfirm: async () => {
+      await clearRecent.submit()
+    },
+  })
+}
+
+export function confirmClearFavourites() {
+  dialog.confirm({
+    title: 'Are you sure?',
+    message: 'All your favourite items will be cleared.',
+    confirmLabel: 'Clear',
+    onConfirm: async () => {
+      await toggleFav.submit()
+    },
+  })
+}
+
+export function confirmClearTrash() {
+  dialog.danger({
+    title: 'Clear your Trash',
+    message: 'All items in your Trash will be deleted forever. This is an irreversible process.',
+    confirmLabel: 'Delete',
+    onConfirm: async () => {
+      await clearTrash.submit()
+    },
+  })
+}
diff --git a/frontend/src/apps/drive/utils/download.js b/frontend/src/apps/drive/utils/download.js
index 4603268029..efd84845f9 100644
--- a/frontend/src/apps/drive/utils/download.js
+++ b/frontend/src/apps/drive/utils/download.js
@@ -24,7 +24,7 @@ async function prepareArchive(entities) {
   try {
     ;({ token } = await call('suite.drive.api.files.download_folder', { entities: names }))
   } catch (error) {
-    toast({ title: error?.message || 'Download failed', type: 'error' })
+    toast.error(error?.message || 'Download failed')
     return
   }
 
diff --git a/frontend/src/apps/drive/utils/files.js b/frontend/src/apps/drive/utils/files.js
index 31de942e07..0270eaf2b7 100644
--- a/frontend/src/apps/drive/utils/files.js
+++ b/frontend/src/apps/drive/utils/files.js
@@ -1,16 +1,7 @@
 import router from '@/apps/drive/router'
 
-import {
-  appendBreadcrumb,
-  applyBreadCrumbs,
-  isHomeContext,
-} from '@/apps/drive/data/breadcrumbs'
+import { isHomeContext } from '@/apps/drive/data/breadcrumbs'
 import { currentFolder } from '@/apps/drive/data/currentFolder'
-
-export {
-  applyBreadCrumbs as setBreadCrumbs,
-  buildBreadCrumbs,
-} from '@/apps/drive/data/breadcrumbs'
 import { formatSize } from '@/apps/drive/utils/format'
 import { nextTick } from 'vue'
 import { useTimeAgo } from '@vueuse/core'
@@ -135,16 +126,6 @@ export const openEntity = (entity, new_tab = false) => {
   if (new_tab) {
     return window.open(getFileLink(entity, false), '_blank')
   }
-  if (!['Link', 'Presentation'].includes(entity.file_type) && !isSheet(entity)) {
-    if (!entity.breadcrumbs?.length)
-      appendBreadcrumb({
-        label: entity.file_name,
-        name: entity.name,
-        route: null,
-      })
-    else applyBreadCrumbs(entity)
-  }
-
   // hm?
   if (entity.name === '') {
     router.push({
@@ -254,10 +235,22 @@ export const sortEntities = (rows, order) => {
   // Mutates directly
   const field = order.field
   const asc = order.ascending ? 1 : -1
+  // Nullish sorts last either way — `>` is false in both directions against it
+  const compare = (x, y) => {
+    if (x == null || y == null) return x == y ? 0 : x == null ? 1 : -1
+    return x === y ? 0 : x > y ? 1 : -1
+  }
   rows.sort((a, b) => {
-    return a[field] == b[field] ? 0 : a[field] > b[field] ? asc : -asc
+    // Folders have no byte size, so they sink below files and sort by count
+    if (field === 'file_size' && a.is_folder !== b.is_folder)
+      return a.is_folder ? 1 : -1
+    const sortField =
+      field === 'file_size' && a.is_folder ? 'child_count' : field
+    const primary = compare(a[sortField], b[sortField])
+    if (primary) return primary * asc
+    return compare(a.file_name, b.file_name) * asc
   })
-  if (order.smart) {
+  if (order.smart && field === 'file_name') {
     rows.sort((a, b) => {
       const [endA, endB] = trimCommonPrefix(a.file_name, b.file_name)
       if (!endA) return 0
@@ -471,12 +464,18 @@ const copyToClipboard = (str) => {
 export async function updateURLSlug(file_name) {
   const route = router.currentRoute.value
   await nextTick()
+  // Only the folder/file pages carry a `:slug` segment. Guard against callers
+  // firing on other pages (e.g. rename from a list view), where appending a
+  // slug would produce a bogus path like `/drive/<slug>` that matches no route.
+  if (!['drive-Folder', 'drive-File'].includes(route.name)) return
   const slug = slugger(file_name)
   if (route.params.slug !== slug) {
-    // Hacky, but we only want to update the URL - triggering a reload breaks a lot
+    // Hacky, but we only want to update the URL - triggering a reload breaks a lot.
+    // Preserve the existing history state so vue-router's back/forward tracking
+    // isn't wiped.
     const base = window.location.pathname.split('/').slice(0, 4).join('/')
     const new_path = base + (base.endsWith('/') ? '' : '/') + slug
-    history.replaceState({}, null, new_path)
+    history.replaceState(history.state, '', new_path)
   }
 }
 
@@ -500,20 +499,15 @@ export function getLink(entity, copy = true, withDomain = true) {
       (entity.content_docname || entity.name)
   } else {
     link = `${
-      withDomain ? window.location.origin + '/drive' : ''
-    }/${getLinkStem(entity)}`
+      withDomain ? window.location.origin : ''
+    }/drive/${getLinkStem(entity)}`
   }
   if (!copy) return link
   try {
     copyToClipboard(link).then(() => toast('Copied to your clipboard.'))
   } catch (err) {
     if (err.name === 'NotAllowedError') {
-      toast({
-        icon: 'alert-triangle',
-        iconClasses: 'text-ink-red-6',
-        title: 'Clipboard permission denied',
-        position: 'bottom-right',
-      })
+      toast('Clipboard permission denied')
     } else {
       console.error('Failed to copy link:', err)
     }
diff --git a/frontend/src/apps/drive/utils/useInlineRename.js b/frontend/src/apps/drive/utils/useInlineRename.js
new file mode 100644
index 0000000000..0ed4db60ae
--- /dev/null
+++ b/frontend/src/apps/drive/utils/useInlineRename.js
@@ -0,0 +1,99 @@
+import { nextTick, ref } from 'vue'
+import { renamingEntity, stopRename } from '@/apps/drive/data/selection'
+import { rename } from '@/apps/drive/ui/drive/js/resources'
+
+// Types whose name is edited whole — they carry no user-facing extension.
+const KEEP_WHOLE_TYPES = ['Document', 'Markdown', 'Link']
+
+// Length of the base name (everything before the extension). Used to pre-select
+// just the name on focus, leaving the extension visible but untouched — the
+// behaviour of Finder/Explorer inline rename.
+function baseNameLength(entity) {
+  const name = entity.file_name || ''
+  if (entity.is_folder || KEEP_WHOLE_TYPES.includes(entity.file_type)) {
+    return name.length
+  }
+  const dot = name.lastIndexOf('.')
+  return dot <= 0 ? name.length : dot
+}
+
+// Inline rename for a single entity (a list row, grid tile, or breadcrumb).
+// `source` is the entity object or a getter returning it (breadcrumb entities
+// can load asynchronously). The entity is mutated optimistically so every view
+// bound to it updates.
+const now = () =>
+  typeof performance !== 'undefined' && performance.now ? performance.now() : Date.now()
+
+// Window after opening during which any focus loss is treated as a transient
+// steal to be reclaimed rather than a commit. Comfortably covers the tick or two
+// it takes the trigger (a removed breadcrumb button, a closing menu) to settle.
+const OPEN_GRACE_MS = 600
+
+export function useInlineRename(source) {
+  const entity = () => (typeof source === 'function' ? source() : source)
+  const draft = ref('')
+  const input = ref(null)
+  let openedAt = 0
+
+  function selectBaseName() {
+    const e = entity()
+    const el = input.value
+    if (!e || !el) return
+    el.setSelectionRange(0, baseNameLength(e))
+  }
+
+  function focusAndSelect(e) {
+    const el = input.value
+    if (!el || renamingEntity.value !== e.name) return
+    if (document.activeElement !== el) el.focus()
+    el.setSelectionRange(0, baseNameLength(e))
+  }
+
+  function start() {
+    const e = entity()
+    if (!e) return
+    draft.value = e.file_name || ''
+    openedAt = now()
+    // Focus + select once the input is in the DOM. Re-assert on a macrotask and
+    // a frame in case something reclaims focus a tick later.
+    nextTick(() => focusAndSelect(e))
+    if (typeof setTimeout === 'function') setTimeout(() => focusAndSelect(e), 0)
+    if (typeof requestAnimationFrame === 'function') {
+      requestAnimationFrame(() => focusAndSelect(e))
+    }
+  }
+
+  // A breadcrumb rename is triggered by clicking the crumb, whose button is then
+  // removed from the DOM — that drops focus (to <body>, or wherever the app's
+  // focus management sends it) right after we focus the input. Committing on
+  // that transient blur would exit edit mode instantly ("selects then instantly
+  // deselects"). So within the grace window right after opening, ANY focus loss
+  // reclaims focus instead of committing; after it settles, a real click-away
+  // still commits.
+  function blur() {
+    const e = entity()
+    if (!e || renamingEntity.value !== e.name) return
+    if (now() - openedAt < OPEN_GRACE_MS) {
+      // Reclaim on the next tick so the browser finishes moving focus first.
+      nextTick(() => focusAndSelect(e))
+      return
+    }
+    submit()
+  }
+
+  function submit() {
+    const e = entity()
+    if (!e || renamingEntity.value !== e.name) return
+    const title = draft.value.trim()
+    stopRename()
+    if (!title || title === e.file_name) return
+    const previous = e.file_name
+    e.file_name = title
+    rename.submit(
+      { entity_name: e.name, new_title: title },
+      { onError: () => (e.file_name = previous) }
+    )
+  }
+
+  return { draft, input, start, submit, blur, selectBaseName, cancel: stopRename }
+}
diff --git a/frontend/src/apps/writer/components/CommentEditor.vue b/frontend/src/apps/writer/components/CommentEditor.vue
index 05df32e078..05de4df1ad 100644
--- a/frontend/src/apps/writer/components/CommentEditor.vue
+++ b/frontend/src/apps/writer/components/CommentEditor.vue
@@ -5,7 +5,7 @@
       !disabled && !isEmpty && $emit('submit', editor)
       " @keydown.esc.stop="$emit('cancel', editor)">
     <div class="flex" :class="editable && 'border rounded'">
-      <Editor ref="textEditor" v-model="editorContent" :autofocus="true" :editable="editable" :extensions
+      <Editor ref="textEditor" v-model="editorContent" :editable="editable" :extensions
         @change="(val) => { modelValue = val; $emit('change') }">
         <template #default="{ editor }">
           <EditorBubbleMenu :editor :items="bubbleItems" />
@@ -42,7 +42,7 @@ import {
 } from 'frappe-ui/editor'
 import { Button } from 'frappe-ui'
 import { allUsers } from '@/apps/drive/sdk'
-import { computed, ref, watch, nextTick } from 'vue'
+import { computed, ref, watch, nextTick, onMounted } from 'vue'
 import LucideMessageCircleReply from '~icons/lucide/message-circle-reply'
 import LucideX from '~icons/lucide/x'
 
@@ -63,11 +63,17 @@ const editorContent = ref(props.content || '')
 const textEditor = ref('textEditor')
 const editor = computed(() => textEditor.value?.editor)
 
-// `:autofocus` only applies at init; focus when a comment flips into edit mode.
+const focusWithoutScroll = () =>
+  nextTick(() => editor.value?.commands.focus('end', { scrollIntoView: false }))
+
+onMounted(() => {
+  if (props.editable) focusWithoutScroll()
+})
+
 watch(
   () => props.editable,
   (editable) => {
-    if (editable) nextTick(() => editor.value?.commands.focus('end'))
+    if (editable) focusWithoutScroll()
   },
 )
 
diff --git a/frontend/src/apps/writer/components/CoreEditor.vue b/frontend/src/apps/writer/components/CoreEditor.vue
index 7644e94a25..a0ed8f28fb 100644
--- a/frontend/src/apps/writer/components/CoreEditor.vue
+++ b/frontend/src/apps/writer/components/CoreEditor.vue
@@ -87,6 +87,7 @@ import MediaDownload from '@/apps/writer/extensions/media-download'
 import OldCommentExtension from '@/apps/writer/extensions/old-comment'
 import { TabsExtension } from '@/apps/writer/extensions/tabs'
 import TabTrailingNode from '@/apps/writer/extensions/tab-trailing-node'
+import { JoinAdjacentLists } from '@/apps/writer/extensions/join-adjacent-lists'
 import { CommentExtension, rebuild } from '@/apps/writer/extensions/comments'
 
 
@@ -232,6 +233,7 @@ const editorExtensions = [
   }),
   TabsExtension,
   TabTrailingNode,
+  JoinAdjacentLists,
   OldCommentExtension.configure({ onCommentActivated }),
   TableOfContents.configure({
     onUpdate: (val) => (anchors.value = val),
diff --git a/frontend/src/apps/writer/components/Dialogs.vue b/frontend/src/apps/writer/components/Dialogs.vue
index 23e4524286..8f67134479 100644
--- a/frontend/src/apps/writer/components/Dialogs.vue
+++ b/frontend/src/apps/writer/components/Dialogs.vue
@@ -1,7 +1,6 @@
 <template>
   <!-- Mutation dialogs -->
-  <RenameDialog v-if="dialog === 'rn'" v-model="dialog" :entity @complete="refresh" />
-  <ShareDialog v-else-if="dialog === 's'" v-model="dialog" :add-users="params || []" :file="entity" @success="() => resource.fetch()" />
+  <ShareDialog v-if="dialog === 's'" v-model="dialog" :add-users="params || []" :file="entity" @success="() => resource.fetch()" />
   <MoveDialog v-else-if="dialog === 'm'" :entities @complete="refresh" />
   
   <!-- Confirmation dialogs -->
@@ -14,7 +13,8 @@
 import { ref, watch, computed } from 'vue'
 import emitter from '@/apps/writer/emitter'
 
-import { ShareDialog, MoveDialog, InfoDialog, RenameDialog } from '@/apps/drive/sdk'
+import { ShareDialog, MoveDialog, InfoDialog } from '@/apps/drive/sdk'
+import { startRename } from '@/apps/drive/data/selection'
 import RemoveDialog from './RemoveDialog.vue'
 import SearchDialog from './SearchDialog.vue'
 
@@ -26,7 +26,7 @@ const props = defineProps({
 
 
 const resource = computed(() => props.docs?.[0])
-const entities = computed(() => props.docs.map(r => r.doc))
+const entities = computed(() => props.docs?.map(r => r.doc) ?? [])
 const entity = computed(() => entities.value?.[0])
 const dialog = defineModel(String)
 const params = ref(null)
@@ -45,7 +45,7 @@ emitter.on('share', (data) => {
   dialog.value = 's'
 })
 emitter.on('newFolder', () => (dialog.value = 'f'))
-emitter.on('rename', () => (dialog.value = 'rn'))
+emitter.on('rename', () => entity.value && startRename(entity.value.name))
 emitter.on('remove', () => (dialog.value = 'remove'))
 emitter.on('move', () => (dialog.value = 'm'))
 emitter.on('newLink', () => (dialog.value = 'l'))
diff --git a/frontend/src/apps/writer/components/FloatingComments.vue b/frontend/src/apps/writer/components/FloatingComments.vue
index e84b89047a..4a9ecad1d4 100644
--- a/frontend/src/apps/writer/components/FloatingComments.vue
+++ b/frontend/src/apps/writer/components/FloatingComments.vue
@@ -7,7 +7,7 @@
         else delete commentRefs[comment.id]
       }
         " v-on-outside-click="(e) => onOutsideCardClick(e, comment)"
-          class="absolute rounded shadow w-56 comment-group scroll-m-24 bg-surface-base dark:border max-md:fixed max-md:inset-x-4 max-md:bottom-4 max-md:top-auto max-md:w-auto max-md:max-w-sm max-md:mx-auto max-md:max-h-[65vh] max-md:overflow-y-auto max-md:shadow-xl"
+          class="absolute rounded shadow w-56 comment-group scroll-m-24 bg-surface-base dark:border max-md:fixed max-md:inset-x-4 max-md:bottom-[calc(1rem+var(--writer-tab-bar-height,0px))] max-md:top-auto max-md:z-20 max-md:w-auto max-md:max-w-sm max-md:mx-auto max-md:max-h-[65vh] max-md:overflow-y-auto max-md:shadow-xl"
           :class="[
             activeComment === comment.id && 'shadow-xl ',
             isMobile || comment.top
diff --git a/frontend/src/apps/writer/components/Navbar.vue b/frontend/src/apps/writer/components/Navbar.vue
index 2e2880af3a..c3dd2cd1e7 100644
--- a/frontend/src/apps/writer/components/Navbar.vue
+++ b/frontend/src/apps/writer/components/Navbar.vue
@@ -21,8 +21,9 @@
       <WriterLogo v-else class="size-7" />
     </div>
     <slot name="breadcrumbs">
-      <Breadcrumbs
+      <EditableBreadcrumbs
         :items="formattedCrumbs"
+        :entity="file?.doc || null"
         class="select-none truncate max-w-[80%]"
       />
     </slot>
@@ -94,7 +95,8 @@
   </nav>
 </template>
 <script setup>
-import { Button, Breadcrumbs, Dropdown } from 'frappe-ui'
+import { Button, Dropdown } from 'frappe-ui'
+import EditableBreadcrumbs from '@/apps/drive/components/EditableBreadcrumbs.vue'
 import { getFileLink } from '@/apps/drive/sdk'
 
 import { useSessionStore } from '@/boot/session'
@@ -223,7 +225,7 @@ const fileActions = computed(() =>
             {
               label: __('Rename'),
               icon: LucideSquarePen,
-              onClick: () => (dialog.value = 'rn'),
+              onClick: () => emitter.emit('rename'),
               isEnabled: () => props.file.doc.write,
             },
             {
diff --git a/frontend/src/apps/writer/components/ToC.vue b/frontend/src/apps/writer/components/ToC.vue
index 39f4463f35..b8b510109d 100644
--- a/frontend/src/apps/writer/components/ToC.vue
+++ b/frontend/src/apps/writer/components/ToC.vue
@@ -5,9 +5,9 @@
     <div v-if="!show" class="flex justify-center">
       <Button variant="ghost" :icon="LucideTableOfContents" tooltip="Table of Contents" @click="show = !show" />
     </div>
-    <div v-if="show" class="grow flex flex-col gap-0.5">
+    <div v-if="show" class="grow flex flex-col gap-0.5 w-52">
       <div v-if="hasContent" class="flex justify-between items-center ps-2 pr-1 pb-1">
-        <span class="text-base-medium text-ink-gray-8 select-none">Table of Contents</span>
+        <span class="text-base-medium text-ink-gray-8 select-none whitespace-nowrap">Table of Contents</span>
         <Button :icon="LucideLeftClose" variant="ghost" @click="show = !show" tooltip="Hide" />
       </div>
       <div v-if="tabs.length > 0" class="flex flex-col gap-0.5 mb-2" @drop.prevent="onDrop">
@@ -106,6 +106,7 @@ import LucideLeftClose from '~icons/lucide/panel-left-close'
 import { ref, watch, computed, h, onMounted, onBeforeUnmount } from 'vue'
 import { Button, TextInput, ContextMenu, onOutsideClickDirective as vOnOutsideClick } from 'frappe-ui'
 import { copyToClipboard } from '@/apps/drive/sdk'
+import { orderedTabs, findTab } from '@/apps/writer/extensions/tabs'
 
 const props = defineProps({
   editor: Object,
@@ -127,13 +128,10 @@ const showHeadings = ref(true)
 const tabs = ref([])
 
 const updateTabs = () => {
-  const t = []
-  props.editor.state.doc.descendants((node) => {
-    if (node.type.name === 'tab') {
-      t.push({ id: node.attrs.id, label: node.attrs.label })
-    }
-  })
-  tabs.value = t
+  tabs.value = orderedTabs(props.editor.state.doc).map(({ node }) => ({
+    id: node.attrs.id,
+    label: node.attrs.label,
+  }))
 }
 
 // Get active tab ID
@@ -159,19 +157,10 @@ const currentTabAnchors = computed(() => {
   if (tabs.value.length === 0) return props.anchors
   if (!activeTabId.value) return props.anchors
 
-  // Find the tab node position in the document
-  let tabStart = null
-  let tabEnd = null
-
-  props.editor.state.doc.descendants((node, pos) => {
-    if (node.type.name === 'tab' && node.attrs.id === activeTabId.value) {
-      tabStart = pos
-      tabEnd = pos + node.nodeSize
-      return false
-    }
-  })
-
-  if (tabStart === null) return []
+  const tab = findTab(props.editor.state.doc, activeTabId.value)
+  if (!tab) return []
+  const tabStart = tab.pos
+  const tabEnd = tab.pos + tab.node.nodeSize
 
   // Filter anchors that are within the active tab's position range
   return props.anchors.filter((anchor) => {
diff --git a/frontend/src/apps/writer/components/ToCMobile.vue b/frontend/src/apps/writer/components/ToCMobile.vue
index 979786efe6..11369ad021 100644
--- a/frontend/src/apps/writer/components/ToCMobile.vue
+++ b/frontend/src/apps/writer/components/ToCMobile.vue
@@ -1,6 +1,7 @@
 <template>
   <div
     v-if="editor && tabs.length > 0 && activeTabId"
+    ref="bar"
     class="md:hidden fixed bottom-0 w-screen z-10 border-t border-outline-gray-2 bg-surface-base"
   >
     <div class="flex overflow-x-auto px-2 py-2 gap-1">
@@ -13,38 +14,47 @@
   </div>
 </template>
 <script setup>
-import { ref, onMounted, onBeforeUnmount } from 'vue'
+import { ref, onMounted, onBeforeUnmount, watchEffect } from 'vue'
 import { TabButtons } from 'frappe-ui'
+import { orderedTabs } from '@/apps/writer/extensions/tabs'
 
 const props = defineProps({
   editor: Object,
 })
 
-// `editor.state.doc` is a ProseMirror object, not a Vue-reactive source, so a
-// computed over it never recomputes — a newly-added (or renamed) tab would
-// never appear in the bar. Mirror the desktop ToC: keep a ref and re-derive it
-// on every editor update.
+const bar = ref(null)
+
+// Anything else pinned to the bottom on mobile (comment cards) needs to clear the bar.
+const setBarHeight = (height) =>
+  document.documentElement.style.setProperty(
+    '--writer-tab-bar-height',
+    `${height}px`,
+  )
+
+let observer
+watchEffect(() => {
+  observer?.disconnect()
+  if (!bar.value) return setBarHeight(0)
+  observer = new ResizeObserver(([entry]) =>
+    setBarHeight(entry.contentRect.height),
+  )
+  observer.observe(bar.value)
+})
+
+// doc isn't reactive, so re-derive on every update
 const tabs = ref([])
 const updateTabs = () => {
-  const collected = []
-  props.editor.state.doc.descendants((node) => {
-    if (node.type.name === 'tab') {
-      collected.push({ id: node.attrs.id, label: node.attrs.label })
-    }
-  })
-  tabs.value = collected
+  tabs.value = orderedTabs(props.editor.state.doc).map(({ node }) => ({
+    id: node.attrs.id,
+    label: node.attrs.label,
+  }))
 }
 
-// Seed from storage in case the initial changeTab fired before this mounted,
-// then track it via the tab-changed event.
 const activeTabId = ref(props.editor.storage.tab?.activeTabId ?? null)
 const handleTabChange = (e) => {
   activeTabId.value = e.detail.tabId
 }
 
-// Switch through the editor command: it repaints the panels and re-emits
-// `tab-changed` (which updates activeTabId). Mutating the model directly instead
-// would move the bar highlight but leave the content on the old tab.
 const selectTab = (id) => {
   if (id && id !== activeTabId.value) props.editor.commands.changeTab(id)
 }
@@ -57,6 +67,8 @@ onMounted(() => {
 })
 
 onBeforeUnmount(() => {
+  observer?.disconnect()
+  setBarHeight(0)
   props.editor.off('update', updateTabs)
   props.editor.view.dom.removeEventListener('tab-changed', handleTabChange)
 })
diff --git a/frontend/src/apps/writer/components/WriterSettings.vue b/frontend/src/apps/writer/components/WriterSettings.vue
index 38aa89631d..180fb26efe 100644
--- a/frontend/src/apps/writer/components/WriterSettings.vue
+++ b/frontend/src/apps/writer/components/WriterSettings.vue
@@ -14,7 +14,7 @@
                     v-model="settings.font_family"
                     variant="subtle"
                     :options="fontOptions"
-                    label="Font Family"
+                    label="Font family"
                     :description="`Choose the default font family for ${
                       tabIndex === 1 ? 'this document' : 'new documents'
                     }.`"
@@ -22,7 +22,7 @@
                   <FormControl
                     v-model="settings.font_size"
                     type="number"
-                    label="Font Size"
+                    label="Font size"
                     autocomplete="off"
                     placeholder="Automatic"
                     description="Set the font size of the editor (px)."
@@ -30,13 +30,13 @@
                   <FormControl
                     v-model="settings.line_height"
                     type="number"
-                    label="Line Height"
+                    label="Line height"
                     autocomplete="off"
                     placeholder="Automatic"
                     description="Set the line height of the editor."
                   />
                   <div class="space-y-1.5">
-                    <FormLabel label="Paragraph Spacing" size="md" />
+                    <FormLabel label="Paragraph spacing" size="md" />
                     <div class="grid grid-cols-2 gap-2">
                       <FormControl
                         v-model.number="settings.paragraph_spacing_before"
@@ -64,39 +64,38 @@
                 </div>
 
                 <!-- Print Settings Section -->
-                <div class="flex flex-col gap-3 pb-5 pr-5">
-                  <template v-if="tabIndex === 1">
-                    <h3 class="text-base font-medium text-ink-gray-7">Print Settings</h3>
+                <div v-if="tabIndex === 1" class="flex flex-col gap-3 pb-5 pr-5">
+                    <h3 class="text-base font-medium text-ink-gray-7">Print settings</h3>
                     <div class="space-y-2">
-                      <FormLabel label="Header & Footer" size="md" />
+                      <FormLabel label="Header & footer" size="md" />
                       <div class="grid grid-cols-2 gap-2">
                         <FormControl
                           v-model="settings.print_header_left"
                           type="text"
-                          placeholder="Header Left"
-                          label="Top Left"
+                          placeholder="Header left"
+                          label="Top left"
                           autocomplete="off"
                         />
                         <FormControl
                           v-model="settings.print_header_right"
                           type="text"
-                          placeholder="Header Right"
-                          label="Top Right"
+                          placeholder="Header right"
+                          label="Top right"
                           autocomplete="off"
                         />
                         <FormControl
                           v-model="settings.print_footer_left"
                           type="text"
-                          placeholder="Footer Left"
-                          label="Bottom Left"
+                          placeholder="Footer left"
+                          label="Bottom left"
                           autocomplete="off"
                         />
                         <FormControl
                           v-model="settings.print_footer_right"
                           :disabled="settings.print_show_pages"
                           type="text"
-                          placeholder="Footer Right"
-                          label="Bottom Right"
+                          placeholder="Footer right"
+                          label="Bottom right"
                           autocomplete="off"
                         />
                       </div>
@@ -123,48 +122,7 @@
                         label="Footer separator line"
                         description="Add a line above the footer when printing."
                       />
-                      <FormControl
-                        v-model="settings.apply_watermark"
-                        type="checkbox"
-                        label="Apply watermark to PDF"
-                        :description="'Enable this to automatically apply watermark when downloading PDF for this document.'"
-                      />
-                    </div>
-                  </template>
-                  <template v-else>
-                    <h3 class="text-base font-medium text-ink-gray-7">Watermark</h3>
-                    <FormControl
-                      v-model="settings.watermark_text"
-                      type="text"
-                      label="Text"
-                      placeholder="Your company name.."
-                      :description="`Set the text for the watermark.`"
-                    />
-                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                      <FormControl
-                        v-model.number="settings.watermark_size"
-                        type="number"
-                        label="Size"
-                        placeholder="40"
-                        :min="10"
-                        :max="300"
-                        :step="5"
-                        :description="`Set the watermark text size (px).`"
-                        class="w-full"
-                      />
-                      <FormControl
-                        v-model.number="settings.watermark_angle"
-                        type="number"
-                        label="Angle"
-                        placeholder="-45"
-                        :min="-180"
-                        :max="180"
-                        :step="15"
-                        :description="`Set the watermark text angle (°).`"
-                        class="w-full"
-                      />
                     </div>
-                  </template>
                 </div>
               </div>
               <div class="mt-2">
@@ -249,9 +207,6 @@ const KEYS = computed(() => [
   'print_show_pages',
   'print_header_separator',
   'print_footer_separator',
-  ...(tabIndex.value === 0
-    ? ['watermark_text', 'watermark_size', 'watermark_angle']
-    : ['apply_watermark']),
 ])
 
 const settings = reactive({})
@@ -262,12 +217,7 @@ const LOCAL_ONLY = [
   'print_footer_left',
   'print_footer_right',
 ]
-const BOOLS = [
-  'apply_watermark',
-  'print_header_separator',
-  'print_footer_separator',
-  'print_show_pages',
-]
+const BOOLS = ['print_header_separator', 'print_footer_separator', 'print_show_pages']
 watchEffect(() => {
   const base = { ...resource.value.doc[key.value] }
   for (const k of KEYS.value) {
diff --git a/frontend/src/apps/writer/extensions/join-adjacent-lists.js b/frontend/src/apps/writer/extensions/join-adjacent-lists.js
new file mode 100644
index 0000000000..427c1d0daf
--- /dev/null
+++ b/frontend/src/apps/writer/extensions/join-adjacent-lists.js
@@ -0,0 +1,55 @@
+import { Extension } from '@tiptap/core'
+import { Plugin, PluginKey } from '@tiptap/pm/state'
+import { canJoin } from '@tiptap/pm/transform'
+
+// Deleting a block between two lists, or lifting an item out, leaves adjacent
+// same-type list nodes that ProseMirror never merges, so the second list
+// restarts its numbering. Join them back into one node after every change.
+const JOINABLE = new Set(['orderedList', 'bulletList'])
+
+export const JoinAdjacentLists = Extension.create({
+  name: 'joinAdjacentLists',
+
+  addProseMirrorPlugins() {
+    return [
+      new Plugin({
+        key: new PluginKey('joinAdjacentLists'),
+        appendTransaction(transactions, oldState, newState) {
+          if (!transactions.some((tr) => tr.docChanged)) return
+
+          // Boundary position (start of `child`) for every pair of adjacent
+          // same-type list siblings. `descendants` skips the doc node itself,
+          // so collect its direct children explicitly (content starts at 0).
+          const boundaries = []
+          const collect = (node, pos) => {
+            node.forEach((child, offset, index) => {
+              if (index === 0) return
+              if (JOINABLE.has(child.type.name) && child.type === node.child(index - 1).type) {
+                boundaries.push(pos + 1 + offset)
+              }
+            })
+          }
+          collect(newState.doc, -1)
+          newState.doc.descendants(collect)
+          if (!boundaries.length) return
+
+          const tr = newState.tr
+          let joined = false
+          for (const pos of boundaries) {
+            // Map through earlier joins in this transaction so the position
+            // stays valid; canJoin then confirms the mapped boundary is real.
+            const mapped = tr.mapping.map(pos)
+            if (canJoin(tr.doc, mapped)) {
+              tr.join(mapped)
+              joined = true
+            }
+          }
+
+          return joined ? tr : undefined
+        },
+      }),
+    ]
+  },
+})
+
+export default JoinAdjacentLists
diff --git a/frontend/src/apps/writer/extensions/tabs.test.ts b/frontend/src/apps/writer/extensions/tabs.test.ts
new file mode 100644
index 0000000000..1d4d041ee4
--- /dev/null
+++ b/frontend/src/apps/writer/extensions/tabs.test.ts
@@ -0,0 +1,107 @@
+import { describe, expect, it } from 'vitest'
+import { Editor } from '@tiptap/core'
+import Document from '@tiptap/extension-document'
+import Paragraph from '@tiptap/extension-paragraph'
+import Text from '@tiptap/extension-text'
+import { TabsExtension, orderedTabs, tabsIn } from './tabs'
+
+const makeEditor = (labels: string[]) => {
+  const editor = new Editor({
+    extensions: [Document, Paragraph, Text, TabsExtension],
+    content: '<p>first</p>',
+  })
+  editor.commands.wrapInTab({ label: labels[0] })
+  labels.slice(1).forEach((label) => editor.commands.createTab({ label }))
+  return editor
+}
+
+const labelsOf = (editor: Editor) =>
+  orderedTabs(editor.state.doc).map(({ node }) => node.attrs.label)
+
+const idsOf = (editor: Editor) =>
+  tabsIn(editor.state.doc).map(({ node }) => node.attrs.id)
+
+describe('tab reordering', () => {
+  it('reorders without moving nodes', () => {
+    const editor = makeEditor(['a', 'b', 'c'])
+    const idsBefore = idsOf(editor)
+
+    expect(editor.commands.reorderTab(idsBefore[2], 0)).toBe(true)
+    expect(labelsOf(editor)).toEqual(['c', 'a', 'b'])
+    expect(idsOf(editor)).toEqual(idsBefore)
+  })
+
+  it('keeps every tab exactly once across repeated moves', () => {
+    const editor = makeEditor(['a', 'b', 'c', 'd'])
+    const ids = idsOf(editor)
+
+    editor.commands.reorderTab(ids[0], 3)
+    editor.commands.reorderTab(ids[2], 1)
+    editor.commands.reorderTab(ids[3], 0)
+
+    expect(idsOf(editor).sort()).toEqual([...ids].sort())
+    expect(labelsOf(editor).sort()).toEqual(['a', 'b', 'c', 'd'])
+    expect(
+      orderedTabs(editor.state.doc).map(({ node }) => node.attrs.order),
+    ).toEqual([0, 1, 2, 3])
+  })
+
+  it('rejects out-of-range and no-op moves', () => {
+    const editor = makeEditor(['a', 'b'])
+    const ids = idsOf(editor)
+
+    expect(editor.commands.reorderTab(ids[0], 0)).toBe(false)
+    expect(editor.commands.reorderTab(ids[0], 2)).toBe(false)
+    expect(editor.commands.reorderTab('missing', 1)).toBe(false)
+  })
+
+  it('falls back to document order when order is unset', () => {
+    const editor = makeEditor(['a', 'b', 'c'])
+    const { tr } = editor.state
+    tabsIn(editor.state.doc).forEach(({ node, pos }) =>
+      tr.setNodeMarkup(pos, undefined, { ...node.attrs, order: null }),
+    )
+    editor.view.dispatch(tr)
+
+    expect(labelsOf(editor)).toEqual(['a', 'b', 'c'])
+  })
+})
+
+describe('tab id integrity', () => {
+  it('refuses a transaction that duplicates a tab id', () => {
+    const editor = makeEditor(['a', 'b'])
+    const [first] = tabsIn(editor.state.doc)
+    const { tr } = editor.state
+
+    tr.insert(
+      editor.state.doc.content.size,
+      editor.schema.nodes.tab.create(
+        first.node.attrs,
+        editor.schema.nodes.paragraph.create(),
+      ),
+    )
+    editor.view.dispatch(tr)
+
+    expect(tabsIn(editor.state.doc)).toHaveLength(2)
+  })
+})
+
+describe('ordered serialisation', () => {
+  it('getHTML serialises tabs in display order', () => {
+    const editor = makeEditor(['a', 'b'])
+    const ids = idsOf(editor)
+    editor.commands.reorderTab(ids[1], 0)
+
+    const html = editor.getHTML()
+    expect(html.indexOf(ids[1])).toBeLessThan(html.indexOf(ids[0]))
+    expect(html).toContain('data-tab-order="0"')
+  })
+
+  it('getHTML keeps a document without tabs intact', () => {
+    const editor = new Editor({
+      extensions: [Document, Paragraph, Text, TabsExtension],
+      content: '<p>plain</p>',
+    })
+    expect(editor.getHTML()).toBe('<p>plain</p>')
+  })
+})
diff --git a/frontend/src/apps/writer/extensions/tabs.ts b/frontend/src/apps/writer/extensions/tabs.ts
index fa88cea74a..efb2134107 100644
--- a/frontend/src/apps/writer/extensions/tabs.ts
+++ b/frontend/src/apps/writer/extensions/tabs.ts
@@ -1,10 +1,54 @@
 import { Node } from '@tiptap/core'
 import { VueNodeViewRenderer } from '@tiptap/vue-3'
 import TabView from './components/TabView.vue'
-import { TextSelection } from '@tiptap/pm/state'
-import { DOMSerializer } from '@tiptap/pm/model'
+import { Plugin, PluginKey, TextSelection } from '@tiptap/pm/state'
+import { DOMSerializer, Fragment, Node as PMNode } from '@tiptap/pm/model'
+import { ySyncPluginKey } from '@tiptap/y-tiptap'
 import { v4 } from 'uuid'
 
+type TabMatch = { node: PMNode; pos: number }
+
+// Tabs are always direct children of the doc
+export const tabsIn = (doc: PMNode): TabMatch[] => {
+  const tabs: TabMatch[] = []
+  doc.forEach((node, offset) => {
+    if (node.type.name === 'tab') tabs.push({ node, pos: offset })
+  })
+  return tabs
+}
+
+export const findTab = (doc: PMNode, id: string): TabMatch | null =>
+  tabsIn(doc).find((tab) => tab.node.attrs.id === id) || null
+
+// Tabs are ordered by attribute, not by position: moving a node is a delete
+// plus an insert, which Yjs cannot merge as a move
+export const orderedTabs = (doc: PMNode): TabMatch[] =>
+  tabsIn(doc)
+    .map((tab, index) => ({ tab, index, order: tab.node.attrs.order ?? index }))
+    .sort((a, b) => a.order - b.order || a.index - b.index)
+    .map(({ tab }) => tab)
+
+// Document order is no longer tab order, so serialise the tab slots in display
+// order
+const orderedHTML = (doc: PMNode): string => {
+  const ordered = orderedTabs(doc)
+  let next = 0
+  const children: PMNode[] = []
+  doc.forEach((node) =>
+    children.push(node.type.name === 'tab' ? ordered[next++].node : node),
+  )
+
+  const serializer = DOMSerializer.fromSchema(doc.type.schema)
+  const wrapper = document.createElement('div')
+  wrapper.appendChild(serializer.serializeFragment(Fragment.fromArray(children)))
+  return wrapper.innerHTML
+}
+
+const duplicateTabIds = (doc: PMNode): string[] => {
+  const ids = tabsIn(doc).map(({ node }) => node.attrs.id)
+  return ids.filter((id, index) => !id || ids.indexOf(id) < index)
+}
+
 export const TabsExtension = Node.create({
   name: 'tab',
   group: 'block',
@@ -37,6 +81,15 @@ export const TabsExtension = Node.create({
         parseHTML: (el) => el.getAttribute('data-tab-label'),
         renderHTML: (attrs) => ({ 'data-tab-label': attrs.label }),
       },
+      order: {
+        default: null,
+        parseHTML: (el) => {
+          const order = el.getAttribute('data-tab-order')
+          return order === null ? null : Number(order)
+        },
+        renderHTML: (attrs) =>
+          attrs.order === null ? {} : { 'data-tab-order': attrs.order },
+      },
     }
   },
 
@@ -52,16 +105,37 @@ export const TabsExtension = Node.create({
     return VueNodeViewRenderer(TabView)
   },
 
+  addProseMirrorPlugins() {
+    return [
+      new Plugin({
+        key: new PluginKey('tabIntegrity'),
+        filterTransaction(tr, state) {
+          if (!tr.docChanged) return true
+
+          const added = duplicateTabIds(tr.doc)
+          if (added.length <= duplicateTabIds(state.doc).length) return true
+
+          console.error('Rejected transaction: duplicate tab ids', added, tr)
+          // Yjs owns the doc; rejecting its sync would desync the editor
+          return !!tr.getMeta(ySyncPluginKey)
+        },
+      }),
+    ]
+  },
+
+  // `create` fires a tick late, so patch the serialiser before anything can
+  // call it
+  onBeforeCreate() {
+    this.editor.getHTML = () => orderedHTML(this.editor.state.doc)
+  },
+
   onCreate() {
     const selectFirstTab = () => {
       if (this.storage.hasInitialized) return
 
       const { doc } = this.editor.state
       let tabToChange = window.location.hash.slice(1)
-      const tabs = []
-      doc.descendants(
-        (node) => node.type.name === 'tab' && tabs.push(node.attrs.id),
-      )
+      const tabs = orderedTabs(doc).map((tab) => tab.node.attrs.id)
       if (!tabToChange || !tabs.includes(tabToChange)) tabToChange = tabs[0]
       if (tabToChange) {
         this.storage.hasInitialized = true
@@ -107,124 +181,71 @@ export const TabsExtension = Node.create({
       reorderTab:
         (tabId: string, newIndex: number) =>
         ({ tr, dispatch, state }) => {
-          const tabs = []
-          state.doc.descendants((node, pos) => {
-            if (node.type.name === 'tab') {
-              tabs.push({ node, pos })
-            }
-          })
-
-          // Find the tab to move
+          const tabs = orderedTabs(state.doc)
           const tabIndex = tabs.findIndex((t) => t.node.attrs.id === tabId)
-          if (tabIndex === -1) return false
 
-          // Validate new index
-          if (newIndex < 0 || newIndex > tabs.length || newIndex === tabIndex) {
-            return false
-          }
+          if (tabIndex === -1 || tabIndex === newIndex) return false
+          if (newIndex < 0 || newIndex >= tabs.length) return false
+          if (!dispatch) return true
 
-          const { node, pos } = tabs[tabIndex]
-          const size = node.nodeSize
-          tr.delete(pos, pos + size)
-
-          let insertPos
-          let i = 0
-          tr.doc.descendants((n, p) => {
-            if (insertPos !== undefined) return false
-            if (n.type.name === 'tab') {
-              if (i === newIndex) {
-                insertPos = p
-                return false
-              }
-              i++
+          tabs.splice(newIndex, 0, tabs.splice(tabIndex, 1)[0])
+          tabs.forEach(({ node, pos }, index) => {
+            if (node.attrs.order !== index) {
+              tr.setNodeMarkup(pos, undefined, { ...node.attrs, order: index })
             }
           })
-
-          // Delete the tab from its current position
-          if (insertPos === undefined) insertPos = tr.doc.content.size
-          tr.insert(insertPos, node)
-
           dispatch(tr)
 
-          // Keep focus on the moved tab
-          setTimeout(() => {
-            this.editor.commands.changeTab(tabId, false)
-          }, 0)
-
           return true
         },
       focusTab:
         (tabId: string) =>
-        ({ state }) => {
+        () => {
           setTimeout(() => {
-            let focusPos = null
-            state.doc.descendants((node, pos) => {
-              if (node.type.name === 'tab' && node.attrs.id === tabId) {
-                focusPos = pos + 1
-                return false
-              }
-            })
-            if (focusPos !== null) this.editor.commands.focus(focusPos)
+            const tab = findTab(this.editor.state.doc, tabId)
+            if (tab) this.editor.commands.focus(tab.pos + 1)
           }, 0)
+          return true
         },
       renameTab:
         (tabId: string, newLabel: string, refocus: boolean = true) =>
         ({ tr, dispatch, state }) => {
           if (!dispatch) return false
 
-          let updated = false
-          state.doc.descendants((node, pos) => {
-            if (node.type.name === 'tab' && node.attrs.id === tabId) {
-              tr.setNodeMarkup(pos, undefined, {
-                ...node.attrs,
-                label: newLabel,
-              })
-              updated = true
-              return false
-            }
-          })
+          const tab = findTab(state.doc, tabId)
+          if (!tab) return false
 
-          if (updated) {
-            dispatch(tr)
-            if (refocus) this.editor.commands.focusTab(tabId)
-            return true
-          }
-          return false
+          tr.setNodeMarkup(tab.pos, undefined, {
+            ...tab.node.attrs,
+            label: newLabel,
+          })
+          dispatch(tr)
+          if (refocus) this.editor.commands.focusTab(tabId)
+          return true
         },
       deleteTab:
         (tabId: string) =>
         ({ tr, dispatch, state }) => {
           if (!dispatch) return false
 
-          let deleted = false
+          const tab = findTab(state.doc, tabId)
+          if (!tab) return false
 
-          state.doc.descendants((node, pos) => {
-            if (node.type.name === 'tab' && node.attrs.id === tabId) {
-              tr.delete(pos, pos + node.nodeSize)
-              deleted = true
-              return false
-            }
-          })
+          tr.delete(tab.pos, tab.pos + tab.node.nodeSize)
+          dispatch(tr)
 
-          if (deleted) {
-            if (this.storage.activeTabId === tabId) {
-              let newActiveTabId = null
-              tr.doc.descendants((node) => {
-                if (node.type.name === 'tab' && !newActiveTabId) {
-                  newActiveTabId = node.attrs.id
-                  return false
-                }
-              })
-              return this.editor.commands.changeTab(newActiveTabId)
-            }
+          if (this.storage.activeTabId === tabId) {
+            const next = tabsIn(tr.doc)[0]
+            this.editor.commands.changeTab(next ? next.node.attrs.id : null)
           }
-          return false
+          return true
         },
       wrapInTab:
-        (attrs: { id?: string; label?: string } = {}) =>
+        (attrs: { id?: string; label?: string; order?: number } = {}) =>
         ({ tr, dispatch }) => {
           if (dispatch) {
             if (!attrs?.id) attrs.id = v4()
+            if (attrs.order === undefined) attrs.order = 0
             const tabType = this.editor.schema.nodes.tab
             tr.replaceWith(
               0,
@@ -238,11 +259,12 @@ export const TabsExtension = Node.create({
           return false
         },
       createTab:
-        (attrs: { id?: string; label?: string } = {}) =>
+        (attrs: { id?: string; label?: string; order?: number } = {}) =>
         ({ tr, dispatch, state }) => {
           if (dispatch) {
             if (!attrs.id) attrs.id = v4()
             if (!attrs.label) attrs.label = 'Untitled'
+            if (attrs.order === undefined) attrs.order = tabsIn(state.doc).length
 
             const paragraphType = this.editor.schema.nodes.paragraph
             const tab = this.editor.schema.nodes.tab.create(
@@ -259,22 +281,13 @@ export const TabsExtension = Node.create({
       getCurrentTabHTML:
         () =>
         ({ state }) => {
-          const serializer = DOMSerializer.fromSchema(state.schema)
+          const tab = findTab(state.doc, this.storage.activeTabId)
+          if (!tab) return this.editor.getHTML()
 
-          let html: string | boolean = false
-          state.doc.descendants((node) => {
-            if (
-              node.type.name === 'tab' &&
-              node.attrs.id === this.storage.activeTabId
-            ) {
-              const dom = serializer.serializeNode(node)
-              const wrapper = document.createElement('div')
-              wrapper.appendChild(dom)
-              html = wrapper.innerHTML
-              return false
-            }
-          })
-          return html === false ? this.editor.getHTML() : html
+          const serializer = DOMSerializer.fromSchema(state.schema)
+          const wrapper = document.createElement('div')
+          wrapper.appendChild(serializer.serializeNode(tab.node))
+          return wrapper.innerHTML
         },
     }
   },
@@ -286,26 +299,19 @@ export const TabsExtension = Node.create({
         if (!activeTabId) return false
 
         const { state, view } = this.editor
-        let tabStart = null
-        let tabEnd = null
-
-        state.doc.descendants((node, pos) => {
-          if (node.type.name === 'tab' && node.attrs.id === activeTabId) {
-            tabStart = pos + 1
-            tabEnd = pos + node.nodeSize - 1
-            return false
-          }
-        })
-
-        if (tabStart !== null && tabEnd !== null) {
-          const tr = state.tr.setSelection(
-            TextSelection.create(state.doc, tabStart, tabEnd),
-          )
-          view.dispatch(tr)
-          return true
-        }
-
-        return false
+        const tab = findTab(state.doc, activeTabId)
+        if (!tab) return false
+
+        view.dispatch(
+          state.tr.setSelection(
+            TextSelection.create(
+              state.doc,
+              tab.pos + 1,
+              tab.pos + tab.node.nodeSize - 1,
+            ),
+          ),
+        )
+        return true
       },
       Backspace: () => {
         // prevent clearing of document when tab is empty
@@ -322,17 +328,13 @@ export const TabsExtension = Node.create({
         let tabNode = null
         let tabPos = null
 
-        state.doc.descendants((node, pos) => {
-          if (
-            node.type.name === 'tab' &&
-            pos < $from.pos &&
-            $from.pos < pos + node.nodeSize
-          ) {
-            tabNode = node
-            tabPos = pos
-            return false
+        for (let depth = $from.depth; depth > 0; depth--) {
+          if ($from.node(depth).type.name === 'tab') {
+            tabNode = $from.node(depth)
+            tabPos = $from.before(depth)
+            break
           }
-        })
+        }
 
         if (
           !tabNode ||
diff --git a/frontend/src/apps/writer/utils/download.js b/frontend/src/apps/writer/utils/download.js
index 6057826458..6332b6328b 100644
--- a/frontend/src/apps/writer/utils/download.js
+++ b/frontend/src/apps/writer/utils/download.js
@@ -9,37 +9,14 @@ import globalStyle from '@/apps/writer/styles/index.css?inline'
 async function getPdfFromDoc(entity_name, settings = {}) {
   const res = await fetch(`/api/method/suite.drive.api.files.get_file_content?entity_name=${entity_name}`)
   const raw_html = (await res.json()).message
-  const applyWatermark = settings?.apply_watermark || false
-  const watermark = {
-    text: settings?.watermark_text || '',
-    size: settings?.watermark_size || 90,
-    angle: settings?.watermark_angle || -45,
-  }
-  // Show watermark if apply_watermark is true AND text is not empty
-  const shouldShowWatermark = applyWatermark && watermark.text.trim() !== ''
   const content = `
           <!DOCTYPE html>
           <html>
             <head>
               <style>${globalStyle}</style>
               <style>${editorStyle}</style>
-              <style>
-                .watermark {
-                  position: fixed;
-                  top: 50%;
-                  left: 50%;
-                  transform: translate(-50%, -50%) rotate(${watermark.angle}deg);
-                  opacity: 0.12;
-                  font-size: ${watermark.size}px;
-                  color: #999;
-                  pointer-events: none;
-                  z-index: 9999;
-                  white-space: nowrap;
-                }
-              </style>
             </head>
             <body>
-              ${shouldShowWatermark ? `<div class="watermark">${watermark.text}</div>` : ''}
               <div class="ProseMirror prose-sm" style='padding-left: 40px; padding-right: 40px; padding-top: 20px; padding-bottom: 20px; margin: 0;'>
                 ${raw_html}
               </div>
diff --git a/frontend/src/apps/writer/utils/index.js b/frontend/src/apps/writer/utils/index.js
index 02d31effe7..820414cbf4 100644
--- a/frontend/src/apps/writer/utils/index.js
+++ b/frontend/src/apps/writer/utils/index.js
@@ -254,13 +254,6 @@ export function printDoc(html, settings = {}) {
     nunito: 'var(--font-nunito)',
   }
   const fontFamily = fontMap[settings?.font_family]
-  const applyWatermark = settings?.apply_watermark || false
-  const watermark = {
-    text: settings?.watermark_text || '',
-    size: settings?.watermark_size || 90,
-    angle: settings?.watermark_angle || -45,
-  }
-  const shouldShowWatermark = applyWatermark && watermark.text.trim() !== ''
   const content = `
             <!DOCTYPE html>
             <html>
@@ -312,23 +305,10 @@ export function printDoc(html, settings = {}) {
                 div[data-page-break='true'] {
                   border: none;
                   margin: none;
-                }  
-                .watermark {
-                  position: fixed;
-                  top: 50%;
-                  left: 50%;
-                  transform: translate(-50%, -50%) rotate(${watermark.angle}deg);
-                  opacity: 0.12;
-                  font-size: ${watermark.size}px;
-                  color: #999;
-                  pointer-events: none;
-                  z-index: 9999;
-                  white-space: nowrap;
                 }
               </style>
               </head>
               <body>
-                ${shouldShowWatermark ? `<div class="watermark">${watermark.text}</div>` : ''}
                 <div class="ProseMirror prose-sm" style='padding-left: 40px; padding-right: 40px; padding-top: 20px; padding-bottom: 20px; margin: 0;'>
                   ${highlightedHtml}
                 </div>
diff --git a/frontend/src/components/SortControl.vue b/frontend/src/components/SortControl.vue
index 27c9e9b16f..a39a65f9bd 100644
--- a/frontend/src/components/SortControl.vue
+++ b/frontend/src/components/SortControl.vue
@@ -12,18 +12,11 @@
 		</Button>
 
 		<Dropdown :options="orderByItems" placement="right">
-			<Button class="text-base h-7 rounded-l-none flex-1" :disabled>
-				<div class="grid">
-					<span class="col-start-1 row-start-1 flex items-center gap-2">
-						{{ __(sortOrder.label) }}
-						<LucideSparkles v-if="sortOrder.smart" class="size-3" />
-					</span>
-					<span
-						aria-hidden="true"
-						class="sort-label-sizer col-start-1 row-start-1"
-						:data-width-text="sizingText"
-					/>
-				</div>
+			<Button class="text-base h-7 rounded-l-none" :disabled>
+				<span class="flex items-center gap-2">
+					{{ __(sortOrder.label) }}
+					<LucideSparkles v-if="sortOrder.smart" class="size-3" />
+				</span>
 			</Button>
 		</Dropdown>
 	</div>
@@ -55,8 +48,6 @@ const props = defineProps<{
 	disabled?: boolean
 }>()
 
-const sizingText = computed(() => props.options.map((option) => __(option.label)).join('\n'))
-
 const toggleAscending = () => {
 	sortOrder.value.ascending = !sortOrder.value.ascending
 }
@@ -72,15 +63,3 @@ const orderByItems = computed<DropdownOption[]>(() => [
 	...(props.menuItems ?? []),
 ])
 </script>
-
-<style scoped>
-/* Width-reservation sizer, same pattern as frappe-ui Select's .select-trigger-sizer */
-.sort-label-sizer::after {
-	content: attr(data-width-text);
-	display: block;
-	height: 0;
-	overflow: hidden;
-	white-space: pre;
-	visibility: hidden;
-}
-</style>
diff --git a/frontend/src/index.css b/frontend/src/index.css
index a796199648..506b3330e0 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -3,6 +3,7 @@
    CSS-layer classes in the beta line — use them in markup (see SuiteLayout.vue),
    NOT via @apply (they are not registered Tailwind color utilities). */
 @import 'frappe-ui/style.css';
+@import 'frappe-ui/list-style.css';
 
 html,
 body,
@@ -10,6 +11,25 @@ body,
   height: 100%;
 }
 
+/* setupTheme adds this for one frame so a theme switch doesn't animate. */
+html.theme-switching,
+html.theme-switching * {
+  transition: none !important;
+}
+
+/* Lets the UA theme scrollbars, form controls and canvas backgrounds. */
+:root[data-theme='light'] {
+  color-scheme: light;
+}
+
+:root[data-theme='dark'] {
+  color-scheme: dark;
+}
+
+* {
+  scrollbar-width: thin;
+}
+
 body {
   margin: 0;
 }
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index c3c8b2e60c..a9ed179168 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -1,4 +1,4 @@
-import frappeUIPreset from 'frappe-ui/tailwind'
+import frappeUIPreset from "frappe-ui/tailwind";
 
 /** @type {import('tailwindcss').Config} */
 export default {
@@ -18,7 +18,7 @@ export default {
   ],
   variants: {
     extend: {
-      display: ['group-hover'],
+      display: ["group-hover"],
     },
   },
-}
+};
diff --git a/suite/drive/api/list.py b/suite/drive/api/list.py
index b498b0db73..f7d7d9a405 100644
--- a/suite/drive/api/list.py
+++ b/suite/drive/api/list.py
@@ -5,22 +5,22 @@
 from pypika import Criterion, CustomFunction, Order
 from pypika import functions as fn
 
-
 from suite.drive.utils import (
-    MIME_LIST_MAP,
-    default_team,
-    get_home_folder,
-    FILE_FIELDS,
-    map_ff_to_drive_type,
-    entity_kind,
-    hide_storage_key,
-    is_site_file,
-    KIND_VIRTUAL,
-    STATUS_ACTIVE,
-    STATUS_TRASHED,
+	FILE_FIELDS,
+	KIND_VIRTUAL,
+	MIME_LIST_MAP,
+	STATUS_ACTIVE,
+	STATUS_TRASHED,
+	default_team,
+	entity_kind,
+	get_home_folder,
+	hide_storage_key,
+	is_site_file,
+	map_ff_to_drive_type,
 )
 from suite.drive.utils.api import get_default_access
-from .permissions import get_user_access, user_has_permission, get_teams
+
+from .permissions import get_teams, get_user_access, user_has_permission
 
 DriveUser = frappe.qb.DocType("User")
 UserGroupMember = frappe.qb.DocType("User Group Member")
@@ -36,467 +36,509 @@
 
 # Helper Functions for Filters
 def _apply_shared_filter(query, shared_type):
-    """
-    Filters query to show shared files based on shared_type parameter.
-    - "with": files shared with current user
-    - "public": publicly shared files
-    - False/None: all files with permission join
-    """
-    user = frappe.session.user if frappe.session.user != "Guest" else ""
-    cond = (DrivePermission.entity == DriveFile.name) & (DrivePermission.user == user)
-
-    if shared_type == "with":
-        return query.right_join(DrivePermission).on(cond)
-    elif shared_type == "public":
-        cond = (DrivePermission.entity == DriveFile.name) & (DrivePermission.user == "")
-        return query.right_join(DrivePermission).on(cond)
-    else:
-        return query.left_join(DrivePermission).on(cond)
+	"""
+	Filters query to show shared files based on shared_type parameter.
+	- "with": files shared with current user
+	- "public": publicly shared files
+	- False/None: all files with permission join
+	"""
+	user = frappe.session.user if frappe.session.user != "Guest" else ""
+	cond = (DrivePermission.entity == DriveFile.name) & (DrivePermission.user == user)
+
+	if shared_type == "with":
+		return query.right_join(DrivePermission).on(cond)
+	elif shared_type == "public":
+		cond = (DrivePermission.entity == DriveFile.name) & (DrivePermission.user == "")
+		return query.right_join(DrivePermission).on(cond)
+	else:
+		return query.left_join(DrivePermission).on(cond)
 
 
 def _apply_file_kinds_filter(query, file_kinds):
-    """
-    Filters files by kind/mime type.
-    """
-    file_kinds = json.loads(file_kinds) if isinstance(file_kinds, str) else file_kinds
-    if not file_kinds:
-        return query
+	"""
+	Filters files by kind/mime type.
+	"""
+	file_kinds = json.loads(file_kinds) if isinstance(file_kinds, str) else file_kinds
+	if not file_kinds:
+		return query
 
-    mime_types = []
-    for kind in file_kinds:
-        mime_types.extend(MIME_LIST_MAP.get(kind, []))
+	mime_types = []
+	for kind in file_kinds:
+		mime_types.extend(MIME_LIST_MAP.get(kind, []))
 
-    criterion = [DriveFile.mime_type == mime_type for mime_type in mime_types]
-    if "Folder" in file_kinds:
-        criterion.append(DriveFile.is_folder == 1)
+	criterion = [DriveFile.mime_type == mime_type for mime_type in mime_types]
+	if "Folder" in file_kinds:
+		criterion.append(DriveFile.is_folder == 1)
 
-    return query.where(Criterion.any(criterion))
+	return query.where(Criterion.any(criterion))
 
 
 # Data Aggregation Functions
 def _get_children_count(files):
-    """
-    Returns a dict mapping folder names to their child count.
-    """
-    if not files:
-        return {}
-    query = (
-        frappe.qb.from_(DriveFile)
-        .where((DriveFile.folder.isin([k["name"] for k in files])) & (DriveFile.status == STATUS_ACTIVE))
-        .groupby(DriveFile.folder)
-        .select(DriveFile.folder, fn.Count("*").as_("child_count"))
-    )
-    return dict(query.run())
+	"""
+	Returns a dict mapping folder names to their child count.
+	"""
+	if not files:
+		return {}
+	query = (
+		frappe.qb.from_(DriveFile)
+		.where((DriveFile.folder.isin([k["name"] for k in files])) & (DriveFile.status == STATUS_ACTIVE))
+		.groupby(DriveFile.folder)
+		.select(DriveFile.folder, fn.Count("*").as_("child_count"))
+	)
+	return dict(query.run())
+
+
+def _get_slide_counts(rows):
+	"""
+	Returns a dict mapping presentation docnames to their slide count.
+	"""
+	# Imported here as suite.slides imports from suite.drive.
+	from suite.slides.doctype.presentation.presentation import get_slide_counts
+
+	return get_slide_counts(
+		[
+			r["content_docname"]
+			for r in rows
+			if r.get("content_doctype") == "Presentation" and r.get("content_docname")
+		]
+	)
 
 
 def _get_share_count(names):
-    """
-    Returns a dict mapping file names to their share count.
-    Counts shares with individual users (excludes team and public shares).
-    """
-    if not names:
-        return {}
-    query = (
-        frappe.qb.from_(DriveFile)
-        .right_join(DrivePermission)
-        .on(DrivePermission.entity == DriveFile.name)
-        .where(
-            DrivePermission.entity.isin(names)
-            & (DrivePermission.user != "")
-            & (DrivePermission.user != "$TEAM")
-        )
-        .select(DriveFile.name, fn.Count("*").as_("share_count"))
-        .groupby(DriveFile.name)
-    )
-    return dict(query.run())
+	"""
+	Returns a dict mapping file names to their share count.
+	Counts shares with individual users (excludes team and public shares).
+	"""
+	if not names:
+		return {}
+	query = (
+		frappe.qb.from_(DriveFile)
+		.right_join(DrivePermission)
+		.on(DrivePermission.entity == DriveFile.name)
+		.where(
+			DrivePermission.entity.isin(names)
+			& (DrivePermission.user != "")
+			& (DrivePermission.user != "$TEAM")
+		)
+		.select(DriveFile.name, fn.Count("*").as_("share_count"))
+		.groupby(DriveFile.name)
+	)
+	return dict(query.run())
 
 
 def _get_public_files(names):
-    """
-    Returns a set of file names that are publicly shared.
-    """
-    if not names:
-        return set()
-    query = (
-        frappe.qb.from_(DrivePermission)
-        .where((DrivePermission.entity.isin(names)) & (DrivePermission.user == ""))
-        .select(DrivePermission.entity)
-    )
-    return set(k[0] for k in query.run())
+	"""
+	Returns a set of file names that are publicly shared.
+	"""
+	if not names:
+		return set()
+	query = (
+		frappe.qb.from_(DrivePermission)
+		.where((DrivePermission.entity.isin(names)) & (DrivePermission.user == ""))
+		.select(DrivePermission.entity)
+	)
+	return set(k[0] for k in query.run())
 
 
 def _get_team_files(names):
-    """
-    Returns a set of file names shared with team.
-    """
-    if not names:
-        return set()
-    query = (
-        frappe.qb.from_(DrivePermission)
-        .where((DrivePermission.entity.isin(names)) & (DrivePermission.team == 1))
-        .select(DrivePermission.entity)
-    )
-    return set(k[0] for k in query.run())
+	"""
+	Returns a set of file names shared with team.
+	"""
+	if not names:
+		return set()
+	query = (
+		frappe.qb.from_(DrivePermission)
+		.where((DrivePermission.entity.isin(names)) & (DrivePermission.team == 1))
+		.select(DrivePermission.entity)
+	)
+	return set(k[0] for k in query.run())
 
 
 def _get_basic_query(search):
-    # Status defaults to Active for team and Site files alike — no team carve-out.
-    query = frappe.qb.from_(DriveFile).where(DriveFile.status == STATUS_ACTIVE)
-    if search:
-        query = query.where(DriveFile.file_name.like(f"%{search}%"))
-    return query
+	# Status defaults to Active for team and Site files alike — no team carve-out.
+	query = frappe.qb.from_(DriveFile).where(DriveFile.status == STATUS_ACTIVE)
+	if search:
+		query = query.where(DriveFile.file_name.like(f"%{search}%"))
+	return query
 
 
 @frappe.whitelist(allow_guest=True)
 @default_team
 def files(
-    team: str,
-    entity_name: str | None = None,
-    order_by: str = "modified",
-    ascending: bool = True,
-    file_kinds: list[str] | str = [],
-    search: str = None,
-    start: int = 0,
-    limit: int = None,
+	team: str,
+	entity_name: str | None = None,
+	order_by: str = "modified",
+	ascending: bool = True,
+	file_kinds: list[str] | str = [],
+	search: str = None,
+	start: int = 0,
+	limit: int = None,
 ):
-    """
-    Returns active files in a folder. Pass `start`/`limit` to page through large
-    folders. When `search` is set, results span the whole team (not just the
-    current folder).
-    """
-    if team == "all":
-        team = None
-    if not entity_name:
-        if team:
-            entity_name = get_home_folder(team)["name"]
-        else:
-            frappe.throw("You must provide a folder to query", ValueError)
-
-    entity = frappe.get_doc("File", entity_name)
-    team = entity.team
-
-    if not user_has_permission(entity, "read"):
-        frappe.throw(
-            f"You don't have access.",
-            frappe.exceptions.PermissionError,
-        )
-
-    if is_site_file(entity):
-        # Framework folder (e.g. desk "Home"): list via frappe.get_list so the
-        # framework's own File permissions apply. team dropped so get_query_data
-        # skips the Drive-only team filter.
-        ff_filters = {"folder": entity_name}
-        if search:
-            ff_filters["file_name"] = ["like", f"%{search}%"]
-        names = frappe.get_list("File", filters=ff_filters, pluck="name")
-        return get_query_data(
-            frappe.qb.from_(DriveFile).where(DriveFile.name.isin(names or [""])),
-            file_kinds=file_kinds,
-            order_by=order_by,
-            ascending=ascending,
-            start=start,
-            limit=limit,
-        )
-
-    # Folder browse isn't user-scoped, so restrict to team files (Site files use the ff branch).
-    query = _get_basic_query(search).where(DriveFile.team.isnotnull())
-    if search:
-        if not team:
-            query = query.where(DriveFile.team.isin(get_teams() or [""]))
-    else:
-        # Folder browsing; search is team-wide so it skips the folder filter.
-        query = query.where(DriveFile.folder == entity_name)
-
-    return get_query_data(
-        query,
-        team=team,
-        file_kinds=file_kinds,
-        entity_name=entity_name,
-        order_by=order_by,
-        ascending=ascending,
-        start=start,
-        limit=limit,
-    )
+	"""
+	Returns active files in a folder. Pass `start`/`limit` to page through large
+	folders. When `search` is set, results span the whole team (not just the
+	current folder).
+	"""
+	if team == "all":
+		team = None
+	if not entity_name:
+		if team:
+			entity_name = get_home_folder(team)["name"]
+		else:
+			frappe.throw("You must provide a folder to query", ValueError)
+
+	entity = frappe.get_doc("File", entity_name)
+	team = entity.team
+
+	if not user_has_permission(entity, "read"):
+		frappe.throw(
+			"You don't have access.",
+			frappe.exceptions.PermissionError,
+		)
+
+	if is_site_file(entity):
+		# Framework folder (e.g. desk "Home"): list via frappe.get_list so the
+		# framework's own File permissions apply. team dropped so get_query_data
+		# skips the Drive-only team filter.
+		ff_filters = {"folder": entity_name}
+		if search:
+			ff_filters["file_name"] = ["like", f"%{search}%"]
+		names = frappe.get_list("File", filters=ff_filters, pluck="name")
+		return get_query_data(
+			frappe.qb.from_(DriveFile).where(DriveFile.name.isin(names or [""])),
+			file_kinds=file_kinds,
+			order_by=order_by,
+			ascending=ascending,
+			start=start,
+			limit=limit,
+		)
+
+	# Folder browse isn't user-scoped, so restrict to team files (Site files use the ff branch).
+	query = _get_basic_query(search).where(DriveFile.team.isnotnull())
+	if search:
+		if not team:
+			query = query.where(DriveFile.team.isin(get_teams() or [""]))
+	else:
+		# Folder browsing; search is team-wide so it skips the folder filter.
+		query = query.where(DriveFile.folder == entity_name)
+
+	return get_query_data(
+		query,
+		team=team,
+		file_kinds=file_kinds,
+		entity_name=entity_name,
+		order_by=order_by,
+		ascending=ascending,
+		start=start,
+		limit=limit,
+	)
+
 
 @frappe.whitelist()
 @default_team
 def shared(
-    team: str,
-    shared_type: str = "with",
-    order_by: str = "modified",
-    ascending: bool = True,
-    file_kinds: list[str] | str = [],
-    search: str = None,
+	team: str,
+	shared_type: str = "with",
+	order_by: str = "modified",
+	ascending: bool = True,
+	file_kinds: list[str] | str = [],
+	search: str = None,
+	start: int = 0,
+	limit: int = None,
 ):
-    """
-    Returns shared files based on shared_type parameter.
-    - "with": files shared with current user
-    - "public": publicly shared files
-    """
-    query = _get_basic_query(search)
-
-    return get_query_data(
-        query,
-        shared_type=shared_type,
-        file_kinds=file_kinds,
-        team=team,
-        order_by=order_by,
-        ascending=ascending,
-    )
+	"""
+	Returns shared files based on shared_type parameter.
+	- "with": files shared with current user
+	- "public": publicly shared files
+	"""
+	query = _get_basic_query(search)
+
+	return get_query_data(
+		query,
+		shared_type=shared_type,
+		file_kinds=file_kinds,
+		team=team,
+		order_by=order_by,
+		ascending=ascending,
+		start=start,
+		limit=limit,
+	)
 
 
 @frappe.whitelist()
 @default_team
 def favourites(
-    team: str,
-    order_by: str = "modified",
-    ascending: bool = True,
-    file_kinds: list[str] | str = [],
-    search: str = None,
+	team: str,
+	order_by: str = "modified",
+	ascending: bool = True,
+	file_kinds: list[str] | str = [],
+	search: str = None,
+	start: int = 0,
+	limit: int = None,
 ):
-    """
-    Returns all files marked as favourite by the current user.
-    """
-    query = _get_basic_query(search)
-
-    return get_query_data(
-        query,
-        favourites_only=True,
-        file_kinds=file_kinds,
-        team=team,
-        order_by=order_by,
-        ascending=ascending,
-    )
+	"""
+	Returns all files marked as favourite by the current user.
+	"""
+	query = _get_basic_query(search)
+
+	return get_query_data(
+		query,
+		favourites_only=True,
+		file_kinds=file_kinds,
+		team=team,
+		order_by=order_by,
+		ascending=ascending,
+		start=start,
+		limit=limit,
+	)
 
 
 @frappe.whitelist()
 @default_team
 def recents(
-    team: str,
-    order_by: str = "modified",
-    ascending: bool = True,
-    file_kinds: list[str] | str = [],
-    search: str = None,
+	team: str,
+	order_by: str = "modified",
+	ascending: bool = True,
+	file_kinds: list[str] | str = [],
+	search: str = None,
+	start: int = 0,
+	limit: int = None,
 ):
-    """
-    Returns all files marked recently by the current user.
-    """
-    query = _get_basic_query(search)
-
-    return get_query_data(
-        query,
-        recents_only=True,
-        file_kinds=file_kinds,
-        team=team,
-        order_by=order_by,
-        ascending=ascending,
-    )
+	"""
+	Returns all files marked recently by the current user.
+	"""
+	query = _get_basic_query(search)
+
+	return get_query_data(
+		query,
+		recents_only=True,
+		file_kinds=file_kinds,
+		team=team,
+		order_by=order_by,
+		ascending=ascending,
+		start=start,
+		limit=limit,
+	)
 
 
 @frappe.whitelist()
 @default_team
 def trash(
-    team: str,
-    order_by: str = "modified",
-    ascending: bool = True,
-    file_kinds: list[str] | str = [],
-    search: str = None,
+	team: str,
+	order_by: str = "modified",
+	ascending: bool = True,
+	file_kinds: list[str] | str = [],
+	search: str = None,
+	start: int = 0,
+	limit: int = None,
 ):
-    """
-    Returns all deleted files (trash) for the current user.
-    """
-    query = (
-        frappe.qb.from_(DriveFile)
-        .where(DriveFile.status == STATUS_TRASHED)
-        .where(DriveFile.team.isnotnull())
-        .where(DriveFile.owner == frappe.session.user)
-    )
-    if search:
-        query = query.where(DriveFile.file_name.like(f"%{search}%"))
-
-    return get_query_data(
-        query,
-        team=team,
-        file_kinds=file_kinds,
-        order_by=order_by,
-        ascending=ascending,
-    )
+	"""
+	Returns all deleted files (trash) for the current user.
+	"""
+	query = (
+		frappe.qb.from_(DriveFile)
+		.where(DriveFile.status == STATUS_TRASHED)
+		.where(DriveFile.team.isnotnull())
+		.where(DriveFile.owner == frappe.session.user)
+	)
+	if search:
+		query = query.where(DriveFile.file_name.like(f"%{search}%"))
+
+	return get_query_data(
+		query,
+		team=team,
+		file_kinds=file_kinds,
+		order_by=order_by,
+		ascending=ascending,
+		start=start,
+		limit=limit,
+	)
 
 
 ALLOWED_SORT_FIELDS = {
-    "name", "file_name", "file_size", "file_type", "creation", "modified", "owner",
+	"name",
+	"file_name",
+	"file_size",
+	"file_type",
+	"creation",
+	"modified",
+	"owner",
 }
 
 
 def get_query_data(
-    query,
-    favourites_only=False,
-    recents_only=False,
-    file_kinds=[],
-    team=None,
-    entity_name=None,
-    shared_type=None,
-    order_by="modified",
-    ascending=True,
-    start=0,
-    limit=None,
+	query,
+	favourites_only=False,
+	recents_only=False,
+	file_kinds=[],
+	team=None,
+	entity_name=None,
+	shared_type=None,
+	order_by="modified",
+	ascending=True,
+	start=0,
+	limit=None,
 ):
-    """
-    Runs all the necessary commands to obtain files in the structure expected by Drive frontend.
-    """
-    if order_by not in ALLOWED_SORT_FIELDS:
-        order_by = "modified"
-
-    # Filter by team
-    if team and team != "all":
-        query = query.where(DriveFile.team == team)
-
-    # Apply shared filter
-    query = _apply_shared_filter(query, shared_type)
-    query = query.select(
-        *FILE_FIELDS,
-        DrivePermission.user.as_("shared_team"),
-    ).where(fn.Coalesce(DrivePermission.read, 1).as_("read") == 1)
-
-    # Send owner display data with files so the list view doesn't need a separate users fetch
-    query = query.left_join(DriveUser).on(DriveUser.name == DriveFile.owner).select(
-        DriveUser.full_name.as_("owner_full_name"), DriveUser.user_image.as_("owner_image")
-    )
-
-    # Apply favourites filter
-    if favourites_only:
-        query = query.right_join(DriveFavourite)
-    else:
-        query = query.left_join(DriveFavourite)
-
-    query = query.on((DriveFavourite.entity == DriveFile.name) & (DriveFavourite.user == frappe.session.user)).select(
-        DriveFavourite.name.as_("is_favourite")
-    )
-
-    # Apply recents filter
-    if recents_only:
-        query = (
-            query.right_join(Recents)
-            .on((Recents.entity_name == DriveFile.name) & (Recents.user == frappe.session.user))
-            .orderby(Recents.last_interaction, order=Order.desc)
-        )
-    else:
-        query = (
-            query.left_join(Recents)
-            .on((Recents.entity_name == DriveFile.name) & (Recents.user == frappe.session.user))
-            .orderby(DriveFile[order_by], order=Order.asc if ascending else Order.desc)
-        )
-
-    query = query.select(Recents.last_interaction.as_("accessed"))
-
-    # Apply file kind filter
-    query = _apply_file_kinds_filter(query, file_kinds)
-
-    # Page through large result sets (aggregation below is scoped to the page).
-    if limit:
-        query = query.limit(int(limit)).offset(int(start or 0))
-
-    res = query.run(as_dict=True)
-
-    default = get_default_access(entity_name) if entity_name else 0
-
-    # Deduplicate results
-    if shared_type:
-        added = set()
-        filtered_list = []
-        for r in res:
-            if r["name"] not in added:
-                filtered_list.append(r)
-            added.add(r["name"])
-        res = filtered_list
-
-    # Get aggregated data, scoped to the files we're returning
-    names = [r["name"] for r in res]
-    children_count = _get_children_count(res)
-    share_count = _get_share_count(names)
-    public_files = _get_public_files(names)
-    team_files = _get_team_files(names)
-
-    # Enrich results with aggregated data and permissions
-    for r in res:
-        name = r["name"]
-        r["child_count"] = children_count.get(name, 0)
-        if name in public_files:
-            r["share_count"] = -2
-        elif default > -1 and name in team_files:
-            r["share_count"] = -1
-        elif default == 0:
-            r["share_count"] = share_count.get(name, default)
-        else:
-            r["share_count"] = default
-
-        if is_site_file(r):
-            r["file_type"] = map_ff_to_drive_type(r)
-        r["kind"] = entity_kind(r)
-        hide_storage_key(r)
-        r |= get_user_access(name)
-
-    return res
+	"""
+	Runs all the necessary commands to obtain files in the structure expected by Drive frontend.
+	"""
+	if order_by not in ALLOWED_SORT_FIELDS:
+		order_by = "modified"
+
+	# Filter by team
+	if team and team != "all":
+		query = query.where(DriveFile.team == team)
+
+	# Apply shared filter
+	query = _apply_shared_filter(query, shared_type)
+	query = query.select(
+		*FILE_FIELDS,
+		DrivePermission.user.as_("shared_team"),
+	).where(fn.Coalesce(DrivePermission.read, 1).as_("read") == 1)
+
+	# Send owner display data with files so the list view doesn't need a separate users fetch
+	query = (
+		query.left_join(DriveUser)
+		.on(DriveUser.name == DriveFile.owner)
+		.select(DriveUser.full_name.as_("owner_full_name"), DriveUser.user_image.as_("owner_image"))
+	)
+
+	# Apply favourites filter
+	if favourites_only:
+		query = query.right_join(DriveFavourite)
+	else:
+		query = query.left_join(DriveFavourite)
+
+	query = query.on(
+		(DriveFavourite.entity == DriveFile.name) & (DriveFavourite.user == frappe.session.user)
+	).select(DriveFavourite.name.as_("is_favourite"))
+
+	# Apply recents filter
+	if recents_only:
+		query = (
+			query.right_join(Recents)
+			.on((Recents.entity_name == DriveFile.name) & (Recents.user == frappe.session.user))
+			.orderby(Recents.last_interaction, order=Order.desc)
+		)
+	else:
+		query = (
+			query.left_join(Recents)
+			.on((Recents.entity_name == DriveFile.name) & (Recents.user == frappe.session.user))
+			.orderby(DriveFile[order_by], order=Order.asc if ascending else Order.desc)
+		)
+
+	query = query.select(Recents.last_interaction.as_("accessed"))
+
+	# Apply file kind filter
+	query = _apply_file_kinds_filter(query, file_kinds)
+
+	# Page through large result sets (aggregation below is scoped to the page).
+	if limit:
+		query = query.limit(int(limit)).offset(int(start or 0))
+
+	res = query.run(as_dict=True)
+
+	default = get_default_access(entity_name) if entity_name else 0
+
+	# Deduplicate results
+	if shared_type:
+		added = set()
+		filtered_list = []
+		for r in res:
+			if r["name"] not in added:
+				filtered_list.append(r)
+			added.add(r["name"])
+		res = filtered_list
+
+	# Get aggregated data, scoped to the files we're returning
+	names = [r["name"] for r in res]
+	children_count = _get_children_count(res)
+	slide_counts = _get_slide_counts(res)
+	share_count = _get_share_count(names)
+	public_files = _get_public_files(names)
+	team_files = _get_team_files(names)
+
+	# Enrich results with aggregated data and permissions
+	for r in res:
+		name = r["name"]
+		r["child_count"] = children_count.get(name, 0)
+		if r.get("content_doctype") == "Presentation":
+			r["slide_count"] = slide_counts.get(r["content_docname"], 0)
+		if name in public_files:
+			r["share_count"] = -2
+		elif default > -1 and name in team_files:
+			r["share_count"] = -1
+		elif default == 0:
+			r["share_count"] = share_count.get(name, default)
+		else:
+			r["share_count"] = default
+
+		if is_site_file(r):
+			r["file_type"] = map_ff_to_drive_type(r)
+		r["kind"] = entity_kind(r)
+		hide_storage_key(r)
+		r |= get_user_access(name)
+
+	return res
 
 
 @frappe.whitelist()
 def get_attachments(doctype: str | None = None, docname: str | None = None):
-    """
-    Returns all files that are attached to a document.
-    If either doctype or docname isn't specified, returns a list of folder-like objects
-    that represents the tree Doctype > Doc > Attachments.
-    """
-    # filter_file scopes attachments by doctype-level read (coarse), so gate on
-    # the authoritative per-file check used when files are actually served — this
-    # lets a file's owner through while blocking users who only have generic read
-    # on the doctype but not the specific document.
-    if doctype and docname:
-        files = frappe.get_list(
-            "File", filters={"attached_to_doctype": doctype, "attached_to_name": docname}, pluck="name"
-        )
-        files = [f for f in files if user_has_permission(f, "read")]
-        query = frappe.qb.from_(DriveFile).where(DriveFile.name.isin(files or [""]))
-        return get_query_data(query)
-
-    titles = {}
-    if doctype:
-        names = frappe.get_list(
-            "File", filters={"attached_to_doctype": doctype}, fields=["name", "attached_to_name"]
-        )
-        doctypes_set = Counter(
-            k["attached_to_name"] for k in names if user_has_permission(k["name"], "read")
-        )
-        # Show each document by its title field rather than its raw name (ID).
-        title_field = frappe.get_meta(doctype).get_title_field()
-        if title_field != "name":
-            titles = dict(
-                frappe.get_all(
-                    doctype,
-                    filters={"name": ["in", list(doctypes_set) or [""]]},
-                    fields=["name", title_field],
-                    as_list=True,
-                )
-            )
-    else:
-        names = frappe.get_list(
-            "File",
-            filters={"attached_to_doctype": ["is", "set"]},
-            fields=["name", "attached_to_doctype"],
-        )
-        doctypes_set = Counter(
-            k["attached_to_doctype"] for k in names if user_has_permission(k["name"], "read")
-        )
-
-    return [
-        {
-            "name": name,
-            "file_name": titles.get(name) or name,
-            "is_folder": 1,
-            "file_type": "Folder",
-            "child_count": size,
-            "kind": KIND_VIRTUAL,
-            "attached_to_doctype": doctype or name,
-            "attached_to_name": name if doctype else None,
-        }
-        for name, size in doctypes_set.items()
-    ]
+	"""
+	Returns all files that are attached to a document.
+	If either doctype or docname isn't specified, returns a list of folder-like objects
+	that represents the tree Doctype > Doc > Attachments.
+	"""
+	# filter_file scopes attachments by doctype-level read (coarse), so gate on
+	# the authoritative per-file check used when files are actually served — this
+	# lets a file's owner through while blocking users who only have generic read
+	# on the doctype but not the specific document.
+	if doctype and docname:
+		files = frappe.get_list(
+			"File", filters={"attached_to_doctype": doctype, "attached_to_name": docname}, pluck="name"
+		)
+		files = [f for f in files if user_has_permission(f, "read")]
+		query = frappe.qb.from_(DriveFile).where(DriveFile.name.isin(files or [""]))
+		return get_query_data(query)
+
+	titles = {}
+	if doctype:
+		names = frappe.get_list(
+			"File", filters={"attached_to_doctype": doctype}, fields=["name", "attached_to_name"]
+		)
+		doctypes_set = Counter(k["attached_to_name"] for k in names if user_has_permission(k["name"], "read"))
+		# Show each document by its title field rather than its raw name (ID).
+		title_field = frappe.get_meta(doctype).get_title_field()
+		if title_field != "name":
+			titles = dict(
+				frappe.get_all(
+					doctype,
+					filters={"name": ["in", list(doctypes_set) or [""]]},
+					fields=["name", title_field],
+					as_list=True,
+				)
+			)
+	else:
+		names = frappe.get_list(
+			"File",
+			filters={"attached_to_doctype": ["is", "set"]},
+			fields=["name", "attached_to_doctype"],
+		)
+		doctypes_set = Counter(
+			k["attached_to_doctype"] for k in names if user_has_permission(k["name"], "read")
+		)
+
+	return [
+		{
+			"name": name,
+			"file_name": titles.get(name) or name,
+			"is_folder": 1,
+			"file_type": "Folder",
+			"child_count": size,
+			"kind": KIND_VIRTUAL,
+			"attached_to_doctype": doctype or name,
+			"attached_to_name": name if doctype else None,
+		}
+		for name, size in doctypes_set.items()
+	]
diff --git a/suite/slides/doctype/presentation/presentation.py b/suite/slides/doctype/presentation/presentation.py
index b3c2a87750..33295e6f55 100644
--- a/suite/slides/doctype/presentation/presentation.py
+++ b/suite/slides/doctype/presentation/presentation.py
@@ -11,6 +11,7 @@
 import frappe
 from frappe.core.doctype.file.file import get_local_image
 from frappe.model.document import Document
+from frappe.query_builder.functions import Count
 from frappe.utils.caching import redis_cache
 
 from suite.drive.api.permissions import user_has_permission
@@ -207,12 +208,30 @@ def get_presentations() -> list[dict]:
 		filters=[["owner", "=", frappe.session.user], ["is_template", "=", 0]],
 	)
 
+	counts = get_slide_counts([p["name"] for p in presentations])
 	for presentation in presentations:
-		presentation["slide_count"] = frappe.db.count("Slide", {"parent": presentation["name"]})
+		presentation["slide_count"] = counts.get(presentation["name"], 0)
 
 	return presentations
 
 
+def get_slide_counts(presentation_names: list[str]) -> dict[str, int]:
+	"""Returns a dict mapping presentation names to their slide count."""
+	if not presentation_names:
+		return {}
+
+	Slide = frappe.qb.DocType("Slide")
+	return dict(
+		(
+			frappe.qb.from_(Slide)
+			.select(Slide.parent, Count("*"))
+			.where(Slide.parenttype == "Presentation")
+			.where(Slide.parent.isin(presentation_names))
+			.groupby(Slide.parent)
+		).run()
+	)
+
+
 @frappe.whitelist()
 def update_slide_attachments(parent: str, slide: dict | str):
 	frappe.get_doc("Presentation", parent).check_permission("write")