@k2b/cloud 0.6.0-rc.0

package/src/browser/live-websocket.ts

@@ -0,0 +1,268 @@
+export type LiveWebSocketActivity = "always" | "visible";
+export type LiveWebSocketStatus = "connecting" | "open" | "reconnecting" | "paused" | "closed";
+
+export type LiveWebSocketError = {
+  code: string;
+  message: string;
+};
+
+export type LiveWebSocketClose = {
+  code: number;
+  reason: string;
+};
+
+export type LiveWebSocketControls = {
+  markApplied: (cursor: string | null | undefined) => void;
+  /** Forget an expired cursor before resubscribing from a fresh snapshot. */
+  resetCursor: () => void;
+  send: (message: unknown) => boolean;
+  terminate: (error: LiveWebSocketError, close?: LiveWebSocketClose) => void;
+};
+
+export type LiveWebSocketOptions<TMessage> = {
+  url: string | (() => string);
+  initialCursor?: string | null;
+  activity?: LiveWebSocketActivity;
+  subscribe: (cursor: string | null) => unknown;
+  parse: (raw: string) => TMessage | null;
+  onOpen?: (controls: LiveWebSocketControls) => void;
+  onMessage: (message: TMessage, controls: LiveWebSocketControls) => void;
+  onStatus?: (status: LiveWebSocketStatus) => void;
+  onFatal?: (error: LiveWebSocketError) => void;
+  classifyClose?: (close: LiveWebSocketClose) => LiveWebSocketError | null;
+  reconnect?: Partial<{
+    baseDelayMs: number;
+    maxDelayMs: number;
+    jitterMs: number;
+  }>;
+};
+
+export type LiveWebSocket = {
+  connect: () => void;
+  markApplied: (cursor: string | null | undefined) => void;
+  /** Forget an expired cursor before resubscribing from a fresh snapshot. */
+  resetCursor: () => void;
+  send: (message: unknown) => boolean;
+  dispose: () => void;
+};
+
+const DEFAULT_RECONNECT = {
+  baseDelayMs: 750,
+  maxDelayMs: 10_000,
+  jitterMs: 250,
+} as const;
+
+const defaultCloseError = ({ code, reason }: LiveWebSocketClose): LiveWebSocketError | null => {
+  if (code === 1008) return { code: reason || "access_denied", message: "Live access changed or expired." };
+  if (code === 1011) return { code: reason || "internal_error", message: "Live updates failed." };
+  if (code === 1013) return { code: reason || "backpressure", message: "Live updates are overloaded." };
+  return null;
+};
+
+const socketUrl = (raw: string): string => {
+  const url = new URL(raw, window.location.origin);
+  if (url.protocol === "http:") url.protocol = "ws:";
+  else if (url.protocol === "https:") url.protocol = "wss:";
+  if (url.protocol !== "ws:" && url.protocol !== "wss:") throw new Error("Live WebSocket URL must use HTTP(S) or WS(S)");
+  return url.href;
+};
+
+/**
+ * Runs a cursor-backed, server-to-browser WebSocket subscription.
+ *
+ * The app owns its wire protocol, validation, permissions, and domain updates.
+ * This helper owns only browser transport lifecycle: one socket, visibility,
+ * reconnect backoff, applied-cursor resume, terminal closes, and disposal.
+ */
+export const createLiveWebSocket = <TMessage>(options: LiveWebSocketOptions<TMessage>): LiveWebSocket => {
+  const activity = options.activity ?? "visible";
+  const reconnect = { ...DEFAULT_RECONNECT, ...options.reconnect };
+  const classifyClose = options.classifyClose ?? defaultCloseError;
+
+  let socket: WebSocket | null = null;
+  let reconnectTimer: ReturnType<typeof setTimeout> | null = null;
+  let reconnectAttempt = 0;
+  let lastAppliedCursor = options.initialCursor ?? null;
+  let started = false;
+  let disposed = false;
+  let terminated = false;
+  let fatalSent = false;
+  let status: LiveWebSocketStatus | null = null;
+
+  const setStatus = (next: LiveWebSocketStatus) => {
+    if (status === next) return;
+    status = next;
+    options.onStatus?.(next);
+  };
+
+  const clearReconnect = () => {
+    if (reconnectTimer !== null) clearTimeout(reconnectTimer);
+    reconnectTimer = null;
+  };
+
+  const markApplied = (cursor: string | null | undefined) => {
+    if (cursor) lastAppliedCursor = cursor;
+  };
+
+  const resetCursor = () => {
+    lastAppliedCursor = null;
+  };
+
+  const send = (message: unknown): boolean => {
+    if (!socket || socket.readyState !== WebSocket.OPEN || disposed || terminated) return false;
+    try {
+      const payload = JSON.stringify(message);
+      if (payload === undefined) return false;
+      socket.send(payload);
+      return true;
+    } catch {
+      return false;
+    }
+  };
+
+  const closeSocket = (code = 1000, reason = "") => {
+    const current = socket;
+    socket = null;
+    if (!current || current.readyState > WebSocket.OPEN) return;
+    try {
+      current.close(code, reason);
+    } catch {
+      // The browser already discarded the connection.
+    }
+  };
+
+  const fatal = (error: LiveWebSocketError, close: LiveWebSocketClose = { code: 1008, reason: error.code }) => {
+    if (terminated) return;
+    terminated = true;
+    clearReconnect();
+    closeSocket(close.code, close.reason);
+    setStatus("closed");
+    if (!fatalSent) {
+      fatalSent = true;
+      options.onFatal?.(error);
+    }
+  };
+
+  const controls: LiveWebSocketControls = {
+    markApplied,
+    resetCursor,
+    send,
+    terminate: fatal,
+  };
+
+  const browserAvailable = () => typeof window !== "undefined" && typeof document !== "undefined" && typeof WebSocket !== "undefined";
+  const isActive = () => browserAvailable() && (activity === "always" || document.visibilityState === "visible");
+
+  const scheduleReconnect = () => {
+    if (disposed || terminated || !started || !isActive() || reconnectTimer) return;
+    setStatus("reconnecting");
+    const exponential = Math.min(reconnect.maxDelayMs, reconnect.baseDelayMs * 2 ** reconnectAttempt);
+    const delay = exponential + Math.floor(Math.random() * reconnect.jitterMs);
+    reconnectAttempt = Math.min(reconnectAttempt + 1, 5);
+    reconnectTimer = setTimeout(() => {
+      reconnectTimer = null;
+      openSocket();
+    }, delay);
+  };
+
+  const openSocket = () => {
+    if (disposed || terminated || !started || socket) return;
+    if (!browserAvailable()) {
+      fatal({ code: "unsupported", message: "Live WebSockets are not available in this browser" });
+      return;
+    }
+    if (!isActive()) return;
+
+    let next: WebSocket;
+    setStatus(reconnectAttempt > 0 ? "reconnecting" : "connecting");
+    try {
+      next = new WebSocket(socketUrl(typeof options.url === "function" ? options.url() : options.url));
+    } catch (error) {
+      fatal({ code: "invalid_url", message: error instanceof Error ? error.message : "Invalid live WebSocket URL" });
+      return;
+    }
+    socket = next;
+
+    next.onopen = () => {
+      if (socket !== next || disposed || terminated) return;
+      try {
+        if (!send(options.subscribe(lastAppliedCursor))) throw new Error("Live WebSocket subscription could not be sent");
+        setStatus("open");
+        options.onOpen?.(controls);
+      } catch (error) {
+        fatal({ code: "subscribe_failed", message: error instanceof Error ? error.message : "Live subscription failed" });
+      }
+    };
+
+    next.onmessage = (event) => {
+      if (socket !== next || typeof event.data !== "string" || disposed || terminated) return;
+      try {
+        const message = options.parse(event.data);
+        if (message) {
+          options.onMessage(message, controls);
+          reconnectAttempt = 0;
+        }
+      } catch (error) {
+        fatal(
+          { code: "client_handler_failed", message: error instanceof Error ? error.message : "Live update handling failed" },
+          { code: 1011, reason: "client_handler_failed" },
+        );
+      }
+    };
+
+    next.onclose = (event) => {
+      if (socket !== next) return;
+      socket = null;
+      if (disposed || terminated) return;
+      const closeError = classifyClose({ code: event.code, reason: event.reason.trim() });
+      if (closeError) fatal(closeError, { code: event.code, reason: event.reason });
+      else scheduleReconnect();
+    };
+
+    next.onerror = () => {
+      try {
+        next.close();
+      } catch {
+        if (socket === next) {
+          socket = null;
+          scheduleReconnect();
+        }
+      }
+    };
+  };
+
+  const syncVisibility = () => {
+    if (isActive()) openSocket();
+    else {
+      clearReconnect();
+      closeSocket(1000, "inactive");
+      setStatus("paused");
+    }
+  };
+
+  return {
+    connect: () => {
+      if (started || disposed || terminated) return;
+      started = true;
+      if (!browserAvailable()) {
+        fatal({ code: "unsupported", message: "Live WebSockets are not available in this browser" });
+        return;
+      }
+      if (activity === "visible") document.addEventListener("visibilitychange", syncVisibility);
+      openSocket();
+    },
+    markApplied,
+    resetCursor,
+    send,
+    dispose: () => {
+      if (disposed) return;
+      disposed = true;
+      clearReconnect();
+      if (activity === "visible" && typeof document !== "undefined") {
+        document.removeEventListener("visibilitychange", syncVisibility);
+      }
+      closeSocket();
+      setStatus("closed");
+    },
+  };
+};

package/src/browser/locale-preference.ts

@@ -0,0 +1,25 @@
+import { cookies } from "@k2b/stdlib/browser";
+import { canonicalLocale, LOCALE_COOKIE } from "../shared/locale";
+
+export const PROFILE_PREFERENCE_LOCALES = ["en", "de"] as const;
+export type ProfilePreferenceLocale = (typeof PROFILE_PREFERENCE_LOCALES)[number];
+
+export const profilePreferenceLocale = (locale: string): ProfilePreferenceLocale =>
+  canonicalLocale(locale)?.split("-")[0] === "de" ? "de" : "en";
+
+type LocalePreferenceRuntime = {
+  writeCookie: (name: string, value: string) => void;
+  reload: () => void;
+};
+
+export const setLocalePreference = (
+  locale: ProfilePreferenceLocale,
+  runtime: LocalePreferenceRuntime = {
+    writeCookie: cookies.writeCookie,
+    reload: () => window.location.reload(),
+  },
+): ProfilePreferenceLocale => {
+  runtime.writeCookie(LOCALE_COOKIE, locale);
+  runtime.reload();
+  return locale;
+};

package/src/browser/notification-target.ts

@@ -0,0 +1,27 @@
+const countParams = (params: URLSearchParams): Map<string, number> => {
+  const counts = new Map<string, number>();
+  for (const [key, value] of params) {
+    const token = `${key}\u0000${value}`;
+    counts.set(token, (counts.get(token) ?? 0) + 1);
+  }
+  return counts;
+};
+
+/** A deep link already points at the visible view when all its params are present. */
+export const notificationTargetMatchesLocation = (targetHref: string, currentHref: string): boolean => {
+  try {
+    const current = new URL(currentHref);
+    const target = new URL(targetHref, current.origin);
+    if (target.origin !== current.origin || target.pathname !== current.pathname) return false;
+    if (target.hash && target.hash !== current.hash) return false;
+
+    const targetParams = countParams(target.searchParams);
+    const currentParams = countParams(current.searchParams);
+    for (const [token, count] of targetParams) {
+      if ((currentParams.get(token) ?? 0) < count) return false;
+    }
+    return true;
+  } catch {
+    return false;
+  }
+};

package/src/browser/notification-timeout.ts

@@ -0,0 +1,14 @@
+export const withNotificationTimeout = <T>(operation: Promise<T>, timeoutMs: number, message: string): Promise<T> =>
+  new Promise<T>((resolve, reject) => {
+    const timer = globalThis.setTimeout(() => reject(new Error(message)), timeoutMs);
+    operation.then(
+      (value) => {
+        globalThis.clearTimeout(timer);
+        resolve(value);
+      },
+      (error) => {
+        globalThis.clearTimeout(timer);
+        reject(error);
+      },
+    );
+  });

package/src/browser/notifications.ts

@@ -0,0 +1,181 @@
+import { notifications as nativeNotifications } from "@k2b/stdlib/browser";
+import { apiClient } from "../clients/core";
+import type { BrowserPushSubscription } from "../contracts";
+import { withNotificationTimeout } from "./notification-timeout";
+
+const SERVICE_WORKER_PATH = "/service-worker.js";
+const SERVICE_WORKER_SCOPE = "/";
+const STATE_CHECK_TIMEOUT_MS = 5_000;
+
+export type BrowserNotificationState = {
+  supported: boolean;
+  permission: NotificationPermission;
+  enabled: boolean;
+  reason?: string;
+};
+
+const isIos = (): boolean =>
+  /iPad|iPhone|iPod/.test(navigator.userAgent) || (navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1);
+
+const isStandalone = (): boolean =>
+  window.matchMedia("(display-mode: standalone)").matches || (navigator as Navigator & { standalone?: boolean }).standalone === true;
+
+const support = (): { supported: boolean; reason?: string } => {
+  if (
+    typeof window === "undefined" ||
+    !window.isSecureContext ||
+    !("serviceWorker" in navigator) ||
+    !("PushManager" in window) ||
+    !nativeNotifications.isSupported()
+  ) {
+    return { supported: false, reason: "Browser notifications are not supported in this browser." };
+  }
+  if (isIos() && !isStandalone()) {
+    return {
+      supported: false,
+      reason: "On iPhone and iPad, add Cloud to your Home Screen before enabling browser notifications.",
+    };
+  }
+  return { supported: true };
+};
+
+const ensureServiceWorker = (): Promise<ServiceWorkerRegistration> =>
+  navigator.serviceWorker.register(SERVICE_WORKER_PATH, { scope: SERVICE_WORKER_SCOPE });
+
+const subscriptionPayload = (subscription: PushSubscription): BrowserPushSubscription => {
+  const serialized = subscription.toJSON();
+  const p256dh = serialized.keys?.p256dh;
+  const auth = serialized.keys?.auth;
+  if (!serialized.endpoint || !p256dh || !auth) {
+    throw new Error("The browser returned an incomplete push subscription.");
+  }
+  return {
+    endpoint: serialized.endpoint,
+    expirationTime: subscription.expirationTime,
+    keys: { p256dh, auth },
+  };
+};
+
+const responseError = async (response: Response, fallback: string): Promise<Error> => {
+  try {
+    const payload = (await response.json()) as { message?: unknown };
+    if (typeof payload.message === "string" && payload.message.trim()) return new Error(payload.message);
+  } catch {
+    // The endpoint may return an empty or non-JSON infrastructure error.
+  }
+  return new Error(fallback);
+};
+
+const registerEndpoint = async (subscription: PushSubscription): Promise<void> => {
+  const response = await apiClient.me.notifications.browser.endpoints.$post({
+    json: {
+      subscription: subscriptionPayload(subscription),
+      label: navigator.platform ? `Browser on ${navigator.platform}` : "This browser",
+    },
+  });
+  if (!response.ok) throw await responseError(response, "Failed to register this browser for notifications.");
+};
+
+const decodeApplicationServerKey = (value: string): Uint8Array<ArrayBuffer> => {
+  const padded = value
+    .replace(/-/g, "+")
+    .replace(/_/g, "/")
+    .padEnd(Math.ceil(value.length / 4) * 4, "=");
+  const binary = window.atob(padded);
+  const bytes = new Uint8Array(new ArrayBuffer(binary.length));
+  for (let index = 0; index < binary.length; index += 1) bytes[index] = binary.charCodeAt(index);
+  return bytes;
+};
+
+const pushSubscriptionError = (cause: unknown): Error => {
+  const name = cause instanceof DOMException ? cause.name : "";
+  const message = cause instanceof Error ? cause.message.toLowerCase() : "";
+  if (name === "NotAllowedError" || message.includes("permission") || message.includes("incognito")) {
+    return new Error("This browser refused push registration. Check its notification permissions or private browsing mode.");
+  }
+  if (name === "AbortError") return new Error("Push registration was interrupted. Try again.");
+  return new Error("This browser could not create a push subscription.");
+};
+
+const currentState = async (registration?: ServiceWorkerRegistration): Promise<BrowserNotificationState> => {
+  const capability = support();
+  if (!capability.supported) {
+    return { supported: false, permission: "denied", enabled: false, reason: capability.reason };
+  }
+  return withNotificationTimeout(
+    (async () => {
+      const activeRegistration = registration ?? (await navigator.serviceWorker.getRegistration(SERVICE_WORKER_SCOPE));
+      const subscription = await activeRegistration?.pushManager.getSubscription();
+      return {
+        supported: true,
+        permission: Notification.permission,
+        enabled: Notification.permission === "granted" && !!subscription,
+      };
+    })(),
+    STATE_CHECK_TIMEOUT_MS,
+    "Browser notification status check timed out.",
+  );
+};
+
+export const browserNotificationClient = {
+  state: currentState,
+
+  /** Register the worker and rebind an existing subscription to the signed-in user. Never prompts. */
+  refreshExisting: async (): Promise<BrowserNotificationState> => {
+    const capability = support();
+    if (!capability.supported) return currentState();
+    const registration = await ensureServiceWorker();
+    if (Notification.permission !== "granted") return currentState(registration);
+    const subscription = await registration.pushManager.getSubscription();
+    if (subscription) await registerEndpoint(subscription);
+    return currentState(registration);
+  },
+
+  /** Must only be called from an explicit user action because it may show a permission prompt. */
+  enable: async (): Promise<BrowserNotificationState> => {
+    const capability = support();
+    if (!capability.supported) return currentState();
+    if (Notification.permission !== "granted" && !(await nativeNotifications.requestPermission())) return currentState();
+
+    const registration = await ensureServiceWorker();
+    let subscription = await registration.pushManager.getSubscription();
+    if (!subscription) {
+      const configResponse = await apiClient.me.notifications.browser.configuration.$get();
+      if (!configResponse.ok) {
+        throw await responseError(configResponse, "Failed to load browser notification configuration.");
+      }
+      const config = await configResponse.json();
+      try {
+        subscription = await registration.pushManager.subscribe({
+          userVisibleOnly: true,
+          applicationServerKey: decodeApplicationServerKey(config.publicKey),
+        });
+      } catch (cause) {
+        throw pushSubscriptionError(cause);
+      }
+    }
+    await registerEndpoint(subscription);
+    return currentState(registration);
+  },
+
+  disable: async (): Promise<BrowserNotificationState> => {
+    const capability = support();
+    if (!capability.supported) return currentState();
+    const registration = await navigator.serviceWorker.getRegistration(SERVICE_WORKER_SCOPE);
+    const subscription = await registration?.pushManager.getSubscription();
+    if (subscription) {
+      let endpointError: Error | null = null;
+      try {
+        const response = await apiClient.me.notifications.browser.endpoints.$delete({
+          json: { subscription: subscriptionPayload(subscription) },
+        });
+        if (!response.ok) endpointError = await responseError(response, "Failed to disable browser notifications.");
+      } catch (cause) {
+        endpointError = cause instanceof Error ? cause : new Error("Failed to disable browser notifications.");
+      }
+      await subscription.unsubscribe();
+      if (endpointError) throw endpointError;
+    }
+    return currentState(registration);
+  },
+} as const;

package/src/browser/resource-clipboard.ts

@@ -0,0 +1,70 @@
+import type { CloudResourceRef } from "../contracts/capabilities";
+import {
+  CLOUD_RESOURCE_CLIPBOARD_MAX_BYTES,
+  CLOUD_RESOURCE_CLIPBOARD_MIME_TYPE,
+  CLOUD_RESOURCE_CLIPBOARD_WEB_FORMAT,
+  parseCloudResourceClipboard,
+  serializeCloudResourceClipboard,
+} from "../contracts/resource-clipboard";
+
+export type CloudResourceClipboardWrite = {
+  /** Canonical public Cloud origin derived from the configured `app.url`. */
+  cloudUrl: string;
+  ref: CloudResourceRef;
+  fallbackText: string;
+};
+
+export type CloudResourceClipboardItem = Pick<ClipboardItem, "types" | "getType">;
+
+const supportsStructuredClipboard = (): boolean => {
+  if (typeof ClipboardItem === "undefined" || typeof navigator.clipboard?.write !== "function") return false;
+  return typeof ClipboardItem.supports === "function" && ClipboardItem.supports(CLOUD_RESOURCE_CLIPBOARD_WEB_FORMAT);
+};
+
+export const writeCloudResourceClipboard = async ({ cloudUrl, ref, fallbackText }: CloudResourceClipboardWrite): Promise<void> => {
+  if (new TextEncoder().encode(fallbackText).byteLength > CLOUD_RESOURCE_CLIPBOARD_MAX_BYTES || fallbackText.length === 0) {
+    throw new TypeError(`fallbackText must contain between 1 and ${CLOUD_RESOURCE_CLIPBOARD_MAX_BYTES} bytes`);
+  }
+
+  const payload = serializeCloudResourceClipboard({ cloudUrl, ref });
+
+  if (!supportsStructuredClipboard()) {
+    await navigator.clipboard.writeText(fallbackText);
+    return;
+  }
+
+  await navigator.clipboard.write([
+    new ClipboardItem({
+      [CLOUD_RESOURCE_CLIPBOARD_WEB_FORMAT]: new Blob([payload], { type: CLOUD_RESOURCE_CLIPBOARD_MIME_TYPE }),
+      "text/plain": new Blob([fallbackText], { type: "text/plain" }),
+    }),
+  ]);
+};
+
+export const readCloudResourceClipboard = async (
+  cloudUrl: string,
+  items?: readonly CloudResourceClipboardItem[],
+): Promise<CloudResourceRef | null> => {
+  const clipboardItems = items ?? (await navigator.clipboard.read());
+
+  for (const item of clipboardItems) {
+    if (!item.types.includes(CLOUD_RESOURCE_CLIPBOARD_WEB_FORMAT)) continue;
+
+    const blob = await item.getType(CLOUD_RESOURCE_CLIPBOARD_WEB_FORMAT);
+    if (blob.size > CLOUD_RESOURCE_CLIPBOARD_MAX_BYTES) continue;
+
+    const ref = parseCloudResourceClipboard(await blob.text(), cloudUrl);
+    if (ref) return ref;
+  }
+
+  return null;
+};
+
+export const cloudResourceClipboard = {
+  mimeType: CLOUD_RESOURCE_CLIPBOARD_MIME_TYPE,
+  webFormat: CLOUD_RESOURCE_CLIPBOARD_WEB_FORMAT,
+  parse: parseCloudResourceClipboard,
+  serialize: serializeCloudResourceClipboard,
+  write: writeCloudResourceClipboard,
+  read: readCloudResourceClipboard,
+} as const;

package/src/browser/resource-picker.tsx

@@ -0,0 +1,39 @@
+import { prompts } from "@k2b/ui";
+import type { SearchItem } from "../api/search/schemas";
+import type { CloudResourceRef } from "../contracts";
+import CloudResourceSearch from "./CloudResourceSearch";
+import { resourceSearchMessages } from "./resource-search-messages";
+
+export type CloudResourcePickerItem = SearchItem;
+
+export type CloudResourcePickerOptions = {
+  title?: string;
+  placeholder?: string;
+  initialAppId?: string;
+  excludeRefs?: readonly CloudResourceRef[];
+  requireReader?: boolean;
+};
+
+export const openCloudResourcePicker = (options: CloudResourcePickerOptions = {}): Promise<CloudResourcePickerItem | undefined> => {
+  const locale = typeof document === "undefined" ? "en" : document.documentElement.lang || "en";
+  const t = resourceSearchMessages.resolve([locale]).t;
+  return prompts.dialog<CloudResourcePickerItem>(
+    (close) => (
+      <div class="k2b-dialog__body h-[min(36rem,var(--ui-dialog-available-height))] min-h-0 p-0">
+        <CloudResourceSearch
+          initialAppId={options.initialAppId}
+          excludeRefs={options.excludeRefs}
+          requireReader={options.requireReader}
+          placeholder={options.placeholder ?? t.searchPlaceholder}
+          onSelect={close}
+        />
+      </div>
+    ),
+    {
+      title: options.title ?? t.chooseResource,
+      icon: "ti ti-cloud-search",
+      size: "large",
+      ariaLabel: options.title ?? t.chooseResource,
+    },
+  );
+};

package/src/browser/resource-search-messages.ts

@@ -0,0 +1,55 @@
+import { i18n } from "@k2b/stdlib";
+
+export const resourceSearchMessages = i18n.define({
+  baseLocale: "en",
+  messages: {
+    en: {
+      searchFailed: "Search failed.",
+      searchPlaceholder: "Search across apps…",
+      searchCloudResources: "Search Cloud resources",
+      tagSuggestions: "Tag suggestions",
+      filterByApp: "Filter by app",
+      allApps: "All apps",
+      removeTag: ({ tag }: { tag: string }) => `Remove tag ${tag}`,
+      removeTagTitle: ({ tag }: { tag: string }) => `Remove #${tag}`,
+      resultCount: ({ count }: { count: number }) => i18n.plural(count, "en", { one: `${count} result`, other: `${count} results` }),
+      tagHelp: "tag help",
+      typeToSearchBeforeTag: "Type to search, or use a",
+      typeToSearchAfterTag: "to focus on one app.",
+      noTagsAvailable: "No tags available.",
+      addTag: ({ tag, app }: { tag: string; app: string }) => `Add #${tag} (${app})`,
+      seeAllTagDescriptions: "See all tag descriptions",
+      noAppSupports: "No app supports",
+      removeTagOrPick: "Remove the tag or pick one below.",
+      removeNamedTag: ({ tag }: { tag: string }) => `Remove #${tag}`,
+      noMatches: "No matches",
+      matchesFor: "for",
+      selectPreview: "Select a result to preview details.",
+      chooseResource: "Choose Cloud resource",
+    },
+    de: {
+      searchFailed: "Die Suche ist fehlgeschlagen.",
+      searchPlaceholder: "Apps durchsuchen…",
+      searchCloudResources: "Cloud-Inhalte durchsuchen",
+      tagSuggestions: "Tag-Vorschläge",
+      filterByApp: "Nach App filtern",
+      allApps: "Alle Apps",
+      removeTag: ({ tag }) => `Tag ${tag} entfernen`,
+      removeTagTitle: ({ tag }) => `#${tag} entfernen`,
+      resultCount: ({ count }) => i18n.plural(count, "de", { one: `${count} Ergebnis`, other: `${count} Ergebnisse` }),
+      tagHelp: "Hilfe zu Tags",
+      typeToSearchBeforeTag: "Gib einen Suchbegriff ein oder verwende einen",
+      typeToSearchAfterTag: "für die Suche in einer bestimmten App.",
+      noTagsAvailable: "Keine Tags verfügbar.",
+      addTag: ({ tag, app }) => `#${tag} hinzufügen (${app})`,
+      seeAllTagDescriptions: "Alle Tag-Beschreibungen anzeigen",
+      noAppSupports: "Keine App unterstützt",
+      removeTagOrPick: "Entferne den Tag oder wähle unten einen anderen aus.",
+      removeNamedTag: ({ tag }) => `#${tag} entfernen`,
+      noMatches: "Keine Treffer",
+      matchesFor: "für",
+      selectPreview: "Wähle ein Ergebnis aus, um Details anzuzeigen.",
+      chooseResource: "Cloud-Inhalt auswählen",
+    },
+  },
+});