mirror/decomp.me
1
0
Fork 0
mirror of https://github.com/decompme/decomp.me.git synced 2025-12-20 20:39:40 -06:00
Code Issues Packages Projects Releases Wiki Activity

Run Biome formatter (#1392)

Browse Source 
* Run formatter

* Part 2
This commit is contained in:
Ethan Roseman
2024-12-11 01:03:56 +09:00
committed by GitHub
parent a003f5b462
commit 4ef64cbebc
140 changed files with 8223 additions and 6157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
frontend/src/components/user/UserAvatar.tsx
View File

@@ -1,38 +1,50 @@
"use client"
"use client";
import { useEffect, useState } from "react"
import { useEffect, useState } from "react";
import Image from "next/image"
import Image from "next/image";
import classNames from "classnames"
import classNames from "classnames";
import * as api from "@/lib/api"
import { userAvatarUrl } from "@/lib/api/urls"
import * as api from "@/lib/api";
import { userAvatarUrl } from "@/lib/api/urls";
import AnonymousFrogAvatar from "./AnonymousFrog"
import styles from "./UserAvatar.module.scss"
import AnonymousFrogAvatar from "./AnonymousFrog";
import styles from "./UserAvatar.module.scss";
export type Props = {
user: api.User | api.AnonymousUser | undefined
className?: string
}
user: api.User | api.AnonymousUser | undefined;
className?: string;
};
export default function UserAvatar({ user, className }: Props) {
const userIsYou = api.useUserIsYou()
const userIsYou = api.useUserIsYou();
// Avoid hydration mismatch
const [isMounted, setIsMounted] = useState(false)
useEffect(() => setIsMounted(true), [])
const [isMounted, setIsMounted] = useState(false);
useEffect(() => setIsMounted(true), []);
if (!user) {
// Skeleton loading state
return <span className={classNames(styles.avatar, className)}>
<div className="size-full animate-pulse rounded-full bg-gray-6" />
</span>
return (
<span className={classNames(styles.avatar, className)}>
<div className="size-full animate-pulse rounded-full bg-gray-6" />
</span>
);
}
return <span className={classNames(styles.avatar, className)}>
{api.isAnonUser(user) ? <AnonymousFrogAvatar user={user}/> : userAvatarUrl(user) && <Image src={userAvatarUrl(user)} alt="" fill sizes="64px" />}
{isMounted && !userIsYou(user) && user.is_online && <div className={styles.online} title="Online" />}
</span>
return (
<span className={classNames(styles.avatar, className)}>
{api.isAnonUser(user) ? (
<AnonymousFrogAvatar user={user} />
) : (
userAvatarUrl(user) && (
<Image src={userAvatarUrl(user)} alt="" fill sizes="64px" />
)
)}
{isMounted && !userIsYou(user) && user.is_online && (
<div className={styles.online} title="Online" />
)}
</span>
);
}