Merge pull request #90 from Meta-Node/fro-317-fix-and-update-alerts-testing-implementations

fix: tests issue

Author: Bob-six

__tests__/components/alerts/InboundEvaluation.test.tsx

@@ -1,5 +1,5 @@
 import { AppDispatch, configureAppStore, RootState } from '@/store';
-import { updateInboundData } from '@/store/notifications/slice';
+import { updateInboundData } from '@/store/notifications';
 import {
   createSubjectCategory,
   generateEvaluationImpact,

__tests__/components/alerts/InboundLevelOrScoreChange.test.tsx

@@ -3,21 +3,15 @@ import {
   InboundProfile,
   NotificationType,
   updateInboundData,
-} from '@/store/notifications/slice';
+} from '@/store/notifications';
 import {
-  createSubjectCategory,
   findProfileCategory,
-  generateEvaluationImpact,
   generateRandomBrightIdConnectionBackup,
   mockedBrightIdProfileData,
   TEST_BRIGHT_ID,
   TEST_BRIGHT_PASSWORD,
 } from '../../utils/api/profile';
-import {
-  EvaluationCategory,
-  EvaluationValue,
-  PreferredView,
-} from '@/types/dashboard';
+import { EvaluationCategory, PreferredView } from '@/types/dashboard';
 import { setupServer } from 'msw/node';
 import { BrightIdBackupConnection } from '@/types';
 import { http, HttpResponse } from 'msw';

__tests__/components/alerts/InitialNotificationState.test.tsx

@@ -17,7 +17,7 @@ import {
   makeMockInboundInterceptor,
   makeMockOutboundInterceptor,
 } from '../../utils/api/server';
-import { triggerNotificationFetch } from '@/store/notifications/slice';
+import { triggerNotificationFetch } from '@/store/notifications';
 
 const createMockStore = (): EnhancedStore => {
   return configureAppStore().store;

__tests__/components/alerts/OutboundUserEvaluation.test.tsx

@@ -3,10 +3,9 @@ import {
   OutboundProfile,
   updateInboundData,
   updateOutboundData,
-} from '@/store/notifications/slice';
+} from '@/store/notifications';
 import {
   createSubjectCategory,
-  generateEvaluationImpact,
   generateRandomBrightId,
   generateRandomBrightIdConnectionBackup,
   TEST_BRIGHT_ID,
@@ -19,11 +18,7 @@ import {
 } from '@/types/dashboard';
 import { setupServer } from 'msw/node';
 import { BrightIdBackupConnection } from '@/types';
-import { http, HttpResponse } from 'msw';
-import {
-  makeMockInboundInterceptor,
-  makeMockOutboundInterceptor,
-} from '../../utils/api/server';
+import { makeMockOutboundInterceptor } from '../../utils/api/server';
 import { EnhancedStore } from '@reduxjs/toolkit';
 
 const createMockedData = () => {
@@ -59,7 +54,7 @@ const createMockedData = () => {
           evaluatorName: '',
           impact: -40000,
           modified: Date.now(),
-          score: -10000,
+          score: -40000,
           level: 2,
         },
       ],
@@ -114,7 +109,7 @@ outboundTrackedProfiles.set(`${customUser.id}-${EvaluationCategory.SUBJECT}`, {
   evaluators: {},
   id: customUser.id,
   lastUpdated: Date.now() - 5 * 60000,
-  level: 1,
+  level: -1,
   score: -40000,
 });
 
@@ -168,6 +163,7 @@ describe('outbound notification generations', () => {
     await updateOutboundData(getState, dispatch, TEST_BRIGHT_ID);
 
     const { outboundTrackedProfiles, alerts } = getState().alerts;
+    console.log(alerts);
 
     expect(alerts.length).toBe(1);
   });

__tests__/routes/home/Filters.test.tsx

@@ -36,6 +36,7 @@ connection1.auraEvaluations?.push({
   confidence: 4,
   evaluation: EvaluationValue.POSITIVE,
   modified: new Date().getTime() / 1000,
+  timestamp: new Date().getTime() / 1000,
 });
 
 const domains = connection1.verifications![0].domains!;
@@ -123,6 +124,7 @@ connection5.auraEvaluations?.push({
   confidence: 4,
   evaluation: EvaluationValue.NEGATIVE,
   modified: new Date().getTime() / 1000,
+  timestamp: new Date().getTime() / 1000 - -2000,
 });
 
 addPlayerRuleWithCategoryToConnection(

__tests__/setup.ts

@@ -1,11 +1,22 @@
 import '@testing-library/jest-dom';
 import 'vitest-canvas-mock';
-import { setGlobalOrigin } from 'undici';
+import { setGlobalOrigin, fetch, Headers, Request, Response } from 'undici';
 
 beforeEach(() => {
   setGlobalOrigin(window.location.href);
 });
 
+// @ts-ignore
+globalThis.fetch = fetch;
+// @ts-ignore
+globalThis.Headers = Headers;
+
+// @ts-ignore
+globalThis.Request = Request;
+
+// @ts-ignore
+globalThis.Response = Response;
+
 beforeAll(() => {
   window.PointerEvent = class PointerEvent extends Event {} as any;
   window.HTMLElement.prototype.scrollIntoView = vi.fn();

src/app/routes/_app.notifications/route.tsx

@@ -1,14 +1,12 @@
 import {
-  LucideBell,
   LucideTrendingUp,
   LucideTrendingDown,
   LucideArrowUp,
   LucideArrowDown,
   LucideUserCheck,
-  RefreshCcwIcon,
 } from 'lucide-react';
 import { Card } from '@/components/ui/card';
-import { Notification } from '@/store/notifications';
+import { NotificationObject } from '@/store/notifications';
 import { Button } from '@/components/ui/button';
 import { cn } from '@/lib/utils';
 import DefaultHeader from '@/components/Header/DefaultHeader';
@@ -24,22 +22,18 @@ import BrightIdProfilePicture from '@/components/BrightIdProfilePicture';
 import { Link } from 'react-router';
 import { Fragment } from 'react/jsx-runtime';
 import {
-  alertLoadingSelector,
   alertsSelector,
   markAllAsRead,
   markAsRead,
-  NotificationObject,
   NotificationType,
-} from '@/store/notifications/slice';
+} from '@/store/notifications';
 import { useStore } from 'react-redux';
 import { compactFormat } from '@/utils/number';
 import {
   getBgClassNameOfAuraRatingObject,
   getTextClassNameOfAuraRatingObject,
 } from '@/constants';
 import { useMemo } from 'react';
-import Tooltip from '@/components/Shared/Tooltip';
-import { ratingToText } from '@/constants/chart';
 
 // Define icons for evaluation categories
 export const subjectViewAsIconColored: {
@@ -63,37 +57,6 @@ const iconMap = {
   evaluation: <LucideUserCheck className="text-blue-500" />,
 };
 
-function getIcon(notification: Notification) {
-  if (
-    notification.changeType === 'level' ||
-    notification.changeType === 'score'
-  ) {
-    if (
-      typeof (notification as any).newValue === 'number' &&
-      typeof (notification as any).oldValue === 'number'
-    ) {
-      if (notification.changeType === 'level') {
-        return (notification as any).newValue > (notification as any).oldValue
-          ? iconMap.level.up
-          : iconMap.level.down;
-      }
-      if (notification.changeType === 'score') {
-        return (notification as any).newValue > (notification as any).oldValue
-          ? iconMap.score.up
-          : iconMap.score.down;
-      }
-    } else {
-      return notification.changeType === 'level'
-        ? iconMap.level.up
-        : iconMap.score.up;
-    }
-  }
-  if (notification.changeType === 'evaluation') {
-    return iconMap.evaluation;
-  }
-  return <LucideBell />;
-}
-
 export function parseTitleAndDescription(
   description: string,
   type: NotificationType,

src/components/Header/DefaultHeader.tsx

@@ -7,9 +7,8 @@ import { FC, PropsWithChildren, ReactNode } from 'react';
 import { useSelector } from 'react-redux';
 import { Link } from 'react-router';
 import { FaHome } from 'react-icons/fa';
-import { notificationsSelector } from '@/store/notifications';
 import { Badge } from '@/components/ui/badge';
-import { alertsSelector } from '@/store/notifications/slice';
+import { alertsSelector } from '@/store/notifications';
 
 export const HeaderBody: FC<
   PropsWithChildren & { title?: string; beforeTitle?: ReactNode }

src/components/Shared/Dropdown/index.tsx

@@ -49,9 +49,20 @@ export default function Dropdown<T extends DropdownItem>({
           <SelectItem
             data-testid={`dropdown-option-${item.value}`}
             key={item.value}
-            onMouseDown={() => {
-              onItemClick(item);
-              setIsDropdownOpen(false);
+            {...{
+              onMouseDown: process.env.VITEST
+                ? undefined
+                : () => {
+                    onItemClick(item);
+                    setIsDropdownOpen(false);
+                  },
+
+              onClick: process.env.VITEST
+                ? () => {
+                    onItemClick(item);
+                    setIsDropdownOpen(false);
+                  }
+                : undefined,
             }}
             value={item.value.toString()}
           >

src/components/notifications/notifications-checker.tsx

@@ -2,7 +2,7 @@ import {
   alertsLastFetchSelector,
   resetOnMountStates,
   triggerNotificationFetch,
-} from '@/store/notifications/slice';
+} from '@/store/notifications';
 import { selectAuthData } from '@/store/profile/selectors';
 import { useEffect } from 'react';
 import { useDispatch, useSelector, useStore } from 'react-redux';