@crievo/omni 0.0.0-stage → 0.1.1

package/studio/web/hooks/useSidePanel.ts

@@ -0,0 +1,23 @@
+import { useState } from "react";
+
+/* a right side panel's open state, remembered in this browser under `storageKey` */
+export function useSidePanel(storageKey: string, open = false) {
+  const stored = () => {
+    try {
+      const v = localStorage.getItem(storageKey);
+      return v === null ? open : v === "1";
+    } catch {
+      return open;
+    }
+  };
+  const [panel, setPanel] = useState(stored);
+  const toggle = (value: boolean) => {
+    setPanel(value);
+    try {
+      localStorage.setItem(storageKey, value ? "1" : "0");
+    } catch {
+      /* lasts this session only */
+    }
+  };
+  return [panel, toggle] as const;
+}

package/studio/web/hooks/useSound.ts

@@ -0,0 +1,30 @@
+/* The video's sound routes (api/routes/sound.ts) and the sound timeline's data query. */
+
+import { useQuery } from "@tanstack/react-query";
+import { api, enc, read, send } from "../lib/api";
+import type { SoundDraft } from "../types/api";
+
+export const soundRoutes = (slug: string) => {
+  const r = api.videos[":slug"].sound;
+  const param = { slug: enc(slug) };
+  return {
+    get: () => read(r.$get({ param })),
+    plan: (draft: SoundDraft) => send(r.plan.$post({ param, json: draft })),
+    /* keepalive: the request survives the page going away */
+    save: (draft: SoundDraft, keepalive = false) =>
+      keepalive
+        ? r.$post({ param, json: draft }, { init: { keepalive: true } })
+        : send(r.$post({ param, json: draft })),
+    reassemble: () => send(r.reassemble.$post({ param, json: {} })),
+  };
+};
+
+/* the timeline's data: gcTime 0 so coming back to the editor always reads fresh; no structural
+   sharing so every fetch resets the draft, like a reload */
+export const useSoundQuery = (slug: string) =>
+  useQuery({
+    queryKey: ["sound", slug],
+    queryFn: () => soundRoutes(slug).get(),
+    gcTime: 0,
+    structuralSharing: false,
+  });

package/studio/web/hooks/useUsage.ts

@@ -0,0 +1,11 @@
+import { api } from "../lib/api";
+import { queryKeys } from "../lib/query-client";
+import type { Usage } from "../types/api";
+import { useLiveQuery } from "./useLiveQuery";
+
+/* GET /api/usage; reload after POST /api/usage/refresh */
+export function useUsage() {
+  const { data, error, reload } = useLiveQuery(queryKeys.usage, () => api.usage.$get());
+  const usage: Usage | null = data;
+  return { usage, error, reload };
+}

package/studio/web/hooks/useVideoVoice.ts

@@ -0,0 +1,36 @@
+/* The video's voice and its providers: used by the video voice picker and by each line's picker. */
+
+import { PROVIDER_NAME } from "../lib/providers";
+import type { VideoDetail, VoiceProviderStatus } from "../types/api";
+import { useServices } from "./useServices";
+import { useVoiceProfiles } from "./useVoiceProfiles";
+
+export function useVideoVoice(video: VideoDetail) {
+  const s = useServices();
+  const { profiles, defaultId: defaultProfile, reload: reloadProfiles } = useVoiceProfiles();
+  const currentProfile = video.scenes?.voice?.voice_profile ?? defaultProfile ?? "";
+  /* with a voice (profile), its priority wins; with none, the global config order */
+  const profileOrder = profiles?.find(p => p.id === currentProfile)?.order ?? null;
+  const global = s?.voices ?? [];
+  const providers: VoiceProviderStatus[] = profileOrder
+    ? profileOrder
+        .map(
+          id =>
+            global.find(g => g.id === id) ?? {
+              id,
+              name: PROVIDER_NAME[id] ?? id,
+              default: false,
+              ready: true,
+              reason: null,
+            },
+        )
+        .map((p, i) => ({ ...p, default: i === 0, reason: null, ready: true }))
+    : global;
+  const defaultProvider = providers.find(p => p.default)?.id ?? "fish";
+  const current =
+    video.scenes?.voice?.provider && providers.some(p => p.id === video.scenes?.voice?.provider)
+      ? video.scenes.voice.provider
+      : defaultProvider;
+  return { profiles, defaultProfile, reloadProfiles, currentProfile, profileOrder, providers, current };
+}
+export type VideoVoice = ReturnType<typeof useVideoVoice>;

package/studio/web/hooks/useVideos.ts

@@ -0,0 +1,21 @@
+import { api, enc } from "../lib/api";
+import { queryKeys } from "../lib/query-client";
+import type { VideoDetail, VideoSummary } from "../types/api";
+import { useLiveQuery } from "./useLiveQuery";
+
+/* refetched on every SSE "video" notice (150 ms debounce) */
+export function useVideos() {
+  const { data, error, reload } = useLiveQuery(queryKeys.videos, () => api.videos.$get());
+  const videos: VideoSummary[] | null = data;
+  return { videos, error, reload };
+}
+
+/* refetched on the SSE "video" notice for this slug; null slug: nothing to ask for */
+export function useVideo(slug: string | null) {
+  const { data, error, reload } = useLiveQuery(
+    queryKeys.video(slug ?? ""),
+    slug ? () => api.videos[":slug"].$get({ param: { slug: enc(slug) } }) : null,
+  );
+  const video: VideoDetail | null = data;
+  return { video, error, reload };
+}

package/studio/web/hooks/useVoiceProfilePreview.ts

@@ -0,0 +1,52 @@
+/* "Ouvir voz": plays the profile's stored sample (generated only if it doesn't exist yet); the
+   same button stops it. With `provider`, that provider's sample, and `listeningId` is
+   `<profile>:<provider>`. */
+
+import { useCallback, useEffect, useRef, useState } from "react";
+import { api, send } from "../lib/api";
+import { createAudioAnalyser } from "../lib/audio";
+
+export type ListenPhase = "generating" | "playing" | null;
+
+export function useVoiceProfilePreview() {
+  const [listening, setListening] = useState<ListenPhase>(null);
+  const [listeningId, setListeningId] = useState<string | null>(null);
+  const [error, setError] = useState<string | null>(null);
+  const audio = useRef<HTMLAudioElement | null>(null);
+  const analyser = useRef<AnalyserNode | null>(null);
+  const stop = useCallback(() => {
+    audio.current?.pause();
+    audio.current = null;
+    analyser.current = null;
+    setListening(null);
+    setListeningId(null);
+  }, []);
+  useEffect(() => stop, [stop]);
+  const listen = async (id: string, provider?: string) => {
+    if (listening === "generating") return;
+    const key = provider ? `${id}:${provider}` : id;
+    const same = listeningId === key;
+    stop();
+    if (same) return; /* the same button only stops */
+    setError(null);
+    setListeningId(key);
+    setListening("generating");
+    const r = await send(api.settings["voice-profile"].sample.$post({ json: { id, provider } }));
+    if (!r.ok || !r.url) {
+      stop();
+      setError(r.error ?? "Não consegui gerar a amostra");
+      return;
+    }
+    const a = new Audio(r.url);
+    a.onended = stop;
+    a.onerror = () => {
+      stop();
+      setError("Não consegui tocar a amostra");
+    };
+    audio.current = a;
+    analyser.current = createAudioAnalyser(a);
+    setListening("playing");
+    a.play().catch(() => stop());
+  };
+  return { listening, listeningId, error, listen, stop, analyser, clearError: () => setError(null) };
+}

package/studio/web/hooks/useVoiceProfiles.ts

@@ -0,0 +1,7 @@
+import { useSettings } from "./useSettings";
+
+/* the voice profiles and the default one (from GET /api/settings) */
+export function useVoiceProfiles() {
+  const { settings, reload } = useSettings();
+  return { profiles: settings?.voice.profiles ?? null, defaultId: settings?.voice.default_profile ?? null, reload };
+}

package/studio/web/hooks/useVoiceRunning.ts

@@ -0,0 +1,10 @@
+import type { VideoDetail } from "../types/api";
+import { useQueue } from "./useQueue";
+
+/* the voice ticket of this video running or waiting in the queue, if any */
+export function useVoiceRunning(video: VideoDetail) {
+  const queue = useQueue();
+  return (
+    [...(queue?.running ?? []), ...(queue?.waiting ?? [])].find(t => t.dir === video.dir && t.tool === "voice") ?? null
+  );
+}

package/studio/web/hooks/useVoiceStudioClosed.ts

@@ -0,0 +1,8 @@
+import { useServices } from "./useServices";
+
+/* VoiceStudio is local: with the app closed it neither speaks nor has anything to configure.
+   Until the status arrives, it counts as open. */
+export function useVoiceStudioClosed() {
+  const vs = useServices()?.voicestudio;
+  return !!vs && !vs.ok;
+}

package/studio/web/index.html

@@ -0,0 +1,19 @@
+<!doctype html>
+<html lang="pt-BR">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Omni</title>
+  <!-- the brand (looping play): black on the light theme, white on the dark one (web/assets/logos/omni-*.png) -->
+  <link rel="icon" type="image/png" media="(prefers-color-scheme: light)" href="data:image/png;base64,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">
+  <link rel="icon" type="image/png" media="(prefers-color-scheme: dark)" href="data:image/png;base64,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">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap">
+  <link rel="stylesheet" href="./styles/index.css">
+</head>
+<body>
+  <div id="root"></div>
+  <script type="module" src="./main.tsx"></script>
+</body>
+</html>

package/studio/web/lib/agent.ts

@@ -0,0 +1,7 @@
+/* The agent that drives the studio sessions. The UI calls it "Agente"; Claude's name, mark and
+   animation show only with Claude chosen in Configurações → Agente (today the only option: Codex
+   is "em breve"). When there is a real choice, it goes here and the rest of the UI follows. */
+
+export type AgentProvider = "claude" | "codex";
+export const AGENT_PROVIDER: AgentProvider = "claude";
+export const isClaude = AGENT_PROVIDER === "claude";

package/studio/web/lib/alerts.ts

@@ -0,0 +1,210 @@
+/* What broke and needs the user, for the error banner (components/ErrorBanner.tsx): a publication that
+   failed or missed its time, a session that stopped with an error, no agent account free, a platform
+   that refused its token or whose token is about to expire, the omnichat paused by Meta or its cloud
+   not answering. Each alert leaves on its own when the condition clears; its key names the occurrence,
+   so a dismissed one comes back when it fails again. */
+
+import type { AgentsSettings, OmnichatState, PlatformAccounts, Session, Settings, VideoSummary } from "../types/api";
+import { formatDayTime } from "./format";
+import { sessionPageLink, type SessionPageLink } from "./sessions";
+import { PUBLISH_PLATFORMS } from "./video-tabs";
+
+export type AlertLink =
+  | SessionPageLink
+  | { to: "/settings/$category"; params: { category: string } }
+  | { to: "/omnichat"; params?: undefined };
+
+export type Alert = { key: string; label: string; subject?: string; message?: string; link: AlertLink };
+
+export type AlertInput = {
+  videos: VideoSummary[] | null;
+  sessions: Session[] | null;
+  agents: AgentsSettings | null;
+  keys: Settings["publish"]["keys"] | null;
+  accounts: PlatformAccounts | null;
+  omnichat: OmnichatState | null;
+  now: number;
+};
+
+const PLATFORM_NAME = { youtube: "YouTube", instagram: "Instagram", tiktok: "TikTok" } as const;
+const DAY = 86_400_000;
+/* a session error older than this is history, not something to act on */
+export const SESSION_WINDOW_MS = DAY;
+/* a token closer than this to expiring is an alert (the renewal should have run by then) */
+export const EXPIRY_WINDOW_MS = 7 * DAY;
+
+const failedAfter = (p?: { last_error?: { at: string }; published_at?: string }) =>
+  !!p?.last_error && (!p.published_at || p.last_error.at > p.published_at);
+
+const firstLine = (s: string, max = 160) => {
+  const line = s.trim().split("\n")[0] ?? "";
+  return line.length > max ? `${line.slice(0, max - 1)}…` : line;
+};
+
+const publishLink = (slug: string, stage = "publish"): AlertLink => ({
+  to: "/videos/$slug/$stage",
+  params: { slug, stage },
+});
+const settingsLink = (category: string): AlertLink => ({ to: "/settings/$category", params: { category } });
+
+function videoAlerts(videos: VideoSummary[]): Alert[] {
+  const out: Alert[] = [];
+  for (const v of videos) {
+    if (v.archived) continue;
+    const s = v.publication?.schedule;
+    if (s?.state === "failed" || s?.state === "missed") {
+      out.push({
+        key: `schedule:${v.slug}:${s.state}:${s.last_error?.at ?? s.when}`,
+        label: s.state === "missed" ? "Publicação agendada passou da hora" : "Publicação agendada falhou",
+        subject: v.title,
+        message: s.last_error ? firstLine(s.last_error.message) : undefined,
+        link: publishLink(v.slug),
+      });
+    } else {
+      for (const p of PUBLISH_PLATFORMS) {
+        const x = v.publication?.[p];
+        if (!failedAfter(x)) continue;
+        out.push({
+          key: `publish:${v.slug}:${p}:${x!.last_error!.at}`,
+          label: `Falhou a publicação no ${PLATFORM_NAME[p]}`,
+          subject: v.title,
+          message: firstLine(x!.last_error!.message),
+          link: publishLink(v.slug),
+        });
+      }
+    }
+    const ig = v.carousel?.publication?.instagram;
+    if (failedAfter(ig)) {
+      out.push({
+        key: `carousel:${v.slug}:${ig!.last_error!.at}`,
+        label: "Falhou a publicação do carrossel",
+        subject: v.title,
+        message: firstLine(ig!.last_error!.message),
+        link: publishLink(v.slug, "carousel-publish"),
+      });
+    }
+    if (v.statusError) {
+      out.push({
+        key: `status:${v.slug}:${v.statusError}`,
+        label: "Não consegui ler o estado do vídeo",
+        subject: v.title,
+        message: firstLine(v.statusError),
+        link: { to: "/videos/$slug", params: { slug: v.slug } },
+      });
+    }
+  }
+  return out;
+}
+
+/* Omni's own sessions have no page of their own; their errors show in its panel */
+function sessionAlerts(sessions: Session[], now: number): Alert[] {
+  return sessions
+    .filter(s => s.type !== "omni" && s.state === "error" && s.turn)
+    .filter(s => now - Date.parse(s.turn!.started_at) < SESSION_WINDOW_MS)
+    .map(s => ({
+      key: `session:${s.id}:${s.turn!.n}`,
+      label: "O agente parou com erro",
+      subject: s.title,
+      message: s.turn!.result?.text ? firstLine(s.turn!.result.text) : undefined,
+      link: sessionPageLink(s),
+    }));
+}
+
+/* only when no account can take a session: one account at its limit is the rotation working */
+function agentAlerts(agents: AgentsSettings, now: number): Alert[] {
+  const on = agents.accounts.filter(a => a.enabled);
+  const link = settingsLink("agent");
+  if (!on.length) return [{ key: "agents:none", label: "Nenhuma conta de agente ligada", link }];
+  const limited = (a: (typeof on)[number]) => !!a.limited_until && a.limited_until > now;
+  if (on.some(a => a.login && !limited(a))) return [];
+  const until = on.filter(a => a.login && limited(a)).map(a => a.limited_until!);
+  if (!until.length) {
+    return [
+      {
+        key: "agents:no-login",
+        label: "Nenhuma conta de agente tem login",
+        message: "As sessões não começam até uma conta entrar",
+        link,
+      },
+    ];
+  }
+  const first = Math.min(...until);
+  return [
+    {
+      key: `agents:limited:${first}`,
+      label: "Todas as contas de agente estão no limite de uso",
+      message: `A primeira libera ${formatDayTime(first)}`,
+      link,
+    },
+  ];
+}
+
+/* a platform this machine is connected to (the token is in .env) that refuses it, or a token about to expire */
+function tokenAlerts(keys: AlertInput["keys"], accounts: PlatformAccounts, now: number): Alert[] {
+  if (accounts.error) return [];
+  const out: Alert[] = [];
+  for (const p of PUBLISH_PLATFORMS) {
+    const a = accounts[p];
+    if (!a || !keys?.[`${p}_connected`]) continue;
+    const name = PLATFORM_NAME[p];
+    if (!a.ready) {
+      out.push({
+        key: `token:${p}:${a.reason ?? ""}`,
+        label: `O ${name} recusou a conexão`,
+        message: a.reason ? firstLine(a.reason) : undefined,
+        link: settingsLink("platforms"),
+      });
+      continue;
+    }
+    const at = "expires" in a ? a.expires : null;
+    const expires = at ? Date.parse(at) : NaN;
+    if (Number.isFinite(expires) && expires - now < EXPIRY_WINDOW_MS) {
+      out.push({
+        key: `expiry:${p}:${at}`,
+        label: expires <= now ? `O token do ${name} venceu` : `O token do ${name} vence ${formatDayTime(expires)}`,
+        message: "Conecte de novo em Plataformas",
+        link: settingsLink("platforms"),
+      });
+    }
+  }
+  return out;
+}
+
+function omnichatAlerts(o: OmnichatState, now: number): Alert[] {
+  const out: Alert[] = [];
+  if (o.pause && Date.parse(o.pause.until) > now) {
+    out.push({
+      key: `omnichat-pause:${o.pause.until}`,
+      label: "O omnichat está pausado pela Meta",
+      message: `Até ${formatDayTime(o.pause.until)}${o.pause.reason ? `: ${firstLine(o.pause.reason)}` : ""}`,
+      link: { to: "/omnichat" },
+    });
+  }
+  const agent = o.agent;
+  if (agent?.cloud && !agent.cloud.ready) {
+    out.push({
+      key: `omnichat-cloud:${agent.cloud.reason}`,
+      label: "A cloud do omnichat não responde",
+      message: firstLine(agent.cloud.reason),
+      link: settingsLink("publishing"),
+    });
+  } else if (agent && !agent.cloud && agent.installed && !agent.node_ok) {
+    out.push({
+      key: "omnichat-node",
+      label: "O agente do omnichat não acha o Node",
+      message: "Instale o agente de novo em Publicação",
+      link: settingsLink("publishing"),
+    });
+  }
+  return out;
+}
+
+export function alertsOf(i: AlertInput): Alert[] {
+  return [
+    ...(i.agents ? agentAlerts(i.agents, i.now) : []),
+    ...(i.accounts ? tokenAlerts(i.keys, i.accounts, i.now) : []),
+    ...(i.omnichat ? omnichatAlerts(i.omnichat, i.now) : []),
+    ...(i.videos ? videoAlerts(i.videos) : []),
+    ...(i.sessions ? sessionAlerts(i.sessions, i.now) : []),
+  ];
+}