@brftech/filex-core 0.30.1 → 0.32.0

package/src/FileExplorer.vue

@@ -46,6 +46,14 @@ import RecentlyOpened from './components/RecentlyOpened.vue';
 import Breadcrumb from './components/Breadcrumb.vue';
 import ListView from './components/ListView.vue';
 import GridView from './components/GridView.vue';
+import FilterBar from './components/FilterBar.vue' /* surucu:d1 */;
+import ViewSwitcher from './components/ViewSwitcher.vue' /* surucu:d1 */;
+import {
+  EMPTY_FILTERS,
+  applyFilters,
+  filtersActive,
+  type DriveFilters,
+} from './lib/fileFilters' /* surucu:d1 */;
 import GalleryView from './components/GalleryView.vue'; /* wiring:d2 */
 import ContextMenu, { type ContextAction } from './components/ContextMenu.vue';
 import UploadProgress from './components/UploadProgress.vue';
@@ -86,16 +94,30 @@ import { useTabs, type TabState } from './composables/useTabs';
 /* /wiring:d1 */
 /* wiring:e2 — uçtan uca şifreli klasörler (docs/E2E-ENCRYPTION.md) */
 import EncryptedFolderModal from './components/EncryptedFolderModal.vue';
+import RecoveryKeyModal from './components/RecoveryKeyModal.vue';
+import E2eRecoveryUnlockModal from './components/E2eRecoveryUnlockModal.vue';
 import {
   createKeyRing,
-  createMarker,
+  createEncryptedFolder,
+  upgradeMarkerV1,
+  addEscrowSlot,
+  declineEscrowSlot,
+  escrowOfferState,
   parseMarker,
-  verifyPassword,
+  unlockWithPassword,
+  unlockWithRecoveryKey,
+  unlockWithEscrowKey,
+  importEscrowPrivateKey,
+  markerHasRecovery,
+  escrowAvailability,
+  bytesToB64,
+  b64ToBytes,
   encryptFile,
   decryptFile,
   hasMagic,
   E2E_MARKER_NAME,
   E2E_MAX_FILE_BYTES,
+  type E2eMarker,
 } from './lib/e2ecrypto';
 /* /wiring:e2 */
 
@@ -104,12 +126,17 @@ import {
    panes or split view shows mismatched rows). */
 import {
   filterListing,
-  virtualSegmentKey,
+  virtualSegmentLabel,
+  makeTagSegment,
+  tagOfPath,
+  VIRTUAL_SEGMENTS,
   showHiddenFiles,
   setShowHiddenFiles,
   injectTrashRow,
   hydrateTrashRow as hydrateTrashRowShared,
 } from './lib/listing';
+import { setNodeStarred } from './lib/star';
+import { fetchAllTags, fetchTaggedRows, invalidateTagCache } from './lib/tags';
 import { resolveTransfer, type TransferIntent } from './lib/transfer';
 import {
   activeNativeDrag,
@@ -310,17 +337,38 @@ const trashActive = computed(() => trashMode.value);
  * pattern is trashMode's, generalised — including the part that matters most,
  * that load() clears the mode, or the view sticks and every later navigation
  * renders under the wrong heading. */
-type NavView = '' | 'recent' | 'starred' | 'shared' | 'trash';
+type NavView = '' | 'recent' | 'starred' | 'shared' | 'trash' | 'tag';
 const navView = ref<NavView>('');
 /** Where the view was entered from, so "up" goes back there. */
 const navViewOrigin = ref<string>('');
-/** Sentinel parked in `dirname` so the breadcrumb can label the view. */
-const NAV_VIEW_DIRNAME: Record<Exclude<NavView, '' | 'trash'>, string> = {
+/** The tag being browsed while navView === 'tag' ('' otherwise). */
+const navTag = ref<string>('');
+/** Sentinel parked in `dirname` so the breadcrumb can label the view. The tag
+ *  view's sentinel is built per tag (`makeTagSegment`) — see lib/listing. */
+const NAV_VIEW_DIRNAME: Record<Exclude<NavView, '' | 'trash' | 'tag'>, string> = {
   recent: '.recent',
   starred: '.starred',
   shared: '.shared',
 };
 
+/**
+ * A path that is a virtual view rather than a folder. Used by load() so a
+ * sentinel reaching it — a restored tab, a pasted `#.tag~invoices`, a reload,
+ * the breadcrumb's own crumb — opens the VIEW instead of asking the backend
+ * for a folder called `.starred` and landing on "not found". (That was already
+ * true of the four shipped views; the tag view would have inherited it.)
+ */
+function virtualViewOf(path: string): { kind: Exclude<NavView, ''>; tag: string } | null {
+  const clean = String(path ?? '').replace(/^\/+|\/+$/g, '');
+  if (!clean) return null;
+  const tag = tagOfPath(clean);
+  if (tag) return { kind: 'tag', tag };
+  const key = VIRTUAL_SEGMENTS[clean];
+  if (!key) return null;
+  const kind = clean.slice(1) as Exclude<NavView, '' | 'tag'>;
+  return { kind, tag: '' };
+}
+
 // When the caller can see exactly ONE storage, the multi-storage root is a
 // one-row list that carries no information — the user clicks through it every
 // single time. Treat that storage as the floor instead: open it directly and
@@ -448,6 +496,80 @@ function onStarChange(n: FileNode, value: boolean) {
   starredIds.value = next;
 }
 
+/* === yildiz:s1 — starring as an ACTION ================================
+ * The star shipped as an indicator in ONE view: `StarButton` was rendered by
+ * ListView and nowhere else, so a user in grid view (the mode the navigation
+ * panel's own screenshots show) had a Starred view with no way to fill it.
+ * It is a verb, like tagging — so it is a menu entry beside Tags, a chip on
+ * every card, and a key.
+ *
+ * ⚠ ONE implementation of the request: `lib/star.ts`. StarButton calls it,
+ * this calls it. A menu cannot render a component, but it must not grow its
+ * own fetch either — that is the second path that drifts.
+ */
+/** Which of `targets` can carry a star: files the server knows by id.
+ *
+ * Empty when the identity surfaces are suppressed, which is the one
+ * chokepoint the context menu, the toolbar and the keyboard action all go
+ * through — so the affordance disappears everywhere at once rather than in
+ * the two places somebody remembered. Offering to star a file while the
+ * Starred view is hidden would write into a list the person cannot open,
+ * and under a shared app token that list belongs to everyone at once. */
+function starableNodes(targets: FileNode[]): FileNode[] {
+  if (!identitySurfaces.value) return [];
+  return targets.filter((n) => typeof n.id === 'number' && n.type === 'file');
+}
+
+/** True when EVERY starable target is starred — i.e. the action reads
+ *  "Unstar". A mixed selection reads "Star" and stars the rest, which is the
+ *  behaviour that needs no explanation. */
+function selectionAllStarred(targets: FileNode[]): boolean {
+  const list = starableNodes(targets);
+  return list.length > 0 && list.every((n) => starredIds.value.has(n.id as number));
+}
+
+/**
+ * Toggle the star on a selection. Optimistic like the button, and rolled back
+ * per node on failure — a partial failure must not leave the set lying about
+ * what the server holds.
+ */
+async function toggleStar(targets: FileNode[]) {
+  const list = starableNodes(targets);
+  if (list.length === 0) return;
+  const next = !selectionAllStarred(list);
+  const opts = {
+    apiBase: props.config.apiBase ?? '',
+    authHeaders: () => buildAuthHeaders(),
+    authCredentials: api.credentialsMode(),
+  };
+  const set = new Set(starredIds.value);
+  for (const n of list) {
+    if (next) set.add(n.id as number);
+    else set.delete(n.id as number);
+  }
+  starredIds.value = set;
+  let failed = 0;
+  await Promise.all(
+    list.map(async (n) => {
+      try {
+        await setNodeStarred(n.id as number, next, opts);
+      } catch {
+        failed += 1;
+        const rollback = new Set(starredIds.value);
+        if (next) rollback.delete(n.id as number);
+        else rollback.add(n.id as number);
+        starredIds.value = rollback;
+      }
+    }),
+  );
+  if (failed > 0) flashToast(t('star.failed'));
+  // Starring is what fills the Starred view; if that IS the view on screen,
+  // an unstar has to remove the row instead of leaving a listing that
+  // disagrees with its own heading.
+  if (navView.value === 'starred') await loadNavView('starred');
+}
+/* === /yildiz:s1 === */
+
 async function markRecent(n: FileNode) {
   if (typeof n.id !== 'number') return;
   try {
@@ -470,6 +592,17 @@ function openTagPickerFor(n: FileNode) {
   showTagPicker.value = true;
 }
 
+/* etiket:t1 — the user just changed a node's tags, so the cached "every tag
+ * that exists" list is wrong RIGHT NOW, which is the only staleness anybody
+ * notices. Drop it and re-ask; if a tag view is on screen, refresh it too —
+ * removing a file's tag has to remove it from the listing that is named after
+ * that tag. */
+function onNodeTagsChanged() {
+  invalidateTagCache();
+  void loadNavTags(true);
+  if (navView.value === 'tag' && navTag.value) void loadTagView(navTag.value);
+}
+
 function onRecentOpen(entry: { id: number; storage_id?: number; path: string; name: string }) {
   // RecentlyOpened emits the bare row — synthesize a FileNode shaped
   // enough for openNode to route into the editor / preview.
@@ -586,7 +719,17 @@ function closeInspector() {
  * the "one behaviour on one surface" split this shared package exists to
  * prevent. */
 const uiProfile = computed(() => props.config.uiProfile ?? 'standard');
-const simpleUi = computed(() => uiProfile.value === 'simple');
+/**
+ * ⚠ `drive` answers TRUE here. It is a superset of `simple`, so every question
+ * `simple` already answers ("one pane?", "no tab strip?", "list and grid
+ * only?") must keep the same answer under it — asking `=== 'simple'` in those
+ * places is how the drive profile would silently grow a split pane the day
+ * somebody adds a fourth condition. `driveShell` is only for what `drive` adds
+ * on TOP.
+ */
+const simpleUi = computed(() => uiProfile.value === 'simple' || uiProfile.value === 'drive');
+/* === surucu:d1 — the Drive shell (GitHub #14, the reporter's mockups) ===== */
+const driveShell = computed(() => uiProfile.value === 'drive');
 
 const SIDENAV_LS_KEY = 'filex.sidenav';
 const sideNavExpanded = ref<boolean>(
@@ -626,6 +769,31 @@ const sideNavEnabled = computed(() => props.config.sideNav ?? !rootPathProp);
 const navVisible = computed(
   () => sideNavEnabled.value && (isNarrow.value ? navDrawerOpen.value : true),
 );
+/**
+ * Is the navigation panel already offering Trash as a destination?
+ *
+ * ⚠ Keyed to `sideNavEnabled`, NOT to `navVisible`. Three cases decided here,
+ * and each one is a judgement about whether the person has a way to the bin
+ * that is not this row:
+ *
+ *   - collapsed to the icon rail → OFFERING. The entry is still rendered, still
+ *     one click, still labelled for a screen reader; only its text is gone.
+ *   - the drawer under 560px, closed → OFFERING. The toolbar's panel toggle is
+ *     on screen at every width, so the destination is one tap away. Keying this
+ *     to `navVisible` instead would add and remove a row from the LISTING every
+ *     time somebody opened or closed the drawer — the folder changing under
+ *     them for a reason that has nothing to do with the folder.
+ *   - no panel at all (`sideNav: false`, or the default under `rootPath`) → NOT
+ *     offering, and the row stays. That is the case it was invented for: a
+ *     listing with no other door to the bin.
+ *
+ * `trashVisible: false` is handled inside the helper and outranks all of it —
+ * it means no Trash anywhere, panel entry included.
+ */
+const navOffersTrash = computed(
+  () => sideNavEnabled.value && props.config.trashVisible !== false,
+);
+
 /** What the toolbar toggle reports as pressed. */
 const navToggleOn = computed(() =>
   isNarrow.value ? navDrawerOpen.value : sideNavExpanded.value,
@@ -659,6 +827,32 @@ const sharedStorageNames = ref<string[]>([]);
  * storage form), and /api/tokens caps every scope against the caller's own role.
  */
 const connectionsEnabled = computed(() => props.config.connections ?? !simpleUi.value);
+
+/**
+ * Is this caller an integration rather than a person (backend migration 00030)?
+ *
+ * A filex API token authenticates AS its owner, so from here a shared embed
+ * token and somebody's own token are indistinguishable — only the server knows
+ * which kind it is, and it says so in `capabilities.caller_kind`. A host that
+ * already knows can say so with `config.callerKind`, which wins — purely to
+ * spare the flash of a Starred row that appears and then disappears when
+ * capabilities land.
+ *
+ * ⚠ Defaults to "person" in every unknown state — no config, capabilities not
+ * back yet, or a server too old to answer. The cost of guessing wrong that way
+ * is one row too many for a moment; guessing the other way would hide Recent
+ * and API keys from every ordinary user of every older server.
+ */
+const callerIsApp = computed(
+  () => (props.config.callerKind ?? capabilitiesData.value?.caller_kind) === 'app',
+);
+/**
+ * The identity-bearing surfaces: API keys, Recent, Starred, Shared with me.
+ * ⚠ Suppression is per token KIND, never per role — a viewer is still a person
+ * with their own recents. And it is not the whole panel: Upload, the storages,
+ * Trash and "How to connect" stay useful inside an embed.
+ */
+const identitySurfaces = computed(() => !callerIsApp.value);
 const showConnections = ref(false);
 const showTokens = ref(false);
 function openConnections() {
@@ -666,6 +860,10 @@ function openConnections() {
   showConnections.value = true;
 }
 function openTokens() {
+  // Belt and braces: the panel entry is gone for an app token, but a host may
+  // also open this overlay from its own chrome, and /api/tokens would answer
+  // that caller with a 403 it has nowhere to show.
+  if (callerIsApp.value) return;
   showConnections.value = false;
   showTokens.value = true;
 }
@@ -696,6 +894,130 @@ watchEffect(() => {
   if (simpleUi.value && viewMode.value === 'gallery') viewMode.value = 'grid';
 });
 
+/* === surucu:d1 — the filter row =========================================
+ * Three chips over the listing in hand: Type · Modified · Size.
+ *
+ * ⚠ CLIENT-SIDE, and that is the honest place for them, not a shortcut. The
+ * listing endpoint reads exactly six parameters (`action`, `path`, `filter`,
+ * `storage`, `parent`, `cache`) and has no `limit`/`offset` either — so the
+ * rows in hand ARE the folder, and filtering them here answers the whole
+ * question rather than "the first page of it". Wiring a chip to a `min_size`
+ * the server never reads would look identical and change nothing.
+ *
+ * ⚠ Reset on navigation. A filter that survives a folder change makes the next
+ * folder look empty, and the reason is off-screen the moment you scroll.
+ */
+const driveFilters = ref<DriveFilters>({ ...EMPTY_FILTERS });
+const filtersOn = computed(() => driveShell.value && filtersActive(driveFilters.value));
+/** What the views render. Identical reference to `files` when nothing is set. */
+const displayFiles = computed<FileNode[]>(() =>
+  driveShell.value ? applyFilters(files.value, driveFilters.value) : files.value,
+);
+function clearDriveFilters() {
+  setDriveFilters({ ...EMPTY_FILTERS });
+}
+function setDriveFilters(v: DriveFilters) {
+  driveFilters.value = v;
+  // A selection the filter just hid would still be what Delete acts on, with
+  // nothing on screen to say so.
+  selection.clear();
+}
+watch(
+  () => `${currentPath.value}|${navView.value}`,
+  () => {
+    if (filtersActive(driveFilters.value)) driveFilters.value = { ...EMPTY_FILTERS };
+  },
+);
+
+/**
+ * surucu:d1 — what the header field says it will search: the folder you are
+ * standing in, by name. At a storage root that is the storage; in a panel view
+ * ("Recent", a tag) it is that view's own name, because searching from there
+ * searches what is on screen.
+ */
+const driveScopeLabel = computed(() => {
+  if (navView.value === 'tag') return navTag.value;
+  if (navView.value) return t(`sidenav.${navView.value}`);
+  const rel = currentPath.value.replace(/\/+$/, '');
+  const last = rel.split('/').filter(Boolean).pop();
+  return last || adapter.value || '';
+});
+
+/**
+ * surucu:d1 — the ⌘K escalation. The header field searches THIS folder (it
+ * sets `searchQuery`, which the loader answers with `action=search`); this
+ * hands the same words to the command palette, which is where "everywhere",
+ * the saved searches and the commands live. One box, one shortcut, and the
+ * hint printed on the box does what it says.
+ */
+const paletteSeed = ref('');
+function openPaletteWith(q: string) {
+  paletteSeed.value = q;
+  showPalette.value = true;
+}
+
+/**
+ * surucu:d1 — "Request files" from the New menu: the access modal on the
+ * CURRENT folder, opened on its file-drop tab. The modal already owns that
+ * surface; this only gives it a target, since the folder you are standing in
+ * is not a selected row and has no FileNode of its own.
+ */
+const permInitialTab = ref<'perms' | 'share' | 'drop' | undefined>(undefined);
+function openFileRequest() {
+  const path = qualify(currentPath.value);
+  if (!path) return;
+  const segs = currentPath.value.split('/').filter(Boolean);
+  permTarget.value = {
+    path,
+    basename: segs.length ? segs[segs.length - 1] : adapter.value,
+    type: 'dir',
+  };
+  permInitialTab.value = 'drop';
+  showPerm.value = true;
+}
+
+/** surucu:d1 — a link minted from the details panel; same event the share
+ *  dialog emits, so a host listening for `share-created` hears both. */
+function onInspectorShareCreated(payload: { path: string; url: string }) {
+  emit('share-created', { path: payload.path, url: payload.url, pin: null });
+  flashToast(t('inspector.copied'));
+}
+
+/* === surucu:d1 — the storage line under the navigation ==================
+ * Fetched once per mount, and ONLY in the drive shell: no other profile draws
+ * it, and an explorer that has drawn this panel for a year should not start
+ * making a request it has no use for. `quotaMe()` answers null for a server
+ * without the route or a caller without a person behind it, and null renders
+ * nothing at all.
+ */
+const quotaSnapshot = ref<{ used: number; total: number; unlimited: boolean } | null>(null);
+async function loadQuota() {
+  if (!driveShell.value || !identitySurfaces.value) {
+    quotaSnapshot.value = null;
+    return;
+  }
+  const q = await api.quotaMe();
+  if (!q) {
+    quotaSnapshot.value = null;
+    return;
+  }
+  const unlimited = !!q.unlimited || q.quota_bytes <= 0;
+  // ⚠ No ceiling AND nothing counted = nothing to say, so say nothing.
+  //
+  // Measured, not guessed: `used_bytes` is `SUM(nodes.size) WHERE owner_id = me`
+  // and `nodes.owner_id` is set by the UPLOAD path only — it is nil for every
+  // file a storage sync discovered (handlers/shared.go). On an install whose
+  // drives were mounted rather than uploaded into, the honest figure is
+  // therefore "0 B", and a line reading "0 B used" under a drive visibly full
+  // of files reads as a broken widget, not as a fact about quota. With a quota
+  // set the line still earns its place — the ceiling is real and uploads count
+  // against it — so only the no-quota-no-usage case is dropped.
+  quotaSnapshot.value =
+    unlimited && q.used_bytes <= 0
+      ? null
+      : { used: q.used_bytes, total: q.quota_bytes, unlimited };
+}
+
 /**
  * nodeRowToFileNode — the starred / recently-opened endpoints answer with raw
  * node rows (relative `path`, numeric `storage_id`), not the listing shape.
@@ -776,17 +1098,27 @@ async function fetchNavRows(kind: 'recent' | 'starred' | 'shared'): Promise<File
 /** Open one of the panel views in the main pane. */
 async function loadNavView(kind: Exclude<NavView, ''>) {
   closeNavDrawer();
+  if (kind === 'tag') {
+    // The tag view needs a name; the panel calls loadTagView directly.
+    if (navTag.value) await loadTagView(navTag.value);
+    return;
+  }
   if (kind === 'trash') {
     await loadTrash();
     // ⚠ After loadTrash, not before: loadTrash goes through load()-adjacent
     // state and the mode has to be the last word, or the panel row for Trash
     // never lights up.
     navView.value = 'trash';
+    navTag.value = '';
     return;
   }
   loading.value = true;
-  navViewOrigin.value = currentPath.value ?? '';
+  // ⚠ Only when coming from a real folder. Stepping Starred → Recent used to
+  // record `.starred` as the origin, so "up" out of Recent landed in Starred
+  // and the user had to press it twice to get back to their files.
+  if (!navView.value) navViewOrigin.value = currentPath.value ?? '';
   navView.value = kind;
+  navTag.value = '';
   trashMode.value = false;
   e2eRoot.value = '';
   selection.clear();
@@ -808,6 +1140,78 @@ async function loadNavView(kind: Exclude<NavView, ''>) {
   }
 }
 
+/* === etiket:t1 — the tag view ==========================================
+ * "Tagged files should show up inside the tag." A tag is not a folder: its
+ * files live all over the tree and in every storage, so this is the same
+ * shape as Starred — a per-user endpoint answering with node rows, each
+ * carrying its own qualified path, so opening one navigates normally.
+ *
+ * The sentinel is `.tag~<name>` (lib/listing). Every surface that renders a
+ * path segment — tab strip, breadcrumb, inspector heading, the address-bar
+ * hash — goes through `virtualSegmentLabel`, so none of them can print the
+ * sentinel the way the strip once printed `.shared`.
+ */
+async function loadTagView(tag: string) {
+  closeNavDrawer();
+  const name = String(tag ?? '').trim();
+  if (!name) return;
+  loading.value = true;
+  if (!navView.value) navViewOrigin.value = currentPath.value ?? '';
+  navView.value = 'tag';
+  navTag.value = name;
+  trashMode.value = false;
+  e2eRoot.value = '';
+  selection.clear();
+  try {
+    const rows = await fetchTaggedRows(name, {
+      apiBase: props.config.apiBase ?? '',
+      authHeaders: () => buildAuthHeaders(),
+      authCredentials: api.credentialsMode(),
+    });
+    files.value = rows.map(nodeRowToFileNode).filter((n): n is FileNode => n !== null);
+    const seg = makeTagSegment(name);
+    dirname.value = seg;
+    currentPath.value = seg;
+    // Spans every storage, like Starred/Recent/Shared — so no storage crumb.
+    adapter.value = '';
+  } catch (err) {
+    const msg = err instanceof Error ? err.message : String(err);
+    files.value = [];
+    emit('error', { message: msg, context: { op: `nav-view:tag:${name}` } });
+    flashToast(msg);
+  } finally {
+    loading.value = false;
+  }
+}
+
+/**
+ * The tags that exist, for the panel's Tags section.
+ *
+ * ⚠ WHEN this loads was a deliberate decision, not a default: `tags/all` is a
+ * distinct-scan and the panel renders in every mounted explorer (a page can
+ * hold several). It is therefore NOT fetched during mount — it is asked for
+ * once the first listing is on screen, through a module-level cache that
+ * dedupes concurrent callers and reuses the answer for a minute
+ * (lib/tags.ts). N explorers on a page cost ONE query; a navigation costs
+ * none. The cache is dropped the instant the user edits tags, which is the
+ * only staleness anybody can notice.
+ */
+const navTags = ref<string[]>([]);
+const navTagsLoaded = ref(false);
+
+async function loadNavTags(force = false) {
+  if (!navVisible.value) return; // no panel → nobody can see the list
+  navTags.value = await fetchAllTags({
+    apiBase: props.config.apiBase ?? '',
+    authHeaders: () => buildAuthHeaders(),
+    authCredentials: api.credentialsMode(),
+    force,
+  });
+  navTagsLoaded.value = true;
+}
+
+/* === /etiket:t1 === */
+
 /** Panel to a storage root. */
 function openNavStorage(name: string) {
   closeNavDrawer();
@@ -840,7 +1244,11 @@ const inspectorDirLabel = computed(() => {
   if (trashMode.value) return t('node.trash');
   const p = (currentPath.value ?? '').replace(/^\/+|\/+$/g, '');
   if (!p) return adapter.value || t('breadcrumb.root');
-  return p.split('/').pop() || p;
+  const seg = p.split('/').pop() || p;
+  /* etiket:t1 — a THIRD surface that renders a path segment, and it had the
+     same hole the tab strip did: in a virtual view the details panel headed
+     itself ".starred". Same shared resolver, so it cannot drift again. */
+  return virtualSegmentLabel(seg, t) || seg;
 });
 function onInspectorManage(n: FileNode) {
   permTarget.value = n;
@@ -1025,6 +1433,48 @@ function toggleHiddenFiles() {
 }
 
 async function load(path?: string) {
+  /* === etiket:t1 — a sentinel is a VIEW, not a folder ===================
+   * A restored tab, a reload on `#.trash` / `#.starred` / `#.tag~invoices`,
+   * or the breadcrumb crumb for the view you are standing in all arrive here
+   * as a plain path. Without this they went to the backend as a FOLDER NAME
+   * and came back 404, so a view that exists and is merely empty greeted the
+   * user with "Folder not found — this folder does not exist, was moved, or
+   * you do not have access to it" (measured on `#.trash` and `#.starred`,
+   * v0.30.1). The trash is not missing; it is empty, and it has a state that
+   * says so.
+   *
+   * ⚠ Through `virtualViewOf` → the ONE map in lib/listing.ts, never a second
+   * list of names here: two copies of that mapping are what printed `.shared`
+   * in the tab strip two days ago, and the tag view adds a dynamic third kind.
+   *
+   * ⚠ Only a sentinel this build KNOWS is intercepted. Anything else keeps
+   * going — a user may genuinely own a folder called `.config`, and with
+   * hidden files shown they can open it.
+   *
+   * ⚠ And only when the view is actually REACHABLE here. Under `rootPath` the
+   * panel is off on purpose (the views span storages and would list files
+   * outside the folder the embed was confined to), so a stale hash from
+   * another deployment must not smuggle them in: it falls back to the root —
+   * which the floor clamp below then turns into the confined folder.
+   *
+   * ⚠ No recursion: neither loader calls load(), and the fallback passes '',
+   * which is not a sentinel.
+   */
+  const asView = virtualViewOf(path ?? currentPath.value ?? '');
+  if (asView) {
+    const reachable =
+      asView.kind === 'trash' ? props.config.trashVisible !== false : sideNavEnabled.value;
+    if (!reachable) {
+      // Clear it explicitly: if the fallback lands on the path we are already
+      // on, watch(currentPath) never fires and the dead hash would survive to
+      // the next reload (the same trap leaveNotFound documents).
+      writePersistedPath('');
+      return await load('');
+    }
+    if (asView.kind === 'tag') await loadTagView(asView.tag);
+    else await loadNavView(asView.kind);
+    return;
+  }
   loading.value = true;
   // Any normal navigation exits trash mode (the trash view is entered only
   // by opening the virtual `.trash` row, which calls loadTrash()).
@@ -1033,6 +1483,7 @@ async function load(path?: string) {
      this the mode sticks and the breadcrumb keeps saying "Starred" over a
      folder listing. */
   navView.value = '';
+  navTag.value = '';
   let requested = path ?? currentPath.value ?? '';
   try {
     notFoundPath.value = '';
@@ -1077,7 +1528,16 @@ async function load(path?: string) {
     files.value = filterListing(resp.files);
     // Inject virtual `.trash` entry at root only — shared helper so the
     // split-view secondary pane shows the exact same row (no row-offset).
-    if (injectTrashRow(files.value, resp.adapter, resp.dirname, props.config.trashVisible !== false)) {
+    // ⚠ …and NOT into a search result. The search response's `dirname` is the
+    // scope it searched, so it is the storage root exactly as an `index` of
+    // that folder would be; only this call site knows which of the two it just
+    // asked for.
+    if (
+      injectTrashRow(files.value, resp.adapter, resp.dirname, props.config.trashVisible !== false, {
+        isSearchResult: !!searchQuery.value,
+        navOffersTrash: navOffersTrash.value,
+      })
+    ) {
       void hydrateTrashRowShared(files.value, resp.adapter, api);
     }
     // currentPath is the user-facing form: `s3-test/example` in
@@ -1376,6 +1836,28 @@ onMounted(async () => {
   /* gezinti:g1 — which storages are grant-only, so the panel can mark them
      before anybody opens the shared view. */
   void loadSharedStorages();
+  /* etiket:t1 — the panel's tag list. AFTER the first listing has been
+     awaited above, never racing it: `tags/all` is a distinct-scan and the
+     folder the user asked for is the only thing on the critical path. The
+     module-level cache in lib/tags.ts means several explorers on one page
+     still cost a single query. */
+  void loadNavTags();
+  /* surucu:d1 — the storage line. After the listing, like the tag list: it is
+     a status, and the folder somebody asked for is the critical path. */
+  void loadQuota();
+  /* ⚠ The panel is not always on screen at mount. Below 560px it is a DRAWER
+     that starts closed, so `navVisible` is false and the call above returns
+     without asking for anything — measured at 390px: the drawer opened with
+     no Tags section at all. Ask again the first time the panel appears.
+     ⚠ Registered HERE and not beside loadNavTags: `watch` evaluates its
+     source immediately, `navVisible` reads `isNarrow`, and `isNarrow` is
+     declared further down the file — so a watcher created at setup time threw
+     "Cannot access 'isNarrow' before initialization" and took the whole
+     explorer down with it (measured: blank pane, two TDZ errors in the
+     console). In onMounted every ref exists. */
+  watch(navVisible, (visible) => {
+    if (visible && !navTagsLoaded.value) void loadNavTags();
+  });
   if (hashPersistEnabled()) {
     window.addEventListener('hashchange', onHashChange);
   }
@@ -1514,6 +1996,11 @@ useKeyboardShortcuts(rootEl, {
   onGoUp: () => (paneIsActive.value ? splitPaneRef.value?.goUp() : goUp()) /* wiring:d1 pane-route */,
   /* cila:c wiring */
   onPathJump: () => {
+    /* surucu:d1 — the shortcut from anywhere else opens a BLANK palette. The
+       seed belongs to the drive header's field; leaving the last one in place
+       would reopen the palette pre-filled with a query the user has since
+       moved on from. */
+    paletteSeed.value = '';
     showPalette.value = true;
   },
   onShowHelp: () => {
@@ -1522,6 +2009,7 @@ useKeyboardShortcuts(rootEl, {
   /* /cila:c wiring */
   onQuickLook: () => quickLookToggle() /* wiring:c2 */,
   onToggleHidden: () => toggleHiddenFiles(),
+  onStar: () => void toggleStar(selection.nodes.value) /* yildiz:s1 */,
   onToggleInspector: () => toggleInspector() /* koru:k1 */,
   /* wiring:d1 — sekme aksiyonları (registry: tab-new/close/next/prev) */
   onTabNew: () => newTabHere(),
@@ -2033,6 +2521,9 @@ function selectionActionList(sel: FileNode[]): ContextAction[] {
   const isFile = single && sel[0]?.type === 'file';
   const tagsLabel = locale.value === 'en' ? 'Tags…' : 'Etiketler…';
   const singleHasId = single && typeof sel[0]?.id === 'number';
+  /* yildiz:s1 */
+  const canStar = starableNodes(sel).length > 0;
+  const allStarred = selectionAllStarred(sel);
   const copyIdLabel = locale.value === 'en' ? 'Copy node id' : "Node id'yi kopyala";
   // RBAC: gate mutating actions when the caller lacks edit on the target. The
   // "İzinler" (permissions) action shows only for owners on RBAC-on storages.
@@ -2058,7 +2549,17 @@ function selectionActionList(sel: FileNode[]): ContextAction[] {
     { key: 'cut', label: t('ctx.cut'), icon: '✂', hidden: !any || !w, disabled: !any },
     { key: 'copy', label: t('ctx.copy'), icon: '❐', hidden: !any, disabled: !any },
     { key: 'paste', label: t('ctx.paste'), icon: '📋', hidden: !w, disabled: !clipboard.value.mode },
-    { divider: true, key: 'sep-meta', label: '', hidden: !singleHasId },
+    { divider: true, key: 'sep-meta', label: '', hidden: !singleHasId && !canStar },
+    /* yildiz:s1 — "star must be an action, like a tag" (owner, v0.30.0).
+       Beside Tags on purpose: they are the same kind of verb, and this is the
+       ONLY star a grid/gallery user reaches with the keyboard. Works on a
+       multi-selection; the label follows the selection's state. */
+    {
+      key: 'star',
+      label: allStarred ? t('ctx.unstar') : t('ctx.star'),
+      icon: allStarred ? '★' : '☆',
+      hidden: !canStar,
+    },
     { key: 'tags', label: tagsLabel, icon: '🏷', hidden: !singleHasId, disabled: !singleHasId },
     ...keepActionsFor(sel),
     { divider: true, key: 'sep2', label: '', hidden: !w },
@@ -2177,6 +2678,9 @@ async function dispatchItemAction(key: string, targets: FileNode[]) {
         );
       }
       break;
+    case 'star':
+      await toggleStar(targets);
+      break;
     case 'tags':
       if (targets[0]) openTagPickerFor(targets[0]);
       break;
@@ -3285,8 +3789,8 @@ function tabLabel(path: string): string {
   // gezinti:g1 — the virtual views park a sentinel in the path. Translate via
   // the SHARED map: this special-cased only '.trash' when recent/starred/shared
   // arrived, so the strip read ".shared" at users (reported 2026-09-04).
-  const virtualKey = virtualSegmentKey(p.split('/').pop() || p);
-  if (virtualKey) return t(virtualKey);
+  const virtualLabel = virtualSegmentLabel(p.split('/').pop() || p, t);
+  if (virtualLabel) return virtualLabel;
   if (!p) return multiStorageRoot.value ? t('breadcrumb.root') : adapter.value || t('breadcrumb.root');
   return p.split('/').pop() || p;
 }
@@ -3577,6 +4081,66 @@ const e2eUnlockErr = ref('');
 const showEncFolder = ref(false);
 const e2eCreateBusy = ref(false);
 
+/* wiring:e2 recovery — kurtarma anahtarı + escrow.
+ *
+ * The marker of the folder we are looking at is cached here while the lock
+ * screen is up: the recovery dialog needs to know which doors this folder
+ * actually has (a pre-0.31 folder has none) before offering them. */
+const e2eMarker = ref<E2eMarker | null>(null);
+const showRecoveryUnlock = ref(false);
+const e2eRecoverBusy = ref(false);
+const e2eRecoverErr = ref<string | null>(null);
+// The shown-once key. Held only while its dialog is open.
+const showRecoveryKey = ref(false);
+const recoveryKeyValue = ref('');
+const recoveryKeyVariant = ref<'created' | 'upgraded'>('created');
+const recoveryKeyFolder = ref('');
+// A v1 folder that just opened by password: offer to give it recovery now,
+// because this is the only moment filex holds the password.
+const e2eUpgradeOffer = ref(false);
+const e2eUpgradePw = ref('');
+const e2eUpgradeBusy = ref(false);
+
+/* wiring:e2 escrow-offer — offering an EXISTING folder an escrow slot.
+ *
+ * Adoption covers folders created after it, which on an installation that
+ * has been running for a while is nobody's folders: the ones that matter
+ * already exist. The server cannot reach them — adding a slot needs the
+ * folder master key. Its owner can, from inside, with the password, and the
+ * one moment that password exists in the browser is an unlock. So this
+ * lives exactly where the v1 recovery offer lives, in the same strip, with
+ * the same shape.
+ *
+ * mode distinguishes the two ways in:
+ *   'unlock'  right after a successful password unlock — we still hold the
+ *             password, so Accept needs no typing, and Not now RECORDS a
+ *             refusal so the question is not asked again.
+ *   'manual'  the way back, from the unlocked strip, for somebody who said
+ *             no earlier. The password is gone by then, so it is typed, and
+ *             Cancel records nothing — they already answered once. */
+const e2eEscrowOffer = ref(false);
+const e2eEscrowOfferMode = ref<'unlock' | 'manual'>('unlock');
+const e2eEscrowPw = ref('');
+const e2eEscrowBusy = ref(false);
+const e2eEscrowErr = ref('');
+
+/** The installation's escrow public key, or null when escrow is off.
+ *  Published in /api/capabilities on purpose — see docs/E2E-ENCRYPTION.md. */
+const e2eEscrowPub = computed<string | null>(
+  () => capabilitiesData.value?.e2e_escrow?.public_key || null,
+);
+/** Where the honest version of "what escrow can and cannot do" lives.
+ *  ⚠ Linked from the offer on purpose: the notice says what accepting means,
+ *  and the page says what the use-notification can and cannot promise — that
+ *  an operator holding the private key can decrypt offline with no request,
+ *  no notification and no audit row. Somebody being asked to hand over a key
+ *  is entitled to read that before answering, not after. */
+const e2eEscrowDocsUrl = 'https://docs.filex.sh/E2E-ENCRYPTION#what-escrow-can-and-cannot-do';
+
+const e2eEscrowKid = computed<string | null>(
+  () => capabilitiesData.value?.e2e_escrow?.kid || null,
+);
+
 function e2eKek(): CryptoKey | null {
   return e2eRing.get(e2eRoot.value) ?? null;
 }
@@ -3595,7 +4159,7 @@ async function e2eUnlock() {
   try {
     let markerText = '';
     try {
-      const { blob, url } = await api.fetchBlob(wireJoin(e2eRoot.value, E2E_MARKER_NAME));
+      const { blob, url } = await api.fetchBlob(wireJoin(e2eRoot.value, E2E_MARKER_NAME), { fresh: true });
       URL.revokeObjectURL(url);
       markerText = await blob.text();
     } catch {
@@ -3607,13 +4171,36 @@ async function e2eUnlock() {
       e2eUnlockErr.value = t('e2e.unlock.marker_missing');
       return;
     }
-    const kek = await verifyPassword(marker, e2ePw.value);
-    if (!kek) {
+    e2eMarker.value = marker;
+    const fmk = await unlockWithPassword(marker, e2ePw.value);
+    if (!fmk) {
       e2eUnlockErr.value = t('e2e.unlock.wrong');
       return;
     }
-    e2eRing.set(e2eRoot.value, kek);
+    e2eRing.set(e2eRoot.value, fmk);
     e2eRingVer.value++;
+    /* wiring:e2 recovery — a folder from before recovery existed has no way
+     * back in but its password. This is the ONE moment we hold that password,
+     * so ask now. Asking is all we do: the folder keeps working untouched if
+     * the user says no, and saying yes is the only path that also hands the
+     * operator an escrow key (when the install has one), which is why the
+     * prompt says so rather than doing it quietly. */
+    if (marker.v === 1) {
+      e2eUpgradePw.value = e2ePw.value;
+      e2eUpgradeOffer.value = true;
+    } else if (escrowOfferState(marker, e2eEscrowKid.value) === 'offer') {
+      /* wiring:e2 escrow-offer — a v2 folder that predates escrow here.
+       * ⚠ Only after the unlock SUCCEEDED, and only by password: accepting
+       * gives the operator a key to this folder, so the person asked has to
+       * be the person who can already open it. A v1 folder is handled by the
+       * branch above, which seals an escrow slot as part of the upgrade and
+       * already discloses that — two offers on one unlock would be two
+       * chances to get the disclosure wrong. */
+      e2eEscrowPw.value = e2ePw.value;
+      e2eEscrowOfferMode.value = 'unlock';
+      e2eEscrowErr.value = '';
+      e2eEscrowOffer.value = true;
+    }
     e2ePw.value = '';
   } finally {
     e2eUnlockBusy.value = false;
@@ -3740,17 +4327,28 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
   try {
     const dirWire = qualify(currentPath.value);
     await api.newFolder(dirWire, payload.name);
-    const { marker, kek } = await createMarker(payload.password);
+    /* wiring:e2 recovery — the folder gets a recovery key at birth, and an
+     * escrow slot when the installation has one. Both are decided HERE and
+     * never again: the wrapped copies are written into the marker now, so a
+     * folder created without escrow can never be opened by an escrow key. */
+    const { marker, fmk, recoveryKey } = await createEncryptedFolder(payload.password, {
+      escrowPublicKey: e2eEscrowPub.value,
+    });
     const markerFile = new File([JSON.stringify(marker)], E2E_MARKER_NAME, {
       type: 'application/json',
     });
     const newDirWire = wireJoin(dirWire, payload.name);
     await api.uploadMultipart(newDirWire, [markerFile]);
     // Oluşturan oturumda kilit açık başlar (parolayı az önce kendisi girdi).
-    e2eRing.set(newDirWire, kek);
+    e2eRing.set(newDirWire, fmk);
     e2eRingVer.value++;
     showEncFolder.value = false;
-    flashToast(t('e2e.create.done'));
+    // ⚠ Show the key only after the marker is safely uploaded. Showing it
+    // first would promise recovery for a folder that failed to be created.
+    recoveryKeyValue.value = recoveryKey;
+    recoveryKeyFolder.value = payload.name;
+    recoveryKeyVariant.value = 'created';
+    showRecoveryKey.value = true;
     await load();
   } catch (err) {
     emit('error', { message: (err as Error).message, context: { op: 'e2e-create' } });
@@ -3759,6 +4357,238 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
     e2eCreateBusy.value = false;
   }
 }
+
+/* --- wiring:e2 recovery ------------------------------------------------
+ *
+ * Two more ways into a locked folder, and one way to give an old folder
+ * those ways. The password path above is untouched, and nothing here runs
+ * without an explicit user action.
+ */
+
+/** Unlock without the password: user recovery key, or the operator's escrow
+ *  key. The escrow branch announces itself to the server first. */
+async function e2eRecoverUnlock(payload: { mode: 'recovery' | 'escrow'; value: string }) {
+  if (!e2eMarker.value || !e2eRoot.value) return;
+  e2eRecoverBusy.value = true;
+  e2eRecoverErr.value = null;
+  try {
+    let fmk: CryptoKey | null = null;
+    if (payload.mode === 'recovery') {
+      fmk = await unlockWithRecoveryKey(e2eMarker.value, payload.value);
+      if (!fmk) {
+        e2eRecoverErr.value = t('e2e.recover.wrong_recovery');
+        return;
+      }
+    } else {
+      let priv: CryptoKey;
+      try {
+        priv = await importEscrowPrivateKey(payload.value);
+      } catch {
+        e2eRecoverErr.value = t('e2e.recover.bad_escrow_key');
+        return;
+      }
+      fmk = await unlockWithEscrowKey(e2eMarker.value, priv);
+      if (!fmk) {
+        e2eRecoverErr.value = t('e2e.recover.wrong_escrow');
+        return;
+      }
+      /* ⚠ Announce BEFORE unlocking, and treat a failure to announce as a
+       * failure to unlock. The server hands out a nonce sealed to the escrow
+       * public key; returning it proves the key was really here, and that is
+       * what earns the owner their notification.
+       *
+       * ⚠⚠ This is not enforcement and must never be described as such. An
+       * operator holding the escrow private key can decrypt the same folder
+       * offline, with a script, and this code will never run. Refusing to
+       * unlock on a failed announcement only keeps the honest path honest. */
+      try {
+        const ch = await api.e2eEscrowChallenge(e2eRoot.value);
+        const nonce = new Uint8Array(
+          await crypto.subtle.decrypt(
+            { name: 'RSA-OAEP' },
+            priv,
+            b64ToBytes(ch.challenge).buffer as ArrayBuffer,
+          ),
+        );
+        await api.e2eEscrowUsed({
+          path: e2eRoot.value,
+          id: ch.id,
+          nonce: bytesToB64(nonce),
+        });
+      } catch (err) {
+        e2eRecoverErr.value = t('e2e.recover.notify_failed');
+        emit('error', {
+          message: (err as Error).message,
+          context: { op: 'e2e-escrow-notify' },
+        });
+        return;
+      }
+    }
+    e2eRing.set(e2eRoot.value, fmk);
+    e2eRingVer.value++;
+    showRecoveryUnlock.value = false;
+    flashToast(
+      payload.mode === 'escrow' ? t('e2e.recover.escrow_done') : t('e2e.recover.recovery_done'),
+    );
+  } catch (err) {
+    e2eRecoverErr.value = (err as Error).message;
+  } finally {
+    e2eRecoverBusy.value = false;
+  }
+}
+
+/** Open the recovery dialog from the lock screen. The marker was cached by
+ *  the last unlock attempt; fetch it if the user came straight here. */
+async function openRecoveryUnlock() {
+  if (!e2eMarker.value && e2eRoot.value) {
+    try {
+      const { blob, url } = await api.fetchBlob(wireJoin(e2eRoot.value, E2E_MARKER_NAME), { fresh: true });
+      URL.revokeObjectURL(url);
+      e2eMarker.value = parseMarker(await blob.text());
+    } catch {
+      e2eMarker.value = null;
+    }
+  }
+  e2eRecoverErr.value = null;
+  showRecoveryUnlock.value = true;
+}
+
+/** Give a pre-0.31 folder a recovery key, in place, using the password the
+ *  user just typed. The files are NOT rewritten — only the marker is. */
+async function e2eDoUpgrade() {
+  if (!e2eMarker.value || !e2eRoot.value || !e2eUpgradePw.value) return;
+  e2eUpgradeBusy.value = true;
+  try {
+    const up = await upgradeMarkerV1(e2eMarker.value, e2eUpgradePw.value, {
+      escrowPublicKey: e2eEscrowPub.value,
+    });
+    const markerFile = new File([JSON.stringify(up.marker)], E2E_MARKER_NAME, {
+      type: 'application/json',
+    });
+    await api.uploadMultipart(e2eRoot.value, [markerFile]);
+    e2eMarker.value = up.marker;
+    e2eUpgradeOffer.value = false;
+    e2eUpgradePw.value = '';
+    recoveryKeyValue.value = up.recoveryKey;
+    recoveryKeyFolder.value = wireBasename(e2eRoot.value);
+    recoveryKeyVariant.value = 'upgraded';
+    showRecoveryKey.value = true;
+  } catch (err) {
+    emit('error', { message: (err as Error).message, context: { op: 'e2e-upgrade' } });
+    flashToast(t('e2e.upgrade.failed'));
+  } finally {
+    e2eUpgradeBusy.value = false;
+  }
+}
+
+/* wiring:e2 escrow-offer ------------------------------------------- */
+
+/** Whether this folder could be given an escrow slot, and whether its owner
+ *  has already answered. Drives the way-back button in the unlocked strip. */
+const e2eEscrowOfferState = computed(() => escrowOfferState(e2eMarker.value, e2eEscrowKid.value));
+
+/** The way back. Somebody who said no last month can say yes today without
+ *  deleting and re-creating the folder — but the password is long gone from
+ *  memory, so they type it. That is not friction to be smoothed away: it is
+ *  the same proof of ownership the offer at unlock had, and handing the
+ *  operator a key deserves it. */
+function e2eOpenEscrowOffer() {
+  e2eEscrowOfferMode.value = 'manual';
+  e2eEscrowPw.value = '';
+  e2eEscrowErr.value = '';
+  e2eEscrowOffer.value = true;
+}
+
+/** Write a marker back to the folder and adopt it as the one we are holding.
+ *  Both escrow-offer answers change only `.filex-e2e.json`. */
+async function e2eWriteMarker(next: E2eMarker) {
+  const file = new File([JSON.stringify(next)], E2E_MARKER_NAME, { type: 'application/json' });
+  await api.uploadMultipart(e2eRoot.value, [file]);
+  e2eMarker.value = next;
+}
+
+/** Accept: seal this folder's master key to the installation's escrow key.
+ *  No file is re-encrypted or moved — only the marker gains a slot. */
+async function e2eAcceptEscrow() {
+  const marker = e2eMarker.value;
+  const pub = e2eEscrowPub.value;
+  if (!marker || !pub || !e2eRoot.value || e2eEscrowBusy.value) return;
+  if (!e2eEscrowPw.value) {
+    e2eEscrowErr.value = t('e2e.escrowoffer.password_required');
+    return;
+  }
+  e2eEscrowBusy.value = true;
+  e2eEscrowErr.value = '';
+  try {
+    // ⚠ The kid comes from the installation's CURRENT key, via the marker
+    // addEscrowSlot writes — never from anything the UI is displaying. The
+    // sibling bug went the other way (the dialog labelled a folder's slot
+    // with the installation's kid); writing the installation's kid into a
+    // slot sealed to some other key would be the same lie in reverse.
+    const next = await addEscrowSlot(marker, e2eEscrowPw.value, pub);
+    await e2eWriteMarker(next);
+    e2eEscrowOffer.value = false;
+    e2eEscrowPw.value = '';
+    flashToast(t('e2e.escrowoffer.done'));
+  } catch (err) {
+    // A wrong password is the ordinary case here and reads as a typo, not
+    // as a broken folder; anything else is worth reporting.
+    if ((err as Error)?.name === 'E2eDecryptError') {
+      e2eEscrowErr.value = t('e2e.escrowoffer.wrong_password');
+    } else {
+      e2eEscrowErr.value = t('e2e.escrowoffer.failed');
+      emit('error', { message: (err as Error).message, context: { op: 'e2e-escrow-offer' } });
+    }
+  } finally {
+    e2eEscrowBusy.value = false;
+  }
+}
+
+/** Not now. Recorded IN THE FOLDER, so the same person on another device is
+ *  not asked again and the answer survives a cleared browser. A question
+ *  that returns every single unlock is how people learn to click past
+ *  security dialogs without reading them. */
+async function e2eDeclineEscrow() {
+  const marker = e2eMarker.value;
+  if (!marker || !e2eRoot.value || e2eEscrowBusy.value) return;
+  e2eEscrowBusy.value = true;
+  try {
+    await e2eWriteMarker(declineEscrowSlot(marker, new Date().toISOString()));
+    e2eEscrowOffer.value = false;
+    e2eEscrowPw.value = '';
+    flashToast(t('e2e.escrowoffer.declined_toast'));
+  } catch (err) {
+    // ⚠ Fail towards asking again rather than towards silence: if the
+    // refusal could not be written, the honest state is "not answered yet".
+    e2eEscrowErr.value = t('e2e.escrowoffer.decline_failed');
+    emit('error', { message: (err as Error).message, context: { op: 'e2e-escrow-decline' } });
+  } finally {
+    e2eEscrowBusy.value = false;
+  }
+}
+
+/** Close the way-back panel without answering anything. Distinct from
+ *  declining: they answered once already, and re-recording the same refusal
+ *  would overwrite the date it was actually made. */
+function e2eCloseEscrowOffer() {
+  e2eEscrowOffer.value = false;
+  e2eEscrowPw.value = '';
+  e2eEscrowErr.value = '';
+}
+
+/** Decline the offer. The folder keeps working exactly as it did, and the
+ *  prompt returns on the next unlock because the risk has not changed. */
+function e2eDeclineUpgrade() {
+  e2eUpgradeOffer.value = false;
+  e2eUpgradePw.value = '';
+}
+
+/** Drop the shown-once key from memory the moment its dialog closes. */
+function closeRecoveryKey() {
+  showRecoveryKey.value = false;
+  recoveryKeyValue.value = '';
+  recoveryKeyFolder.value = '';
+}
 /* === /wiring:e2 === */
 </script>
 
@@ -3814,6 +4644,9 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       :nav-open="navToggleOn /* gezinti:g1 */"
       :nav-enabled="sideNavEnabled /* gezinti:g1 */"
       :view-modes="allowedViewModes /* gezinti:g1 */"
+      :shell="driveShell ? 'drive' : 'classic' /* surucu:d1 */"
+      :scope-label="driveScopeLabel /* surucu:d1 */"
+      @open-palette="openPaletteWith /* surucu:d1 */"
       @toggle-inspector="toggleInspector /* koru:k1 */"
       @toggle-nav="toggleSideNav /* gezinti:g1 */"
       @open-theme="showThemeGallery = true /* wiring:c1 */"
@@ -3844,16 +4677,26 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       :expanded="sideNavExpanded"
       :narrow="isNarrow"
       :active-view="navView"
+      :active-tag="navTag"
+      :tags="navTags"
+      :tags-loaded="navTagsLoaded"
       :active-storage="adapter"
       :storages="config.storages ?? []"
       :shared-storages="sharedStorageNames"
       :trash-visible="config.trashVisible !== false"
       :show-connections="connectionsEnabled"
+      :show-identity-surfaces="identitySurfaces"
       :can-write="canWriteHere && !atVirtualRoot && !trashActive"
       :locale="locale"
+      :new-menu="driveShell /* surucu:d1 */"
+      :can-request-files="canWriteHere && !atVirtualRoot && !trashActive && !navView /* surucu:d1 */"
+      :quota="quotaSnapshot /* surucu:d1 */"
+      :theme="themeMode /* surucu:d1 — the teleported New menu leaves .fe */"
+      @request-files="openFileRequest /* surucu:d1 */"
       @toggle="toggleSideNav"
       @close="closeNavDrawer"
       @open-view="loadNavView"
+      @open-tag="loadTagView"
       @open-storage="openNavStorage"
       @upload="triggerUpload"
       @new-folder="showNewFolder = true"
@@ -3878,6 +4721,14 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       class="fe__primary"
       :class="{ 'fe-pane--focus': mainPaneFocus } /* wiring:d1 — aktif panel vurgusu */"
     >
+    <!-- surucu:d1 — the breadcrumb row. In the drive shell it also carries the
+         two controls that belong to a LISTING rather than to the app (the view
+         switcher and the details toggle), which is where the mockups put them
+         and where the header then has room for one wide search field.
+         Everywhere else the wrapper is `display: contents`, so the breadcrumb
+         is the same flex child of `.fe__primary` it has always been — one
+         Breadcrumb, not a second copy that can drift. -->
+    <div :class="driveShell ? 'fe-subhead' : 'fe-subhead--plain'">
     <Breadcrumb
       :dirname="dirname"
       :adapter="adapter"
@@ -3890,6 +4741,49 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       @crumb-context="onCrumbContext"
       @crumb-drop="onCrumbDropInto"
     />
+    <div v-if="driveShell" class="fe-subhead__actions">
+      <ViewSwitcher
+        :view-mode="displayedViewMode"
+        :locale="locale"
+        :modes="allowedViewModes"
+        @update:view-mode="setDisplayedViewMode($event)"
+      />
+      <button
+        type="button"
+        class="fe-btn fe-btn--icon-only fe-toolbar__inspector"
+        :class="{ 'is-active': showInspector }"
+        :aria-pressed="showInspector"
+        :title="t('toolbar.inspector')"
+        :aria-label="t('toolbar.inspector')"
+        data-testid="subhead-inspector"
+        @click="toggleInspector"
+      >
+        <svg
+          class="fe-ficon"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="1.8"
+          stroke-linecap="round"
+          aria-hidden="true"
+          focusable="false"
+        >
+          <circle cx="12" cy="12" r="9" />
+          <path d="M12 11v5" />
+          <circle cx="12" cy="7.6" r="1" fill="currentColor" stroke="none" />
+        </svg>
+      </button>
+    </div>
+    </div>
+    <FilterBar
+      v-if="driveShell && !atVirtualRoot"
+      :value="driveFilters"
+      :locale="locale"
+      :theme="themeMode"
+      :shown="displayFiles.length"
+      :total="files.length"
+      @update:value="setDriveFilters"
+    />
 
     <!-- Live presence: who else is viewing this folder (empty → nothing shown).
          When the live socket is unavailable the same strip carries a small
@@ -3910,9 +4804,102 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
 
     <!-- wiring:e2 — kilit açık şeridi: şifreli klasörde anahtar bellekteyken
          görünür; "Kilitle" anahtarı ve çözülmüş blob'ları atar. -->
+    <!-- wiring:e2 recovery — a v1 folder just opened by password. Offer it
+         recovery HERE, visibly, rather than doing anything silently: this is
+         the only moment filex holds the password, and (when the install has
+         escrow) accepting also gives the operator a key. -->
+    <div v-if="e2eUpgradeOffer" class="fe-e2e-upgrade" role="alert">
+      <div class="fe-e2e-upgrade__text">
+        <strong>{{ t('e2e.upgrade.title') }}</strong>
+        <p>{{ t('e2e.upgrade.body') }}</p>
+        <p v-if="e2eEscrowKid" class="fe-e2e-upgrade__escrow">
+          {{ t('e2e.upgrade.escrow_note') }}
+        </p>
+      </div>
+      <div class="fe-e2e-upgrade__actions">
+        <button type="button" class="fe-btn" :disabled="e2eUpgradeBusy" @click="e2eDeclineUpgrade">
+          {{ t('e2e.upgrade.decline') }}
+        </button>
+        <button
+          type="button"
+          class="fe-btn fe-btn--primary"
+          :disabled="e2eUpgradeBusy"
+          @click="e2eDoUpgrade"
+        >
+          {{ e2eUpgradeBusy ? t('e2e.upgrade.busy') : t('e2e.upgrade.accept') }}
+        </button>
+      </div>
+    </div>
+<!-- wiring:e2 escrow-offer — an existing folder that predates escrow on
+         this installation. Shown only after an unlock SUCCEEDED, because
+         accepting hands the operator a permanent second key to this folder
+         and the only person entitled to do that is the one who can already
+         open it. Doing nothing leaves the folder exactly as it is. -->
+    <div v-if="e2eEscrowOffer" class="fe-e2e-upgrade fe-e2e-upgrade--escrow" role="alert">
+      <div class="fe-e2e-upgrade__text">
+        <strong>{{ t('e2e.escrowoffer.title') }}</strong>
+        <p>{{ t('e2e.escrowoffer.body') }}</p>
+        <p class="fe-e2e-upgrade__escrow">
+          {{ t('e2e.escrowoffer.consequence') }}
+          <a :href="e2eEscrowDocsUrl" target="_blank" rel="noopener noreferrer">
+            {{ t('e2e.escrowoffer.learn_more') }}
+          </a>
+        </p>
+        <p v-if="e2eEscrowKid" class="fe-e2e-upgrade__escrow">
+          {{ t('e2e.recover.escrow_kid') }}: <code>{{ e2eEscrowKid }}</code>
+        </p>
+        <!-- The way-back path has no password in memory any more, so it is
+             typed. The same proof of ownership the unlock path already had. -->
+        <label v-if="e2eEscrowOfferMode === 'manual'" class="fe-e2e-upgrade__pw">
+          <span>{{ t('e2e.escrowoffer.password_label') }}</span>
+          <input
+            v-model="e2eEscrowPw"
+            type="password"
+            class="fe-input"
+            autocomplete="current-password"
+            :disabled="e2eEscrowBusy"
+            @keyup.enter="e2eAcceptEscrow"
+          />
+        </label>
+        <p v-if="e2eEscrowErr" class="fe-form__error" role="alert">{{ e2eEscrowErr }}</p>
+      </div>
+      <div class="fe-e2e-upgrade__actions">
+        <button
+          type="button"
+          class="fe-btn"
+          :disabled="e2eEscrowBusy"
+          @click="e2eEscrowOfferMode === 'manual' ? e2eCloseEscrowOffer() : e2eDeclineEscrow()"
+        >
+          {{
+            e2eEscrowOfferMode === 'manual'
+              ? t('e2e.escrowoffer.cancel')
+              : t('e2e.escrowoffer.decline')
+          }}
+        </button>
+        <button
+          type="button"
+          class="fe-btn fe-btn--primary"
+          :disabled="e2eEscrowBusy"
+          @click="e2eAcceptEscrow"
+        >
+          {{ e2eEscrowBusy ? t('e2e.escrowoffer.busy') : t('e2e.escrowoffer.accept') }}
+        </button>
+      </div>
+    </div>
     <div v-if="e2eUnlocked" class="fe-e2e-strip" role="status">
       <span class="fe-e2e-strip__icon" aria-hidden="true">🔒</span>
       <span class="fe-e2e-strip__label">{{ t('e2e.strip.label') }}</span>
+      <!-- The way back for somebody who declined. Quiet, but present: a
+           refusal that could not be reversed without deleting the folder
+           would not be a decision, it would be a trap. -->
+      <button
+        v-if="e2eEscrowOfferState !== 'n/a' && !e2eEscrowOffer"
+        type="button"
+        class="fe-btn fe-e2e-strip__btn"
+        @click="e2eOpenEscrowOffer"
+      >
+        {{ t('e2e.escrowoffer.strip_action') }}
+      </button>
       <button type="button" class="fe-btn fe-e2e-strip__btn" @click="e2eLock">
         {{ t('e2e.strip.lock') }}
       </button>
@@ -4048,6 +5035,13 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
           </button>
         </form>
         <p v-if="e2eUnlockErr" class="fe-form__error" role="alert">{{ e2eUnlockErr }}</p>
+        <!-- wiring:e2 recovery — the second door. Always offered: whether
+             this folder actually has one is answered inside the dialog,
+             which can say "this folder predates recovery keys" instead of
+             leaving the user guessing why there is no link. -->
+        <button type="button" class="fe-e2e-optlink" @click="openRecoveryUnlock">
+          {{ t('e2e.locked.use_recovery') }}
+        </button>
       </div>
       <!-- /wiring:e2 -->
       <!-- Search with zero hits — its own message, not "folder is empty". -->
@@ -4098,6 +5092,10 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
           <template v-else-if="navView === 'starred'">
             <path d="M60 26l9 18.6 20.4 3-14.8 14.4 3.5 20.4L60 72.8 41.9 82.4l3.5-20.4L30.6 47.6l20.4-3z" />
           </template>
+          <template v-else-if="navView === 'tag'">
+            <path d="M30 30h24l32 32-24 24-32-32z" />
+            <circle cx="43" cy="43" r="4.5" />
+          </template>
           <template v-else>
             <circle cx="84" cy="34" r="9" />
             <circle cx="36" cy="52" r="9" />
@@ -4105,8 +5103,15 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
             <path d="M44.5 47.5l31-9M44.5 56.5l31 9" />
           </template>
         </svg>
-        <p class="fe-state__title">{{ t(`empty.${navView}.title`) }}</p>
-        <p class="fe-state__hint">{{ t(`empty.${navView}.hint`) }}</p>
+        <!-- etiket:t1 — the tag view's empty state names the TAG. "Nothing
+             here" would be the fourth identical sentence and would not say
+             which of the user's tags is the empty one. -->
+        <p class="fe-state__title">
+          {{ navView === 'tag' ? t('empty.tag.title', { tag: navTag }) : t(`empty.${navView}.title`) }}
+        </p>
+        <p class="fe-state__hint">
+          {{ navView === 'tag' ? t('empty.tag.hint') : t(`empty.${navView}.hint`) }}
+        </p>
       </div>
       <!-- Empty trash view. -->
       <div v-else-if="!loading && files.length === 0 && trashMode" class="fe-state">
@@ -4129,6 +5134,36 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
         </svg>
         <p class="fe-state__title">{{ t('empty.trash.title') }}</p>
       </div>
+      <!-- surucu:d1 — the folder HAS rows and the filters hid all of them.
+           "This folder is empty" would be false, and the way back is the chip
+           row just above, so the message names it and offers the button. -->
+      <div
+        v-else-if="!loading && filtersOn && displayFiles.length === 0 && files.length > 0"
+        class="fe-state"
+        data-testid="empty-filtered"
+      >
+        <svg
+          class="fe-state__art"
+          viewBox="0 0 120 100"
+          width="110"
+          height="92"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          aria-hidden="true"
+        >
+          <path d="M26 28h68L68 58v24l-16 8V58z" />
+        </svg>
+        <p class="fe-state__title">{{ t('filter.empty.title') }}</p>
+        <p class="fe-state__hint">{{ t('filter.empty.hint') }}</p>
+        <div class="fe-state__actions">
+          <button type="button" class="fe-btn" @click="clearDriveFilters">
+            {{ t('filter.clear') }}
+          </button>
+        </div>
+      </div>
       <!-- Loaded, zero files, no search: the real empty-folder state. The
            upload affordances follow write permission (RBAC viewers only get
            the title). -->
@@ -4161,7 +5196,7 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       </div>
       <ListView
         v-else-if="viewMode === 'list'"
-        :files="files"
+        :files="displayFiles /* surucu:d1 */"
         :selected="selection.selected.value"
         :clipped="clippedPaths"
         :show-parent-path="!!searchQuery"
@@ -4169,6 +5204,7 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
         :loading="loading"
         :keep-badge-for="desktopSync ? keepBadgeFor : undefined"
         :starred-ids="starredIds"
+        :star-enabled="identitySurfaces"
         :api-base="props.config.apiBase ?? ''"
         :auth-headers="() => buildAuthHeaders()"
         :auth-credentials="api.credentialsMode()"
@@ -4181,7 +5217,8 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       />
       <GridView
         v-else-if="viewMode === 'grid' /* wiring:d2 — v-else → v-else-if (3. mod eklendi) */"
-        :files="files"
+        :files="displayFiles /* surucu:d1 */"
+        :sections="driveShell /* surucu:d1 */"
         :selected="selection.selected.value"
         :clipped="clippedPaths"
         :show-parent-path="!!searchQuery"
@@ -4189,27 +5226,39 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
         :loading="loading"
         :keep-badge-for="desktopSync ? keepBadgeFor : undefined"
         :thumb-src="thumbs.src"
+        :starred-ids="starredIds"
+        :star-enabled="identitySurfaces"
+        :api-base="props.config.apiBase ?? ''"
+        :auth-headers="() => buildAuthHeaders()"
+        :auth-credentials="api.credentialsMode()"
         @click-card="(n, m) => selection.click(n.path, m)"
         @dbl-card="openNode"
         @context-card="onContextTarget"
         @item-drag-start="onItemDragStart"
         @item-drop-into="onItemDropInto"
+        @star-change="onStarChange"
       />
       <!-- wiring:d2 — galeri görünümü (GridView ile aynı event sözleşmesi) -->
       <GalleryView
         v-else
-        :files="files"
+        :files="displayFiles /* surucu:d1 */"
         :selected="selection.selected.value"
         :clipped="clippedPaths"
         :show-parent-path="!!searchQuery"
         :locale="locale"
         :loading="loading"
         :thumb-src="thumbs.src"
+        :starred-ids="starredIds"
+        :star-enabled="identitySurfaces"
+        :api-base="props.config.apiBase ?? ''"
+        :auth-headers="() => buildAuthHeaders()"
+        :auth-credentials="api.credentialsMode()"
         @click-card="(n, m) => selection.click(n.path, m)"
         @dbl-card="openNode"
         @context-card="onContextTarget"
         @item-drag-start="onItemDragStart"
         @item-drop-into="onItemDropInto"
+        @star-change="onStarChange"
       />
       <!-- /wiring:d2 -->
     </div>
@@ -4237,6 +5286,7 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       :view-mode="paneViewMode /* ui-fix */"
       :thumb-src="thumbs.src /* ui-fix */"
       :trash-visible="config.trashVisible !== false /* ui-fix — çöp satırı simetrisi */"
+      :nav-offers-trash="navOffersTrash /* surucu:d1 — aynı kapı iki kez açılmaz */"
       @navigate="onPaneNavigate"
       @activate="activePane = 'split'"
       @close="closeSplit"
@@ -4259,7 +5309,9 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       :locale="locale"
       :narrow="isNarrow"
       :thumb-src="thumbs.src"
+      :tabs="driveShell /* surucu:d1 */"
       @close="closeInspector"
+      @share-created="onInspectorShareCreated /* surucu:d1 */"
       @manage-permissions="onInspectorManage"
       @toast="flashToast"
       @changed="() => load()"
@@ -4399,9 +5451,32 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       :open="showEncFolder"
       :locale="locale"
       :busy="e2eCreateBusy"
+      :escrow-kid="e2eEscrowKid"
       @close="showEncFolder = false"
       @submit="submitEncryptedFolder"
     />
+    <!-- wiring:e2 recovery — the key, shown exactly once. -->
+    <RecoveryKeyModal
+      :open="showRecoveryKey"
+      :locale="locale"
+      :recovery-key="recoveryKeyValue"
+      :folder-name="recoveryKeyFolder"
+      :escrow-kid="e2eEscrowKid"
+      :variant="recoveryKeyVariant"
+      @close="closeRecoveryKey"
+    />
+    <!-- wiring:e2 recovery — the way back in without the password. -->
+    <E2eRecoveryUnlockModal
+      :open="showRecoveryUnlock"
+      :locale="locale"
+      :has-recovery="markerHasRecovery(e2eMarker)"
+      :escrow-state="escrowAvailability(e2eMarker, e2eEscrowKid)"
+      :escrow-kid="e2eMarker?.esc?.kid || e2eEscrowKid"
+      :busy="e2eRecoverBusy"
+      :error="e2eRecoverErr"
+      @close="showRecoveryUnlock = false"
+      @submit="e2eRecoverUnlock"
+    />
     <!-- /wiring:e2 -->
     <RenameModal
       :open="showRename"
@@ -4463,7 +5538,8 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
       :size="typeof permTarget.size === 'number' ? permTarget.size : undefined"
       :locale="locale === 'en' ? 'en' : 'tr'"
       :share-max-ttl-days="shareMaxTtlDays"
-      @close="showPerm = false"
+      :initial-tab="permInitialTab /* surucu:d1 */"
+      @close="showPerm = false; permInitialTab = undefined"
     />
 
     <!-- Recently-opened tray. Anchored to the toolbar trigger via fixed
@@ -4519,6 +5595,7 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
               :api-base="props.config.apiBase ?? ''"
               :auth-headers="() => buildAuthHeaders()"
               :auth-credentials="api.credentialsMode()"
+              @change="onNodeTagsChanged"
               @error="(msg: string) => emit('error', { message: msg, context: { op: 'tags' } })"
             />
           </div>
@@ -4528,6 +5605,7 @@ async function submitEncryptedFolder(payload: { name: string; password: string }
 
     <!-- cila:c wiring — command palette (Ctrl/Cmd+K) + shortcuts help (?) -->
     <CommandPalette
+      :initial-query="paletteSeed /* surucu:d1 */"
       :open="showPalette"
       :locale="locale"
       :files="files"