feat(avatar): create DoctorAvatar component for improved doctor image handling

2026-06-21 11:17:34 +03:30
parent 6e1550c610
commit 6ec2f5a069
5 changed files with 55 additions and 36 deletions
@@ -0,0 +1,38 @@
+import Image from "next/image";
+import { imageUrl } from "@/helper";
+
+function getInitials(name) {
+  if (!name) return "";
+  const parts = name.trim().split(/\s+/).filter(Boolean);
+  if (parts.length === 0) return "";
+  if (parts.length === 1) return parts[0][0];
+  return `${parts[0][0]}${parts[1][0]}`;
+}
+
+function DoctorAvatar({ doctor, size = 72, className = "", priority = false }) {
+  const url = doctor?.img?.[0]?.url;
+
+  if (!url) {
+    return (
+      <div
+        style={{ width: size, height: size }}
+        className={`flex items-center justify-center rounded-full bg-[#F8F8FF] text-[#3B3B3B] font-bold select-none ${className}`}
+      >
+        <span style={{ fontSize: size * 0.32 }}>{getInitials(doctor?.name)}</span>
+      </div>
+    );
+  }
+
+  return (
+    <Image
+      width={size}
+      height={size}
+      alt="image-doctor"
+      src={imageUrl(url)}
+      className={`object-contain rounded-full ${className}`}
+      priority={priority}
+    />
+  );
+}
+
+export default DoctorAvatar;