reya/lume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update default avatar

Browse Source
This commit is contained in:
Ren Amamiya
2023-08-19 11:18:27 +07:00
parent eda18f8c34
commit 08e3a66ece
27 changed files with 41 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/shared/accounts/active.tsx
View File

@@ -3,8 +3,6 @@ import { Link } from 'react-router-dom';
import { Image } from '@shared/image';
import { NetworkStatusIndicator } from '@shared/networkStatusIndicator';
import { DEFAULT_AVATAR } from '@stores/constants';
import { useProfile } from '@utils/hooks/useProfile';
export function ActiveAccount({ data }: { data: { pubkey: string; npub: string } }) {
@@ -18,7 +16,6 @@ export function ActiveAccount({ data }: { data: { pubkey: string; npub: string }
<Link to={`/users/${data.pubkey}`} className="relative inline-block h-9 w-9">
<Image
src={user?.picture || user?.image}
fallback={DEFAULT_AVATAR}
alt={data.npub}
className="h-9 w-9 rounded-md object-cover"
/>

9
src/shared/accounts/inactive.tsx
View File

@@ -1,7 +1,5 @@
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { useProfile } from '@utils/hooks/useProfile';
export function InactiveAccount({ data }: { data: any }) {
@@ -9,12 +7,7 @@ export function InactiveAccount({ data }: { data: any }) {
return (
<div className="relative h-9 w-9 shrink-0">
<Image
src={user?.image}
fallback={DEFAULT_AVATAR}
alt={data.npub}
className="h-9 w-9 rounded object-cover"
/>
<Image src={user?.image} alt={data.npub} className="h-9 w-9 rounded object-cover" />
</div>
);
}

3
src/shared/composer/mention/item.tsx
View File

@@ -1,7 +1,5 @@
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { displayNpub } from '@utils/shortenKey';
import { Profile } from '@utils/types';
@@ -11,7 +9,6 @@ export function MentionItem({ profile }: { profile: Profile }) {
<div className="h-8 w-8 shrink-0 overflow-hidden rounded-md bg-zinc-900">
<Image
src={profile.picture || profile.image}
fallback={DEFAULT_AVATAR}
alt={profile.pubkey}
className="h-8 w-8 object-cover"
/>

3
src/shared/composer/user.tsx
View File

@@ -1,7 +1,5 @@
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { useProfile } from '@utils/hooks/useProfile';
export function ComposerUser({ pubkey }: { pubkey: string }) {
@@ -11,7 +9,6 @@ export function ComposerUser({ pubkey }: { pubkey: string }) {
<div className="flex items-center gap-3">
<Image
src={user?.picture || user?.image}
fallback={DEFAULT_AVATAR}
alt={pubkey}
className="h-8 w-8 shrink-0 rounded-md object-cover"
/>

10
src/shared/editProfileModal.tsx
View File

@@ -11,8 +11,6 @@ import { BannerUploader } from '@shared/bannerUploader';
import { CancelIcon, CheckCircleIcon, LoaderIcon, UnverifiedIcon } from '@shared/icons';
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { useNostr } from '@utils/hooks/useNostr';
export function EditProfileModal() {
@@ -20,7 +18,7 @@ export function EditProfileModal() {
const [isOpen, setIsOpen] = useState(false);
const [loading, setLoading] = useState(false);
const [picture, setPicture] = useState(DEFAULT_AVATAR);
const [picture, setPicture] = useState('https://void.cat/d/5VKmKyuHyxrNMf9bWSVPih');
const [banner, setBanner] = useState('');
const [nip05, setNIP05] = useState({ verified: false, text: '' });
@@ -126,7 +124,7 @@ export function EditProfileModal() {
// reset state
setLoading(false);
setIsOpen(false);
setPicture(DEFAULT_AVATAR);
setPicture('https://void.cat/d/5VKmKyuHyxrNMf9bWSVPih');
setBanner(null);
}, 1200);
} else {
@@ -206,9 +204,8 @@ export function EditProfileModal() {
/>
<div className="relative">
<div className="relative h-44 w-full bg-zinc-800">
<Image
<img
src={banner}
fallback="https://void.cat/d/QY1myro5tkHVs2nY7dy74b.jpg"
alt="user's banner"
className="h-full w-full object-cover"
/>
@@ -220,7 +217,6 @@ export function EditProfileModal() {
<div className="relative z-10 -mt-7 h-14 w-14">
<Image
src={picture}
fallback={DEFAULT_AVATAR}
alt="user's avatar"
className="h-14 w-14 rounded-lg object-cover ring-2 ring-zinc-900"
/>

28
src/shared/image.tsx
View File

@@ -1,17 +1,27 @@
import { ImgHTMLAttributes } from 'react';
import { minidenticon } from 'minidenticons';
import { ImgHTMLAttributes, useState } from 'react';
import { useMemo } from 'react';
interface Props extends ImgHTMLAttributes<any> {
fallback: string;
}
export function Image({ src, ...props }: ImgHTMLAttributes<HTMLImageElement>) {
const [isError, setIsError] = useState(false);
if (isError || !src) {
const svgURI = useMemo(
() =>
'data:image/svg+xml;utf8,' + encodeURIComponent(minidenticon(props.alt, 90, 50)),
[props.alt]
);
return (
<img src={svgURI} alt={props.alt} {...props} style={{ backgroundColor: '#000' }} />
);
}
export function Image({ src, fallback, ...props }: Props) {
return (
<img
{...props}
src={src || fallback}
onError={({ currentTarget }) => {
currentTarget.onerror = null;
currentTarget.src = fallback;
src={src}
onError={() => {
setIsError(true);
}}
decoding="async"
alt="lume default img"

2
src/shared/notes/actions/more.tsx
View File

@@ -45,7 +45,7 @@ export function MoreActions({ id, pubkey }: { id: string; pubkey: string }) {
</Tooltip.Portal>
</Tooltip.Root>
<Popover.Portal>
<Popover.Content className="w-[200px] overflow-hidden rounded-md bg-white/10 backdrop-blur-xl focus:outline-none">
<Popover.Content className="w-[200px] overflow-hidden rounded-md bg-white/10 backdrop-blur-3xl focus:outline-none">
<div className="flex flex-col p-2">
<Link
to={`/events/${id}`}

3
src/shared/notes/replies/form.tsx
View File

@@ -3,7 +3,7 @@ import { useState } from 'react';
import { Button } from '@shared/button';
import { Image } from '@shared/image';
import { DEFAULT_AVATAR, FULL_RELAYS } from '@stores/constants';
import { FULL_RELAYS } from '@stores/constants';
import { useNostr } from '@utils/hooks/useNostr';
import { useProfile } from '@utils/hooks/useProfile';
@@ -47,7 +47,6 @@ export function NoteReplyForm({ id, pubkey }: { id: string; pubkey: string }) {
<div className="relative h-11 w-11 shrink-0 rounded">
<Image
src={user?.picture || user?.image}
fallback={DEFAULT_AVATAR}
alt={pubkey}
className="h-11 w-11 rounded-lg bg-white object-cover"
/>

5
src/shared/notes/users/mini.tsx
View File

@@ -1,7 +1,5 @@
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { useProfile } from '@utils/hooks/useProfile';
export function MiniUser({ pubkey }: { pubkey: string }) {
@@ -13,8 +11,7 @@ export function MiniUser({ pubkey }: { pubkey: string }) {
return (
<Image
src={user?.picture || user?.image || DEFAULT_AVATAR}
fallback={DEFAULT_AVATAR}
src={user?.picture || user?.image}
alt={pubkey}
className="relative z-20 inline-block h-4 w-4 rounded bg-white ring-1 ring-zinc-800"
/>

5
src/shared/notes/users/repost.tsx
View File

@@ -1,7 +1,5 @@
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { useProfile } from '@utils/hooks/useProfile';
import { shortenKey } from '@utils/shortenKey';
@@ -15,8 +13,7 @@ export function RepostUser({ pubkey }: { pubkey: string }) {
return (
<div className="flex gap-2 pl-6">
<Image
src={user?.picture || user?.image || DEFAULT_AVATAR}
fallback={DEFAULT_AVATAR}
src={user?.picture || user?.image}
alt={pubkey}
className="relative z-20 inline-block h-6 w-6 rounded bg-white ring-1 ring-black"
/>

5
src/shared/notes/users/thread.tsx
View File

@@ -1,8 +1,6 @@
import { VerticalDotsIcon } from '@shared/icons';
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { formatCreatedAt } from '@utils/createdAt';
import { useProfile } from '@utils/hooks/useProfile';
import { displayNpub } from '@utils/shortenKey';
@@ -18,8 +16,7 @@ export function ThreadUser({ pubkey, time }: { pubkey: string; time: number }) {
return (
<div className="flex items-center gap-3">
<Image
src={user?.picture || user?.image || DEFAULT_AVATAR}
fallback={DEFAULT_AVATAR}
src={user?.picture || user?.image}
alt={pubkey}
className="relative z-20 inline-block h-11 w-11 rounded-lg"
/>

3
src/shared/notification/user.tsx
View File

@@ -1,7 +1,5 @@
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { useProfile } from '@utils/hooks/useProfile';
import { displayNpub } from '@utils/shortenKey';
@@ -23,7 +21,6 @@ export function NotiUser({ pubkey }: { pubkey: string }) {
<div className="flex shrink-0 items-start justify-start gap-3">
<Image
src={user?.picture || user?.image}
fallback={DEFAULT_AVATAR}
alt={pubkey}
className="h-10 w-10 shrink-0 rounded-md object-cover"
/>

4
src/shared/user.tsx
View File

@@ -4,8 +4,6 @@ import { twMerge } from 'tailwind-merge';
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { formatCreatedAt } from '@utils/createdAt';
import { useProfile } from '@utils/hooks/useProfile';
import { displayNpub } from '@utils/shortenKey';
@@ -63,7 +61,6 @@ export function User({
>
<Image
src={user?.picture || user?.image}
fallback={DEFAULT_AVATAR}
alt={pubkey}
className={twMerge(
`object-cover ${avatarWidth} ${avatarHeight}`,
@@ -99,7 +96,6 @@ export function User({
<div className="flex gap-2.5 border-b border-white/5 px-3 py-3">
<Image
src={user?.picture || user?.image}
fallback={DEFAULT_AVATAR}
alt={pubkey}
className="h-11 w-11 shrink-0 rounded-lg object-cover"
/>

4
src/shared/userProfile.tsx
View File

@@ -3,11 +3,8 @@ import { Link } from 'react-router-dom';
import { UserMetadata } from '@app/users/components/metadata';
import { ZapIcon } from '@shared/icons';
import { Image } from '@shared/image';
import { DEFAULT_AVATAR } from '@stores/constants';
import { useProfile } from '@utils/hooks/useProfile';
import { useSocial } from '@utils/hooks/useSocial';
import { displayNpub } from '@utils/shortenKey';
@@ -52,7 +49,6 @@ export function UserProfile({ pubkey }: { pubkey: string }) {
<div>
<Image
src={user?.picture || user?.image}
fallback={DEFAULT_AVATAR}
alt={pubkey}
className="h-14 w-14 rounded-md"
/>