refactor(characters): drive shared UI from active character
This commit is contained in:
@@ -48,7 +48,13 @@ describe("shared Tailwind components", () => {
|
||||
|
||||
it("renders CharacterAvatar with dynamic sizing and image utilities", () => {
|
||||
const html = renderToStaticMarkup(
|
||||
<CharacterAvatar size={48} imageSize={96} className="custom-avatar" />,
|
||||
<CharacterAvatar
|
||||
src="/images/avatar/maya.png"
|
||||
alt="Maya Tan"
|
||||
size={48}
|
||||
imageSize={96}
|
||||
className="custom-avatar"
|
||||
/>,
|
||||
);
|
||||
|
||||
expect(html).toContain("inline-flex");
|
||||
@@ -56,7 +62,7 @@ describe("shared Tailwind components", () => {
|
||||
expect(html).toContain("width:48px");
|
||||
expect(html).toContain("height:48px");
|
||||
expect(html).toContain("size-full object-cover");
|
||||
expect(html).toContain("%2Fimages%2Favatar%2Felio.png");
|
||||
expect(html).toContain("%2Fimages%2Favatar%2Fmaya.png");
|
||||
});
|
||||
|
||||
it("renders UserMessageAvatar custom and fallback images", () => {
|
||||
|
||||
@@ -4,8 +4,8 @@ import Image from "next/image";
|
||||
import type { CSSProperties } from "react";
|
||||
|
||||
export interface CharacterAvatarProps {
|
||||
src?: string;
|
||||
alt?: string;
|
||||
src: string;
|
||||
alt: string;
|
||||
className?: string;
|
||||
size?: number | string;
|
||||
imageSize?: number;
|
||||
@@ -13,8 +13,8 @@ export interface CharacterAvatarProps {
|
||||
}
|
||||
|
||||
export function CharacterAvatar({
|
||||
src = "/images/avatar/elio.png",
|
||||
alt = "Elio Silvestri",
|
||||
src,
|
||||
alt,
|
||||
className,
|
||||
size = 43,
|
||||
imageSize,
|
||||
|
||||
@@ -79,6 +79,7 @@ describe("core Tailwind components", () => {
|
||||
<AppBottomNav
|
||||
activeItem="chat"
|
||||
variant="dark"
|
||||
privateRoomLabel="Maya Private room"
|
||||
onChatClick={() => undefined}
|
||||
onPrivateRoomClick={() => undefined}
|
||||
/>,
|
||||
@@ -87,6 +88,7 @@ describe("core Tailwind components", () => {
|
||||
<AppBottomNav
|
||||
activeItem="privateRoom"
|
||||
variant="warm"
|
||||
privateRoomLabel="Maya Private room"
|
||||
onChatClick={() => undefined}
|
||||
onPrivateRoomClick={() => undefined}
|
||||
/>,
|
||||
@@ -99,7 +101,7 @@ describe("core Tailwind components", () => {
|
||||
);
|
||||
expect(privateRoomHtml).toMatch(/class="[^"]*warm[^"]*"/);
|
||||
expect(privateRoomHtml).toMatch(
|
||||
/<button[^>]*aria-current="page"[^>]*>.*?<span>Elio Private room<\/span>/,
|
||||
/<button[^>]*aria-current="page"[^>]*>.*?<span>Maya Private room<\/span>/,
|
||||
);
|
||||
expect(chatHtml).toContain('data-analytics-key="navigation.chat"');
|
||||
expect(privateRoomHtml).toContain(
|
||||
|
||||
@@ -10,7 +10,7 @@ export type AppBottomNavVariant = "warm" | "dark";
|
||||
export interface AppBottomNavProps {
|
||||
activeItem?: AppBottomNavItem | null;
|
||||
variant?: AppBottomNavVariant;
|
||||
privateRoomLabel?: string;
|
||||
privateRoomLabel: string;
|
||||
onChatClick: () => void;
|
||||
onPrivateRoomClick: () => void;
|
||||
}
|
||||
@@ -18,7 +18,7 @@ export interface AppBottomNavProps {
|
||||
export function AppBottomNav({
|
||||
activeItem = null,
|
||||
variant = "warm",
|
||||
privateRoomLabel = "Elio Private room",
|
||||
privateRoomLabel,
|
||||
onChatClick,
|
||||
onPrivateRoomClick,
|
||||
}: AppBottomNavProps) {
|
||||
|
||||
@@ -16,7 +16,10 @@ export default async function CharacterChatLayout({
|
||||
if (!character?.capabilities.chat) notFound();
|
||||
|
||||
return (
|
||||
<ChatRouteProviders characterId={character.id}>
|
||||
<ChatRouteProviders
|
||||
characterId={character.id}
|
||||
emptyChatGreeting={character.emptyChatGreeting}
|
||||
>
|
||||
{children}
|
||||
</ChatRouteProviders>
|
||||
);
|
||||
|
||||
@@ -9,7 +9,10 @@ import {
|
||||
useChatDispatch,
|
||||
useChatState,
|
||||
} from "@/stores/chat/chat-context";
|
||||
import { useActiveCharacterRoutes } from "@/providers/character-provider";
|
||||
import {
|
||||
useActiveCharacter,
|
||||
useActiveCharacterRoutes,
|
||||
} from "@/providers/character-provider";
|
||||
|
||||
import { MobileShell } from "@/app/_components/core";
|
||||
|
||||
@@ -46,6 +49,7 @@ const chatShellStyle = {
|
||||
|
||||
export function ChatScreen() {
|
||||
const router = useRouter();
|
||||
const character = useActiveCharacter();
|
||||
const characterRoutes = useActiveCharacterRoutes();
|
||||
const searchParams = useSearchParams();
|
||||
const state = useChatState();
|
||||
@@ -167,7 +171,7 @@ export function ChatScreen() {
|
||||
>
|
||||
<div className="pointer-events-none absolute inset-0 z-0">
|
||||
<Image
|
||||
src="/images/chat/bg-chatpage.png"
|
||||
src={character.assets.chatBackground}
|
||||
alt=""
|
||||
fill
|
||||
priority
|
||||
|
||||
@@ -235,6 +235,7 @@ function renderChatArea(
|
||||
act(() => {
|
||||
root.render(
|
||||
<ChatArea
|
||||
characterId="character_elio"
|
||||
messages={messages}
|
||||
isReplyingAI={false}
|
||||
initialScrollReady={initialScrollReady}
|
||||
|
||||
@@ -1,15 +1,22 @@
|
||||
import { renderToStaticMarkup } from "react-dom/server";
|
||||
import { describe, expect, it } from "vitest";
|
||||
|
||||
import { getCharacterBySlug } from "@/data/constants/character";
|
||||
import { CharacterProvider } from "@/providers/character-provider";
|
||||
|
||||
import { LockedImageMessageCard } from "../locked-image-message-card";
|
||||
|
||||
describe("LockedImageMessageCard", () => {
|
||||
it("renders the promotion hint and an enabled unlock action", () => {
|
||||
const character = getCharacterBySlug("maya");
|
||||
if (!character) throw new Error("Missing Maya character fixture");
|
||||
const html = renderToStaticMarkup(
|
||||
<LockedImageMessageCard
|
||||
hint="Unlock this private photo."
|
||||
onUnlock={() => undefined}
|
||||
/>,
|
||||
<CharacterProvider character={character}>
|
||||
<LockedImageMessageCard
|
||||
hint="Unlock this private photo."
|
||||
onUnlock={() => undefined}
|
||||
/>
|
||||
</CharacterProvider>,
|
||||
);
|
||||
|
||||
expect(html).toContain('aria-label="Locked private image"');
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import type { ReactNode } from "react";
|
||||
import { renderToStaticMarkup } from "react-dom/server";
|
||||
import { describe, expect, it, vi } from "vitest";
|
||||
|
||||
@@ -25,8 +26,8 @@ vi.mock("@/router/use-app-navigator", () => ({
|
||||
|
||||
describe("chat Tailwind components", () => {
|
||||
it("renders MessageAvatar AI and user branches with image utilities", () => {
|
||||
const aiHtml = renderToStaticMarkup(<MessageAvatar isFromAI={true} />);
|
||||
const userHtml = renderToStaticMarkup(
|
||||
const aiHtml = renderWithCharacter(<MessageAvatar isFromAI={true} />);
|
||||
const userHtml = renderWithCharacter(
|
||||
<MessageAvatar isFromAI={false} userAvatarUrl="/user-avatar.png" />,
|
||||
);
|
||||
|
||||
@@ -71,8 +72,8 @@ describe("chat Tailwind components", () => {
|
||||
});
|
||||
|
||||
it("renders PrivateMessageCard with fallback and loading states", () => {
|
||||
const fallbackHtml = renderToStaticMarkup(<PrivateMessageCard />);
|
||||
const unlockingHtml = renderToStaticMarkup(
|
||||
const fallbackHtml = renderWithCharacter(<PrivateMessageCard />);
|
||||
const unlockingHtml = renderWithCharacter(
|
||||
<PrivateMessageCard hint="Premium secret" isUnlocking onUnlock={() => undefined} />,
|
||||
);
|
||||
|
||||
@@ -126,13 +127,18 @@ describe("chat Tailwind components", () => {
|
||||
it("renders ImageBubble openable and paywalled states", () => {
|
||||
const openableHtml = renderToStaticMarkup(
|
||||
<ImageBubble
|
||||
characterId="character_elio"
|
||||
messageId="message-1"
|
||||
imageUrl="/chat-image.png"
|
||||
onOpenImage={() => undefined}
|
||||
/>,
|
||||
);
|
||||
const paywalledHtml = renderToStaticMarkup(
|
||||
<ImageBubble imageUrl="/locked-image.png" imagePaywalled />,
|
||||
<ImageBubble
|
||||
characterId="character_elio"
|
||||
imageUrl="/locked-image.png"
|
||||
imagePaywalled
|
||||
/>,
|
||||
);
|
||||
|
||||
expect(openableHtml).toContain('role="button"');
|
||||
@@ -170,14 +176,14 @@ describe("chat Tailwind components", () => {
|
||||
});
|
||||
|
||||
it("renders ChatHeader guest and member branches", () => {
|
||||
const guestHtml = renderToStaticMarkup(<ChatHeader isGuest={true} />);
|
||||
const memberHtml = renderToStaticMarkup(
|
||||
const guestHtml = renderWithCharacter(<ChatHeader isGuest={true} />);
|
||||
const memberHtml = renderWithCharacter(
|
||||
<ChatHeader isGuest={false} offerBanner={<div>Offer</div>} />,
|
||||
);
|
||||
const memberWithHintHtml = renderToStaticMarkup(
|
||||
const memberWithHintHtml = renderWithCharacter(
|
||||
<ChatHeader isGuest={false} showBrowserHint />,
|
||||
);
|
||||
const guestWithHintHtml = renderToStaticMarkup(
|
||||
const guestWithHintHtml = renderWithCharacter(
|
||||
<ChatHeader isGuest={true} showBrowserHint />,
|
||||
);
|
||||
|
||||
@@ -369,3 +375,11 @@ describe("chat Tailwind components", () => {
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
function renderWithCharacter(node: ReactNode, slug = "elio"): string {
|
||||
const character = getCharacterBySlug(slug);
|
||||
if (!character) throw new Error(`Missing ${slug} character fixture`);
|
||||
return renderToStaticMarkup(
|
||||
<CharacterProvider character={character}>{node}</CharacterProvider>,
|
||||
);
|
||||
}
|
||||
|
||||
@@ -24,7 +24,6 @@ import {
|
||||
import { LoaderCircle } from "lucide-react";
|
||||
|
||||
import type { UiMessage } from "@/stores/chat/ui-message";
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
import { usePullToRefresh } from "@/hooks/use-pull-to-refresh";
|
||||
|
||||
import {
|
||||
@@ -46,7 +45,7 @@ const ReplyingAnimation = lazy(() =>
|
||||
);
|
||||
|
||||
export interface ChatAreaProps {
|
||||
characterId?: string;
|
||||
characterId: string;
|
||||
messages: readonly UiMessage[];
|
||||
isReplyingAI: boolean;
|
||||
scrollToBottomSignal?: number;
|
||||
@@ -63,7 +62,7 @@ export interface ChatAreaProps {
|
||||
}
|
||||
|
||||
export function ChatArea({
|
||||
characterId = DEFAULT_CHARACTER_ID,
|
||||
characterId,
|
||||
messages,
|
||||
isReplyingAI,
|
||||
scrollToBottomSignal = 0,
|
||||
|
||||
@@ -9,10 +9,9 @@
|
||||
*/
|
||||
|
||||
import { ChatMediaImage } from "./chat-media-image";
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
|
||||
export interface ImageBubbleProps {
|
||||
characterId?: string;
|
||||
characterId: string;
|
||||
messageId?: string;
|
||||
imageUrl: string; // base64 data URI 或 URL
|
||||
imagePaywalled?: boolean;
|
||||
@@ -20,7 +19,7 @@ export interface ImageBubbleProps {
|
||||
}
|
||||
|
||||
export function ImageBubble({
|
||||
characterId = DEFAULT_CHARACTER_ID,
|
||||
characterId,
|
||||
messageId,
|
||||
imageUrl,
|
||||
imagePaywalled = false,
|
||||
|
||||
@@ -1,5 +1,21 @@
|
||||
import { CoinsRulesScreen } from "./coins-rules-screen";
|
||||
import { redirect } from "next/navigation";
|
||||
|
||||
export default function CoinsRulesPage() {
|
||||
return <CoinsRulesScreen />;
|
||||
import { DEFAULT_CHARACTER_SLUG } from "@/data/constants/character";
|
||||
import {
|
||||
appendRouteSearchParams,
|
||||
getCharacterRoutes,
|
||||
type RouteSearchParams,
|
||||
} from "@/router/routes";
|
||||
|
||||
export default async function CoinsRulesPage({
|
||||
searchParams,
|
||||
}: {
|
||||
searchParams: Promise<RouteSearchParams>;
|
||||
}) {
|
||||
redirect(
|
||||
appendRouteSearchParams(
|
||||
getCharacterRoutes(DEFAULT_CHARACTER_SLUG).coinsRules,
|
||||
await searchParams,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,6 +2,8 @@ import { act } from "react";
|
||||
import { createRoot, type Root } from "react-dom/client";
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
|
||||
|
||||
import { getCharacterBySlug } from "@/data/constants/character";
|
||||
import { CharacterProvider } from "@/providers/character-provider";
|
||||
import { Result } from "@/utils/result";
|
||||
|
||||
import { FeedbackScreen } from "../feedback-screen";
|
||||
@@ -48,7 +50,7 @@ describe("FeedbackScreen", () => {
|
||||
});
|
||||
|
||||
it("renders all categories and defaults to Problem", () => {
|
||||
act(() => root.render(<FeedbackScreen />));
|
||||
renderFeedbackScreen(root);
|
||||
|
||||
expect(container.textContent).toContain("Help us improve CozSweet");
|
||||
expect(container.textContent).toContain("Problem");
|
||||
@@ -73,7 +75,7 @@ describe("FeedbackScreen", () => {
|
||||
mocks.submitFeedback.mockResolvedValue(
|
||||
Result.ok({ feedbackId: "feedback-123" }),
|
||||
);
|
||||
act(() => root.render(<FeedbackScreen />));
|
||||
renderFeedbackScreen(root);
|
||||
const textarea = container.querySelector("textarea");
|
||||
if (!textarea) throw new Error("Expected feedback textarea");
|
||||
|
||||
@@ -104,6 +106,18 @@ describe("FeedbackScreen", () => {
|
||||
});
|
||||
});
|
||||
|
||||
function renderFeedbackScreen(root: Root): void {
|
||||
const character = getCharacterBySlug("maya");
|
||||
if (!character) throw new Error("Missing Maya character fixture");
|
||||
act(() =>
|
||||
root.render(
|
||||
<CharacterProvider character={character}>
|
||||
<FeedbackScreen />
|
||||
</CharacterProvider>,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
function setTextareaValue(element: HTMLTextAreaElement, value: string): void {
|
||||
const setter = Object.getOwnPropertyDescriptor(
|
||||
HTMLTextAreaElement.prototype,
|
||||
|
||||
@@ -1,5 +1,21 @@
|
||||
import { FeedbackScreen } from "./feedback-screen";
|
||||
import { redirect } from "next/navigation";
|
||||
|
||||
export default function FeedbackPage() {
|
||||
return <FeedbackScreen />;
|
||||
import { DEFAULT_CHARACTER_SLUG } from "@/data/constants/character";
|
||||
import {
|
||||
appendRouteSearchParams,
|
||||
getCharacterRoutes,
|
||||
type RouteSearchParams,
|
||||
} from "@/router/routes";
|
||||
|
||||
export default async function FeedbackPage({
|
||||
searchParams,
|
||||
}: {
|
||||
searchParams: Promise<RouteSearchParams>;
|
||||
}) {
|
||||
redirect(
|
||||
appendRouteSearchParams(
|
||||
getCharacterRoutes(DEFAULT_CHARACTER_SLUG).feedback,
|
||||
await searchParams,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,7 +2,9 @@ import { act, type Dispatch } from "react";
|
||||
import { createRoot, type Root } from "react-dom/client";
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
|
||||
|
||||
import { getCharacterBySlug } from "@/data/constants/character";
|
||||
import type { LoginStatus } from "@/data/schemas/auth";
|
||||
import { CharacterProvider } from "@/providers/character-provider";
|
||||
import { getCharacterRoutes } from "@/router/routes";
|
||||
import type { PrivateRoomEvent } from "@/stores/private-room";
|
||||
import type { PrivateRoomUnlockPaywallRequest } from "@/stores/private-room/private-room-state";
|
||||
@@ -80,7 +82,7 @@ describe("Private Room paywall navigation", () => {
|
||||
renderHarness(root, "guest", roomDispatch);
|
||||
|
||||
expect(mocks.openAuth).toHaveBeenCalledWith(
|
||||
getCharacterRoutes("elio").privateRoom,
|
||||
getCharacterRoutes("maya").privateRoom,
|
||||
);
|
||||
expect(mocks.openSubscription).not.toHaveBeenCalled();
|
||||
});
|
||||
@@ -91,9 +93,13 @@ function renderHarness(
|
||||
loginStatus: LoginStatus,
|
||||
roomDispatch: Dispatch<PrivateRoomEvent>,
|
||||
): void {
|
||||
const character = getCharacterBySlug("maya");
|
||||
if (!character) throw new Error("Missing Maya character fixture");
|
||||
act(() => {
|
||||
root.render(
|
||||
<Harness loginStatus={loginStatus} roomDispatch={roomDispatch} />,
|
||||
<CharacterProvider character={character}>
|
||||
<Harness loginStatus={loginStatus} roomDispatch={roomDispatch} />
|
||||
</CharacterProvider>,
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -1,5 +1,21 @@
|
||||
import { SidebarScreen } from "@/app/sidebar/sidebar-screen";
|
||||
import { redirect } from "next/navigation";
|
||||
|
||||
export default function SidebarPage() {
|
||||
return <SidebarScreen />;
|
||||
import { DEFAULT_CHARACTER_SLUG } from "@/data/constants/character";
|
||||
import {
|
||||
appendRouteSearchParams,
|
||||
getCharacterRoutes,
|
||||
type RouteSearchParams,
|
||||
} from "@/router/routes";
|
||||
|
||||
export default async function SidebarPage({
|
||||
searchParams,
|
||||
}: {
|
||||
searchParams: Promise<RouteSearchParams>;
|
||||
}) {
|
||||
redirect(
|
||||
appendRouteSearchParams(
|
||||
getCharacterRoutes(DEFAULT_CHARACTER_SLUG).sidebar,
|
||||
await searchParams,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -17,21 +17,23 @@ describe("splash Tailwind components", () => {
|
||||
});
|
||||
|
||||
it("renders SplashBackground with Tailwind fill image classes", () => {
|
||||
const html = renderToStaticMarkup(<SplashBackground />);
|
||||
const html = renderToStaticMarkup(
|
||||
<SplashBackground src="/images/cover/maya.png" />,
|
||||
);
|
||||
|
||||
expect(html).toContain("absolute");
|
||||
expect(html).toContain("bg-sidebar-background");
|
||||
expect(html).toContain("object-cover");
|
||||
expect(html).toContain("%2Fimages%2Fcover%2Felio.png");
|
||||
expect(html).toContain("%2Fimages%2Fcover%2Fmaya.png");
|
||||
});
|
||||
|
||||
it("renders SplashContent with Tailwind typography classes", () => {
|
||||
const html = renderToStaticMarkup(<SplashContent />);
|
||||
const html = renderToStaticMarkup(<SplashContent characterName="Maya" />);
|
||||
|
||||
expect(html).toContain("flex flex-col gap-md");
|
||||
expect(html).toContain("font-(family-name:--font-athelas)");
|
||||
expect(html).toContain("whitespace-pre-line");
|
||||
expect(html).toContain("Welcome to my secret hideout");
|
||||
expect(html).toContain("Welcome to Maya");
|
||||
});
|
||||
|
||||
it("renders SplashButton as an always-ready action", () => {
|
||||
|
||||
@@ -11,9 +11,9 @@
|
||||
import Image from "next/image";
|
||||
|
||||
export function SplashBackground({
|
||||
src = "/images/cover/elio.png",
|
||||
src,
|
||||
}: {
|
||||
src?: string;
|
||||
src: string;
|
||||
}) {
|
||||
return (
|
||||
<div className="absolute inset-0 z-0 overflow-hidden bg-sidebar-background">
|
||||
|
||||
@@ -4,11 +4,11 @@
|
||||
|
||||
const APOSTROPHE = "'";
|
||||
|
||||
export function SplashContent() {
|
||||
export function SplashContent({ characterName }: { characterName: string }) {
|
||||
return (
|
||||
<div className="z-2 flex flex-col gap-md">
|
||||
<h1 className="m-0 whitespace-pre-line text-left font-(family-name:--font-athelas) text-[clamp(28px,7.8vw,30px)] font-bold italic leading-[1.28] text-white">
|
||||
Welcome to my secret hideout~
|
||||
Welcome to {characterName}{APOSTROPHE}s secret hideout~
|
||||
{"\n"}It{APOSTROPHE}s just the two of us now.
|
||||
{"\n"}Feel free to whisper your
|
||||
{"\n"}little secrets.
|
||||
|
||||
@@ -26,6 +26,7 @@ import { useSplashLatestMessage } from "../use-splash-latest-message";
|
||||
|
||||
function LatestMessageHarness() {
|
||||
const state = useSplashLatestMessage({
|
||||
characterId: "character_maya",
|
||||
hasInitialized: true,
|
||||
isAuthLoading: false,
|
||||
loginStatus: "facebook",
|
||||
@@ -64,5 +65,9 @@ describe("useSplashLatestMessage hydration", () => {
|
||||
expect(hydrationErrors).toEqual([]);
|
||||
expect(container.textContent).toBe("Loading");
|
||||
expect(mocks.loadLatestMessage).toHaveBeenCalledOnce();
|
||||
expect(mocks.loadLatestMessage).toHaveBeenCalledWith({
|
||||
cache: mocks.cache,
|
||||
characterId: "character_maya",
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -3,7 +3,6 @@
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
import type { LoginStatus } from "@/data/schemas/auth";
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
import { useHasHydrated } from "@/hooks/use-has-hydrated";
|
||||
import { loadSplashLatestMessagePreview } from "@/lib/chat/splash_latest_message";
|
||||
import { useSplashLatestMessageCache } from "@/providers/splash-latest-message-provider";
|
||||
@@ -13,7 +12,7 @@ import { Result } from "@/utils/result";
|
||||
const log = new Logger("SplashLatestMessage");
|
||||
|
||||
export interface UseSplashLatestMessageInput {
|
||||
characterId?: string;
|
||||
characterId: string;
|
||||
hasInitialized: boolean;
|
||||
isAuthLoading: boolean;
|
||||
loginStatus: LoginStatus;
|
||||
@@ -31,7 +30,7 @@ interface SplashLatestMessageState {
|
||||
}
|
||||
|
||||
export function useSplashLatestMessage({
|
||||
characterId = DEFAULT_CHARACTER_ID,
|
||||
characterId,
|
||||
hasInitialized,
|
||||
isAuthLoading,
|
||||
loginStatus,
|
||||
|
||||
@@ -65,12 +65,12 @@ export function SplashScreen() {
|
||||
isLoading={latestMessage.isLoading}
|
||||
onOpenChat={handleStartChat}
|
||||
/>
|
||||
<SplashContent />
|
||||
<SplashContent characterName={character.shortName} />
|
||||
<div className={styles.buttonArea}>
|
||||
<SplashButton onStartChat={handleStartChat} />
|
||||
</div>
|
||||
<p className={styles.bottom}>
|
||||
{character.displayName}, {character.copy.splashRelationship}
|
||||
{character.displayName}, {character.tagline}
|
||||
<br />
|
||||
24/7 online | Chat | Companion | Heal | Sweet moments
|
||||
</p>
|
||||
|
||||
@@ -145,7 +145,10 @@ describe("character actor route providers", () => {
|
||||
function renderChat(characterId: string): void {
|
||||
act(() => {
|
||||
root.render(
|
||||
<ChatRouteProviders characterId={characterId}>
|
||||
<ChatRouteProviders
|
||||
characterId={characterId}
|
||||
emptyChatGreeting={`Hello from ${characterId}`}
|
||||
>
|
||||
<span>chat</span>
|
||||
</ChatRouteProviders>,
|
||||
);
|
||||
|
||||
@@ -2,13 +2,10 @@
|
||||
|
||||
import { createContext, type ReactNode, useContext } from "react";
|
||||
|
||||
import {
|
||||
DEFAULT_CHARACTER,
|
||||
type CharacterProfile,
|
||||
} from "@/data/constants/character";
|
||||
import type { CharacterProfile } from "@/data/constants/character";
|
||||
import { getCharacterRoutes, type CharacterRoutes } from "@/router/routes";
|
||||
|
||||
const CharacterContext = createContext<CharacterProfile>(DEFAULT_CHARACTER);
|
||||
const CharacterContext = createContext<CharacterProfile | null>(null);
|
||||
|
||||
export interface CharacterProviderProps {
|
||||
character: CharacterProfile;
|
||||
@@ -27,7 +24,11 @@ export function CharacterProvider({
|
||||
}
|
||||
|
||||
export function useActiveCharacter(): CharacterProfile {
|
||||
return useContext(CharacterContext);
|
||||
const character = useContext(CharacterContext);
|
||||
if (!character) {
|
||||
throw new Error("useActiveCharacter must be used within CharacterProvider.");
|
||||
}
|
||||
return character;
|
||||
}
|
||||
|
||||
export function useActiveCharacterRoutes(): CharacterRoutes {
|
||||
|
||||
@@ -2,7 +2,6 @@
|
||||
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
import { ChatProvider } from "@/stores/chat/chat-context";
|
||||
import { PaymentProvider } from "@/stores/payment/payment-context";
|
||||
import { ChatAuthSync } from "@/stores/sync/chat-auth-sync";
|
||||
@@ -11,17 +10,23 @@ import { PaymentSuccessSync } from "@/stores/sync/payment-success-sync";
|
||||
|
||||
export interface ChatRouteProvidersProps {
|
||||
children: ReactNode;
|
||||
characterId?: string;
|
||||
characterId: string;
|
||||
emptyChatGreeting: string;
|
||||
}
|
||||
|
||||
export function ChatRouteProviders({
|
||||
children,
|
||||
characterId = DEFAULT_CHARACTER_ID,
|
||||
characterId,
|
||||
emptyChatGreeting,
|
||||
}: ChatRouteProvidersProps) {
|
||||
return (
|
||||
<PaymentProvider key={characterId}>
|
||||
<PaymentSuccessSync />
|
||||
<ChatProvider key={characterId} characterId={characterId}>
|
||||
<ChatProvider
|
||||
key={characterId}
|
||||
characterId={characterId}
|
||||
emptyChatGreeting={emptyChatGreeting}
|
||||
>
|
||||
<ChatAuthSync />
|
||||
<ChatPaymentSuccessSync />
|
||||
{children}
|
||||
|
||||
@@ -2,17 +2,16 @@
|
||||
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
import { PrivateRoomProvider } from "@/stores/private-room";
|
||||
|
||||
export interface PrivateRoomRouteProviderProps {
|
||||
children: ReactNode;
|
||||
characterId?: string;
|
||||
characterId: string;
|
||||
}
|
||||
|
||||
export function PrivateRoomRouteProvider({
|
||||
children,
|
||||
characterId = DEFAULT_CHARACTER_ID,
|
||||
characterId,
|
||||
}: PrivateRoomRouteProviderProps) {
|
||||
return (
|
||||
<PrivateRoomProvider key={characterId} characterId={characterId}>
|
||||
|
||||
@@ -62,15 +62,18 @@ describe("chat actor request cancellation", () => {
|
||||
() => new Promise(() => undefined),
|
||||
);
|
||||
const actor = createActor(loadHistoryActor, {
|
||||
input: { characterId: "character_elio" },
|
||||
input: {
|
||||
characterId: "character_elio",
|
||||
emptyChatGreeting: "Hello from Elio",
|
||||
},
|
||||
}).start();
|
||||
await vi.waitFor(() =>
|
||||
expect(historySync.syncNetworkHistory).toHaveBeenCalled(),
|
||||
);
|
||||
|
||||
const signal = getSignal(
|
||||
historySync.syncNetworkHistory.mock.calls[0]?.[3],
|
||||
);
|
||||
const historyCall = historySync.syncNetworkHistory.mock.calls[0];
|
||||
expect(historyCall?.[3]).toBe("Hello from Elio");
|
||||
const signal = getSignal(historyCall?.[4]);
|
||||
expect(signal.aborted).toBe(false);
|
||||
actor.stop();
|
||||
expect(signal.aborted).toBe(true);
|
||||
@@ -81,7 +84,10 @@ describe("chat actor request cancellation", () => {
|
||||
() => new Promise(() => undefined),
|
||||
);
|
||||
const actor = createActor(unlockHistoryActor, {
|
||||
input: { characterId: "character_elio" },
|
||||
input: {
|
||||
characterId: "character_elio",
|
||||
emptyChatGreeting: "Hello from Elio",
|
||||
},
|
||||
}).start();
|
||||
await vi.waitFor(() => expect(repository.unlockHistory).toHaveBeenCalled());
|
||||
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
import { describe, expect, it } from "vitest";
|
||||
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
import {
|
||||
DEFAULT_CHARACTER,
|
||||
DEFAULT_CHARACTER_ID,
|
||||
} from "@/data/constants/character";
|
||||
import {
|
||||
ChatSendResponseSchema,
|
||||
type ChatSendResponse,
|
||||
@@ -35,6 +38,7 @@ function makeResponse(
|
||||
function makeChatState(overrides: Partial<ChatState> = {}): ChatState {
|
||||
return {
|
||||
characterId: DEFAULT_CHARACTER_ID,
|
||||
emptyChatGreeting: DEFAULT_CHARACTER.emptyChatGreeting,
|
||||
messages: [],
|
||||
promotion: null,
|
||||
outgoingMessageRevision: 0,
|
||||
|
||||
@@ -4,7 +4,10 @@ import { createActor, fromCallback, waitFor } from "xstate";
|
||||
import type { UiMessage } from "@/stores/chat/ui-message";
|
||||
import type { ChatEvent } from "@/stores/chat/chat-events";
|
||||
import { chatMachine } from "@/stores/chat/chat-machine";
|
||||
import type { LoadMoreHistoryActorEvent } from "@/stores/chat/machine/actors/history";
|
||||
import type {
|
||||
ChatHistoryActorInput,
|
||||
LoadMoreHistoryActorEvent,
|
||||
} from "@/stores/chat/machine/actors/history";
|
||||
|
||||
import {
|
||||
createLoadHistoryCallback,
|
||||
@@ -50,7 +53,7 @@ describe("chat history flow", () => {
|
||||
actors: {
|
||||
loadHistory: fromCallback<
|
||||
ChatEvent,
|
||||
{ characterId: string }
|
||||
ChatHistoryActorInput
|
||||
>(({ sendBack }) => {
|
||||
sendBack({
|
||||
type: "ChatLocalHistoryLoaded",
|
||||
@@ -119,7 +122,7 @@ describe("chat history flow", () => {
|
||||
),
|
||||
loadMoreHistory: fromCallback<
|
||||
LoadMoreHistoryActorEvent,
|
||||
{ characterId: string }
|
||||
ChatHistoryActorInput
|
||||
>(
|
||||
({ receive, sendBack }) => {
|
||||
receive((event) => {
|
||||
@@ -198,7 +201,7 @@ describe("chat history flow", () => {
|
||||
}),
|
||||
loadMoreHistory: fromCallback<
|
||||
LoadMoreHistoryActorEvent,
|
||||
{ characterId: string }
|
||||
ChatHistoryActorInput
|
||||
>(
|
||||
({ receive, sendBack }) => {
|
||||
receive((event) => {
|
||||
@@ -260,7 +263,7 @@ describe("chat history flow", () => {
|
||||
}),
|
||||
loadMoreHistory: fromCallback<
|
||||
LoadMoreHistoryActorEvent,
|
||||
{ characterId: string }
|
||||
ChatHistoryActorInput
|
||||
>(
|
||||
({ receive }) => {
|
||||
receive(() => {
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
import { fromCallback, fromPromise } from "xstate";
|
||||
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
import {
|
||||
DEFAULT_CHARACTER,
|
||||
DEFAULT_CHARACTER_ID,
|
||||
} from "@/data/constants/character";
|
||||
import {
|
||||
ChatSendResponseSchema,
|
||||
UnlockPrivateResponseSchema,
|
||||
@@ -36,6 +39,7 @@ export interface TestUnlockMessageOutput {
|
||||
|
||||
export const TEST_CHAT_MACHINE_INPUT = {
|
||||
characterId: DEFAULT_CHARACTER_ID,
|
||||
emptyChatGreeting: DEFAULT_CHARACTER.emptyChatGreeting,
|
||||
};
|
||||
|
||||
export function makeChatSendResponse(): ChatSendResponse {
|
||||
@@ -109,7 +113,10 @@ export function createTestChatMachine(
|
||||
return () => undefined;
|
||||
},
|
||||
),
|
||||
unlockHistory: fromPromise<UnlockHistoryOutput, { characterId: string }>(
|
||||
unlockHistory: fromPromise<
|
||||
UnlockHistoryOutput,
|
||||
{ characterId: string; emptyChatGreeting: string }
|
||||
>(
|
||||
async () => {
|
||||
if (options.unlockHistoryError) {
|
||||
throw options.unlockHistoryError;
|
||||
|
||||
@@ -155,7 +155,7 @@ describe("chat send flow", () => {
|
||||
),
|
||||
unlockHistory: fromPromise<
|
||||
UnlockHistoryOutput,
|
||||
{ characterId: string }
|
||||
{ characterId: string; emptyChatGreeting: string }
|
||||
>(async () => ({
|
||||
unlocked: true,
|
||||
reason: "ok",
|
||||
|
||||
@@ -9,10 +9,43 @@ import {
|
||||
describe("chat session flow", () => {
|
||||
it("initializes the conversation from the supplied character", () => {
|
||||
const actor = createActor(createTestChatMachine(), {
|
||||
input: { characterId: "character_aria" },
|
||||
input: {
|
||||
characterId: "character_maya",
|
||||
emptyChatGreeting: "Hello from Maya",
|
||||
},
|
||||
}).start();
|
||||
|
||||
expect(actor.getSnapshot().context.characterId).toBe("character_aria");
|
||||
expect(actor.getSnapshot().context).toMatchObject({
|
||||
characterId: "character_maya",
|
||||
emptyChatGreeting: "Hello from Maya",
|
||||
});
|
||||
actor.stop();
|
||||
});
|
||||
|
||||
it("keeps the active character greeting across login state changes", async () => {
|
||||
const actor = createActor(createTestChatMachine(), {
|
||||
input: {
|
||||
characterId: "character_maya",
|
||||
emptyChatGreeting: "Hello from Maya",
|
||||
},
|
||||
}).start();
|
||||
|
||||
actor.send({ type: "ChatUserLogin", token: "token" });
|
||||
await waitFor(actor, (snapshot) =>
|
||||
snapshot.matches({ userSession: "ready" }),
|
||||
);
|
||||
expect(actor.getSnapshot().context.emptyChatGreeting).toBe(
|
||||
"Hello from Maya",
|
||||
);
|
||||
|
||||
actor.send({ type: "ChatGuestLogin" });
|
||||
await waitFor(actor, (snapshot) =>
|
||||
snapshot.matches({ guestSession: "ready" }),
|
||||
);
|
||||
expect(actor.getSnapshot().context.emptyChatGreeting).toBe(
|
||||
"Hello from Maya",
|
||||
);
|
||||
|
||||
actor.stop();
|
||||
});
|
||||
|
||||
|
||||
@@ -4,8 +4,6 @@ import { type Dispatch, type ReactNode, useMemo } from "react";
|
||||
import { createActorContext, shallowEqual } from "@xstate/react";
|
||||
import type { SnapshotFrom } from "xstate";
|
||||
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
|
||||
import { chatMachine } from "./chat-machine";
|
||||
import type { ChatEvent, ChatState as MachineContext } from "./chat-machine";
|
||||
import { appendPromotionMessage } from "./helper/promotion";
|
||||
@@ -46,15 +44,19 @@ const ChatActorContext = createActorContext(chatMachine);
|
||||
|
||||
export interface ChatProviderProps {
|
||||
children: ReactNode;
|
||||
characterId?: string;
|
||||
characterId: string;
|
||||
emptyChatGreeting: string;
|
||||
}
|
||||
|
||||
export function ChatProvider({
|
||||
children,
|
||||
characterId = DEFAULT_CHARACTER_ID,
|
||||
characterId,
|
||||
emptyChatGreeting,
|
||||
}: ChatProviderProps) {
|
||||
return (
|
||||
<ChatActorContext.Provider options={{ input: { characterId } }}>
|
||||
<ChatActorContext.Provider
|
||||
options={{ input: { characterId, emptyChatGreeting } }}
|
||||
>
|
||||
{children}
|
||||
</ChatActorContext.Provider>
|
||||
);
|
||||
|
||||
@@ -30,12 +30,9 @@ export type LocalHistorySnapshotOutput = {
|
||||
|
||||
export type NetworkHistorySyncOutput = ReadAndSyncHistoryOutput;
|
||||
|
||||
export function createGreetingMessage(): UiMessage {
|
||||
export function createGreetingMessage(content: string): UiMessage {
|
||||
return {
|
||||
content:
|
||||
"You're here! Facebook is so restrictive, " +
|
||||
"there were things I couldn't say there. " +
|
||||
"Finally I can relax. How was your day out?",
|
||||
content,
|
||||
isFromAI: true,
|
||||
date: todayString(),
|
||||
isSynthetic: true,
|
||||
@@ -51,9 +48,10 @@ export async function resolveHistoryCacheIdentity(
|
||||
|
||||
export async function readLocalHistorySnapshot(
|
||||
cacheIdentity: string | null,
|
||||
emptyChatGreeting: string,
|
||||
): Promise<LocalHistorySnapshotOutput> {
|
||||
const chatRepo = await loadChatRepository();
|
||||
const greetingMessage = createGreetingMessage();
|
||||
const greetingMessage = createGreetingMessage(emptyChatGreeting);
|
||||
|
||||
const localResult = cacheIdentity
|
||||
? await chatRepo.getLocalMessages(cacheIdentity)
|
||||
@@ -82,10 +80,11 @@ export async function syncNetworkHistory(
|
||||
characterId: string,
|
||||
localCount: number,
|
||||
cacheIdentity: string | null,
|
||||
emptyChatGreeting: string,
|
||||
signal?: AbortSignal,
|
||||
): Promise<NetworkHistorySyncOutput | null> {
|
||||
const chatRepo = await loadChatRepository();
|
||||
const greetingMessage = createGreetingMessage();
|
||||
const greetingMessage = createGreetingMessage(emptyChatGreeting);
|
||||
|
||||
const networkResult = await chatRepo.getHistory(
|
||||
characterId,
|
||||
@@ -149,14 +148,19 @@ export async function syncNetworkHistory(
|
||||
*/
|
||||
export async function readAndSyncHistory(
|
||||
characterId: string,
|
||||
emptyChatGreeting: string,
|
||||
signal?: AbortSignal,
|
||||
): Promise<ReadAndSyncHistoryOutput> {
|
||||
const cacheIdentity = await resolveHistoryCacheIdentity(characterId);
|
||||
const localSnapshot = await readLocalHistorySnapshot(cacheIdentity);
|
||||
const localSnapshot = await readLocalHistorySnapshot(
|
||||
cacheIdentity,
|
||||
emptyChatGreeting,
|
||||
);
|
||||
const networkSnapshot = await syncNetworkHistory(
|
||||
characterId,
|
||||
localSnapshot.localCount,
|
||||
cacheIdentity,
|
||||
emptyChatGreeting,
|
||||
signal,
|
||||
);
|
||||
if (networkSnapshot) return networkSnapshot;
|
||||
|
||||
@@ -2,7 +2,10 @@ import {
|
||||
chatMachineSetup,
|
||||
chatRootStateConfig,
|
||||
} from "./machine/session-flow";
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
import {
|
||||
DEFAULT_CHARACTER,
|
||||
DEFAULT_CHARACTER_ID,
|
||||
} from "@/data/constants/character";
|
||||
|
||||
import { createInitialChatState } from "./chat-state";
|
||||
|
||||
@@ -13,7 +16,10 @@ export type { ChatEvent } from "./chat-events";
|
||||
export const chatMachine = chatMachineSetup.createMachine({
|
||||
id: "chat",
|
||||
context: ({ input }) =>
|
||||
createInitialChatState(input?.characterId ?? DEFAULT_CHARACTER_ID),
|
||||
createInitialChatState(
|
||||
input?.characterId ?? DEFAULT_CHARACTER_ID,
|
||||
input?.emptyChatGreeting ?? DEFAULT_CHARACTER.emptyChatGreeting,
|
||||
),
|
||||
...chatRootStateConfig,
|
||||
});
|
||||
|
||||
|
||||
@@ -2,7 +2,10 @@ import type { UiMessage } from "@/stores/chat/ui-message";
|
||||
import type { PendingChatUnlockKind } from "@/lib/navigation/chat_unlock_session";
|
||||
import type { ChatLockType } from "@/data/schemas/chat";
|
||||
import type { PendingChatPromotion } from "@/data/storage/navigation";
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
import {
|
||||
DEFAULT_CHARACTER,
|
||||
DEFAULT_CHARACTER_ID,
|
||||
} from "@/data/constants/character";
|
||||
import type { ChatPromotionState } from "./helper/promotion";
|
||||
|
||||
export type ChatUpgradeReason = "insufficient_credits";
|
||||
@@ -26,6 +29,7 @@ export interface ChatUnlockPaywallRequest
|
||||
|
||||
export interface ChatState {
|
||||
characterId: string;
|
||||
emptyChatGreeting: string;
|
||||
messages: UiMessage[];
|
||||
promotion: ChatPromotionState | null;
|
||||
outgoingMessageRevision: number;
|
||||
@@ -55,9 +59,11 @@ export interface ChatState {
|
||||
|
||||
export function createInitialChatState(
|
||||
characterId: string = DEFAULT_CHARACTER_ID,
|
||||
emptyChatGreeting: string = DEFAULT_CHARACTER.emptyChatGreeting,
|
||||
): ChatState {
|
||||
return {
|
||||
characterId,
|
||||
emptyChatGreeting,
|
||||
messages: [],
|
||||
promotion: null,
|
||||
outgoingMessageRevision: 0,
|
||||
|
||||
@@ -25,6 +25,7 @@ export interface LoadMoreHistoryActorEvent {
|
||||
|
||||
export interface ChatHistoryActorInput {
|
||||
characterId: string;
|
||||
emptyChatGreeting: string;
|
||||
}
|
||||
|
||||
export interface LoadMoreHistoryOutput {
|
||||
@@ -43,7 +44,10 @@ export const loadHistoryActor = fromCallback<
|
||||
|
||||
void (async () => {
|
||||
const cacheIdentity = await resolveHistoryCacheIdentity(input.characterId);
|
||||
const localSnapshot = await readLocalHistorySnapshot(cacheIdentity);
|
||||
const localSnapshot = await readLocalHistorySnapshot(
|
||||
cacheIdentity,
|
||||
input.emptyChatGreeting,
|
||||
);
|
||||
if (cancelled) return;
|
||||
sendBack({
|
||||
type: "ChatLocalHistoryLoaded",
|
||||
@@ -54,6 +58,7 @@ export const loadHistoryActor = fromCallback<
|
||||
input.characterId,
|
||||
localSnapshot.localCount,
|
||||
cacheIdentity,
|
||||
input.emptyChatGreeting,
|
||||
controller.signal,
|
||||
);
|
||||
if (cancelled || !networkSnapshot) return;
|
||||
|
||||
@@ -25,7 +25,7 @@ export interface UnlockHistoryOutput {
|
||||
|
||||
export const unlockHistoryActor = fromPromise<
|
||||
UnlockHistoryOutput,
|
||||
{ characterId: string }
|
||||
{ characterId: string; emptyChatGreeting: string }
|
||||
>(async ({ input, signal }) => {
|
||||
const chatRepo = await loadChatRepository();
|
||||
const unlockResult = await chatRepo.unlockHistory(input.characterId, {
|
||||
@@ -40,7 +40,11 @@ export const unlockHistoryActor = fromPromise<
|
||||
}
|
||||
|
||||
signal.throwIfAborted();
|
||||
const history = await readAndSyncHistory(input.characterId, signal);
|
||||
const history = await readAndSyncHistory(
|
||||
input.characterId,
|
||||
input.emptyChatGreeting,
|
||||
signal,
|
||||
);
|
||||
return {
|
||||
unlocked: unlockResult.data.unlocked,
|
||||
reason: unlockResult.data.reason,
|
||||
|
||||
@@ -19,20 +19,26 @@ import {
|
||||
|
||||
const startGuestSessionAction = unlockMachineSetup.assign(
|
||||
({ context }) => ({
|
||||
...createInitialChatState(context.characterId),
|
||||
...createInitialChatState(
|
||||
context.characterId,
|
||||
context.emptyChatGreeting,
|
||||
),
|
||||
promotion: context.promotion,
|
||||
}),
|
||||
);
|
||||
|
||||
const startUserSessionAction = unlockMachineSetup.assign(
|
||||
({ context }) => ({
|
||||
...createInitialChatState(context.characterId),
|
||||
...createInitialChatState(
|
||||
context.characterId,
|
||||
context.emptyChatGreeting,
|
||||
),
|
||||
promotion: context.promotion,
|
||||
}),
|
||||
);
|
||||
|
||||
const clearChatSessionAction = unlockMachineSetup.assign(({ context }) => ({
|
||||
...createInitialChatState(context.characterId),
|
||||
...createInitialChatState(context.characterId, context.emptyChatGreeting),
|
||||
}));
|
||||
|
||||
const injectPromotionAction = unlockMachineSetup.assign(({ event }) => {
|
||||
@@ -80,12 +86,18 @@ const guestSessionState = chatMachineSetup.createStateConfig({
|
||||
{
|
||||
id: "loadHistory",
|
||||
src: "loadHistory",
|
||||
input: ({ context }) => ({ characterId: context.characterId }),
|
||||
input: ({ context }) => ({
|
||||
characterId: context.characterId,
|
||||
emptyChatGreeting: context.emptyChatGreeting,
|
||||
}),
|
||||
},
|
||||
{
|
||||
id: "loadMoreHistory",
|
||||
src: "loadMoreHistory",
|
||||
input: ({ context }) => ({ characterId: context.characterId }),
|
||||
input: ({ context }) => ({
|
||||
characterId: context.characterId,
|
||||
emptyChatGreeting: context.emptyChatGreeting,
|
||||
}),
|
||||
},
|
||||
],
|
||||
on: {
|
||||
@@ -162,12 +174,18 @@ const userSessionState = chatMachineSetup.createStateConfig({
|
||||
{
|
||||
id: "loadHistory",
|
||||
src: "loadHistory",
|
||||
input: ({ context }) => ({ characterId: context.characterId }),
|
||||
input: ({ context }) => ({
|
||||
characterId: context.characterId,
|
||||
emptyChatGreeting: context.emptyChatGreeting,
|
||||
}),
|
||||
},
|
||||
{
|
||||
id: "loadMoreHistory",
|
||||
src: "loadMoreHistory",
|
||||
input: ({ context }) => ({ characterId: context.characterId }),
|
||||
input: ({ context }) => ({
|
||||
characterId: context.characterId,
|
||||
emptyChatGreeting: context.emptyChatGreeting,
|
||||
}),
|
||||
},
|
||||
],
|
||||
on: {
|
||||
|
||||
@@ -17,6 +17,7 @@ import type { ChatState } from "../chat-state";
|
||||
|
||||
export interface ChatMachineInput {
|
||||
characterId?: string;
|
||||
emptyChatGreeting?: string;
|
||||
}
|
||||
|
||||
export const baseChatMachineSetup = setup({
|
||||
|
||||
@@ -188,7 +188,10 @@ export const unlockingHistoryState = unlockMachineSetup.createStateConfig({
|
||||
invoke: {
|
||||
id: "unlockHistory",
|
||||
src: "unlockHistory",
|
||||
input: ({ context }) => ({ characterId: context.characterId }),
|
||||
input: ({ context }) => ({
|
||||
characterId: context.characterId,
|
||||
emptyChatGreeting: context.emptyChatGreeting,
|
||||
}),
|
||||
onDone: {
|
||||
target: "ready",
|
||||
actions: applyUnlockHistoryOutputAction,
|
||||
|
||||
@@ -4,8 +4,6 @@ import type { Dispatch, ReactNode } from "react";
|
||||
import { createActorContext, shallowEqual } from "@xstate/react";
|
||||
import type { SnapshotFrom } from "xstate";
|
||||
|
||||
import { DEFAULT_CHARACTER_ID } from "@/data/constants/character";
|
||||
|
||||
import { privateRoomMachine } from "./private-room-machine";
|
||||
import type {
|
||||
PrivateRoomEvent,
|
||||
@@ -34,12 +32,12 @@ const PrivateRoomActorContext = createActorContext(privateRoomMachine);
|
||||
|
||||
export interface PrivateRoomProviderProps {
|
||||
children: ReactNode;
|
||||
characterId?: string;
|
||||
characterId: string;
|
||||
}
|
||||
|
||||
export function PrivateRoomProvider({
|
||||
children,
|
||||
characterId = DEFAULT_CHARACTER_ID,
|
||||
characterId,
|
||||
}: PrivateRoomProviderProps) {
|
||||
return (
|
||||
<PrivateRoomActorContext.Provider options={{ input: { characterId } }}>
|
||||
|
||||
Reference in New Issue
Block a user