feat(profile): enhance email management and avatar fallback for better mobile support (#2776)
This commit is contained in:
parent
c7b151394a
commit
4295decfa9
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Reference in New Issue