27:I[533540,["/_next/static/immutable/chunks/1foxow80j86yc.js","/_next/static/immutable/chunks/1uc7fygqse0rk.js","/_next/static/immutable/chunks/14z5dxw32h9uu.js","/_next/static/immutable/chunks/2x52r-ds3ga7q.js","/_next/static/immutable/chunks/3zv_ge6xmbxh5.js","/_next/static/immutable/chunks/0whdc15hiby5u.js","/_next/static/immutable/chunks/3socxcyct4svx.js","/_next/static/immutable/chunks/3uqibq0uylb_w.js","/_next/static/immutable/chunks/11ey3q-ne_2gt.js","/_next/static/immutable/chunks/1i-l36eufkj48.js","/_next/static/immutable/chunks/2j_wkzp59te1y.js","/_next/static/immutable/chunks/444p6c71d54pu.js","/_next/static/immutable/chunks/1ajaadwomwxn6.js","/_next/static/immutable/chunks/1cdy7tuqlvrq6.js","/_next/static/immutable/chunks/1vydmupd3rkwq.js","/_next/static/immutable/chunks/26og1hq4705ez.js","/_next/static/immutable/chunks/3jzblm053_dkb.js","/_next/static/immutable/chunks/03pxstsmo58q-.js","/_next/static/immutable/chunks/3u47yu7kbtjyk.js"],"AiMobileScreenWorkspace",1] 28:T1f50,"use client"; import { ArrowUp, BatteryFull, ChevronDown, ListChecks, Menu, Signal, Wifi, X, } from "lucide-react"; import * as React from "react"; type Message = { id: number; role: "assistant" | "user"; text: string; }; const openingMessages: Message[] = [ { id: 1, role: "assistant", text: "I reviewed the launch notes. Want a short handoff plan for the team?", }, { id: 2, role: "user", text: "Yes. Keep it to three clear steps.", }, { id: 3, role: "assistant", text: "Start with the release checklist, name an owner for each open item, then share a final status update before launch.", }, ]; export function AiMobilePreviewScreen() { const [messages, setMessages] = React.useState(openingMessages); const [draft, setDraft] = React.useState(""); const [menuOpen, setMenuOpen] = React.useState(false); const [model, setModel] = React.useState<"Focus" | "Fast">("Focus"); const nextId = React.useRef(4); const thread = React.useRef(null); React.useEffect(() => { if (messages.length <= openingMessages.length || !thread.current) return; thread.current.scrollTop = thread.current.scrollHeight; }, [messages]); function sendMessage() { const text = draft.trim(); if (!text) return; const userId = nextId.current++; const replyId = nextId.current++; setMessages((current) => [ ...current, { id: userId, role: "user", text }, { id: replyId, role: "assistant", text: "Here’s a concise version: confirm the owner, close the remaining checks, and post the launch update. I can refine any step.", }, ]); setDraft(""); } return (

Release handoff

AI workspace

Today

{messages.map((message) => (

{message.text}

))}

Release checklist

{[ "Confirm owners", "Review open checks", "Post launch update", ].map((step, index) => (

{index + 1} {step}

))}

{["Draft team update", "Find open risks"].map((prompt) => ( ))}

{ event.preventDefault(); sendMessage(); }} className="rounded-2xl border p-2.5 shadow-sm" >

setDraft(event.target.value)}
            onKeyDown={(event) => {
              if (event.key === "Enter" && !event.shiftKey) {
                event.preventDefault();
                sendMessage();
              }
            }}
            className="placeholder:text-muted-foreground w-full resize-none bg-transparent px-1 text-[13px] outline-none"
          />
          <div className="flex justify-end">
            <button
              type="submit"
              aria-label="Send message"
              disabled={!draft.trim()}
              className="bg-primary text-primary-foreground flex size-7 items-center justify-center rounded-full disabled:opacity-40"
            >
              <ArrowUp className="size-4" />
            </button>
          </div>
        </form>
      </div>
      <div
        aria-hidden="true"
        className="flex h-5 shrink-0 items-center justify-center"
      >
        <div className="bg-foreground h-1 w-28 rounded-full" />
      </div>

{menuOpen ? (
        <nav
          aria-label="Mobile conversations"
          className="bg-background absolute inset-x-0 top-[100px] bottom-5 z-20 flex flex-col border-t p-5 shadow-lg"
        >
          <p className="text-muted-foreground mb-3 text-[11px] font-medium tracking-wide uppercase">
            Conversations
          </p>
          <button
            type="button"
            onClick={() => setMenuOpen(false)}
            className="bg-muted rounded-xl px-3 py-3 text-left text-[13px] font-medium"
          >
            Release handoff
          </button>
          <button
            type="button"
            onClick={() => {
              setMessages(openingMessages);
              setDraft("");
              setMenuOpen(false);
            }}
            className="hover:bg-muted mt-2 rounded-xl px-3 py-3 text-left text-[13px]"
          >
            Reset preview
          </button>
        </nav>
      ) : null}
    </div>
  );
}
1c:["$","$L27",null,{"source":"$28"}]
</article></body></html>