42 lines
935 B
TypeScript
42 lines
935 B
TypeScript
import { Children } from "../../../types/Preact";
|
|
import { Username } from "./UserShort";
|
|
import styled from "styled-components";
|
|
import UserStatus from "./UserStatus";
|
|
import Tooltip from "../Tooltip";
|
|
import { User } from "revolt.js";
|
|
|
|
interface Props {
|
|
user?: User,
|
|
children: Children
|
|
}
|
|
|
|
const Base = styled.div`
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.username {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.status {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
`;
|
|
|
|
export default function UserHover({ user, children }: Props) {
|
|
return (
|
|
<Tooltip placement="right-end" content={
|
|
<Base>
|
|
<Username className="username" user={user} />
|
|
<span className="status">
|
|
<UserStatus user={user} />
|
|
</span>
|
|
</Base>
|
|
}>
|
|
{ children }
|
|
</Tooltip>
|
|
)
|
|
}
|