@olares/lares-mobile 0.15.6 → 0.15.9

package/src/desktop/DirectoryBrowser.vue

@@ -1,18 +1,50 @@
 <template>
   <LaresPcDialog
     :open="state.open"
-    :title="t('desktop.chooseFolder')"
+    :title="t('desktop.selectWorkspaceDirectory')"
     :close-label="t('desktop.close')"
     :busy="state.creating || state.creatingFolder"
     :width="620"
+    variant="directory"
     @close="$emit('close')"
   >
+    <template #header="{ titleId }">
+      <div class="directory-browser__header">
+        <h2 :id="titleId">{{ t("desktop.selectWorkspaceDirectory") }}</h2>
+        <div class="directory-browser__location">
+          <input
+            v-if="editingPath"
+            ref="pathInput"
+            v-model="pathDraft"
+            :aria-label="t('desktop.folderPath')"
+            @keydown.enter.prevent="submitPath"
+            @keydown.esc.prevent="editingPath = false"
+            @blur="editingPath = false"
+          />
+          <nav v-else-if="state.listing" :aria-label="t('desktop.folderPath')">
+            <template v-for="(crumb, index) in homeCrumbs" :key="crumb.path">
+              <span v-if="index" aria-hidden="true">/</span>
+              <button type="button" @click="$emit('browse', crumb.path)">
+                {{ crumb.path === state.listing.home ? t("desktop.home") : crumb.name }}
+              </button>
+            </template>
+          </nav>
+          <button
+            v-if="!editingPath"
+            type="button"
+            class="directory-browser__edit"
+            :aria-label="t('desktop.folderPath')"
+            @click="beginPathEdit"
+          >
+            <svg viewBox="0 0 24 24" aria-hidden="true">
+              <path d="m4 16-.75 4.25L7.5 19.5 18.4 8.6a2.1 2.1 0 0 0-3-3Z" />
+              <path d="m13.8 7.2 3 3M3 21h18" />
+            </svg>
+          </button>
+        </div>
+      </div>
+    </template>
     <div class="directory-browser">
-      <nav v-if="state.listing" class="directory-browser__crumbs" :aria-label="t('desktop.folderPath')">
-        <button v-for="crumb in state.listing.crumbs" :key="crumb.path" type="button" @click="$emit('browse', crumb.path)">
-          {{ crumb.path === state.listing.home ? t("desktop.home") : crumb.name }}
-        </button>
-      </nav>
       <div class="directory-browser__body">
         <p v-if="state.loading" class="directory-browser__status">{{ t("desktop.loadingFolders") }}</p>
         <p v-else-if="state.error" class="directory-browser__error">{{ state.error }}</p>
@@ -40,9 +72,7 @@
     </div>
     <template #footer>
       <div class="directory-browser__footer">
-        <p class="directory-browser__path">{{ selected || state.listing?.path || "" }}</p>
-        <div class="directory-browser__footer-row">
-          <div class="directory-browser__footer-left">
+        <div class="directory-browser__footer-left">
             <button
               type="button"
               class="directory-browser__new-folder"
@@ -60,8 +90,8 @@
               />
               <span>{{ t("desktop.showHiddenFiles") }}</span>
             </label>
-          </div>
-          <div class="directory-browser__footer-right">
+        </div>
+        <div class="directory-browser__footer-right">
             <button type="button" class="directory-browser__cancel" :disabled="state.creating" @click="$emit('close')">
               {{ t("desktop.cancel") }}
             </button>
@@ -71,9 +101,8 @@
               :disabled="state.loading || state.creating || !(selected || state.listing?.path)"
               @click="$emit('choose', selected || state.listing.path)"
             >
-              {{ state.creating ? t("desktop.addingWorkspace") : t("desktop.addWorkspace") }}
+              {{ state.creating ? t("desktop.addingWorkspace") : t("desktop.open") }}
             </button>
-          </div>
         </div>
       </div>
     </template>
@@ -100,17 +129,25 @@ export default {
   },
   emits: ["close", "browse", "choose", "create-folder", "toggle-hidden"],
   data() {
-    return { selected: "", newFolderOpen: false };
+    return { selected: "", newFolderOpen: false, editingPath: false, pathDraft: "" };
   },
   computed: {
     visibleEntries() {
       const entries = this.state.listing?.entries ?? [];
       return this.state.showHidden ? entries : entries.filter((entry) => !entry.hidden);
     },
+    homeCrumbs() {
+      const crumbs = this.state.listing?.crumbs ?? [];
+      const home = this.state.listing?.home;
+      const homeIndex = crumbs.findIndex((crumb) => crumb.path === home);
+      return homeIndex >= 0 ? crumbs.slice(homeIndex) : crumbs;
+    },
   },
   watch: {
     "state.listing.path"() {
       this.selected = this.state.selectPath || "";
+      this.pathDraft = this.state.listing?.path || "";
+      this.editingPath = false;
     },
     "state.selectPath"(path) {
       if (path) this.selected = path;
@@ -129,38 +166,62 @@ export default {
     onCreateFolder(name) {
       this.$emit("create-folder", name);
     },
+    beginPathEdit() {
+      this.pathDraft = this.state.listing?.path || "";
+      this.editingPath = true;
+      this.$nextTick(() => {
+        this.$refs.pathInput?.focus();
+        this.$refs.pathInput?.select();
+      });
+    },
+    submitPath() {
+      const path = this.pathDraft.trim();
+      if (!path) return;
+      this.editingPath = false;
+      this.$emit("browse", path);
+    },
   },
 };
 </script>
 
 <style scoped>
-.directory-browser { display:flex; height:min(440px, calc(100vh - 180px)); flex-direction:column; margin:-16px; }
+.directory-browser__header { height:76px; }
+.directory-browser__header h2 { height:42px; margin:0; padding:19px 22px 0; font-size:16px; font-weight:500; line-height:22px; }
+.directory-browser__location { display:flex; height:34px; align-items:center; gap:8px; padding:0 20px 7px 22px; }
+.directory-browser__location nav { display:flex; min-width:0; flex:1; align-items:center; gap:7px; overflow:hidden; color:var(--q-ink-2); }
+.directory-browser__location nav button { min-width:0; overflow:hidden; border:0; padding:0; background:transparent; color:inherit; font:inherit; font-size:14px; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; }
+.directory-browser__location nav button:hover { color:var(--q-ink-1); }
+.directory-browser__location input { box-sizing:border-box; min-width:0; height:27px; flex:1; border:1px solid var(--q-input-stroke); border-radius:5px; padding:0 8px; outline:none; background:var(--q-background-2); color:var(--q-ink-1); font:inherit; font-size:13px; }
+.directory-browser__edit { display:grid; width:30px; height:30px; flex-shrink:0; place-items:center; border:0; border-radius:6px; background:transparent; color:var(--q-ink-2); cursor:pointer; }
+.directory-browser__edit:hover { background:var(--q-background-hover); color:var(--q-ink-1); }
+.directory-browser__edit svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
+.directory-browser { display:flex; height:min(316px, calc(100vh - 186px)); flex-direction:column; }
 .directory-browser svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
-.directory-browser__crumbs { display:flex; gap:3px; min-height:38px; align-items:center; overflow:auto; padding:0 14px; border-bottom:1px solid var(--q-separator); }
-.directory-browser__crumbs button { flex-shrink:0; border:0; border-radius:5px; padding:4px 6px; background:transparent; color:var(--q-ink-3); font-size:14px; }
-.directory-browser__crumbs button:hover { background:var(--q-background-hover); color:var(--q-ink-1); }
-.directory-browser__body { flex:1; min-height:0; overflow:auto; padding:8px; }
-.directory-browser__row { display:flex; width:100%; align-items:center; gap:9px; border:0; border-radius:7px; padding:8px 10px; background:transparent; color:var(--q-ink-1); text-align:left; }
-.directory-browser__row:hover,
-.directory-browser__row[data-selected="true"] { background:var(--q-background-hover); }
+.directory-browser__body { flex:1; min-height:0; overflow:auto; padding:13px 20px; }
+.directory-browser__row { display:flex; width:100%; height:28px; align-items:center; gap:7px; border:0; border-radius:6px; padding:0 6px; background:transparent; color:var(--q-ink-1); font-size:14px; text-align:left; }
+.directory-browser__row:hover { background:var(--q-background-hover); }
+.directory-browser__row[data-selected="true"] { background:var(--q-background-selected); }
 .directory-browser__row > span { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .directory-browser__open { display:grid; width:26px; height:26px; place-items:center; border:0; background:transparent; color:var(--q-ink-3); }
 .directory-browser__status,
-.directory-browser__error { margin:20px; color:var(--q-ink-3); font-size:15px; text-align:center; }
+.directory-browser__error { margin:20px; color:var(--q-ink-3); font-size:14px; text-align:center; }
 .directory-browser__error { color:var(--q-orange-default); }
-.directory-browser__footer { display:flex; width:100%; flex-direction:column; gap:10px; }
-.directory-browser__path { min-width:0; margin:0; overflow:hidden; color:var(--q-ink-3); font-size:13px; text-overflow:ellipsis; white-space:nowrap; text-align:left; }
-.directory-browser__footer-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
+.directory-browser__footer { display:flex; width:100%; align-items:center; justify-content:space-between; gap:12px; }
 .directory-browser__footer-left { display:flex; min-width:0; flex:1; align-items:center; gap:12px; }
 .directory-browser__footer-right { display:flex; flex-shrink:0; align-items:center; gap:8px; }
-.directory-browser__new-folder { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--q-separator); border-radius:999px; padding:0 10px; height:32px; background:transparent; color:var(--q-ink-2); font:inherit; font-size:13px; white-space:nowrap; }
-.directory-browser__new-folder svg { width:14px; height:14px; }
-.directory-browser__hidden { display:inline-flex; align-items:center; gap:6px; color:var(--q-ink-3); font-size:13px; white-space:nowrap; cursor:pointer; }
-.directory-browser__hidden input { width:15px; height:15px; margin:0; }
+.directory-browser__new-folder { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--q-btn-stroke); border-radius:999px; padding:0 14px; height:34px; background:transparent; color:var(--q-ink-1); font:inherit; font-size:14px; white-space:nowrap; }
+/* The footer is a dialog slot, outside `.directory-browser`, so it misses the shared icon rule. */
+.directory-browser__new-folder svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
+.directory-browser__hidden { display:inline-flex; align-items:center; color:var(--q-ink-2); font-size:13px; white-space:nowrap; cursor:pointer; }
+.directory-browser__hidden input { position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none; }
+.directory-browser__hidden:has(input:checked) { color:var(--q-ink-1); }
 .directory-browser__cancel,
-.directory-browser__choose { min-width:76px; height:32px; border-radius:999px; padding:0 12px; }
-.directory-browser__cancel { border:1px solid var(--q-separator); background:transparent; color:var(--q-ink-2); }
-.directory-browser__choose { border:0; background:var(--q-blue-default); color:var(--q-ink-on-brand); }
+.directory-browser__choose { min-width:67px; height:34px; border-radius:999px; padding:0 14px; font-size:14px; }
+.directory-browser__cancel { border:1px solid var(--q-btn-stroke); background:transparent; color:var(--q-ink-1); }
+.directory-browser__new-folder:hover:not(:disabled),
+.directory-browser__cancel:hover:not(:disabled) { background:var(--q-btn-bg-hover); border-color:var(--q-btn-stroke-hover); }
+/* The confirm button is the inverse surface: white on dark, dark on light. */
+.directory-browser__choose { border:0; background:var(--q-background-9); color:var(--q-background-1); }
 .directory-browser button,
 .directory-browser__cancel,
 .directory-browser__choose { cursor:pointer; font:inherit; }

package/src/desktop/ui/PcDialog.vue

@@ -1,17 +1,26 @@
 <template>
   <Teleport to="body">
     <Transition name="lares-dialog">
-      <div v-if="open" class="lares-pc-dialog" role="dialog" aria-modal="true" :aria-labelledby="titleId">
+      <div
+        v-if="open"
+        class="lares-pc-dialog"
+        role="dialog"
+        aria-modal="true"
+        :aria-labelledby="titleId"
+        :data-variant="variant || undefined"
+      >
         <button class="lares-pc-dialog__backdrop" type="button" :aria-label="closeLabel" @click="close" />
         <section class="lares-pc-dialog__surface" :style="{ width: surfaceWidth }">
         <header class="lares-pc-dialog__header">
-          <div class="lares-pc-dialog__title">
-            <h2 :id="titleId">{{ title }}</h2>
-            <button type="button" class="lares-pc-dialog__close" :aria-label="closeLabel" @click="close">
-              <svg viewBox="0 0 24 24" aria-hidden="true"><path d="m7 7 10 10M17 7 7 17" /></svg>
-            </button>
-          </div>
-          <p v-if="description">{{ description }}</p>
+          <slot name="header" :title-id="titleId">
+            <div class="lares-pc-dialog__title">
+              <h2 :id="titleId">{{ title }}</h2>
+              <button type="button" class="lares-pc-dialog__close" :aria-label="closeLabel" @click="close">
+                <svg viewBox="0 0 24 24" aria-hidden="true"><path d="m7 7 10 10M17 7 7 17" /></svg>
+              </button>
+            </div>
+            <p v-if="description">{{ description }}</p>
+          </slot>
         </header>
         <div class="lares-pc-dialog__body">
           <slot />
@@ -37,6 +46,7 @@ export default {
     closeLabel: { type: String, default: "Close" },
     width: { type: [Number, String], default: 440 },
     busy: { type: Boolean, default: false },
+    variant: { type: String, default: "" },
   },
   emits: ["close"],
   data() {
@@ -82,4 +92,9 @@ export default {
 .lares-pc-dialog__close svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; }
 .lares-pc-dialog__body { min-height:0; overflow:auto; padding:16px; }
 .lares-pc-dialog__footer { display:flex; min-height:58px; flex-shrink:0; align-items:center; justify-content:flex-end; gap:8px; padding:0 16px; border-top:1px solid var(--q-separator); }
+/* The directory variant only changes geometry; colors stay on the shared tokens. */
+.lares-pc-dialog[data-variant="directory"] .lares-pc-dialog__surface { border-radius:20px; }
+.lares-pc-dialog[data-variant="directory"] .lares-pc-dialog__header { padding:0; }
+.lares-pc-dialog[data-variant="directory"] .lares-pc-dialog__body { padding:0; }
+.lares-pc-dialog[data-variant="directory"] .lares-pc-dialog__footer { min-height:62px; padding:0 22px; }
 </style>

package/src/host.js

@@ -2,12 +2,18 @@ import { hostTarget, hostUrl, MODELS_PATH, probeHost } from "@olares/lares-core/
 import { callRpc, consumeMux, ensureSession, loadTranscript, MUX_PATH, sendPrompt } from "@olares/lares-core/larepass/chat";
 import { commandsUrl, normalizeCommands } from "@olares/lares-core/larepass/commands";
 import { normalizeReferenceCandidates, referencesUrl } from "@olares/lares-core/larepass/references";
-import { muxWsUrl } from "@olares/lares-core/larepass/mux";
+import { muxWsUrl, remoteStreamOpen, workspaceBaseline } from "@olares/lares-core/larepass/mux";
 import { RESPOND_PATH } from "@olares/lares-core/larepass/rpc";
 import { createHostSettings } from "@olares/lares-core/larepass/settings";
-import { downloadFileUrl, previewMetaUrl, rawFileUrl } from "@olares/lares-core/files/preview-workspace";
+import {
+  downloadFileUrl,
+  isPreviewPayload,
+  previewMetaUrl,
+  rawFileUrl,
+} from "@olares/lares-core/files/preview-workspace";
 import { FILES_UPLOAD_PATH, uploadFile } from "@olares/lares-core/files/upload-client";
 import { API as VOICE_API, postTranscribe } from "@olares/lares-core/voice/client";
+import { postReport, REPORT_PATH } from "@olares/lares-core/log/report";
 
 function pageOrigin() {
   try {
@@ -35,6 +41,72 @@ function socketProtocols(ports) {
   return value ? String(value) : undefined;
 }
 
+function listWorkspaces(ports) {
+  const Socket = globalThis.WebSocket;
+  if (typeof Socket !== "function") {
+    return Promise.resolve({
+      ok: false,
+      status: "error",
+      error: { code: "no-websocket", message: "WebSocket is not available" },
+    });
+  }
+  const streamId = typeof globalThis.crypto?.randomUUID === "function"
+    ? globalThis.crypto.randomUUID()
+    : `ws-${Date.now()}`;
+  return openMuxSocket(hostUrl({
+    baseUrl: hostTarget(ports).baseUrl,
+    proxyPrefix: hostTarget(ports).proxyPrefix,
+    path: MUX_PATH,
+  }), undefined, socketProtocols(ports)).then((opened) => {
+    if (!opened.ok || !opened.body) {
+      return {
+        ok: false,
+        status: opened.status || "error",
+        error: opened.error || { code: "workspace", message: "workspace follow failed" },
+      };
+    }
+    const socket = opened.body;
+    return new Promise((resolve) => {
+      let settled = false;
+      const finish = (result) => {
+        if (settled) return;
+        settled = true;
+        clearTimeout(timer);
+        try {
+          socket.send(JSON.stringify({ type: "cancel", streamId }));
+        } catch {
+          // already closing
+        }
+        try {
+          socket.close();
+        } catch {
+          // already closing
+        }
+        resolve(result);
+      };
+      const timer = setTimeout(() => {
+        finish({
+          ok: false,
+          status: "error",
+          error: { code: "workspace", message: "workspace follow timed out" },
+        });
+      }, 8000);
+      socket.addEventListener("message", (event) => {
+        let message;
+        try {
+          message = JSON.parse(String(event.data ?? ""));
+        } catch {
+          return;
+        }
+        const baseline = workspaceBaseline(message);
+        if (!baseline) return;
+        finish({ ok: true, status: "ok", value: baseline });
+      });
+      socket.send(JSON.stringify(remoteStreamOpen(streamId, "workspace/follow")));
+    });
+  });
+}
+
 function openMuxSocket(httpUrl, signal, protocols) {
   const Socket = globalThis.WebSocket;
   if (typeof Socket !== "function") {
@@ -82,19 +154,24 @@ function openMuxSocket(httpUrl, signal, protocols) {
   });
 }
 
+/** Audio and file bodies go out as bytes; only plain objects are JSON. */
+function isBinaryBody(body) {
+  return (typeof Blob !== "undefined" && body instanceof Blob)
+    || body instanceof ArrayBuffer
+    || ArrayBuffer.isView(body)
+    || (typeof FormData !== "undefined" && body instanceof FormData);
+}
+
 export async function defaultRequest(url, init = {}) {
+  const raw = init.body === undefined || typeof init.body === "string" || isBinaryBody(init.body);
   const res = await fetch(url, {
     method: init.method ?? "GET",
-    body: init.body === undefined
-      ? undefined
-      : typeof init.body === "string"
-        ? init.body
-        : JSON.stringify(init.body),
+    body: raw ? init.body : JSON.stringify(init.body),
     credentials: "include",
     redirect: "manual",
     signal: init.signal,
     headers: {
-      ...(init.body === undefined ? {} : { "content-type": "application/json" }),
+      ...(init.body === undefined || isBinaryBody(init.body) ? {} : { "content-type": "application/json" }),
       ...init.headers,
     },
   });
@@ -118,14 +195,20 @@ export function createHostClient(ports = {}) {
   const { baseUrl, proxyPrefix } = hostTarget(ports);
   const send = ports.request ?? defaultRequest;
   const urlFor = (path) => hostUrl({ baseUrl, proxyPrefix, path });
-  const request = (path, init) => send(urlFor(path), init);
-  const rpc = (method, payload) => callRpc(request, method, payload);
+  const direct = (url, init) => {
+    if (ports.missing) {
+      return Promise.resolve({ ok: false, status: 0, body: { error: { code: "missing" } } });
+    }
+    return send(url, init);
+  };
+  const request = (path, init) => direct(urlFor(path), init);
+  const rpc = (method, payload) => (
+    method === "workspace.list" ? listWorkspaces(ports) : callRpc(request, method, payload)
+  );
   return {
     urlFor,
     probe() {
-      if (!proxyPrefix && !baseUrl) {
-        return Promise.resolve({ status: "missing" });
-      }
+      if (ports.missing) return Promise.resolve({ status: "missing" });
       return probeHost((path) => request(path), MODELS_PATH);
     },
     rpc,
@@ -168,32 +251,59 @@ export function createHostClient(ports = {}) {
         const code = body?.error?.code || "file_preview_failed";
         throw new Error(code);
       }
+      if (!isPreviewPayload(body)) throw new Error("file_preview_failed");
       return body;
     },
-    mediaUrl(sessionId, path, modifiedAt) {
-      return urlFor(rawFileUrl(sessionId, path, modifiedAt));
+    mediaUrl(sessionId, path, modifiedAt, size) {
+      return urlFor(rawFileUrl(sessionId, path, modifiedAt, size));
     },
     downloadUrl(sessionId, path) {
       return urlFor(downloadFileUrl(sessionId, path));
     },
-    // Both carry a binary body, so neither can go through `request` as an RPC —
-    // but both must still ride the host's auth. `ports.request` is passed
-    // through rather than called here so a host that supplies none keeps the
-    // cookie `fetch` these two used before.
+    // Binary bodies stay off the JSON path. `direct` still uses the host's
+    // auth port, or cookie fetch when none was given, and does not call out
+    // when LarePass has no entrance.
     upload(sessionId, file, options) {
       return uploadFile(file, sessionId, {
         ...options,
         url: urlFor(FILES_UPLOAD_PATH),
-        request: ports.request,
+        request: direct,
       });
     },
     transcribe(blob, language, signal) {
       return postTranscribe(blob, language, signal, {
         baseUrl: urlFor(VOICE_API),
-        request: ports.request,
+        request: direct,
+      });
+    },
+    reportLog(scope, event, fields) {
+      return postReport({ scope, event, ...(fields ?? {}) }, {
+        request,
+        url: urlFor(REPORT_PATH),
       });
     },
+    async speak(text) {
+      const res = await request(`${VOICE_API}/speak`, { method: "POST", body: { text } });
+      const body = res?.body;
+      if (res?.ok && body && typeof body.audio === "string") {
+        return {
+          bluetooth: body.bluetooth === "played" ? "played" : "skipped",
+          audio: body.audio,
+        };
+      }
+      const error = body && typeof body === "object" ? body.error : null;
+      const code = typeof error?.code === "string" && error.code ? error.code : "voice_speak_failed";
+      const message = typeof error?.message === "string" && error.message ? error.message : code;
+      throw Object.assign(new Error(message), { code });
+    },
+    async interruptSpeech() {
+      const res = await request(`${VOICE_API}/playback/stop`, { method: "POST" });
+      return Boolean(res?.ok);
+    },
     async openMux(signal) {
+      if (ports.missing) {
+        return { ok: false, status: "missing", error: { code: "missing", message: "no entrance" } };
+      }
       try {
         return await openMuxSocket(urlFor(MUX_PATH), signal, socketProtocols(ports));
       } catch (err) {

package/src/index.d.ts

@@ -30,6 +30,8 @@ export type HostPorts = {
    * carry `X-Authorization`. Pass a function to have it read per connect.
    */
   socketProtocol?: string | string[] | (() => string | string[] | undefined);
+  /** LarePass sets this when myApps has no Lares app. The entrance page leaves it unset. */
+  missing?: boolean;
 };
 
 export const PC_TEST_PROXY: string;
@@ -50,6 +52,7 @@ export function laresPortsFromAccount(input?: {
   baseUrl?: string;
   env?: HostEnv;
   proxyPrefix?: string;
+  missing?: boolean;
 };
 
 export function defaultRequest(url: string, init?: HostRequestInit): Promise<HostResponse>;
@@ -72,6 +75,7 @@ export const LaresApp: DefineComponent<{
   env?: HostEnv;
   request?: (url: string, init?: HostRequestInit) => Promise<HostResponse>;
   socketProtocol?: HostPorts["socketProtocol"];
+  missing?: boolean;
 }>;
 
 export const LaresAgentSettings: DefineComponent<{
@@ -81,4 +85,5 @@ export const LaresAgentSettings: DefineComponent<{
   proxyPrefix?: string;
   env?: HostEnv;
   request?: (url: string, init?: HostRequestInit) => Promise<HostResponse>;
+  missing?: boolean;
 }>;

package/src/mobile/MobileNewSession.vue

@@ -6,35 +6,6 @@
     </div>
 
     <div class="mobile-new-session__prompt">
-      <div class="mobile-new-session__selectors">
-        <button
-          type="button"
-          class="mobile-new-session__chip mobile-new-session__chip--workspace"
-          :disabled="workspaceBusy"
-          :aria-label="t('desktop.workspaces')"
-          @click="$emit('workspace')"
-        >
-          <svg viewBox="0 0 24 24" aria-hidden="true">
-            <path d="M3.5 7.5h6l1.6 2H20.5v9H3.5z" />
-          </svg>
-          <span>{{ workspaceLabel }}</span>
-          <svg class="mobile-new-session__chevron" viewBox="0 0 24 24" aria-hidden="true">
-            <path d="M7 10l5 5 5-5" />
-          </svg>
-        </button>
-        <button
-          type="button"
-          class="mobile-new-session__chip mobile-new-session__chip--model"
-          :disabled="modelBusy"
-          :aria-label="modelAria"
-          @click="$emit('model')"
-        >
-          <span>{{ modelLabel || t("model.select") }}</span>
-          <svg class="mobile-new-session__chevron" viewBox="0 0 24 24" aria-hidden="true">
-            <path d="M7 10l5 5 5-5" />
-          </svg>
-        </button>
-      </div>
       <div class="mobile-new-session__composer">
         <slot />
       </div>
@@ -49,21 +20,11 @@ export default {
   name: "LaresMobileNewSession",
   props: {
     t: { type: Function, required: true },
-    workspaceLabel: { type: String, default: "" },
-    workspaceBusy: { type: Boolean, default: false },
-    modelLabel: { type: String, default: "" },
-    modelBusy: { type: Boolean, default: false },
   },
-  emits: ["workspace", "model"],
   computed: {
     logoStyle() {
       return { backgroundImage: MARK_DATA_URI };
     },
-    modelAria() {
-      return this.modelLabel
-        ? this.t("model.switchAria", { label: this.modelLabel })
-        : this.t("model.select");
-    },
   },
 };
 </script>
@@ -75,17 +36,17 @@ export default {
   min-height: 0;
   flex: 1;
   flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 20px 20px calc(12px + env(safe-area-inset-bottom, 0px));
+  align-items: stretch;
 }
 
 .mobile-new-session__brand {
   display: flex;
+  min-height: 0;
+  flex: 1;
   flex-direction: column;
   align-items: center;
+  justify-content: center;
   gap: 8px;
-  margin-bottom: 32px;
 }
 
 .mobile-new-session__logo {
@@ -121,78 +82,10 @@ export default {
 }
 
 .mobile-new-session__prompt {
-  display: flex;
-  width: min(100%, 420px);
-  flex-direction: column;
-  gap: 6px;
-}
-
-.mobile-new-session__selectors {
   display: flex;
   width: 100%;
-  align-items: center;
-  justify-content: space-between;
-  gap: 10px;
-}
-
-.mobile-new-session__chip {
-  display: inline-flex;
-  min-width: 0;
-  align-items: center;
-  gap: 6px;
-  border: 0;
-  border-radius: 999px;
-  padding: 6px 10px;
-  background: transparent;
-  color: var(--q-ink-2);
-  font-size: 14px;
-  font-weight: 500;
-  line-height: 18px;
-  transition: background var(--lares-duration-fast, 120ms) var(--lares-ease-out, ease),
-    color var(--lares-duration-fast, 120ms) var(--lares-ease-out, ease);
-}
-
-.mobile-new-session__chip--workspace {
-  flex: 0 1 auto;
-  max-width: 46%;
-}
-
-.mobile-new-session__chip--model {
-  flex: 1 1 auto;
-  justify-content: flex-end;
-  max-width: 54%;
-}
-
-.mobile-new-session__chip span {
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.mobile-new-session__chip svg:not(.mobile-new-session__chevron) {
-  width: 18px;
-  height: 18px;
-  flex-shrink: 0;
-  fill: none;
-  stroke: currentColor;
-  stroke-width: 1.75;
-  stroke-linejoin: round;
-}
-
-.mobile-new-session__chevron {
-  width: 16px;
-  height: 16px;
-  flex-shrink: 0;
-  fill: none;
-  stroke: currentColor;
-  stroke-width: 1.75;
-  stroke-linecap: round;
-  stroke-linejoin: round;
-}
-
-.mobile-new-session__chip:active:not(:disabled) {
-  background: var(--q-btn-bg-pressed);
+  flex-direction: column;
+  padding: 8px 16px calc(12px + env(safe-area-inset-bottom, 0px));
 }
 
 .mobile-new-session__composer {
@@ -200,10 +93,6 @@ export default {
 }
 
 @media (max-height: 640px) {
-  .mobile-new-session__brand {
-    margin-bottom: 24px;
-  }
-
   .mobile-new-session__logo {
     width: 48px;
     height: 48px;