Robotail/Corp
Robotail/Corp
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(frontend): remove nested avatar fallback shells

Browse Source
This commit is contained in:
lizerk 2026-04-13 16:07:53 +03:00
parent 3a70060a62
commit 24a090850f
4 changed files with 16 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/app/employees/page.tsx
View File

@ -188,7 +188,9 @@ export default function EmployeesPage() {
href={`/users/${employee.id}`}
className="flex min-w-0 flex-1 items-center gap-4"
>
<div className="app-avatar-frame flex h-12 w-12 shrink-0 items-center justify-center overflow-hidden rounded-full">
<div
className={`${employee.avatar ? "app-avatar-frame" : "app-avatar-fallback"} flex h-12 w-12 shrink-0 items-center justify-center overflow-hidden rounded-full text-sm font-semibold`}
>
{employee.avatar ? (
<Image
src={resolveMediaUrl(employee.avatar)}
@ -199,9 +201,7 @@ export default function EmployeesPage() {
unoptimized
/>
) : (
<span className="app-avatar-fallback flex h-full w-full items-center justify-center text-sm font-semibold">
{initials}
</span>
initials
)}
</div>
<div className="min-w-0 flex-1">

8
frontend/src/app/profile/page.tsx
View File

@ -122,7 +122,9 @@ export default function ProfilePage() {
) : null
}
avatar={
<div className="app-avatar-frame h-20 w-20 shrink-0 overflow-hidden rounded-full">
<div
className={`${user.avatar ? "app-avatar-frame" : "app-avatar-fallback"} flex h-20 w-20 shrink-0 items-center justify-center overflow-hidden rounded-full text-2xl font-semibold`}
>
{user.avatar ? (
<Image
src={resolveMediaUrl(user.avatar)}
@ -133,9 +135,7 @@ export default function ProfilePage() {
unoptimized
/>
) : (
<div className="app-avatar-fallback flex h-full w-full items-center justify-center text-2xl font-semibold">
{initials(user.first_name, user.last_name)}
</div>
initials(user.first_name, user.last_name)
)}
</div>
}

8
frontend/src/app/users/[id]/page.tsx
View File

@ -318,7 +318,9 @@ export default function UserDetailPage() {
) : null
}
avatar={
<div className="h-20 w-20 shrink-0 overflow-hidden rounded-full app-avatar-frame">
<div
className={`flex h-20 w-20 shrink-0 items-center justify-center overflow-hidden rounded-full text-2xl font-semibold ${avatarUrl && !avatarFailed ? "app-avatar-frame" : "app-avatar-fallback"}`}
>
{avatarUrl && !avatarFailed ? (
<Image
src={avatarUrl}
@ -330,9 +332,7 @@ export default function UserDetailPage() {
unoptimized
/>
) : (
<div className="app-avatar-fallback flex h-full w-full items-center justify-center text-2xl font-semibold">
{initials}
</div>
initials
)}
</div>
}

8
frontend/src/components/users/EditUserProfileModal.tsx
View File

@ -116,7 +116,9 @@ export default function EditUserProfileModal({
<div className="space-y-4">
<section className="app-surface-muted rounded-xl p-4">
<div className="flex flex-col gap-4 sm:flex-row sm:items-center">
<div className="app-avatar-frame flex h-20 w-20 items-center justify-center overflow-hidden rounded-full shrink-0">
<div
className={`flex h-20 w-20 shrink-0 items-center justify-center overflow-hidden rounded-full text-xl font-semibold ${form.avatarPreview || (avatarUrl && !avatarFailed) ? "app-avatar-frame" : "app-avatar-fallback"}`}
>
{form.avatarPreview ? (
<Image
src={form.avatarPreview}
@ -136,9 +138,7 @@ export default function EditUserProfileModal({
unoptimized
/>
) : (
<span className="app-avatar-fallback flex h-full w-full items-center justify-center text-xl font-semibold">
{initials}
</span>
initials
)}
</div>