42 lines
1.4 KiB
TypeScript
42 lines
1.4 KiB
TypeScript
import { PresetQuery } from "@/components/search/preset-query";
|
||
import { Skeleton } from "@/components/search/skeleton";
|
||
import { Wrapper } from "@/components/search/wrapper";
|
||
import { Relate } from "@/types/relate";
|
||
import { MessageSquareQuote } from "lucide-react";
|
||
import { FC } from "react";
|
||
|
||
export const Relates: FC<{ relates: Relate[] | null }> = ({ relates }) => {
|
||
return (
|
||
<Wrapper
|
||
title={
|
||
<>
|
||
<MessageSquareQuote></MessageSquareQuote> 相关
|
||
</>
|
||
}
|
||
content={
|
||
<div className="flex gap-2 flex-col">
|
||
{relates !== null ? (
|
||
relates.length > 0 ? (
|
||
relates.map(({ question }) => (
|
||
<PresetQuery key={question} query={question}></PresetQuery>
|
||
))
|
||
) : (
|
||
<div className="text-sm">没有相关问题.</div>
|
||
)
|
||
) : (
|
||
<>
|
||
<Skeleton className="w-full h-5 bg-zinc-200/80"></Skeleton>
|
||
<Skeleton className="w-full h-5 bg-zinc-200/80"></Skeleton>
|
||
<Skeleton className="w-full h-5 bg-zinc-200/80"></Skeleton>
|
||
</>
|
||
)}
|
||
<div className="text-xs text-zinc-500 text-center mt-4">
|
||
<div>VaalaAI回答完成后，您可以通过分享链接将回答分享给朋友！</div>
|
||
<div>有效期20分钟</div>
|
||
</div>
|
||
</div>
|
||
}
|
||
></Wrapper>
|
||
);
|
||
};
|