34 lines
911 B
TypeScript
34 lines
911 B
TypeScript
import type { ReactNode } from "react";
|
|
import { Link } from "react-router";
|
|
import type { PublicUser } from "../model.ts";
|
|
import { Avatar } from "./Avatar.tsx";
|
|
|
|
interface ProfileSubpageHeaderProps {
|
|
username: string;
|
|
profileUser: PublicUser;
|
|
title: string;
|
|
actions?: ReactNode;
|
|
}
|
|
|
|
export function ProfileSubpageHeader(
|
|
{ username, profileUser, title, actions }: ProfileSubpageHeaderProps,
|
|
) {
|
|
return (
|
|
<div className="profile-subpage-header">
|
|
<Link to={`/users/${username}`} className="profile-subpage-back">
|
|
← {profileUser.username}
|
|
</Link>
|
|
<div className="profile-subpage-title-row">
|
|
<Avatar
|
|
userId={profileUser.id}
|
|
username={profileUser.username}
|
|
hasAvatar={!!profileUser.avatarMime}
|
|
size={36}
|
|
/>
|
|
<h1 className="profile-subpage-title">{title}</h1>
|
|
{actions}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|