Stratawiz
/
EventBuzz_Website
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Photo wall Presenter changes

This commit is contained in:
Ravi Gulhane 2026-08-18 14:47:04 +05:30
parent 0b44e15b50
commit d110a9065e
2 changed files with 30 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/lib/api.ts
View File

@ -1031,10 +1031,15 @@ export type PhotoWallUploadMeta = {
export type PhotoWallPresentData = {
eventId: string;
eventName: string;
event?: PhotoWallPublicEvent | null;
eventHeader?: PhotoWallEventHeaderDisplay | null;
photosPerRow: number;
maxPhotoWidth: number;
maxPhotoHeight: number;
gapPx: number;
presentMarginTopPx?: number;
presentMarginLeftPx?: number;
presentMarginRightPx?: number;
showUploaderNameOnWall?: boolean;
frameEnabled?: boolean;
frameCanvasWidth?: number;

31
src/pages/PhotoWallPresentPage.tsx
View File

@ -1,6 +1,7 @@
import { useCallback, useEffect, useState } from "react";
import { useParams } from "react-router-dom";
import { getPhotoWallPresent, type PhotoWallPresentData } from "../lib/api";
import { PhotoWallEventHeader } from "../components/PhotoWallEventHeader";
const POLL_MS = 4000;
@ -51,6 +52,9 @@ export function PhotoWallPresentPage() {
const maxW = data.maxPhotoWidth || 320;
const maxH = data.maxPhotoHeight || 320;
const gap = data.gapPx ?? 8;
const marginTop = Math.max(0, data.presentMarginTopPx ?? 0);
const marginLeft = Math.max(0, data.presentMarginLeftPx ?? 0);
const marginRight = Math.max(0, data.presentMarginRightPx ?? 0);
const showNames = Boolean(data.showUploaderNameOnWall);
const frameEnabled = Boolean(data.frameEnabled);
const frameW = data.frameCanvasWidth || 1080;
@ -59,10 +63,22 @@ export function PhotoWallPresentPage() {
return (
<div className="eb-gradient-auth min-h-dvh text-white">
<div className="px-4 pb-3 pt-4 text-center card-bg rounded-lg shadow-sm max-w-[400px] mx-auto mb-3">
<p className="text-xs uppercase tracking-[0.2em] text-[var(--theme-card-text-color)]/70">Photo Wall</p>
<h1 className="text-xl font-semibold sm:text-2xl text-[var(--theme-card-text-color)]">{data.eventName}</h1>
</div>
{data.event ? (
<div className="px-4 pb-3 pt-4">
<div className="card-bg mx-auto mb-3 max-w-[400px] rounded-lg p-4 shadow-sm [&:not(:has(header))]:hidden">
<PhotoWallEventHeader
event={data.event}
display={data.eventHeader || null}
eyebrow={data.eventHeader?.showTitle === false ? null : "Photo Wall"}
/>
</div>
</div>
) : (
<div className="card-bg mx-auto mb-3 max-w-[400px] rounded-lg px-4 pb-3 pt-4 text-center shadow-sm">
<p className="text-xs uppercase tracking-[0.2em] text-[var(--theme-card-text-color)]/70">Photo Wall</p>
<h1 className="text-xl font-semibold text-[var(--theme-card-text-color)] sm:text-2xl">{data.eventName}</h1>
</div>
)}
{data.photos.length === 0 ? (
<div className="flex min-h-[60dvh] items-center justify-center px-6 text-center text-white/80">
@ -70,13 +86,16 @@ export function PhotoWallPresentPage() {
</div>
) : (
<div
className="mx-auto w-full max-w-[100vw] px-3 pb-6"
className="mx-auto w-full max-w-[100vw] pb-6"
style={{
display: "grid",
gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))`,
gap: `${gap}px`,
justifyItems: "center",
alignItems: "start",
paddingTop: `${marginTop}px`,
paddingLeft: `${marginLeft}px`,
paddingRight: `${marginRight}px`,
}}
>
{data.photos.map((p) => (
@ -98,7 +117,7 @@ export function PhotoWallPresentPage() {
/>
{showNames && p.displayName ? (
<p
className="mt- w-full truncate text-center text-xs font-medium text-[var(--theme-card-text-color)]/90 bg-[var(--theme-card-color)] rounded-md p-1 sm:text-sm"
className="mt- w-full truncate rounded-md bg-[var(--theme-card-color)] p-1 text-center text-xs font-medium text-[var(--theme-card-text-color)]/90 sm:text-sm"
title={p.displayName}
>
{p.displayName}