Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Priyanshu471/ad-management/llms.txt

Use this file to discover all available pages before exploring further.

The User Management panel gives platform administrators a complete view of every registered account on the Ad Management System. Accessible at /admin/users, the page fetches all users from the database and separates them into two tables — one for Advertisers and one for Creators — based on each account’s role field. A <Spinner /> is shown while data is loading to prevent a flash of empty content.

Route

/admin/users

Data Fetching

When the Users page mounts, it calls fetchUsers("/api/users") from the useFetchCamp Zustand store. The store issues a GET request to /api/users, retrieves the full user list from MongoDB via User.find({}), and then filters the results into two arrays before writing them into state:
// useFetchCamp store — fetchUsers
const usersData = await res.json().then((data) => data.users);
const advertisersData = usersData.filter(
  (user: any) => user.role === "advertiser"
);
const creatorsData = usersData.filter(
  (user: any) => user.role === "creator"
);
set({ creatorsData, advertisersData });
The Users page then passes advertisersData to one UsersTable instance and creatorsData to a second:
// app/admin/users/page.tsx
useEffect(() => {
  fetchUsers("/api/users");
}, [fetchUsers, isLoggedIn]);

Loading State

While fetchUsers is in flight, the store sets loading: true. The page renders a full-screen centered <Spinner /> in place of both tables until the store resolves:
if (loading) {
  return (
    <div className="grid h-screen place-items-center">
      <Spinner />
    </div>
  );
}

Table Columns

Both the Advertisers table and the Creators table share the same five-column structure, rendered by the UsersTable component:
ColumnSource
Nameuser.name from the API response
CampaignsMock numeric array — not aggregated from the database
Emailuser.email from the API response
Member SinceMock date strings — not derived from createdAt
ManageMoreHorizontal icon — no action wired up yet
The Campaigns and Member Since columns are populated from static arrays defined in the Users page component. They are not computed from live campaign or timestamp data in the current build.

Pagination

The UsersTable component paginates its data at five rows per page. Page state is managed locally with useState, and the visible slice is recomputed in a useEffect that runs whenever the current page or the source data changes:
const perPage = 5;
const totalPages = Math.ceil(tableData.length / perPage);
const [paginatedData, setPaginatedData] = useState(
  tableData.slice((page - 1) * perPage, page * perPage)
);
The Pagination component is rendered below each table and controls the page state.

API Response Format

The /api/users endpoint returns the full users collection from MongoDB:
{
  "users": [
    {
      "_id": "65f1a2b3c4d5e6f7a8b9c0d1",
      "name": "Jane Doe",
      "email": "jane@example.com",
      "role": "advertiser",
      "createdAt": "2024-01-15T10:30:00.000Z",
      "updatedAt": "2024-01-15T10:30:00.000Z"
    }
  ]
}
The role field on each document drives the advertiser/creator split in the Zustand store. Valid values defined in the user schema are "advertiser", "creator", and "admin".
The Campaigns and Member Since columns currently display mock data. Campaign counts are not yet aggregated from the campaigns collection, and Member Since dates are not derived from the createdAt timestamp returned by the API. The Manage column renders a MoreHorizontal icon but has no action connected to it in the current build.

Build docs developers (and LLMs) love