fix(trainee dashboard) remove performance details field (#436)

Author: shebz2023

src/components/Sidebar.tsx

@@ -18,7 +18,7 @@ import {
   MoonIcon,
   MailIcon,
 } from '@heroicons/react/solid';
-import { FaEnvelopeOpenText } from "react-icons/fa6";
+import { FaEnvelopeOpenText } from 'react-icons/fa6';
 import {
   AcademicCapIcon,
   BookOpenIcon,
@@ -37,8 +37,9 @@ function Sidebar({ style, toggle }: { style: string; toggle: () => void }) {
   const { logout } = useContext(UserContext);
   return (
     <div
-      className={`${showNav ? 'block' : 'hidden'
-        } lg:block page-sideNav fixed lg:static top-16 bottom-0 font-serif`}
+      className={`${
+        showNav ? 'block' : 'hidden'
+      } lg:block page-sideNav fixed lg:static top-16 bottom-0 font-serif`}
     >
       <div
         className={`${style} overflow-auto flex-col h-[100%] pt-2 bg-indigo-100 dark:bg-dark-bg shadow-lg lg:shadow-none dark:shadow-border-dark`}
@@ -80,7 +81,7 @@ function Sidebar({ style, toggle }: { style: string; toggle: () => void }) {
               <UserGroupIcon className="w-5" />
             </SideNavLink>
           </CheckRole>
-          {/* INVITATION*/}
+          {/* INVITATION */}
           <CheckRole roles={['admin', 'coordinator']}>
             <SideNavLink onClick={toggle} to="/invitation" name="Invitation">
               <FaEnvelopeOpenText className="w-5" />
@@ -195,4 +196,4 @@ function Sidebar({ style, toggle }: { style: string; toggle: () => void }) {
   );
 }
 
-export default Sidebar;
+export default Sidebar;

src/components/TraineePerformance.tsx

@@ -5,7 +5,6 @@ import { toast } from 'react-toastify';
 import Pagination from './Pagination';
 import PerformanceData from '../dummyData/performance.json';
 import { TRAINEE_RATING } from '../Mutations/Ratings';
-import Button from './Buttons';
 import RemarksModal from '../pages/ratings/CoordinatorRemarks';
 import { UserContext } from '../hook/useAuth';
 import { rowsType } from '../pages/ratings/frame';
@@ -63,7 +62,7 @@ export const GET_RATINGS_DATA = gql`
 `;
 
 function TraineePerfomance() {
-  const [usedata, setUserdata] = React.useState([]);
+  const [usedata, setUserdata] = useState([]);
   const { data, loading, error } = useQuery(GET_RATINGS_DATA, {});
   const { user } = useContext(UserContext);
   const [row, setRow] = useState<rowsType>({
@@ -121,14 +120,11 @@ function TraineePerfomance() {
   useEffect(() => {
     getRatings({
       fetchPolicy: 'network-only',
-      onCompleted: /* istanbul ignore next */ (data) => {
-        /* istanbul ignore next */
+      onCompleted: (data) => {
         setRatings(data?.fetchRatingsTrainee);
-        /* istanbul ignore next */
         sessionStorage.removeItem('data');
       },
-      onError: /* istanbul ignore next */ (error) => {
-        /* istanbul ignore next */
+      onError: (error) => {
         toast.error(error?.message || 'Something went wrong');
       },
     });
@@ -152,6 +148,7 @@ function TraineePerfomance() {
   const closeFeeds = () => {
     setToggle(false);
   };
+
   if (loading) {
     return (
       <>
@@ -171,6 +168,7 @@ function TraineePerfomance() {
       </>
     );
   }
+
   if (ratings?.length === 0) {
     return (
       <>
@@ -240,14 +238,10 @@ function TraineePerfomance() {
                         <th className="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 dark:bg-neutral-600 text-center text-xs font-semibold text-gray-600 dark:text-white uppercase tracking-wider">
                           {t('Average')}
                         </th>
-                        <th className="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 dark:bg-neutral-600 text-center text-xs font-semibold text-gray-600 dark:text-white uppercase tracking-wider">
-                          {t('Actions')}
-                        </th>
                       </tr>
-                      {ratings?.slice(firstContentIndex, lastContentIndex).map(
-                        /* istanbul ignore next */
-                        (item: any) => (
-                          /* istanbul ignore next */
+                      {ratings
+                        ?.slice(firstContentIndex, lastContentIndex)
+                        .map((item: any) => (
                           <tr key={item.sprint}>
                             <td className="px-5 py-5 border-b border-gray-200 bg-white dark:bg-dark-bg text-sm">
                               <div className="flex justify-center items-center">
@@ -280,29 +274,13 @@ function TraineePerfomance() {
                             </td>
                             <td className="px-5 py-5 border-b border-gray-200 bg-white dark:bg-dark-bg text-sm">
                               <p className="text-gray-900  dark:text-white whitespace-no-wrap text-center">
-                                {item.average % 1 === 0 ? item.average : Number(item.average).toFixed(2)}
+                                {item.average % 1 === 0
+                                  ? item.average
+                                  : Number(item.average).toFixed(2)}
                               </p>
                             </td>
-
-                            <td className="px-0 py-5 border-b border-gray-200 bg-white dark:bg-dark-bg text-sm">
-                              <Button
-                                variant="primary"
-                                size="sm"
-                                style="px-4 py-1 text-sm"
-                                onClick={
-                                  /* istanbul ignore next */
-                                  () => {
-                                    /* istanbul ignore next */
-                                    openFeed(item);
-                                  }
-                                }
-                              >
-                                {t('Details')}
-                              </Button>
-                            </td>
                           </tr>
-                        ),
-                      )}
+                        ))}
                     </tbody>
                   </table>
                 </div>
@@ -314,50 +292,52 @@ function TraineePerfomance() {
               onClick={prevPage}
               data-testid="prev"
               type="button"
-              className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${page === 1 && 'disabled'
-                }`}
+              className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${
+                page === 1 && 'disabled'
+              }`}
             >
               &larr;
             </button>
             <button
               onClick={() => setPage(1)}
               data-testid="page1"
               type="button"
-              className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${page === 1 && 'disabled'
-                }`}
+              className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${
+                page === 1 && 'disabled'
+              }`}
             >
               1
             </button>
-            {/* @ts-ignore */}
-            {gaps.paginationGroup.map(
-              /* istanbul ignore next */(el) => (
-                <button
-                  onClick={/* istanbul ignore next */ () => setPage(el)}
-                  data-testid="page"
-                  key={el}
-                  type="button"
-                  className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${page === el ? 'active' : ''
-                    }`}
-                >
-                  {el}
-                </button>
-              ),
-            )}
+            {gaps.paginationGroup.map((el) => (
+              <button
+                onClick={() => setPage(el)}
+                data-testid="page"
+                key={el}
+                type="button"
+                className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${
+                  page === el ? 'active' : ''
+                }`}
+              >
+                {el}
+              </button>
+            ))}
             <button
               onClick={() => setPage(totalPages)}
               data-testid="page3"
               type="button"
-              className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${page === totalPages && 'disabled'
-                }`}
+              className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${
+                page === totalPages && 'disabled'
+              }`}
             >
               {totalPages}
             </button>
             <button
               onClick={nextPage}
               data-testid="next"
               type="button"
-              className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${page === totalPages && 'disabled'
-                }`}
+              className={`page flex text-white h-12 w-12 items-center justify-center border-solid cursor-pointer bg-transparent ${
+                page === totalPages && 'disabled'
+              }`}
             >
               &rarr;
             </button>

src/containers/admin-dashBoard/tests/Sessions.test.tsx

@@ -1,7 +1,7 @@
 import '@testing-library/jest-dom';
 import React from 'react';
 import { render, screen, fireEvent, waitFor } from '@testing-library/react';
-import '@testing-library/jest-dom';
+
 import { MockedProvider } from '@apollo/client/testing';
 import { act } from 'react-dom/test-utils';
 import AdminSission from '../Sessions';
@@ -123,12 +123,12 @@ describe('AdminSission Component', () => {
     await waitFor(async () => {
       fireEvent.click(screen.getAllByTestId('deleteIcon')[0]);
       expect(screen.getByTestId('delete-section')).toBeInTheDocument();
-      expect(screen.getByTestId('delete-section')).toHaveClass("block");
+      expect(screen.getByTestId('delete-section')).toHaveClass('block');
 
       fireEvent.click(screen.getByTestId('delete'));
-      await waitFor(()=>{
-        expect(screen.queryByTestId('delete-section')).toHaveClass("hidden");
-      })
+      await waitFor(() => {
+        expect(screen.queryByTestId('delete-section')).toHaveClass('hidden');
+      });
     });
   });
 
@@ -163,7 +163,7 @@ describe('AdminSission Component', () => {
       </MockedProvider>,
     );
 
-    await waitFor(async() => {
+    await waitFor(async () => {
       fireEvent.click(screen.getAllByTestId('updateIcon')[0]);
       expect(screen.getByTestId('update-section')).toBeInTheDocument();
 
@@ -176,9 +176,9 @@ describe('AdminSission Component', () => {
       });
 
       fireEvent.click(screen.getByTestId('save'));
-      await waitFor(()=>{
+      await waitFor(() => {
         expect(screen.queryByText('update-section')).toBeNull();
-      })
+      });
     });
   });
 });

src/pages/tests/About.test.tsx

@@ -1,22 +1,20 @@
-import React from "react";
-import { MemoryRouter } from "react-router-dom";
-import renderer from "react-test-renderer"
-import "@testing-library/jest-dom"
-import { About } from '../About'
-import { MockedProvider as ApolloProvider } from "@apollo/client/testing";
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import renderer from 'react-test-renderer';
+import '@testing-library/jest-dom';
+import { MockedProvider as ApolloProvider } from '@apollo/client/testing';
+import { About } from '../About';
 
-describe('About page',()=>{
+describe('About page', () => {
+  it('renders the about page', () => {
+    const elem = renderer.create(
+      <MemoryRouter>
+        <ApolloProvider>
+          <About />
+        </ApolloProvider>
+      </MemoryRouter>,
+    );
 
-    it('renders the about page',()=>{
-        const elem = renderer.create(
-            <MemoryRouter>
-                <ApolloProvider>
-                    <About/>
-                </ApolloProvider>
-            </MemoryRouter>
-        )
-
-        expect(elem.toJSON()).toMatchSnapshot()
-    })
-
-})
+    expect(elem.toJSON()).toMatchSnapshot();
+  });
+});

src/tests/about.test.tsx

@@ -2,20 +2,18 @@ import React from 'react';
 import { render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { MemoryRouter } from 'react-router-dom';
-import { About } from '../pages/About';
 import { I18nextProvider } from 'react-i18next';
+import { About } from '../pages/About';
 
 // Mock i18next
 jest.mock('react-i18next', () => ({
   // this mock makes sure any components using the translate hook can use it without a warning being shown
-  useTranslation: () => {
-    return {
-      t: (str: string) => str,
-      i18n: {
-        changeLanguage: () => new Promise(() => {}),
-      },
-    };
-  },
+  useTranslation: () => ({
+    t: (str: string) => str,
+    i18n: {
+      changeLanguage: () => new Promise(() => {}),
+    },
+  }),
   initReactI18next: {
     type: '3rdParty',
     init: () => {},
@@ -48,13 +46,12 @@ jest.mock('../assets/person2.png', () => 'mock-person2-image');
 jest.mock('../assets/ur.png', () => 'mock-ur-image');
 
 describe('About Component', () => {
-  const renderComponent = () => {
-    return render(
+  const renderComponent = () =>
+    render(
       <MemoryRouter>
         <About />
-      </MemoryRouter>
+      </MemoryRouter>,
     );
-  };
 
   it('renders the main heading', () => {
     renderComponent();
@@ -89,6 +86,8 @@ describe('About Component', () => {
 
   it('renders the final heading', () => {
     renderComponent();
-    expect(screen.getByText('Come shape the future together')).toBeInTheDocument();
+    expect(
+      screen.getByText('Come shape the future together'),
+    ).toBeInTheDocument();
   });
-});
+});