71 lines
2.4 KiB
TypeScript
71 lines
2.4 KiB
TypeScript
'use client';
|
||
|
||
import { AlertDialog, AlertDialogContent, AlertDialogTitle } from '@/components/ui/alert-dialog';
|
||
import { Chip } from '@/components/ui/chip';
|
||
import IconFont from '@/components/ui/iconFont';
|
||
import Link from 'next/link';
|
||
import { useState } from 'react';
|
||
|
||
type StoryDialogProps = {
|
||
open: boolean;
|
||
onOpenChange: (open: boolean) => void;
|
||
};
|
||
export default function StoryDialog({ open, onOpenChange }: StoryDialogProps) {
|
||
const tags = [
|
||
{
|
||
label: 'CEO',
|
||
value: 'ceo',
|
||
},
|
||
{
|
||
label: 'Contract',
|
||
value: 'contract',
|
||
},
|
||
{
|
||
label: 'Lover',
|
||
value: 'lover',
|
||
},
|
||
{
|
||
label: 'Bossy',
|
||
value: 'bossy',
|
||
},
|
||
{
|
||
label: 'Billionaire',
|
||
value: 'billionaire',
|
||
},
|
||
];
|
||
|
||
return (
|
||
<AlertDialog open={open} onOpenChange={onOpenChange}>
|
||
<AlertDialogContent className="max-w-[760px]">
|
||
<AlertDialogTitle></AlertDialogTitle>
|
||
<div className="txt-title-l my-6 text-txt-primary-normal text-center">
|
||
The Bossy CEO’s Contract Lover
|
||
</div>
|
||
<div className="flex items-center gap-2">
|
||
{tags.map((tag) => (
|
||
<Chip key={tag.value}># {tag.label}</Chip>
|
||
))}
|
||
</div>
|
||
<div className="p-5 rounded-2xl mt-4 txt-label-m text-txt-tertiary-normal bg-[#403E57]">
|
||
In an era where memories can be digitally extracted and traded, Chen Mo is the most elite
|
||
"memory trader" on the black market. He deals in sweet first loves and moments of triumph,
|
||
but also handles guilty memories too dark to see the light. One day, he takes on a memory
|
||
file from a suicide victim. Inside, he sees his own face—holding the murder weapon. At the
|
||
same time, city-wide alarms sound because of him, and the memory agents known as
|
||
"Silencers"... have locked onto his location. To uncover the truth, he must delve into
|
||
this fatal memory...
|
||
</div>
|
||
<div className="flex items-center mt-6 justify-between">
|
||
<span className="txt-title-m">All Characters</span>
|
||
<Link href="/create/group">
|
||
<div className="text-primary-normal cursor-pointer flex items-center gap-2">
|
||
<IconFont type="icon-qunliao" className="text-2xl" />
|
||
Group Chat
|
||
</div>
|
||
</Link>
|
||
</div>
|
||
</AlertDialogContent>
|
||
</AlertDialog>
|
||
);
|
||
}
|