Added tsdoc comments

src/components/EventManagement/EventAttendance/AttendedEventList.tsx

@@ -8,7 +8,11 @@ import DateIcon from 'assets/svgs/cardItemDate.svg?react';
 interface InterfaceEventsAttended {
   eventId: string;
 }
-
+/**
+ * Component to display a list of events attended by a member
+ * @param eventId - The ID of the event to display details for
+ * @returns A table row containing event details with a link to the event
+ */
 const AttendedEventList: React.FC<InterfaceEventsAttended> = ({ eventId }) => {
   const { orgId: currentOrg } = useParams();
   const { data, loading, error } = useQuery(EVENT_DETAILS, {

src/components/EventManagement/EventAttendance/EventAttendance.tsx

@@ -29,7 +29,11 @@ enum FilterPeriod {
   ThisYear = 'This Year',
   All = 'All',
 }
-
+/**
+ * Component to manage and display event attendance information
+ * Includes filtering and sorting functionality for attendees
+ * @returns JSX element containing the event attendance interface
+ */
 function EventAttendance(): JSX.Element {
   const { t } = useTranslation('translation', {
     keyPrefix: 'eventAttendance',

src/components/EventRegistrantsModal/AddOnSpotAttendee.tsx

@@ -11,7 +11,13 @@ import type {
 } from 'utils/interfaces';
 import { useTranslation } from 'react-i18next';
 import { errorHandler } from 'utils/errorHandler';
-
+/**
+ * Modal component for adding on-spot attendees to an event
+ * @param show - Boolean to control modal visibility
+ * @param handleClose - Function to handle modal close
+ * @param reloadMembers - Function to refresh member list after adding attendee
+ * @returns Modal component with form for adding new attendee
+ */
 const AddOnSpotAttendee: React.FC<InterfaceAddOnSpotAttendeeProps> = ({
   show,
   handleClose,

src/components/MemberDetail/EventsAttendedByMember.tsx

@@ -3,7 +3,11 @@ import { useQuery } from '@apollo/client';
 import { EVENT_DETAILS } from 'GraphQl/Queries/Queries';
 import EventAttendedCard from './EventsAttendedCardItem';
 import { Spinner } from 'react-bootstrap';
-
+/**
+ * Component to display events attended by a specific member
+ * @param eventsId - ID of the event to fetch and display details for
+ * @returns Event card component with event details
+ */
 interface InterfaceEventsAttendedByMember {
   eventsId: string;
 }

src/components/MemberDetail/EventsAttendedMemberModal.tsx

@@ -13,7 +13,14 @@ import { Modal } from 'react-bootstrap';
 import { useTranslation } from 'react-i18next';
 import styles from '../../screens/MemberDetail/MemberDetail.module.css';
 import { CustomTableCell } from './customTableCell';
-
+/**
+ * Modal component to display paginated list of events attended by a member
+ * @param eventsAttended - Array of events attended by the member
+ * @param setShow - Function to control modal visibility
+ * @param show - Boolean to control modal visibility
+ * @param eventsPerPage - Number of events to display per page
+ * @returns Modal component with paginated events list
+ */
 interface InterfaceEvent {
   _id: string;
   name: string;

src/components/MemberDetail/customTableCell.tsx

@@ -4,6 +4,11 @@ import { EVENT_DETAILS } from 'GraphQl/Queries/Queries';
 import React from 'react';
 import styles from '../../screens/MemberDetail/MemberDetail.module.css';
 import { Link } from 'react-router-dom';
+/**
+ * Custom table cell component to display event details
+ * @param eventId - ID of the event to fetch and display
+ * @returns TableRow component with event information
+ */
 
 export const CustomTableCell: React.FC<{ eventId: string }> = ({ eventId }) => {
   const { data, loading, error } = useQuery(EVENT_DETAILS, {

src/components/UserPortal/UserProfile/EventsAttendedByUser.tsx

@@ -2,7 +2,12 @@ import React from 'react';
 import { Card } from 'react-bootstrap';
 import styles from './common.module.css';
 import EventsAttendedByMember from 'components/MemberDetail/EventsAttendedByMember';
-
+/**
+ * Component to display events attended by a user in card format
+ * @param userDetails - User information including attended events
+ * @param t - Translation function
+ * @returns Card component containing list of attended events
+ */
 interface InterfaceUser {
   userDetails: {
     firstName: string;