Refactor: added datagridwrapper in volunteer and fundcampaign screens

docs/docs/auto-docs/Requests/README-1.md

@@ -13,7 +13,7 @@ Requests.tsx
 ## Description
 
 This component renders a table displaying volunteer membership requests for a specific event.
-It allows administrators to search, sort, and manage these requests by accepting or rejecting them.
+It allows administrators to search, sort, filter, and manage these requests by accepting or rejecting them.
 
 ## Requires
 
@@ -37,10 +37,6 @@ react-router-dom
 
 ## Requires
 
-@mui/x-data-grid
-
-## Requires
-
 dayjs
 
 ## Requires
@@ -57,7 +53,7 @@ components/Avatar/Avatar
 
 ## Requires
 
-components/AdminSearchFilterBar/AdminSearchFilterBar
+shared-components/DataGridWrapper/DataGridWrapper
 
 ## Requires
 
@@ -77,7 +73,7 @@ utils/interfaces
 
 - Displays a loader while fetching data and handles errors gracefully.
 - Uses Apollo Client's `useQuery` to fetch data and `useMutation` to update membership status.
-- Uses AdminSearchFilterBar for unified search and filter interface with debouncing.
+- Uses DataGridWrapper for unified search, sort, and filter interface with debouncing.
 - Provides sorting by creation date (latest/earliest) and filtering by request type (all/individuals/groups).
 - Displays volunteer details with accessible avatar alt text, request type, request date, and action buttons.
 - All UI text is internationalized using i18n translation keys.

docs/docs/auto-docs/Requests/functions/default-1.md

@@ -6,7 +6,7 @@
 
 > **default**(): `Element`
 
-Defined in: [src/screens/EventVolunteers/Requests/Requests.tsx:62](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/EventVolunteers/Requests/Requests.tsx#L62)
+Defined in: [src/screens/EventVolunteers/Requests/Requests.tsx:59](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/EventVolunteers/Requests/Requests.tsx#L59)
 
 ## Returns
 

docs/docs/auto-docs/VolunteerGroups/functions/default.md

@@ -0,0 +1,13 @@
+[Admin Docs](/)
+
+***
+
+# Function: default()
+
+> **default**(): `Element`
+
+Defined in: [src/screens/EventVolunteers/VolunteerGroups/VolunteerGroups.tsx:64](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/EventVolunteers/VolunteerGroups/VolunteerGroups.tsx#L64)
+
+## Returns
+
+`Element`

docs/docs/auto-docs/Volunteers/functions/default.md

@@ -6,16 +6,18 @@
 
 > **default**(): `Element`
 
-Defined in: [src/screens/EventVolunteers/Volunteers/Volunteers.tsx:104](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/EventVolunteers/Volunteers/Volunteers.tsx#L104)
+Defined in: [src/screens/EventVolunteers/Volunteers/Volunteers.tsx:106](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/screens/EventVolunteers/Volunteers/Volunteers.tsx#L106)
 
 Renders the Event Volunteers screen.
 
 Responsibilities:
-- Displays volunteer listings with status chips
-- Supports search and filter via AdminSearchFilterBar
+- Displays volunteer listings with status chips (Accepted/Pending/Rejected)
+- Uses DataGridWrapper for integrated search, sort, and filter capabilities
+- Search by volunteer name with debouncing
+- Sort by hours volunteered (most/least)
+- Filter by status (All/Pending/Accepted/Rejected)
 - Shows volunteer avatars and hours volunteered
-- Handles add, view, and delete volunteer flows
-- Integrates with DataGrid for table display
+- Handles add, view, and delete volunteer flows via modals
 
 Localization:
 - Uses `common` and `eventVolunteers` namespaces

docs/docs/auto-docs/types/DataGridWrapper/interface/interfaces/InterfaceDataGridWrapperProps.md

@@ -4,6 +4,7 @@
 
 # Interface: InterfaceDataGridWrapperProps\<T\>
 
+Defined in: [src/types/DataGridWrapper/interface.ts:15](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L15)
 Defined in: [src/types/DataGridWrapper/interface.ts:15](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L15)
 
 Props for the DataGridWrapper component.
@@ -25,7 +26,7 @@ The type of the row data. Must extend `GridValidRowModel` (typically requires an
 
 > `optional` **actionColumn**: (`row`) => `ReactNode`
 
-Defined in: [src/types/DataGridWrapper/interface.ts:93](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L93)
+Defined in: [src/types/DataGridWrapper/interface.ts:133](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L133)
 
 A function to render custom content in the "Actions" column (appended to the right).
 
@@ -49,25 +50,31 @@ A ReactNode (e.g., buttons, menu) to display in the actions cell.
 
 > `optional` **columns**: `GridColDef`[]
 
+Defined in: [src/types/DataGridWrapper/interface.ts:28](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L28)
 Defined in: [src/types/DataGridWrapper/interface.ts:28](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L28)
 
 Configuration for the grid columns.
 Defines headers, widths, and cell rendering logic.
 
 ***
 
+### ~~emptyStateMessage?~~
 ### ~~emptyStateMessage?~~
 
 > `optional` **emptyStateMessage**: `string`
 
-Defined in: [src/types/DataGridWrapper/interface.ts:125](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L125)
+Defined in: [src/types/DataGridWrapper/interface.ts:165](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L165)
 
 Custom message to display when there are no rows and `loading` is false.
 
 #### Deprecated
 
 Use `emptyStateProps` instead for full customization.
 
+#### Deprecated
+
+Use `emptyStateProps` instead for full customization.
+
 #### Default
 
 ```ts
@@ -85,7 +92,7 @@ This property is maintained for backward compatibility.
 
 > `optional` **emptyStateProps**: [`InterfaceEmptyStateProps`](../../../shared-components/EmptyState/interface/interfaces/InterfaceEmptyStateProps.md)
 
-Defined in: [src/types/DataGridWrapper/interface.ts:115](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L115)
+Defined in: [src/types/DataGridWrapper/interface.ts:155](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L155)
 
 Full EmptyState component props for flexible empty state rendering.
 Takes precedence over `emptyStateMessage`.
@@ -113,16 +120,96 @@ emptyStateProps={{
 
 > `optional` **error**: `ReactNode`
 
-Defined in: [src/types/DataGridWrapper/interface.ts:130](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L130)
+Defined in: [src/types/DataGridWrapper/interface.ts:170](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L170)
 
 Error message or component to display instead of the grid when data fetch fails.
 
 ***
 
+### filterConfig?
+
+> `optional` **filterConfig**: `object`
+
+Defined in: [src/types/DataGridWrapper/interface.ts:98](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L98)
+
+Configuration for filtering options displayed in a dropdown.
+Enables client-side filtering with custom filter functions.
+
+#### defaultFilter?
+
+> `optional` **defaultFilter**: `string` \| `number`
+
+Default filter value to apply on component mount.
+
+#### filterFunction()?
+
+> `optional` **filterFunction**: (`rows`, `filterValue`) => readonly `T`[]
+
+Custom filter function to apply to rows based on selected filter value.
+
+##### Parameters
+
+###### rows
+
+readonly `T`[]
+
+###### filterValue
+
+`string` | `number`
+
+##### Returns
+
+readonly `T`[]
+
+#### filterOptions?
+
+> `optional` **filterOptions**: `object`[]
+
+Array of filter options for the filter dropdown.
+
+#### Example
+
+```ts
+filterConfig: {
+  filterOptions: [
+    { label: 'All', value: 'all' },
+    { label: 'Active', value: 'active' },
+    { label: 'Inactive', value: 'inactive' }
+  ],
+  filterFunction: (rows, filterValue) => {
+    if (filterValue === 'all') return rows;
+    return rows.filter(row => row.status === filterValue);
+  }
+}
+```
+
+***
+
+### headerButton?
+
+> `optional` **headerButton**: `ReactNode`
+
+Defined in: [src/types/DataGridWrapper/interface.ts:183](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L183)
+
+Optional custom button or element to display in the toolbar (typically for actions like "Create New").
+
+#### Example
+
+```tsx
+headerButton={
+  <Button onClick={handleCreate}>
+    Create New
+  </Button>
+}
+```
+
+***
+
 ### loading?
 
 > `optional` **loading**: `boolean`
 
+Defined in: [src/types/DataGridWrapper/interface.ts:34](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L34)
 Defined in: [src/types/DataGridWrapper/interface.ts:34](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L34)
 
 If `true`, displays a loading indicator (e.g., Progress Bar) overlaying the grid.
@@ -139,7 +226,7 @@ false
 
 > `optional` **onRowClick**: (`row`) => `void`
 
-Defined in: [src/types/DataGridWrapper/interface.ts:86](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L86)
+Defined in: [src/types/DataGridWrapper/interface.ts:126](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L126)
 
 Callback fired when a row is clicked.
 
@@ -161,7 +248,7 @@ The data object of the clicked row.
 
 > `optional` **paginationConfig**: `object`
 
-Defined in: [src/types/DataGridWrapper/interface.ts:73](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L73)
+Defined in: [src/types/DataGridWrapper/interface.ts:113](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L113)
 
 Configuration for pagination.
 
@@ -189,6 +276,7 @@ Available options for rows per page. default: [10, 25, 50, 100]
 
 > `optional` **rows**: readonly `T`[]
 
+Defined in: [src/types/DataGridWrapper/interface.ts:22](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L22)
 Defined in: [src/types/DataGridWrapper/interface.ts:22](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L22)
 
 The array of data rows to display in the grid.
@@ -200,6 +288,7 @@ Each row must include a unique `id` property (string or number).
 
 > `optional` **searchConfig**: `object`
 
+Defined in: [src/types/DataGridWrapper/interface.ts:48](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L48)
 Defined in: [src/types/DataGridWrapper/interface.ts:48](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L48)
 
 Configuration for client-side search functionality.
@@ -244,6 +333,7 @@ searchConfig: {
 
 > `optional` **sortConfig**: `object`
 
+Defined in: [src/types/DataGridWrapper/interface.ts:63](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L63)
 Defined in: [src/types/DataGridWrapper/interface.ts:63](https://github.com/PalisadoesFoundation/talawa-admin/blob/main/src/types/DataGridWrapper/interface.ts#L63)
 
 Configuration for sorting options displayed in a dropdown.
@@ -257,6 +347,28 @@ Note: This is separate from MUI DataGrid's native column header sorting.
 
 > `optional` **defaultSortOrder**: `"desc"` \| `"asc"`
 
+#### sortFunction()?
+
+> `optional` **sortFunction**: (`rows`, `sortValue`) => readonly `T`[]
+
+Custom sorting function to apply when a sort option is selected.
+If provided, this function will be used instead of MUI DataGrid's default sorting.
+The sort value is passed as a string in the format "field_direction" (e.g., "volunteers_asc").
+
+##### Parameters
+
+###### rows
+
+readonly `T`[]
+
+###### sortValue
+
+`string` | `number`
+
+##### Returns
+
+readonly `T`[]
+
 #### sortingOptions?
 
 > `optional` **sortingOptions**: `object`[]