feat: image proxy service

This commit is contained in:
2023-01-30 23:17:59 +00:00
parent dbc853fd8a
commit 8115b541de
4 changed files with 77 additions and 57 deletions

View File

@ -2,22 +2,27 @@ import "./Avatar.css";
import Nostrich from "../nostrich.jpg";
import { CSSProperties } from "react";
import type { UserMetadata } from "Nostr";
import { useSelector } from "react-redux";
import { RootState } from "State/Store";
import { ApiHost } from "Const";
const Avatar = ({ user, ...rest }: { user?: UserMetadata, onClick?: () => void }) => {
const useImageProxy = useSelector((s: RootState) => s.login.preferences.useImageProxy);
const Avatar = ({ user, ...rest }: { user?: UserMetadata, onClick?: () => void}) => {
const avatarUrl = (user?.picture?.length ?? 0) === 0 ? Nostrich : user?.picture
const backgroundImage = `url(${avatarUrl})`
const domain = user?.nip05 && user.nip05.split('@')[1]
const style = { '--img-url': backgroundImage } as CSSProperties
return (
<div
{...rest}
style={style}
className="avatar"
data-domain={domain?.toLowerCase()}
>
</div>
)
const avatarUrl = (user?.picture?.length ?? 0) === 0 ? Nostrich :
(useImageProxy ? `${ApiHost}/api/v1/imgproxy/${window.btoa(user!.picture!)}` : user?.picture)
const backgroundImage = `url(${avatarUrl})`
const domain = user?.nip05 && user.nip05.split('@')[1]
const style = { '--img-url': backgroundImage } as CSSProperties
return (
<div
{...rest}
style={style}
className="avatar"
data-domain={domain?.toLowerCase()}
>
</div>
)
}
export default Avatar