import { GetServerSideProps } from "next"; import Head from "next/head"; import fetchAPI from "../../../lib/fetch"; import { User } from "../../../lib/types"; import FieldCard from "../../../components/FieldCard"; import Card from "../../../components/Card"; import ReactMarkdown from "react-markdown"; import Image from "next/image"; import { userState } from "../../../lib/state"; import { useRecoilValue } from "recoil"; import Link from "next/link"; interface Props { user: User; } export default function Index({ user }: Props) { const isMeUser = useRecoilValue(userState)?.id === user.id; return ( <> @{user.username} - pronouns.cc {isMeUser && (

You are currently viewing your{" "} public profile.
Edit your profile

)}

{user.avatar_url && ( // eslint-disable-next-line @next/next/no-img-element {`@${user.username}'s

)}

{user.display_name && (

{user.display_name}

)}

@{user.username}

{user.bio && ( {user.bio} )} {user.links?.length && user.fields?.length && (

{user.links.map((link, index) => ( {link} ))}

)}

{user.fields?.map((field, index) => ( ))} {user.links?.length && ( {user.links.map((link, index) => ( {link} ))} )}

); } export const getServerSideProps: GetServerSideProps = async (context) => { try { const user = await fetchAPI(`/users/${context.params!.user}`); return { props: { user } }; } catch (e) { console.log(e); return { notFound: true }; } };