From 65c21a8326f6fa05ed1d997d24ef27e11ed8af0f Mon Sep 17 00:00:00 2001 From: Jamari McFarlane Date: Sat, 7 Oct 2023 05:37:22 -0500 Subject: [PATCH] removed unnecessary changes --- .../LatestPostsCard.module.css | 65 ----------------- .../LatestPostsCard/LatestPostsCard.test.tsx | 52 -------------- .../LatestPostsCard/LatestPostsCard.tsx | 47 ------------- .../UpcomingEventsCard.module.css | 62 ---------------- .../UpcomingEventsCard.test.tsx | 70 ------------------- .../UpcomingEventsCard/UpcomingEventsCard.tsx | 54 -------------- src/utils/convertToTimeAgo.test.ts | 27 ------- src/utils/convertToTimeAgo.ts | 22 ------ 8 files changed, 399 deletions(-) delete mode 100644 src/components/LatestPostsCard/LatestPostsCard.module.css delete mode 100644 src/components/LatestPostsCard/LatestPostsCard.test.tsx delete mode 100644 src/components/LatestPostsCard/LatestPostsCard.tsx delete mode 100644 src/components/UpcomingEventsCard/UpcomingEventsCard.module.css delete mode 100644 src/components/UpcomingEventsCard/UpcomingEventsCard.test.tsx delete mode 100644 src/components/UpcomingEventsCard/UpcomingEventsCard.tsx delete mode 100644 src/utils/convertToTimeAgo.test.ts delete mode 100644 src/utils/convertToTimeAgo.ts diff --git a/src/components/LatestPostsCard/LatestPostsCard.module.css b/src/components/LatestPostsCard/LatestPostsCard.module.css deleted file mode 100644 index 2f83b671a9..0000000000 --- a/src/components/LatestPostsCard/LatestPostsCard.module.css +++ /dev/null @@ -1,65 +0,0 @@ -.latestPostsContainer { - margin-top: 20px; - width: 40em; - height: 30vh; - background-color: #fff; - - border-radius: 4px; - padding: 16px; - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); -} - -.latestPostsHeader { - display: flex; - justify-content: space-between; - font-weight: bold; - width: 100%; - align-items: center; - padding: 5px; - border-radius: 2px; - margin-bottom: 30px; - background-color: #f9f5f5; -} - -.latestPostsTitle { - font-size: 16px; - color: #707070; - margin: 10px; -} - -.seeAllLink { - font-weight: bold; - margin-left: 10px; -} - -.postItem { - background-color: #fff; - margin: 10px; -} - -.postMeta { - display: grid; - grid-template-columns: 2fr 1fr 1fr; - grid-column-gap: 10px; -} - -.postTitle { - font-size: 16px; - font-weight: bolder; - color: rgb(18, 87, 148); -} - -.postTime { - font-size: 14px; - color: #666; -} - -.postAuthor { - font-size: 14px; - color: #333; -} - -.noEvents { - font-size: 30px; - color: grey; -} diff --git a/src/components/LatestPostsCard/LatestPostsCard.test.tsx b/src/components/LatestPostsCard/LatestPostsCard.test.tsx deleted file mode 100644 index 09c3212270..0000000000 --- a/src/components/LatestPostsCard/LatestPostsCard.test.tsx +++ /dev/null @@ -1,52 +0,0 @@ -import React from 'react'; -import { render } from '@testing-library/react'; -import LatestPosts from './LatestPostsCard'; -import LatestPostsCard from './LatestPostsCard'; -import { I18nextProvider } from 'react-i18next'; -import { MockedProvider } from '@apollo/react-testing'; -import i18nForTest from 'utils/i18nForTest'; - -const posts = [ - { - id: 1, - title: 'Post 1', - createdAt: '2023-09-20T10:00:00Z', - creator: { - firstName: 'John', - lastName: 'Doe', - }, - }, - { - id: 2, - title: 'Post 2', - createdAt: '2023-09-21T14:30:00Z', - creator: { - firstName: 'Jane', - lastName: 'Smith', - }, - }, -]; - -test('Should render LatestPosts when appropriate props are passed', () => { - const { getByText } = render( - - - - - - ); - - expect(getByText('Latest Posts')).toBeInTheDocument(); - - posts.forEach((post) => { - expect(getByText(post.title)).toBeInTheDocument(); - expect( - getByText(post.creator.firstName + ' ' + post.creator.lastName) - ).toBeInTheDocument(); - }); -}); - -test('Should render "No Posts Created" message when no posts are passed in', () => { - const { getByText } = render(); - expect(getByText('No Posts Created')).toBeInTheDocument(); -}); diff --git a/src/components/LatestPostsCard/LatestPostsCard.tsx b/src/components/LatestPostsCard/LatestPostsCard.tsx deleted file mode 100644 index 9c77abc6db..0000000000 --- a/src/components/LatestPostsCard/LatestPostsCard.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import React, { useEffect } from 'react'; -import styles from './LatestPostsCard.module.css'; -import { useTranslation } from 'react-i18next'; -import timeAgo from 'utils/convertToTimeAgo'; - -const LatestPostsCard = ({ posts, refetch }: any): JSX.Element => { - const currentUrl = window.location.href.split('=')[1]; - const { t } = useTranslation('translation', { - keyPrefix: 'latestPosts', - }); - - useEffect(() => { - refetch(); - }, []); - - return ( -
-
- {t('latestPostsTitle')} - - - {t('seeAllLink') + ' '} - - -
-
- {posts.length === 0 ? ( -

{t('noPostsCreated')}

- ) : ( - posts.map((post: any) => ( -
-
- {post.title} -
{timeAgo(post.createdAt)}
-
- {post.creator.firstName} {post.creator.lastName} -
-
-
- )) - )} -
-
- ); -}; - -export default LatestPostsCard; diff --git a/src/components/UpcomingEventsCard/UpcomingEventsCard.module.css b/src/components/UpcomingEventsCard/UpcomingEventsCard.module.css deleted file mode 100644 index 569eb885d3..0000000000 --- a/src/components/UpcomingEventsCard/UpcomingEventsCard.module.css +++ /dev/null @@ -1,62 +0,0 @@ -.eventCardContainer { - margin-top: 20px; - min-width: 40em; - height: 30vh; - background-color: #fff; - border-radius: 4px; - padding: 16px; - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); -} - -.eventDetails { - display: grid; - grid-template-columns: 1fr 1fr 1fr; - gap: 10px; -} - -.eventTitle { - font-size: 16px; -} - -.eventCardHeader { - display: flex; - justify-content: space-between; - font-weight: bold; - width: 100%; - align-items: center; - padding: 5px; - border-radius: 2px; - margin-bottom: 30px; - background-color: #f9f5f5; -} - -.eventCardTitle { - font-size: 16px; - color: #707070; - margin: 10px; -} - -.eventCardSeeAll { - font-size: 16px; - font-weight: bold; - margin-left: 10px; -} - -.eventCardBody { - display: grid; - gap: 10px; - padding-left: 10px; -} - -.eventDuration { - color: #707070; -} - -.noEvents { - font-size: 30px; - color: grey; -} - -.eventLocation { - color: #707070; -} diff --git a/src/components/UpcomingEventsCard/UpcomingEventsCard.test.tsx b/src/components/UpcomingEventsCard/UpcomingEventsCard.test.tsx deleted file mode 100644 index 72e70100ef..0000000000 --- a/src/components/UpcomingEventsCard/UpcomingEventsCard.test.tsx +++ /dev/null @@ -1,70 +0,0 @@ -import React from 'react'; -import { MockedProvider } from '@apollo/react-testing'; -import { act, render } from '@testing-library/react'; -import { I18nextProvider } from 'react-i18next'; -import i18nForTest from 'utils/i18nForTest'; -import UpcomingEventsCard from './UpcomingEventsCard'; - -async function wait(ms = 100): Promise { - await act(() => { - return new Promise((resolve) => { - setTimeout(resolve, ms); - }); - }); -} - -test('Should render UpcomingEvents when appropriate props are passed', () => { - const eventProps: any[] = [ - { - id: 1, - title: 'Event 1', - startDate: '2023-09-20', - endDate: '2023-09-22', - location: 'Location 1', - }, - { - id: 2, - title: 'Event 2', - startDate: '2023-10-05', - endDate: '2023-10-07', - location: 'Location 2', - }, - { - id: 3, - title: 'Event 3', - startDate: '2023-11-15', - endDate: '2023-11-18', - location: 'Location 3', - }, - ]; - - const { getByText } = render( - - - - - - ); - - eventProps.forEach((event) => { - expect(getByText(event.title)).toBeInTheDocument(); - expect( - getByText(`${event.startDate} | ${event.endDate}`) - ).toBeInTheDocument(); - expect(getByText(event.location)).toBeInTheDocument(); - }); -}); - -test('Should render no events when no events are passed in', async () => { - const eventProps: any[] = []; - - const { queryByText } = render( - - - - - - ); - await wait(); - expect(queryByText('No Upcoming Events')).toBeInTheDocument(); -}); diff --git a/src/components/UpcomingEventsCard/UpcomingEventsCard.tsx b/src/components/UpcomingEventsCard/UpcomingEventsCard.tsx deleted file mode 100644 index 83bdef440a..0000000000 --- a/src/components/UpcomingEventsCard/UpcomingEventsCard.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import React from 'react'; -import { useEffect } from 'react'; -import styles from './UpcomingEventsCard.module.css'; -import { ReactComponent as Marker } from '../../assets/svgs/icons/location.svg'; -import { useTranslation } from 'react-i18next'; - -const UpcomingEventsCard = ({ events, refetch }: any): JSX.Element => { - const { t } = useTranslation('translation', { - keyPrefix: 'latestEvents', - }); - - const currentUrl = window.location.href.split('=')[1]; - - useEffect(() => { - refetch(); - }, []); - - return ( -
-
- {t('eventCardTitle')} - - {t('eventCardSeeAll')} - -
-
- {events.length === 0 ? ( -

{t('noEvents')}

- ) : ( - events.map((event: any) => ( -
-
- - {event.title} - - - {event.startDate} | {event.endDate} - - - {event.location} - -
-
- )) - )} -
-
- ); -}; - -export default UpcomingEventsCard; diff --git a/src/utils/convertToTimeAgo.test.ts b/src/utils/convertToTimeAgo.test.ts deleted file mode 100644 index e3fd25e2eb..0000000000 --- a/src/utils/convertToTimeAgo.test.ts +++ /dev/null @@ -1,27 +0,0 @@ -import timeAgo from './convertToTimeAgo'; - -describe('timeAgo function', () => { - it('should return "30 seconds ago" for a timestamp 30 seconds in the past', () => { - expect(timeAgo(new Date(Date.now() - 30000).toISOString())).toBe( - '30 seconds ago' - ); - }); - - it('should return "1 minute ago" for a timestamp 1 minute in the past', () => { - expect(timeAgo(new Date(Date.now() - 60000).toISOString())).toBe( - '1 minute ago' - ); - }); - - it('should return "1 hour ago" for a timestamp 1 hour in the past', () => { - expect(timeAgo(new Date(Date.now() - 3600000).toISOString())).toBe( - '1 hour ago' - ); - }); - - it('should return "1 day ago" for a timestamp 1 day in the past', () => { - expect(timeAgo(new Date(Date.now() - 86400000).toISOString())).toBe( - '1 day ago' - ); - }); -}); diff --git a/src/utils/convertToTimeAgo.ts b/src/utils/convertToTimeAgo.ts deleted file mode 100644 index 959311c13a..0000000000 --- a/src/utils/convertToTimeAgo.ts +++ /dev/null @@ -1,22 +0,0 @@ -function timeAgo(timestamp: string): string { - const currentDate = new Date(); - const pastDate = new Date(timestamp); - - const timeDifference = currentDate.getTime() - pastDate.getTime(); - const seconds = Math.floor(timeDifference / 1000); - - if (seconds < 60) { - return `${seconds} seconds ago`; - } else if (seconds < 3600) { - const minutes = Math.floor(seconds / 60); - return `${minutes} minute${minutes > 1 ? 's' : ''} ago`; - } else if (seconds < 86400) { - const hours = Math.floor(seconds / 3600); - return `${hours} hour${hours > 1 ? 's' : ''} ago`; - } else { - const days = Math.floor(seconds / 86400); - return `${days} day${days > 1 ? 's' : ''} ago`; - } -} - -export default timeAgo;