@mohasinac/appkit 2.2.0 → 2.3.1

package/dist/features/events/api/[id]/route.js

@@ -17,7 +17,7 @@
 import { NextResponse } from "next/server.js";
 import { getProviders } from "../../../../contracts";
 import { EVENT_FIELDS } from "../../schemas";
-// ─── GET /api/events/[id] ─────────────────────────────────────────────────────
+// --- GET /api/events/[id] -----------------------------------------------------
 export async function GET(_request, context) {
     try {
         const { id } = await context.params;

package/dist/features/events/components/AdminEventEntriesView.d.ts

@@ -1,6 +1,11 @@
 import React from "react";
 import type { StackedViewShellProps } from "../../../ui";
 export interface AdminEventEntriesViewProps extends Omit<StackedViewShellProps, "sections"> {
+    eventId?: string;
+    entriesEndpoint?: (eventId: string) => string;
+    entryReviewEndpoint?: (eventId: string, entryId: string) => string;
+    statsEndpoint?: (eventId: string) => string;
+    children?: React.ReactNode;
     /** Back-link and event title header */
     renderHeader?: () => React.ReactNode;
     /** Stats banner (total / approved / flagged counts) */
@@ -8,10 +13,10 @@ export interface AdminEventEntriesViewProps extends Omit<StackedViewShellProps,
     /** Filter bar (status dropdown, sort, search) */
     renderFilters?: () => React.ReactNode;
     /** Entries data table */
-    renderTable: () => React.ReactNode;
+    renderTable?: () => React.ReactNode;
     /** Pagination footer */
     renderPagination?: () => React.ReactNode;
     /** Entry review side-drawer */
     renderReviewDrawer?: () => React.ReactNode;
 }
-export declare function AdminEventEntriesView({ renderHeader, renderStats, renderFilters, renderTable, renderPagination, renderReviewDrawer, ...rest }: AdminEventEntriesViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function AdminEventEntriesView({ eventId, entriesEndpoint, entryReviewEndpoint, statsEndpoint, renderHeader, renderStats, renderFilters, renderTable, renderPagination, renderReviewDrawer, ...rest }: AdminEventEntriesViewProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/events/components/AdminEventEntriesView.js

@@ -1,10 +1,117 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { StackedViewShell } from "../../../ui";
-export function AdminEventEntriesView({ renderHeader, renderStats, renderFilters, renderTable, renderPagination, renderReviewDrawer, ...rest }) {
-    return (_jsx(StackedViewShell, { portal: "admin", ...rest, renderHeader: renderHeader, sections: [
-            renderStats?.(),
-            renderFilters?.(),
-            renderTable(),
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { Alert, Button, Input, Select, StackedViewShell, Text, } from "../../../ui";
+import { apiClient } from "../../../http";
+import { DataTable } from "../../admin/components/DataTable";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+const REVIEW_STATUS_OPTIONS = [
+    { label: "All", value: "all" },
+    { label: "Pending", value: "pending" },
+    { label: "Approved", value: "approved" },
+    { label: "Flagged", value: "flagged" },
+];
+export function AdminEventEntriesView({ eventId, entriesEndpoint, entryReviewEndpoint, statsEndpoint, renderHeader, renderStats, renderFilters, renderTable, renderPagination, renderReviewDrawer, ...rest }) {
+    const queryClient = useQueryClient();
+    const [page, setPage] = React.useState(1);
+    const [pageSize] = React.useState(20);
+    const [statusFilter, setStatusFilter] = React.useState("all");
+    const [searchQuery, setSearchQuery] = React.useState("");
+    const resolvedEntriesEndpoint = React.useMemo(() => {
+        if (!eventId)
+            return "";
+        return entriesEndpoint?.(eventId) ?? ADMIN_ENDPOINTS.EVENT_ENTRIES(eventId);
+    }, [entriesEndpoint, eventId]);
+    const resolvedStatsEndpoint = React.useMemo(() => {
+        if (!eventId)
+            return "";
+        return statsEndpoint?.(eventId) ?? ADMIN_ENDPOINTS.EVENT_STATS(eventId);
+    }, [eventId, statsEndpoint]);
+    const entriesQuery = useQuery({
+        queryKey: [
+            "admin-event-entries",
+            eventId,
+            resolvedEntriesEndpoint,
+            page,
+            pageSize,
+            statusFilter,
+            searchQuery,
+        ],
+        queryFn: () => {
+            const sp = new URLSearchParams();
+            sp.set("page", String(page));
+            sp.set("pageSize", String(pageSize));
+            if (statusFilter !== "all")
+                sp.set("reviewStatus", statusFilter);
+            if (searchQuery.trim())
+                sp.set("q", searchQuery.trim());
+            return apiClient.get(`${resolvedEntriesEndpoint}?${sp.toString()}`);
+        },
+        enabled: Boolean(eventId && resolvedEntriesEndpoint),
+        staleTime: 15000,
+    });
+    const statsQuery = useQuery({
+        queryKey: ["admin-event-stats", eventId, resolvedStatsEndpoint],
+        queryFn: () => apiClient.get(resolvedStatsEndpoint),
+        enabled: Boolean(eventId && resolvedStatsEndpoint),
+        staleTime: 15000,
+    });
+    const reviewMutation = useMutation({
+        mutationFn: async ({ entryId, status, }) => {
+            if (!eventId)
+                throw new Error("eventId is required");
+            const endpoint = entryReviewEndpoint?.(eventId, entryId) ??
+                ADMIN_ENDPOINTS.EVENT_ENTRY_BY_ID(eventId, entryId);
+            await apiClient.patch(endpoint, { status });
+        },
+        onSuccess: async () => {
+            await Promise.all([
+                queryClient.invalidateQueries({ queryKey: ["admin-event-entries", eventId] }),
+                queryClient.invalidateQueries({ queryKey: ["admin-event-stats", eventId] }),
+            ]);
+        },
+    });
+    const rows = entriesQuery.data?.items ?? [];
+    const columns = React.useMemo(() => [
+        {
+            key: "submittedAt",
+            header: "Submitted",
+            render: (row) => new Date(row.submittedAt).toLocaleString(),
+        },
+        {
+            key: "userDisplayName",
+            header: "User",
+            render: (row) => row.userDisplayName || row.userEmail || row.userId || "Anonymous",
+        },
+        {
+            key: "reviewStatus",
+            header: "Status",
+            render: (row) => (_jsx(Text, { className: "text-xs font-medium uppercase tracking-wide", children: row.reviewStatus })),
+        },
+        {
+            key: "actions",
+            header: "Actions",
+            render: (row) => (_jsxs("div", { className: "flex items-center gap-2", "data-section": "adminevententriesview-div-274", children: [_jsx(Button, { size: "sm", variant: "secondary", disabled: reviewMutation.isPending || row.reviewStatus === "approved", onClick: () => reviewMutation.mutate({ entryId: row.id, status: "approved" }), children: "Approve" }), _jsx(Button, { size: "sm", variant: "outline", disabled: reviewMutation.isPending || row.reviewStatus === "flagged", onClick: () => reviewMutation.mutate({ entryId: row.id, status: "flagged" }), children: "Flag" })] })),
+        },
+    ], [reviewMutation]);
+    const statsSection = (_jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-3", "data-section": "adminevententriesview-div-275", children: [_jsx(Alert, { variant: "info", title: "Total entries", children: String(statsQuery.data?.stats?.totalEntries ?? 0) }), _jsx(Alert, { variant: "success", title: "Approved", children: String(statsQuery.data?.stats?.approvedEntries ?? 0) }), _jsx(Alert, { variant: "warning", title: "Flagged", children: String(statsQuery.data?.stats?.flaggedEntries ?? 0) })] }));
+    const filtersSection = (_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-3", "data-section": "adminevententriesview-div-276", children: [_jsx(Input, { label: "Search entries", value: searchQuery, onChange: (event) => {
+                    setPage(1);
+                    setSearchQuery(event.target.value);
+                }, placeholder: "Search by user, email, or id" }), _jsx(Select, { label: "Review status", value: statusFilter, options: REVIEW_STATUS_OPTIONS, onChange: (event) => {
+                    setPage(1);
+                    setStatusFilter(event.target.value);
+                } })] }));
+    const tableSection = (_jsx(DataTable, { columns: columns, rows: rows, isLoading: entriesQuery.isLoading, currentPage: entriesQuery.data?.page ?? page, totalPages: entriesQuery.data?.totalPages ?? 1, onPageChange: setPage, emptyLabel: "No entries found" }));
+    const eventTitle = statsQuery.data?.event?.title;
+    return (_jsx(StackedViewShell, { portal: "admin", ...rest, title: eventTitle ? `${eventTitle} Entries` : "Event Entries", renderHeader: renderHeader, sections: [
+            !eventId ? (_jsx(Alert, { variant: "warning", title: "Missing event id", children: "Event id is required to load entries." })) : null,
+            entriesQuery.error ? (_jsx(Alert, { variant: "error", title: "Could not load entries", children: entriesQuery.error instanceof Error ? entriesQuery.error.message : "Unknown error" })) : null,
+            statsQuery.error ? (_jsx(Alert, { variant: "error", title: "Could not load event stats", children: statsQuery.error instanceof Error ? statsQuery.error.message : "Unknown error" })) : null,
+            renderStats?.() ?? statsSection,
+            renderFilters?.() ?? filtersSection,
+            renderTable?.() ?? tableSection,
             renderPagination?.(),
         ], overlays: renderReviewDrawer?.() }));
 }

package/dist/features/events/components/AdminEventsView.d.ts

@@ -1,11 +1,4 @@
-import React from "react";
-import type { SlottedListingViewProps } from "../../../ui";
-export interface AdminEventsViewProps extends Omit<SlottedListingViewProps, "renderTable"> {
-    /** Toolbar: search + sort controls */
-    renderToolbar?: () => React.ReactNode;
-    /** Data table / grid */
-    renderTable: () => React.ReactNode;
-    /** Create / edit event form drawer */
-    renderFormDrawer?: () => React.ReactNode;
+import type { ListingViewShellProps } from "../../../ui";
+export interface AdminEventsViewProps extends ListingViewShellProps {
 }
-export declare function AdminEventsView({ renderToolbar, renderTable, renderFormDrawer, ...rest }: AdminEventsViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function AdminEventsView({ children, ...props }: AdminEventsViewProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/events/components/AdminEventsView.js

@@ -1,5 +1,35 @@
-import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { SlottedListingView } from "../../../ui";
-export function AdminEventsView({ renderToolbar, renderTable, renderFormDrawer, ...rest }) {
-    return (_jsx(SlottedListingView, { portal: "admin", ...rest, renderSearch: renderToolbar ? () => renderToolbar() : undefined, renderTable: renderTable, overlays: _jsxs(_Fragment, { children: [rest.overlays, renderFormDrawer?.()] }) }));
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { ListingViewShell } from "../../../ui";
+import { ADMIN_ENDPOINTS } from "../../../constants/api-endpoints";
+import { toRecordArray, toRelativeDate, toStringValue, useAdminListingData, } from "../../admin/hooks/useAdminListingData";
+import { AdminListingScaffold } from "../../admin/components/AdminListingScaffold";
+export function AdminEventsView({ children, ...props }) {
+    const hasChildren = React.Children.count(children) > 0;
+    const { rows, total, isLoading, errorMessage } = useAdminListingData({
+        queryKey: ["admin", "events", "listing"],
+        endpoint: ADMIN_ENDPOINTS.EVENTS,
+        mapRows: (response) => toRecordArray(response.items).map((item, index) => ({
+            id: toStringValue(item.id, `event-${index}`),
+            primary: toStringValue(item.title, "Untitled event"),
+            secondary: [
+                toStringValue(item.type, "event"),
+                toStringValue(item.startsAt, ""),
+            ]
+                .filter(Boolean)
+                .join(" · "),
+            status: toStringValue(item.status, "active"),
+            updatedAt: toRelativeDate(item.updatedAt ?? item.createdAt),
+        })),
+        getTotal: (response, mappedRows) => {
+            if (typeof response.total === "number")
+                return response.total;
+            return mappedRows.length;
+        },
+    });
+    if (hasChildren) {
+        return _jsx(ListingViewShell, { portal: "admin", ...props, children: children });
+    }
+    return (_jsx(AdminListingScaffold, { portal: "admin", ...props, title: "Events", subtitle: "Manage sales events, offers, polls, surveys, and feedback campaigns.", actionLabel: "New event", searchPlaceholder: "Search events by title or type", rows: rows, isLoading: isLoading, errorMessage: errorMessage, emptyLabel: "No events found", resultSummary: `Showing ${rows.length} of ${total} events` }));
 }

package/dist/features/events/components/EventBanner.js

@@ -43,6 +43,6 @@ export function EventBanner({ storageKey = "dismissed_event_banners", className
     return (_jsxs("div", { className: [
             "relative bg-gradient-to-r from-indigo-600 to-violet-600 px-4 py-2 text-center text-sm font-medium text-white",
             className,
-        ].join(" "), children: [_jsx(TextLink, { href: href, className: "hover:underline", children: text }), _jsx(Button, { type: "button", variant: "ghost", onClick: dismiss, "aria-label": labels?.dismissAriaLabel ?? "Dismiss banner", className: "absolute right-3 top-1/2 -translate-y-1/2 text-white/80 hover:text-white", children: "\u00D7" })] }));
+        ].join(" "), "data-section": "eventbanner-div-277", children: [_jsx(TextLink, { href: href, className: "hover:underline", children: text }), _jsx(Button, { type: "button", variant: "ghost", onClick: dismiss, "aria-label": labels?.dismissAriaLabel ?? "Dismiss banner", className: "absolute right-3 top-1/2 -translate-y-1/2 text-white/80 hover:text-white", children: "\u00D7" })] }));
 }
 export default EventBanner;

package/dist/features/events/components/EventCard.d.ts

@@ -3,6 +3,7 @@ interface EventCardProps {
     event: EventItem;
     labels?: {
         participate?: string;
+        viewDetails?: string;
         viewResults?: string;
         entries?: string;
     };

package/dist/features/events/components/EventCard.js

@@ -1,8 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Article, Button, Div, Heading, Span, Text } from "../../../ui";
-import { stripHtml } from "../../../utils/string.formatter";
+import { Article, Button, Div, Heading, RichText, Span, TextLink } from "../../../ui";
+import { THEME_CONSTANTS, LAYOUT } from "../../../tokens";
+import { normalizeRichTextHtml } from "../../../utils/string.formatter";
 import { EVENT_FIELDS } from "../schemas";
 import { EventStatusBadge } from "./EventStatusBadge";
+import { ROUTES } from "../../../next";
 const TYPE_ICONS = {
     sale: "🏷️",
     offer: "🎁",
@@ -11,11 +13,11 @@ const TYPE_ICONS = {
     feedback: "💬",
 };
 export function EventCard({ event, labels = {}, onParticipate, className = "", }) {
+    const safeTitle = event.title?.trim() || "Untitled event";
     const now = new Date();
     const endsAt = new Date(event.endsAt);
     const msLeft = endsAt.getTime() - now.getTime();
     const daysLeft = Math.max(0, Math.ceil(msLeft / (1000 * 60 * 60 * 24)));
-    return (_jsxs(Article, { className: `flex flex-col h-full rounded-xl border border-gray-200 bg-white overflow-hidden shadow-sm hover:shadow-md transition-shadow ${className}`, children: [event.coverImageUrl && (_jsx(Div, { className: "aspect-video overflow-hidden", children: _jsx(Div, { role: "img", "aria-label": event.title, className: "h-full w-full bg-cover bg-center", style: { backgroundImage: `url(${event.coverImageUrl})` } }) })), _jsxs(Div, { className: "p-4 flex-1 flex flex-col", children: [_jsxs(Div, { className: "flex items-start justify-between gap-2 mb-2", children: [_jsx(Span, { className: "text-lg", "aria-hidden": "true", children: TYPE_ICONS[event.type] }), _jsx(EventStatusBadge, { status: event.status })] }), _jsx(Heading, { level: 3, className: "font-semibold text-gray-900 text-base leading-snug mb-1", children: event.title }), _jsx(Text, { className: "text-sm text-gray-500 line-clamp-2 mb-3", children: stripHtml(event.description ?? "") }), _jsxs(Div, { className: "flex items-center justify-between text-xs text-gray-400 mb-3", children: [event.status === EVENT_FIELDS.STATUS_VALUES.ACTIVE &&
-                                daysLeft > 0 && _jsxs(Span, { children: [daysLeft, "d remaining"] }), _jsxs(Span, { children: [event.stats.totalEntries, " ", labels.entries ?? "entries"] })] }), event.status === EVENT_FIELDS.STATUS_VALUES.ACTIVE &&
-                        onParticipate && (_jsx(Button, { type: "button", onClick: () => onParticipate(event), className: "w-full rounded-lg bg-orange-500 py-2 text-sm font-medium text-white hover:bg-orange-600 transition-colors", children: labels.participate ?? "Participate" }))] })] }));
+    return (_jsxs(Article, { className: `flex h-full ${LAYOUT.cardHeight.event} flex-col overflow-hidden rounded-xl border border-zinc-200 bg-white shadow-sm transition-shadow hover:shadow-md dark:border-slate-700 dark:bg-slate-900 ${className}`, children: [event.coverImageUrl ? (_jsx(Div, { className: "aspect-video overflow-hidden", children: _jsx(Div, { role: "img", "aria-label": safeTitle, className: "h-full w-full bg-cover bg-center", style: { backgroundImage: `url(${event.coverImageUrl})` } }) })) : (_jsx(Div, { className: "aspect-video bg-gradient-to-br from-zinc-100 to-zinc-200 dark:from-slate-800 dark:to-slate-700" })), _jsxs(Div, { className: "flex flex-1 flex-col p-4", children: [_jsxs(Div, { className: "flex items-start justify-between gap-2 mb-2", children: [_jsx(Span, { className: "text-lg", "aria-hidden": "true", children: TYPE_ICONS[event.type] }), _jsx(EventStatusBadge, { status: event.status })] }), _jsx(Heading, { level: 3, className: "font-semibold text-gray-900 dark:text-zinc-100 text-base leading-snug mb-1", children: safeTitle }), _jsx(RichText, { html: normalizeRichTextHtml(event.description ?? ""), proseClass: "prose prose-sm max-w-none dark:prose-invert prose-p:my-0", className: `mb-3 ${THEME_CONSTANTS.utilities.textClamp3} text-sm text-zinc-600 dark:text-zinc-400` }), _jsxs(Div, { className: "mb-3 mt-auto flex items-center justify-between text-xs text-zinc-500 dark:text-zinc-500", children: [event.status === EVENT_FIELDS.STATUS_VALUES.ACTIVE &&
+                                daysLeft > 0 && _jsxs(Span, { children: [daysLeft, "d remaining"] }), _jsxs(Span, { children: [event.stats.totalEntries, " ", labels.entries ?? "entries"] })] }), event.status === EVENT_FIELDS.STATUS_VALUES.ACTIVE && onParticipate ? (_jsx(Button, { type: "button", onClick: () => onParticipate(event), className: "w-full rounded-lg bg-primary py-2 text-sm font-medium text-white transition-colors hover:bg-primary-600", children: labels.participate ?? "Participate" })) : (_jsx(TextLink, { href: ROUTES.PUBLIC.EVENT_DETAIL(event.id), className: "inline-flex w-full items-center justify-center rounded-lg border border-zinc-300 px-3 py-2 text-sm font-medium text-zinc-700 transition-colors hover:bg-zinc-100 dark:border-slate-600 dark:text-zinc-200 dark:hover:bg-slate-800", children: labels.viewDetails ?? "View details" }))] })] }));
 }

package/dist/features/events/components/EventFilters.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTranslations } from "next-intl";
 import { FilterFacetSection } from "../../filters/FilterFacetSection";

package/dist/features/events/components/EventFormDrawer.js

@@ -2,5 +2,5 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
 export function EventFormDrawer({ isOpen, onClose, renderHeader, renderBaseFields, renderMediaFields, renderTypeConfig, renderTypeSelector, renderFooter, className = "", }) {
     if (!isOpen)
         return null;
-    return (_jsxs("div", { className: `space-y-6 ${className}`, children: [renderHeader?.(), renderTypeSelector?.(), renderBaseFields?.(), renderMediaFields?.(), renderTypeConfig?.(), renderFooter?.()] }));
+    return (_jsxs("div", { className: `space-y-6 ${className}`, "data-section": "eventformdrawer-div-278", children: [renderHeader?.(), renderTypeSelector?.(), renderBaseFields?.(), renderMediaFields?.(), renderTypeConfig?.(), renderFooter?.()] }));
 }

package/dist/features/events/components/EventLeaderboard.js

@@ -5,7 +5,7 @@ export function EventLeaderboard({ isLoading = false, isEmpty = false, renderLis
     if (isLoading) {
         if (renderSkeleton)
             return _jsx(_Fragment, { children: renderSkeleton() });
-        return _jsx("div", { className: "flex justify-center py-8", children: "Loading\u2026" });
+        return _jsx("div", { className: "flex justify-center py-8", "data-section": "eventleaderboard-div-279", children: "Loading\u2026" });
     }
     if (isEmpty) {
         if (renderEmpty)
@@ -13,6 +13,6 @@ export function EventLeaderboard({ isLoading = false, isEmpty = false, renderLis
         return (_jsx(Text, { variant: "secondary", size: "sm", className: "text-center py-4", children: labels.noEntries ?? "No entries yet." }));
     }
     if (renderList)
-        return _jsx("div", { className: className, children: renderList() });
-    return (_jsx("div", { className: `space-y-2 ${className}`, children: entries.map((entry, i) => renderEntry ? (_jsx(React.Fragment, { children: renderEntry(entry, i) }, entry.userId)) : (_jsxs("div", { className: "flex items-center justify-between p-3 rounded-xl border", children: [_jsxs(Span, { className: "font-medium", children: ["#", entry.rank, " ", entry.userDisplayName] }), _jsxs(Span, { children: [entry.points, " ", labels.points ?? "pts"] })] }, entry.userId))) }));
+        return _jsx("div", { className: className, "data-section": "eventleaderboard-div-280", children: renderList() });
+    return (_jsx("div", { className: `space-y-2 ${className}`, "data-section": "eventleaderboard-div-281", children: entries.map((entry, i) => renderEntry ? (_jsx(React.Fragment, { children: renderEntry(entry, i) }, entry.userId)) : (_jsxs("div", { className: "flex items-center justify-between p-3 rounded-xl border", "data-section": "eventleaderboard-div-282", children: [_jsxs(Span, { className: "font-medium", children: ["#", entry.rank, " ", entry.userDisplayName] }), _jsxs(Span, { children: [entry.points, " ", labels.points ?? "pts"] })] }, entry.userId))) }));
 }

package/dist/features/events/components/EventParticipateView.js

@@ -3,11 +3,11 @@ export function EventParticipateView({ isLoading = false, isSubmitted = false, r
     if (isLoading) {
         if (renderSkeleton)
             return _jsx(_Fragment, { children: renderSkeleton() });
-        return _jsx("div", { className: "flex justify-center py-20", children: "Loading\u2026" });
+        return _jsx("div", { className: "flex justify-center py-20", "data-section": "eventparticipateview-div-283", children: "Loading\u2026" });
     }
     if (renderAuthGate)
         return _jsx(_Fragment, { children: renderAuthGate() });
     if (isSubmitted && renderSuccess)
         return _jsx(_Fragment, { children: renderSuccess() });
-    return (_jsxs("div", { className: `max-w-xl mx-auto space-y-6 ${className}`, children: [renderEventInfo?.(), renderForm?.(), renderAction?.()] }));
+    return (_jsxs("div", { className: `max-w-xl mx-auto space-y-6 ${className}`, "data-section": "eventparticipateview-div-284", children: [renderEventInfo?.(), renderForm?.(), renderAction?.()] }));
 }

package/dist/features/events/components/EventsIndexListing.d.ts

@@ -0,0 +1,4 @@
+export interface EventsIndexListingProps {
+    initialData?: any;
+}
+export declare function EventsIndexListing({ initialData }: EventsIndexListingProps): import("react/jsx-runtime").JSX.Element;

package/dist/features/events/components/EventsIndexListing.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useUrlTable } from "../../../react/hooks/useUrlTable";
+import { useEvents } from "../hooks/useEvents";
+import { Div, Input, Pagination, SlottedListingView, SortDropdown, Stack, Text, } from "../../../ui";
+import { EventCard } from "./EventCard";
+import { EventFilters, EVENT_PUBLIC_SORT_OPTIONS, } from "./EventFilters";
+const PAGE_SIZE = 24;
+export function EventsIndexListing({ initialData }) {
+    const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: "startsAt" } });
+    const params = {
+        page: table.getNumber("page", 1),
+        pageSize: table.getNumber("pageSize", PAGE_SIZE),
+        sort: table.get("sort") || "startsAt",
+        type: table.get("type") || undefined,
+        status: table.get("status") || "published",
+        filters: table.get("filters") || undefined,
+    };
+    const { events, total, totalPages, isLoading } = useEvents(params, {
+        initialData,
+    });
+    const currentPage = table.getNumber("page", 1);
+    return (_jsx(Div, { className: "min-h-screen", children: _jsx(SlottedListingView, { portal: "public", manageSearch: true, manageSort: true, inlineToolbar: true, renderSearch: (search, setSearch) => (_jsx(Input, { value: search, onChange: (e) => setSearch(e.target.value), placeholder: "Search events...", className: "max-w-sm" })), renderSort: (value, onChange) => (_jsx(SortDropdown, { value: value, onChange: onChange, options: EVENT_PUBLIC_SORT_OPTIONS })), renderFilters: () => (_jsx(EventFilters, { table: table, variant: "public" })), renderTable: () => events.length === 0 && !isLoading ? (_jsx(Stack, { align: "center", gap: "3", className: "justify-center py-24 text-center", children: _jsx(Text, { className: "text-xl font-medium text-zinc-900 dark:text-zinc-50", children: "No events found" }) })) : (_jsx(Div, { className: "grid gap-6 sm:grid-cols-2 lg:grid-cols-3", children: events.map((event) => (_jsx(EventCard, { event: event }, event.id))) })), renderPagination: () => totalPages > 1 ? (_jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) })) : null, total: total, isLoading: isLoading }) }));
+}

package/dist/features/events/components/EventsListPageView.d.ts

@@ -0,0 +1 @@
+export declare function EventsListPageView(): Promise<import("react/jsx-runtime").JSX.Element>;

package/dist/features/events/components/EventsListPageView.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { eventRepository } from "../../../repositories";
+import { AdSlot } from "../../homepage/components/AdSlot";
+import { Container, Heading, Main, Section } from "../../../ui";
+import { EventsIndexListing } from "./EventsIndexListing";
+export async function EventsListPageView() {
+    const result = await eventRepository
+        .list({
+        filters: "status==published",
+        sorts: "startsAt",
+        page: 1,
+        pageSize: 24,
+    })
+        .catch(() => null);
+    return (_jsx(Main, { children: _jsx(Section, { className: "py-10", children: _jsxs(Container, { size: "xl", children: [_jsx(Heading, { level: 1, className: "mb-8 text-3xl font-semibold text-zinc-900 dark:text-zinc-50", children: "Events" }), _jsx(AdSlot, { id: "listing-sidebar-top", className: "mb-6" }), _jsx(EventsIndexListing, { initialData: result }), _jsx(AdSlot, { id: "listing-sidebar-bottom", className: "mt-8" })] }) }) }));
+}

package/dist/features/events/components/index.d.ts

@@ -3,6 +3,8 @@ export { EventFilters, EVENT_SORT_OPTIONS, EVENT_FILTER_KEYS, EVENT_ADMIN_SORT_O
 export type { EventFiltersProps, EventFilterVariant } from "./EventFilters";
 export { EventCard } from "./EventCard";
 export { EventsListView } from "./EventsListView";
+export { EventsIndexListing } from "./EventsIndexListing";
+export type { EventsIndexListingProps } from "./EventsIndexListing";
 export { EventDetailView } from "./EventDetailView";
 export type { EventDetailViewProps } from "./EventDetailView";
 export { EventParticipateView } from "./EventParticipateView";

package/dist/features/events/components/index.js

@@ -2,6 +2,7 @@ export { EventStatusBadge } from "./EventStatusBadge";
 export { EventFilters, EVENT_SORT_OPTIONS, EVENT_FILTER_KEYS, EVENT_ADMIN_SORT_OPTIONS, EVENT_SELLER_SORT_OPTIONS, EVENT_PUBLIC_SORT_OPTIONS, getEventFilterKeys, getEventSortOptions, } from "./EventFilters";
 export { EventCard } from "./EventCard";
 export { EventsListView } from "./EventsListView";
+export { EventsIndexListing } from "./EventsIndexListing";
 export { EventDetailView } from "./EventDetailView";
 export { EventParticipateView } from "./EventParticipateView";
 export { EventLeaderboard } from "./EventLeaderboard";

package/dist/features/events/hooks/useBulkEvent.js

@@ -1,4 +1,3 @@
-"use client";
 import { RealtimeEventType, useRealtimeEvent, } from "../../../react";
 const BULK_EVENT_TIMEOUT_MS = 10 * 60 * 1000;
 function extractBulkResult(raw) {

package/dist/features/events/hooks/useEvent.js

@@ -1,4 +1,3 @@
-"use client";
 import { useQuery } from "@tanstack/react-query";
 import { apiClient } from "../../../http";
 import { EVENT_ENDPOINTS } from "../../../constants/api-endpoints";

package/dist/features/events/hooks/useEvents.js

@@ -1,4 +1,3 @@
-"use client";
 import { useQuery } from "@tanstack/react-query";
 import { apiClient } from "../../../http";
 import { EVENT_ENDPOINTS } from "../../../constants/api-endpoints";