eionet2-dashboard 3.2.0 → 3.2.2

package/tabs/src/components/activity/Activity.test.jsx

@@ -0,0 +1,218 @@
+jest.mock('react', () => {
+  const actual = jest.requireActual('react');
+  return {
+    ...actual,
+    React: actual,
+    useState: jest.fn(actual.useState),
+    useEffect: jest.fn((fn) => fn()),
+    useCallback: jest.fn((fn) => fn),
+  };
+});
+
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { Activity } from './Activity';
+import {
+  getConsultations,
+  getMeetings,
+  getPublications,
+  getObligations,
+} from '../../data/sharepointProvider';
+import { useAppInsightsContext } from '@microsoft/applicationinsights-react-js';
+
+jest.mock('./activity.scss', () => ({}));
+
+jest.mock('@mui/material', () => {
+  const ReactLocal = require('react');
+  const passthrough =
+    (Tag = 'div') =>
+    ({ children }) =>
+      ReactLocal.createElement(Tag, {}, children);
+
+  const ListItemButton = ({ children, onClick }) => {
+    onClick && onClick();
+    return <div>{children}</div>;
+  };
+
+  return {
+    Backdrop: passthrough(),
+    CircularProgress: passthrough('span'),
+    Box: passthrough(),
+    ListItem: passthrough(),
+    ListItemIcon: passthrough(),
+    ListItemText: ({ primary }) => <div>{primary}</div>,
+    ListItemButton,
+  };
+});
+
+jest.mock('@mui/icons-material/Loop', () => () => <span>loop-icon</span>);
+jest.mock('@mui/icons-material/FastForwardOutlined', () => () => <span>fast-forward-icon</span>);
+jest.mock('@mui/icons-material/HistoryOutlined', () => () => <span>history-icon</span>);
+jest.mock('@mui/icons-material/NextPlanOutlined', () => () => <span>next-plan-icon</span>);
+
+jest.mock('./ConsultationList', () => ({
+  ConsultationList: () => <div>consultation-list</div>,
+}));
+jest.mock('./EventList', () => ({
+  EventList: () => <div>event-list</div>,
+}));
+jest.mock('./PublicationList', () => ({
+  PublicatonList: () => <div>publication-list</div>,
+}));
+jest.mock('./ObligationList', () => ({
+  ObligationList: () => <div>obligation-list</div>,
+}));
+
+jest.mock('../CustomDrawer', () => ({
+  __esModule: true,
+  default: ({ drawerOptions }) => <div>{drawerOptions}</div>,
+}));
+
+jest.mock('../../data/sharepointProvider', () => ({
+  getConsultations: jest.fn(),
+  getMeetings: jest.fn(),
+  getPublications: jest.fn(),
+  getObligations: jest.fn(),
+}));
+
+jest.mock('@microsoft/applicationinsights-react-js', () => ({
+  useAppInsightsContext: jest.fn(),
+}));
+
+function mockStateSequence(values) {
+  let index = 0;
+  React.useState.mockImplementation((initialValue) => {
+    if (index < values.length) {
+      const current = values[index];
+      index += 1;
+      return [current, jest.fn()];
+    }
+    return [initialValue, jest.fn()];
+  });
+}
+
+function buildStates(tabsValue) {
+  return [
+    tabsValue,
+    [{ id: 'past' }],
+    [{ id: 'current' }],
+    [{ id: 'upcoming' }],
+    [{ id: 'open-consultation' }],
+    [{ id: 'review-consultation' }],
+    [{ id: 'final-consultation' }],
+    [{ id: 'future-consultation' }],
+    [{ id: 'open-survey' }],
+    [{ id: 'review-survey' }],
+    [{ id: 'final-survey' }],
+    [{ id: 'future-survey' }],
+    [{ id: 'future-publication' }],
+    [{ id: 'past-publication' }],
+    [{ id: 'upcoming-obligation' }],
+    [{ id: 'continuous-obligation' }],
+    false,
+  ];
+}
+
+describe('Activity', () => {
+  const trackEvent = jest.fn();
+  const closeDrawer = jest.fn();
+
+  const baseProps = {
+    userInfo: { country: 'RO', isEionetUser: true, isNFP: true },
+    country: 'RO',
+    configuration: { DashboardNumberOfMonthsData: 24, PublicationsType: 'Report;Article' },
+    setData4Menu: jest.fn(),
+    openRating: jest.fn(),
+    openApproval: jest.fn(),
+    drawerOpen: true,
+    closeDrawer,
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    React.useCallback.mockImplementation((fn) => fn);
+    React.useEffect.mockImplementation((fn) => fn());
+    React.useState.mockImplementation((initialValue) => [initialValue, jest.fn()]);
+
+    useAppInsightsContext.mockReturnValue({ trackEvent });
+
+    getMeetings.mockResolvedValue([{ IsCurrent: true }, { IsUpcoming: true }, { IsPast: true }]);
+    getConsultations.mockResolvedValue([]);
+    getPublications.mockResolvedValue([{ ItemType: 'Report', IsPast: false }]);
+    getObligations.mockResolvedValue([{ IsUpcoming: true, IsContinuous: false }]);
+  });
+
+  test('renders drawer sections and event tab by default', () => {
+    mockStateSequence(buildStates(0));
+
+    const html = renderToStaticMarkup(<Activity {...baseProps} />);
+
+    expect(html).toContain('EVENTS');
+    expect(html).toContain('CONSULTATIONS');
+    expect(html).toContain('ENQUIRIES');
+    expect(html).toContain('PUBLICATIONS &amp; OUTREACH');
+    expect(html).toContain('REPORTING OBLIGATIONS');
+    expect(html).toContain('event-list');
+    expect(closeDrawer).toHaveBeenCalled();
+    expect(trackEvent).toHaveBeenCalled();
+  });
+
+  test('renders consultations view for consultation tabs', () => {
+    mockStateSequence(buildStates(4));
+
+    const html = renderToStaticMarkup(<Activity {...baseProps} />);
+
+    expect(html).toContain('consultation-list');
+  });
+
+  test('renders surveys view for enquiries tabs', () => {
+    mockStateSequence(buildStates(8));
+
+    const html = renderToStaticMarkup(<Activity {...baseProps} />);
+
+    expect(html).toContain('consultation-list');
+  });
+
+  test('renders publications view', () => {
+    mockStateSequence(buildStates(11));
+
+    const html = renderToStaticMarkup(<Activity {...baseProps} />);
+
+    expect(html).toContain('publication-list');
+  });
+
+  test('renders obligations view', () => {
+    mockStateSequence(buildStates(13));
+
+    const html = renderToStaticMarkup(<Activity {...baseProps} />);
+
+    expect(html).toContain('obligation-list');
+  });
+
+  test('loads activity data in effect', async () => {
+    mockStateSequence(buildStates(0));
+
+    renderToStaticMarkup(<Activity {...baseProps} />);
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(getMeetings).toHaveBeenCalled();
+    expect(getConsultations).toHaveBeenCalled();
+    expect(getPublications).toHaveBeenCalled();
+    expect(getObligations).toHaveBeenCalled();
+    expect(baseProps.setData4Menu).toHaveBeenCalled();
+  });
+
+  test('handles meeting loading errors', async () => {
+    const logSpy = jest.spyOn(console, 'log').mockImplementation(() => {});
+    getMeetings.mockRejectedValue(new Error('boom'));
+    mockStateSequence(buildStates(0));
+
+    renderToStaticMarkup(<Activity {...baseProps} />);
+    await Promise.resolve();
+    await Promise.resolve();
+
+    expect(logSpy).toHaveBeenCalledWith('boom');
+    logSpy.mockRestore();
+  });
+});

package/tabs/src/components/activity/ConsultationList.test.jsx

@@ -0,0 +1,114 @@
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { ConsultationList } from './ConsultationList';
+
+let mockGridProps;
+
+jest.mock('../ResizableGrid', () => ({
+  __esModule: true,
+  default: (props) => {
+    mockGridProps = props;
+    return <div>grid-rows-{props.rows?.length || 0}</div>;
+  },
+}));
+
+jest.mock('./GroupsTags', () => ({
+  GroupsTags: ({ groups }) => <div>groups-{groups?.length || 0}</div>,
+}));
+
+describe('ConsultationList', () => {
+  beforeEach(() => {
+    mockGridProps = null;
+  });
+
+  test('renders future consultations grid for tab 0', () => {
+    const html = renderToStaticMarkup(
+      <ConsultationList
+        configuration={{ DateFormatDashboard: 'dd-MMM-yyyy' }}
+        openConsultations={[]}
+        reviewConsultations={[]}
+        finalisedConsultations={[]}
+        futureConsultations={[{ id: 1, Title: 'Future' }]}
+        type="Consultations"
+        country="RO"
+        tabsValue={0}
+      />,
+    );
+
+    expect(html).toContain('grid-rows-1');
+  });
+
+  test('renders open consultations grid for tab 1 and colors urgent values', () => {
+    const html = renderToStaticMarkup(
+      <ConsultationList
+        configuration={{ DateFormatDashboard: 'dd-MMM-yyyy' }}
+        openConsultations={[{ id: 1, Title: 'Open' }]}
+        reviewConsultations={[]}
+        finalisedConsultations={[]}
+        futureConsultations={[]}
+        type="Consultations"
+        country=""
+        tabsValue={1}
+      />,
+    );
+
+    expect(html).toContain('grid-rows-1');
+    const daysLeftColumn = mockGridProps.columns.find((column) => column.field === 'DaysLeft');
+    expect(daysLeftColumn.cellClassName({ value: 2 })).toBe('red-cell-text');
+    expect(daysLeftColumn.cellClassName({ value: 4 })).toBeUndefined();
+  });
+
+  test('renders review grid for tab 2', () => {
+    const html = renderToStaticMarkup(
+      <ConsultationList
+        configuration={{ DateFormatDashboard: 'dd-MMM-yyyy' }}
+        openConsultations={[]}
+        reviewConsultations={[{ id: 3, Title: 'Review', Startdate: new Date('2026-01-01') }]}
+        finalisedConsultations={[]}
+        futureConsultations={[]}
+        type="Consultations"
+        country="RO"
+        tabsValue={2}
+      />,
+    );
+
+    expect(html).toContain('grid-rows-1');
+    expect(mockGridProps.columns.some((column) => column.field === 'DaysFinalised')).toBe(true);
+  });
+
+  test('renders finalised grid for tab 3 and result/country cells', () => {
+    renderToStaticMarkup(
+      <ConsultationList
+        configuration={{
+          DateFormatDashboard: 'dd-MMM-yyyy',
+          ConsultationResultsTooltip: 'results',
+          CountryRespondedTooltip: 'responded',
+        }}
+        openConsultations={[]}
+        reviewConsultations={[]}
+        finalisedConsultations={[{ id: 4, Title: 'Final', Deadline: new Date('2026-02-01') }]}
+        futureConsultations={[]}
+        type="Consultations"
+        country=""
+        tabsValue={3}
+      />,
+    );
+
+    const resultsColumn = mockGridProps.columns.find((column) => column.field === 'Results');
+    const respondantsColumn = mockGridProps.columns.find(
+      (column) => column.field === 'HasUserCountryResponded',
+    );
+
+    const resultHtml = renderToStaticMarkup(
+      resultsColumn.renderCell({ row: { LinkToResults: 'https://example.org/results' } }),
+    );
+    const respondedHtml = renderToStaticMarkup(
+      respondantsColumn.renderCell({
+        row: { HasUserCountryResponded: false, Respondants: [{}, {}, {}] },
+      }),
+    );
+
+    expect(resultHtml).toContain('button');
+    expect(respondedHtml).toContain('3');
+  });
+});

package/tabs/src/components/activity/EventList.test.jsx

@@ -0,0 +1,164 @@
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { EventList } from './EventList';
+
+let mockGridProps;
+
+jest.mock('../ResizableGrid', () => ({
+  __esModule: true,
+  default: (props) => {
+    mockGridProps = props;
+    return <div>grid-rows-{props.rows?.length || 0}</div>;
+  },
+}));
+
+jest.mock('./GroupsTags', () => ({
+  GroupsTags: ({ groups }) => <div>groups-{groups?.length || 0}</div>,
+}));
+
+jest.mock('../event_registration/EventRegistration', () => ({
+  EventRegistration: () => <div>event-registration</div>,
+}));
+
+jest.mock('../event_registration/EventExternalRegistration', () => ({
+  EventExternalRegistration: () => <div>event-external-registration</div>,
+}));
+
+jest.mock('../EventDialogTitle', () => ({
+  EventDialogTitle: () => <div>event-dialog-title</div>,
+}));
+
+jest.mock('../../data/sharepointProvider', () => ({
+  getCurrentParticipant: jest.fn(),
+}));
+
+jest.mock('../../static/images/teams-icon.svg', () => ({
+  ReactComponent: () => <svg />,
+}));
+
+describe('EventList', () => {
+  beforeEach(() => {
+    mockGridProps = null;
+  });
+
+  test('renders upcoming meetings grid for tab 0', () => {
+    const html = renderToStaticMarkup(
+      <EventList
+        userInfo={{ country: 'RO', isEionetUser: true, isNFP: true }}
+        configuration={{
+          DateFormatDashboard: 'dd-MMM-yyyy',
+          RegisterEventButtonTooltip: 'register',
+          RegisterOthersButtonTooltip: 'register others',
+        }}
+        pastMeetings={[]}
+        currentMeetings={[]}
+        upcomingMeetings={[
+          {
+            id: 1,
+            Title: 'Upcoming meeting',
+            MeetingType: 'Physical',
+            NoOfRegistered: 2,
+            IsUpcoming: true,
+          },
+        ]}
+        tabsValue={0}
+        openRating={jest.fn()}
+        openApproval={jest.fn()}
+      />,
+    );
+
+    expect(html).toContain('grid-rows-1');
+    expect(mockGridProps.columns.some((column) => column.field === 'MeetingRegistrationLink')).toBe(
+      true,
+    );
+    expect(mockGridProps.columns.some((column) => column.field === 'Approval')).toBe(true);
+    expect(mockGridProps.columns.some((column) => column.field === 'id')).toBe(true);
+    expect(mockGridProps.columns.some((column) => column.field === 'NoOfRegistered')).toBe(true);
+
+    const registerColumn = mockGridProps.columns.find(
+      (column) => column.field === 'MeetingRegistrationLink',
+    );
+    const registerHtml = renderToStaticMarkup(
+      registerColumn.renderCell({ row: { MeetingType: 'physical', MeetingLink: '' } }),
+    );
+    expect(registerHtml).toContain('button');
+  });
+
+  test('renders current meetings grid for tab 1', () => {
+    const html = renderToStaticMarkup(
+      <EventList
+        userInfo={{ country: 'RO', isEionetUser: true, isNFP: true }}
+        configuration={{ DateFormatDashboard: 'dd-MMM-yyyy', JoinEventButtonTooltip: 'join' }}
+        pastMeetings={[]}
+        currentMeetings={[
+          {
+            id: 2,
+            Title: 'Current meeting',
+            MeetingType: 'Online',
+            MeetingLink: 'https://example.org/meeting',
+            NoOfRegistered: 3,
+            IsCurrent: true,
+            AllowVote: true,
+            HasVoted: true,
+            MeetingStart: new Date('2026-01-01'),
+          },
+        ]}
+        upcomingMeetings={[]}
+        tabsValue={1}
+        openRating={jest.fn()}
+        openApproval={jest.fn()}
+      />,
+    );
+
+    expect(html).toContain('grid-rows-1');
+    expect(mockGridProps.columns.some((column) => column.field === 'MeetingLink')).toBe(true);
+    expect(mockGridProps.columns.some((column) => column.field === 'AllowVote')).toBe(true);
+
+    const ratingColumn = mockGridProps.columns.find((column) => column.field === 'AllowVote');
+    const ratingHtml = renderToStaticMarkup(
+      ratingColumn.renderCell({ row: { AllowVote: true, HasVoted: true } }),
+    );
+    expect(ratingHtml).toContain('button');
+  });
+
+  test('renders past meetings grid for tab 2 with participants and no rating for missing country', () => {
+    const html = renderToStaticMarkup(
+      <EventList
+        userInfo={{ country: '', isEionetUser: false, isNFP: false }}
+        configuration={{
+          DateFormatDashboard: 'dd-MMM-yyyy',
+          NoOfParticipantsTooltip: 'participants',
+        }}
+        pastMeetings={[
+          {
+            id: 3,
+            Title: 'Past meeting',
+            IsPast: true,
+            NoOfParticipants: 0,
+            MeetingStart: new Date('2026-01-01'),
+            MeetingEnd: new Date('2026-01-02'),
+          },
+        ]}
+        currentMeetings={[]}
+        upcomingMeetings={[]}
+        tabsValue={2}
+        openRating={jest.fn()}
+        openApproval={jest.fn()}
+      />,
+    );
+
+    expect(html).toContain('grid-rows-1');
+    expect(mockGridProps.columns.some((column) => column.field === 'NoOfParticipants')).toBe(true);
+    expect(mockGridProps.columns.some((column) => column.field === 'AllowVote')).toBe(false);
+
+    const participantsColumn = mockGridProps.columns.find(
+      (column) => column.field === 'NoOfParticipants',
+    );
+    const participantsHtml = renderToStaticMarkup(
+      participantsColumn.renderCell({
+        row: { IsPast: true, NoOfParticipants: 0, ParticipantsUrl: '' },
+      }),
+    );
+    expect(participantsHtml).toContain('N/A');
+  });
+});

package/tabs/src/components/activity/GroupsTags.test.jsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { GroupsTags } from './GroupsTags';
+
+describe('GroupsTags', () => {
+  test('renders chips and dialog class when isDialog is true', () => {
+    const html = renderToStaticMarkup(
+      <GroupsTags groups={['A', 'B']} handleClick={jest.fn()} isDialog={true} />,
+    );
+
+    expect(html).toContain('groups-tags-dialog');
+    expect(html).toContain('A');
+    expect(html).toContain('B');
+  });
+
+  test('renders without dialog class when isDialog is false', () => {
+    const html = renderToStaticMarkup(
+      <GroupsTags groups={['A']} handleClick={jest.fn()} isDialog={false} />,
+    );
+
+    expect(html).not.toContain('groups-tags-dialog');
+  });
+});

package/tabs/src/components/activity/ObligationList.test.jsx

@@ -0,0 +1,46 @@
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { ObligationList } from './ObligationList';
+
+jest.mock('../ResizableGrid', () => ({
+  __esModule: true,
+  default: ({ rows }) => <div>grid-rows-{rows?.length || 0}</div>,
+}));
+
+jest.mock('../HtmlBox', () => ({
+  HtmlBox: ({ html }) => <div>{html}</div>,
+}));
+
+describe('ObligationList', () => {
+  test('renders intro text and upcoming obligations grid for tab 0', () => {
+    const html = renderToStaticMarkup(
+      <ObligationList
+        userInfo={{}}
+        configuration={{
+          DateFormatDashboard: 'dd-MMM-yyyy',
+          ReportingObligationsIntroText: 'Reporting intro',
+        }}
+        upcomingObligations={[{ id: 1, Title: 'Upcoming' }]}
+        continuousObligations={[]}
+        tabsValue={0}
+      />,
+    );
+
+    expect(html).toContain('Reporting intro');
+    expect(html).toContain('grid-rows-1');
+  });
+
+  test('renders continuous obligations grid for tab 1', () => {
+    const html = renderToStaticMarkup(
+      <ObligationList
+        userInfo={{}}
+        configuration={{ DateFormatDashboard: 'dd-MMM-yyyy' }}
+        upcomingObligations={[]}
+        continuousObligations={[{ id: 1, Title: 'Continuous' }]}
+        tabsValue={1}
+      />,
+    );
+
+    expect(html).toContain('grid-rows-1');
+  });
+});

package/tabs/src/components/activity/PublicationList.test.jsx

@@ -0,0 +1,46 @@
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { PublicatonList } from './PublicationList';
+
+jest.mock('../ResizableGrid', () => ({
+  __esModule: true,
+  default: ({ rows }) => <div>grid-rows-{rows?.length || 0}</div>,
+}));
+
+jest.mock('../HtmlBox', () => ({
+  HtmlBox: ({ html }) => <div>{html}</div>,
+}));
+
+describe('PublicationList', () => {
+  test('renders intro text and future publications grid for tab 0', () => {
+    const html = renderToStaticMarkup(
+      <PublicatonList
+        userInfo={{}}
+        configuration={{
+          DateFormatDashboard: 'dd-MMM-yyyy',
+          PublicationsIntroText: 'Intro text',
+        }}
+        futurePublications={[{ id: 1, Title: 'Future Publication' }]}
+        pastPublications={[]}
+        tabsValue={0}
+      />,
+    );
+
+    expect(html).toContain('Intro text');
+    expect(html).toContain('grid-rows-1');
+  });
+
+  test('renders past publications grid for tab 1', () => {
+    const html = renderToStaticMarkup(
+      <PublicatonList
+        userInfo={{}}
+        configuration={{ DateFormatDashboard: 'dd-MMM-yyyy' }}
+        futurePublications={[]}
+        pastPublications={[{ id: 1, Title: 'Past Publication' }]}
+        tabsValue={1}
+      />,
+    );
+
+    expect(html).toContain('grid-rows-1');
+  });
+});

package/tabs/src/components/activity/Reporting.test.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { Reporting } from './Reporting';
+
+describe('Reporting', () => {
+  test('renders under construction message', () => {
+    const html = renderToStaticMarkup(<Reporting />);
+
+    expect(html).toContain('Page under construction');
+  });
+});

package/tabs/src/components/event_rating/EventRating.test.jsx

@@ -0,0 +1,63 @@
+import React from 'react';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { EventRating } from './EventRating';
+
+jest.mock('@mui/material', () => {
+  const ReactLocal = require('react');
+  const passthrough =
+    (Tag = 'div') =>
+    ({ children }) =>
+      ReactLocal.createElement(Tag, {}, children);
+
+  const Rating = ({ value, getLabelText }) => (
+    <div>
+      <span>rating-value-{value}</span>
+      <span>{getLabelText ? getLabelText(value) : ''}</span>
+    </div>
+  );
+
+  return {
+    Box: passthrough(),
+    Button: ({ children }) => <button>{children}</button>,
+    CircularProgress: passthrough('span'),
+    Backdrop: passthrough(),
+    Rating,
+    Typography: passthrough('span'),
+  };
+});
+
+jest.mock('@mui/icons-material/Check', () => () => <span>check-icon</span>);
+jest.mock('@mui/icons-material/Save', () => () => <span>save-icon</span>);
+jest.mock('@mui/icons-material/Star', () => () => <span>star-icon</span>);
+
+jest.mock('../../data/sharepointProvider', () => ({
+  postRating: jest.fn(),
+}));
+
+describe('EventRating', () => {
+  test('renders modal text, rating caption and confirm button', () => {
+    const html = renderToStaticMarkup(
+      <EventRating
+        configuration={{ EventRatingModalText: 'Please rate this event' }}
+        participant={{ id: 1 }}
+        event={{ id: 2 }}
+        onRate={jest.fn()}
+      />,
+    );
+
+    expect(html).toContain('Please rate this event');
+    expect(html).toContain('rating-value-5');
+    expect(html).toContain('5 Stars, Excellent');
+    expect(html).toContain('Excellent');
+    expect(html).toContain('Confirm rating');
+  });
+
+  test('renders without optional modal text', () => {
+    const html = renderToStaticMarkup(
+      <EventRating configuration={{}} participant={{}} event={{}} onRate={jest.fn()} />,
+    );
+
+    expect(html).not.toContain('Please rate this event');
+    expect(html).toContain('Confirm rating');
+  });
+});