External/portabase
1
0
Fork 0
mirror of https://github.com/Portabase/portabase.git synced 2026-07-14 11:16:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: allow avatar upload regardless of mode

Browse Source 
Remove avatarMode prop from AvatarWithUpload and always render the upload
overlay. The upload functionality is now unconditionally available.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Théo LAGACHE
2026-06-25 11:02:10 +02:00
co-authored by Claude Sonnet 4.6
parent 8d448718d0
commit 3f76f7b604
1 changed files with 15 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/features/profile/components/avatar-with-upload.tsx
+15 -20
View File
@@ -8,17 +8,14 @@ import { updateImageUserAction } from "@/features/profile/actions/avatar.action"
import { useRouter } from "next/navigation";
import { User } from "@/db/schema/02_user";
import React, { ChangeEvent } from "react";
import type { AvatarMode } from "@/features/onboarding/types";
export type AvatarWithUploadProps = {
user: User;
avatarMode?: AvatarMode;
avatarUrl?: string;
};
export const AvatarWithUpload = (props: AvatarWithUploadProps) => {
const user = props.user;
const canUpload = !props.avatarMode || props.avatarMode === "internal";
const src = props.avatarUrl ?? user.image ?? undefined;
const router = useRouter();
@@ -79,23 +76,21 @@ export const AvatarWithUpload = (props: AvatarWithUploadProps) => {
</AvatarFallback>
</Avatar>
{canUpload && (
<div
onClick={() => {
const fileInput = document.createElement("input");
fileInput.type = "file";
fileInput.accept = ".jpg,.jpeg,.png,.webp";
fileInput.onchange = (e: Event) =>
handleImageUpload(
e as unknown as React.ChangeEvent<HTMLInputElement>,
);
fileInput.click();
}}
className="cursor-pointer absolute inset-0 flex justify-center items-center opacity-0 transition-opacity hover:opacity-30 hover:bg-gray-500 hover:bg-opacity-50 rounded-full w-24 h-24 lg:w-32 lg:h-32"
>
<UploadIcon className="w-12 h-12 lg:w-16 lg:h-16 text-primary" />
</div>
)}
<div
onClick={() => {
const fileInput = document.createElement("input");
fileInput.type = "file";
fileInput.accept = ".jpg,.jpeg,.png,.webp";
fileInput.onchange = (e: Event) =>
handleImageUpload(
e as unknown as React.ChangeEvent<HTMLInputElement>,
);
fileInput.click();
}}
className="cursor-pointer absolute inset-0 flex justify-center items-center opacity-0 transition-opacity hover:opacity-30 hover:bg-gray-500 hover:bg-opacity-50 rounded-full w-24 h-24 lg:w-32 lg:h-32"
>
<UploadIcon className="w-12 h-12 lg:w-16 lg:h-16 text-primary" />
</div>
</div>
);
};