36 lines
1.2 KiB
TypeScript
36 lines
1.2 KiB
TypeScript
import { Link } from 'react-router-dom';
|
|
|
|
import { CheckCircleIcon } from '@shared/icons';
|
|
|
|
import { useOnboarding } from '@stores/onboarding';
|
|
|
|
export function SuggestFollow() {
|
|
const enrich = useOnboarding((state) => state.enrich);
|
|
|
|
return (
|
|
<div className="rounded-xl bg-neutral-100 p-3 text-neutral-800 dark:bg-neutral-900 dark:text-neutral-200">
|
|
<div className="flex items-start justify-between">
|
|
<div>
|
|
<h5 className="font-semibold">Enrich your network</h5>
|
|
<p className="text-sm">
|
|
Follow more people to stay up to date with everything happening around the
|
|
world.
|
|
</p>
|
|
</div>
|
|
{enrich ? (
|
|
<div className="mt-1 inline-flex h-9 w-24 shrink-0 items-center justify-center rounded-lg bg-teal-500 text-white">
|
|
<CheckCircleIcon className="h-4 w-4" />
|
|
</div>
|
|
) : (
|
|
<Link
|
|
to="/auth/onboarding/enrich"
|
|
className="mt-1 inline-flex h-9 w-24 shrink-0 items-center justify-center rounded-lg bg-neutral-200 font-medium hover:bg-blue-500 hover:text-white dark:bg-neutral-800"
|
|
>
|
|
Check
|
|
</Link>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|