diff --git a/frontend/lib/types.ts b/frontend/lib/types.ts index 38c6c78..e5e6b8d 100644 --- a/frontend/lib/types.ts +++ b/frontend/lib/types.ts @@ -11,13 +11,25 @@ export interface User { avatar_urls: string[] | null; links: string[] | null; members: PartialMember[]; + names: Name[]; + pronouns: Pronoun[]; fields: Field[]; } export interface PartialMember { id: string; name: string; - avatar_url: string | null; + avatar_urls: string[] | null; +} + +export interface Member extends PartialMember { + bio: string | null; + links: string[] | null; + id: string; + name: string; + avatar_urls: string[] | null; + + user?: PartialUser; } export interface Name { @@ -71,3 +83,10 @@ export interface SignupRequest { ticket: string; invite_code?: string; } + +export interface PartialUser { + id: string; + username: string; + display_name: string | null; + avatar_urls: string[] | null; +} diff --git a/frontend/pages/u/[user]/[member].tsx b/frontend/pages/u/[user]/[member].tsx new file mode 100644 index 0000000..d139ada --- /dev/null +++ b/frontend/pages/u/[user]/[member].tsx @@ -0,0 +1,35 @@ +import { GetServerSideProps } from "next"; +import fetchAPI from "../../../lib/fetch"; +import { Member, User } from "../../../lib/types"; +import { userState } from "../../../lib/state"; +import { useRecoilValue } from "recoil"; + +interface Props { + member: Member; +} + +export default function MemberPage({ member }: Props) { + const isOwnMember = useRecoilValue(userState)?.id === member.user?.id; + + return ( + <> +
hi! this is {isOwnMember ? "" : "not "}your own member.
+

name: {member.name}

+

{member.bio}

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