66 lines
1.7 KiB
TypeScript
66 lines
1.7 KiB
TypeScript
"use client";
|
|
|
|
import { useSearchParams } from "next/navigation";
|
|
import { useEffect, useMemo } from "react";
|
|
|
|
import { useI18n } from "@/core/i18n/hooks";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
import { AuroraText } from "../ui/aurora-text";
|
|
|
|
let waved = false;
|
|
|
|
export function Welcome({
|
|
className,
|
|
mode,
|
|
}: {
|
|
className?: string;
|
|
mode?: "ultra" | "pro" | "thinking" | "flash";
|
|
}) {
|
|
const { t } = useI18n();
|
|
const searchParams = useSearchParams();
|
|
const isUltra = useMemo(() => mode === "ultra", [mode]);
|
|
const colors = useMemo(() => {
|
|
if (isUltra) {
|
|
return ["#efefbb", "#e9c665", "#e3a812"];
|
|
}
|
|
return ["var(--color-foreground)"];
|
|
}, [isUltra]);
|
|
useEffect(() => {
|
|
waved = true;
|
|
}, []);
|
|
return (
|
|
<div
|
|
className={cn(
|
|
"mx-auto flex w-full flex-col items-center justify-center gap-2 px-8 py-4 text-center",
|
|
className,
|
|
)}
|
|
>
|
|
<div className="text-2xl font-bold">
|
|
{searchParams.get("mode") === "skill" ? (
|
|
`✨ ${t.welcome.createYourOwnSkill} ✨`
|
|
) : (
|
|
<div className="flex items-center gap-2">
|
|
<AuroraText className="text-[18px] text-[#150033]" colors={colors}>
|
|
{t.welcome.greeting}
|
|
</AuroraText>
|
|
</div>
|
|
)}
|
|
</div>
|
|
{searchParams.get("mode") === "skill" ? (
|
|
<div className="text-muted-foreground text-sm">
|
|
{t.welcome.createYourOwnSkillDescription.includes("\n") ? (
|
|
<pre className="font-sans whitespace-pre">
|
|
{t.welcome.createYourOwnSkillDescription}
|
|
</pre>
|
|
) : (
|
|
<p>{t.welcome.createYourOwnSkillDescription}</p>
|
|
)}
|
|
</div>
|
|
) : (
|
|
<div> </div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|