feat(profile): enhance email management and avatar fallback for better mobile support (#2776)

This commit is contained in:
Konv Suu 2025-02-17 12:23:44 +08:00 committed by GitHub
parent c7b151394a
commit 4295decfa9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 8 additions and 2 deletions

View File

@ -1,3 +1,4 @@
import { useMobile } from "@follow/components/hooks/useMobile.js"
import { Button } from "@follow/components/ui/button/index.js"
import {
Form,
@ -29,6 +30,7 @@ const formSchema = z.object({
export function EmailManagement() {
const user = useWhoami()
const isMobile = useMobile()
const { t } = useTranslation("settings")
const verifyEmailMutation = useMutation({
@ -73,7 +75,10 @@ export function EmailManagement() {
{user?.email && (
<CopyButton
value={user.email}
className="size-5 p-1 opacity-0 duration-300 group-hover:opacity-100"
className={cn(
"size-5 p-1 duration-300",
!isMobile && "opacity-0 group-hover:opacity-100",
)}
/>
)}
</p>

View File

@ -1,4 +1,4 @@
import { Avatar, AvatarImage } from "@follow/components/ui/avatar/index.jsx"
import { Avatar, AvatarFallback, AvatarImage } from "@follow/components/ui/avatar/index.jsx"
import { Button } from "@follow/components/ui/button/index.js"
import {
Form,
@ -116,6 +116,7 @@ export const ProfileSettingForm = ({
{field.value && (
<Avatar className="size-9">
<AvatarImage src={field.value} />
<AvatarFallback>{user?.name[0] || ""}</AvatarFallback>
</Avatar>
)}
</div>