zio/bsky-app
2
0
Fork 0
Code Pull requests Releases Packages Activity

72-delete-avatar-and-cover (#255)

Browse source 
* allow to delete profile pic

* allow for removing banner
This commit is contained in:
Ansh 2023-03-02 16:53:18 -08:00 • committed by GitHub
parent aeb04a2ed0
commit e592e59f4e
4 changed files with 45 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

27
src/view/com/modals/EditProfile.tsx
View file

@ -44,20 +44,30 @@ export function Component({
const [description, setDescription] = useState<string>(
profileView.description || '',
)
const [userBanner, setUserBanner] = useState<string | undefined>(
const [userBanner, setUserBanner] = useState<string | undefined | null>(
profileView.banner,
)
const [userAvatar, setUserAvatar] = useState<string | undefined>(
const [userAvatar, setUserAvatar] = useState<string | undefined | null>(
profileView.avatar,
)
const [newUserBanner, setNewUserBanner] = useState<PickedMedia | undefined>()
const [newUserAvatar, setNewUserAvatar] = useState<PickedMedia | undefined>()
const [newUserBanner, setNewUserBanner] = useState<
PickedMedia | undefined | null
>()
const [newUserAvatar, setNewUserAvatar] = useState<
PickedMedia | undefined | null
>()
const onPressCancel = () => {
store.shell.closeModal()
}
const onSelectNewAvatar = async (img: PickedMedia) => {
const onSelectNewAvatar = async (img: PickedMedia | null) => {
track('EditProfile:AvatarSelected')
try {
// if img is null, user selected "remove avatar"
if (!img) {
setNewUserAvatar(null)
setUserAvatar(null)
return
}
const finalImg = await compressIfNeeded(img, 1000000)
setNewUserAvatar({mediaType: 'photo', ...finalImg})
setUserAvatar(finalImg.path)
@ -65,7 +75,12 @@ export function Component({
setError(cleanError(e))
}
}
const onSelectNewBanner = async (img: PickedMedia) => {
const onSelectNewBanner = async (img: PickedMedia | null) => {
if (!img) {
setNewUserBanner(null)
setUserBanner(null)
return
}
track('EditProfile:BannerSelected')
try {
const finalImg = await compressIfNeeded(img, 1000000)

17
src/view/com/util/UserAvatar.tsx
View file

@ -31,7 +31,7 @@ export function UserAvatar({
handle: string
displayName: string | undefined
avatar?: string | null
onSelectNewAvatar?: (img: PickedMedia) => void
onSelectNewAvatar?: (img: PickedMedia | null) => void
}) {
const store = useStores()
const pal = usePalette('default')
@ -97,14 +97,13 @@ export function UserAvatar({
)
},
},
// TODO: Remove avatar https://github.com/bluesky-social/social-app/issues/122
// {
// label: 'Remove',
// icon: ['far', 'trash-can'],
// onPress: () => {
// // Remove avatar API call
// },
// },
{
label: 'Remove',
icon: ['far', 'trash-can'] as IconProp,
onPress: async () => {
onSelectNewAvatar?.(null)
},
},
]
// onSelectNewAvatar is only passed as prop on the EditProfile component
return onSelectNewAvatar ? (

17
src/view/com/util/UserBanner.tsx
View file

@ -25,7 +25,7 @@ export function UserBanner({
onSelectNewBanner,
}: {
banner?: string | null
onSelectNewBanner?: (img: PickedMedia) => void
onSelectNewBanner?: (img: PickedMedia | null) => void
}) {
const store = useStores()
const pal = usePalette('default')
@ -70,14 +70,13 @@ export function UserBanner({
)
},
},
// TODO: Remove banner https://github.com/bluesky-social/social-app/issues/122
// {
// label: 'Remove',
// icon: ['far', 'trash-can'],
// onPress: () => {
// // Remove banner api call
// },
// },
{
label: 'Remove',
icon: ['far', 'trash-can'] as IconProp,
onPress: () => {
onSelectNewBanner?.(null)
},
},
]
const renderSvg = () => (