Merge branch 'main' of http://192.168.1.200:3000/Stratawiz/EventBuzz_Website

* 'main' of http://192.168.1.200:3000/Stratawiz/EventBuzz_Website:
  Apply presenter photo shape styles on the Photo Wall present page.

src/lib/api.ts

@@ -1040,6 +1040,7 @@ export type PhotoWallPresentData = {
   presentMarginTopPx?: number;
   presentMarginLeftPx?: number;
   presentMarginRightPx?: number;
+  presentPhotoShape?: "rect" | "rounded" | "circle";
   showUploaderNameOnWall?: boolean;
   frameEnabled?: boolean;
   frameCanvasWidth?: number;

src/pages/PhotoWallPresentPage.tsx

@@ -5,6 +5,25 @@ import { PhotoWallPresentChrome } from "../components/PhotoWallPresentChrome";
 
 const POLL_MS = 4000;
 
+function presentShapeStyles(
+  shape: PhotoWallPresentData["presentPhotoShape"],
+  maxW: number,
+  maxH: number,
+  frameEnabled: boolean,
+  frameW: number,
+  frameH: number,
+) {
+  const normalized = shape === "rect" || shape === "circle" || shape === "rounded" ? shape : "rounded";
+  const borderRadius = normalized === "rect" ? 0 : normalized === "circle" ? "50%" : 16;
+  const aspectRatio =
+    normalized === "circle"
+      ? "1 / 1"
+      : frameEnabled
+        ? `${frameW} / ${frameH}`
+        : `${maxW} / ${maxH}`;
+  return { borderRadius, aspectRatio, shape: normalized };
+}
+
 export function PhotoWallPresentPage() {
   const { presentToken } = useParams<{ presentToken: string }>();
   const [data, setData] = useState<PhotoWallPresentData | null>(null);
@@ -59,7 +78,14 @@ export function PhotoWallPresentPage() {
   const frameEnabled = Boolean(data.frameEnabled);
   const frameW = data.frameCanvasWidth || 1080;
   const frameH = data.frameCanvasHeight || 1080;
-  const aspectRatio = frameEnabled ? `${frameW} / ${frameH}` : `${maxW} / ${maxH}`;
+  const { borderRadius, aspectRatio } = presentShapeStyles(
+    data.presentPhotoShape,
+    maxW,
+    maxH,
+    frameEnabled,
+    frameW,
+    frameH,
+  );
 
   return (
     <div className="eb-gradient-auth min-h-dvh text-white">
@@ -90,20 +116,25 @@ export function PhotoWallPresentPage() {
           {data.photos.map((p) => (
             <div
               key={p._id}
-              className="flex w-full flex-col items-center rounded-xl bg-[var(--theme-card-color)]/50"
+              className="flex w-full flex-col items-center bg-[var(--theme-card-color)]/50"
               style={{ maxWidth: maxW }}
             >
-              <img
-                src={p.url}
-                alt={p.displayName || "Photo Wall"}
-                className="relative z-1 w-full object-cover shadow-lg"
+              <div
+                className="relative z-1 w-full overflow-hidden shadow-lg"
                 style={{
                   maxWidth: maxW,
                   maxHeight: maxH,
                   aspectRatio,
-                  objectFit: "cover",
+                  borderRadius,
                 }}
-              />
+              >
+                <img
+                  src={p.url}
+                  alt={p.displayName || "Photo Wall"}
+                  className="h-full w-full object-cover"
+                  style={{ objectFit: "cover" }}
+                />
+              </div>
               {showNames && p.displayName ? (
                 <p
                   className="mt-1 w-full truncate rounded-md p-2 text-center text-sm font-bold text-[var(--theme-card-text-color)]/90"