From 6be4dd253be5835cc61b73c03e5041a99fc4e82f Mon Sep 17 00:00:00 2001 From: SahilDahekar Date: Tue, 12 Nov 2024 23:14:00 +0530 Subject: [PATCH 1/3] Added CommunityEvents component in extract state from events page --- components/CommunityEvents.tsx | 45 ++++++++++++++++++++++++++++++++++ 1 file changed, 45 insertions(+) create mode 100644 components/CommunityEvents.tsx diff --git a/components/CommunityEvents.tsx b/components/CommunityEvents.tsx new file mode 100644 index 000000000000..5f6483f27ea7 --- /dev/null +++ b/components/CommunityEvents.tsx @@ -0,0 +1,45 @@ +import React, { useState } from 'react'; +import EventFilter from '@/components/navigation/EventFilter'; +import EventPostItem from '@/components/navigation/EventPostItem'; +import type { Event } from '@/types/pages/community/Community'; +import { HeadingLevel, HeadingTypeStyle } from '@/types/typography/Heading'; +import { ParagraphTypeStyle } from '@/types/typography/Paragraph'; +import Heading from '@/components/typography/Heading'; +import Paragraph from '@/components/typography/Paragraph'; +import meetings from '@/config/meetings.json'; +import { getEvents } from '@/utils/staticHelpers'; + + +const CommunityEvents = () => { + const [events, setEvents] = useState(getEvents(meetings)); + + return ( +
+
+ + All Events + +
+ +
+
+
+ {!events || events.length === 0 ? ( +
+ + No Events. Check back later! + +
+ ) : ( +
    + {events.map((event: Event, index: number) => { + return ; + })} +
+ )} +
+
+ ) +} + +export default CommunityEvents; \ No newline at end of file From 31e4b96e4cc05e844493b07d2fe6dfb515492440 Mon Sep 17 00:00:00 2001 From: SahilDahekar Date: Tue, 12 Nov 2024 23:15:55 +0530 Subject: [PATCH 2/3] Fixed rendering issue on NewsletterSubscribe & few button component on community/tsc , community/events , community pages --- pages/community/events/index.tsx | 39 ++++++-------------------------- pages/community/index.tsx | 5 ++++ pages/community/tsc.tsx | 21 +++++++++-------- utils/getStatic.ts | 2 +- 4 files changed, 24 insertions(+), 43 deletions(-) diff --git a/pages/community/events/index.tsx b/pages/community/events/index.tsx index 8e2e966ca668..517d29b54ba1 100644 --- a/pages/community/events/index.tsx +++ b/pages/community/events/index.tsx @@ -1,8 +1,6 @@ /* eslint-disable react/no-unescaped-entities */ import { ArrowRightIcon } from '@heroicons/react/outline'; -import React, { useState } from 'react'; -import type { Event } from '@/types/pages/community/Community'; import { HeadingLevel, HeadingTypeStyle } from '@/types/typography/Heading'; import { ParagraphTypeStyle } from '@/types/typography/Paragraph'; @@ -10,21 +8,22 @@ import GoogleCalendarButton from '../../../components/buttons/GoogleCalendarButt import ICSFileButton from '../../../components/buttons/ICSFileButton'; import GenericLayout from '../../../components/layout/GenericLayout'; import Meeting from '../../../components/Meeting'; -import EventFilter from '../../../components/navigation/EventFilter'; -import EventPostItem from '../../../components/navigation/EventPostItem'; import NewsletterSubscribe from '../../../components/NewsletterSubscribe'; import Heading from '../../../components/typography/Heading'; import Paragraph from '../../../components/typography/Paragraph'; import TextLink from '../../../components/typography/TextLink'; -import meetings from '../../../config/meetings.json'; -import { getEvents } from '../../../utils/staticHelpers'; +import CommunityEvents from '@/components/CommunityEvents'; + +import { makeStaticProps } from '@/utils/getStatic'; +const getStaticProps = makeStaticProps(['landing-page', 'footer', 'common']); + +export { getStaticProps }; /** * @description This is the events page which displays all the events and meetings. */ export default function EventIndex() { const image = '/img/social/community-events.webp'; - const [events, setEvents] = useState(getEvents(meetings)); return ( @@ -89,31 +88,7 @@ export default function EventIndex() { -
-
- - All Events - -
- -
-
-
- {!events || events.length === 0 ? ( -
- - No Events. Check back later! - -
- ) : ( -
    - {events.map((event: Event, index: number) => { - return ; - })} -
- )} -
-
+
diff --git a/pages/community/index.tsx b/pages/community/index.tsx index e8a68b23528f..4f918d213c7b 100644 --- a/pages/community/index.tsx +++ b/pages/community/index.tsx @@ -13,6 +13,11 @@ import NewsletterSubscribe from '../../components/NewsletterSubscribe'; import Heading from '../../components/typography/Heading'; import eventsData from '../../config/meetings.json'; import { getEvents } from '../../utils/staticHelpers'; +import { makeStaticProps } from '@/utils/getStatic'; + +const getStaticProps = makeStaticProps(['common']); + +export { getStaticProps }; interface Event { title: string; diff --git a/pages/community/tsc.tsx b/pages/community/tsc.tsx index 755652736f1b..b658d7676cda 100644 --- a/pages/community/tsc.tsx +++ b/pages/community/tsc.tsx @@ -1,5 +1,4 @@ import { sortBy } from 'lodash'; -import React, { useState } from 'react'; import type { Tsc } from '@/types/pages/community/Community'; @@ -10,6 +9,11 @@ import GenericLayout from '../../components/layout/GenericLayout'; import NewsletterSubscribe from '../../components/NewsletterSubscribe'; import TextLink from '../../components/typography/TextLink'; import TSCMembersList from '../../config/MAINTAINERS.json'; +import { makeStaticProps } from '@/utils/getStatic'; + +const getStaticProps = makeStaticProps(['common']); + +export { getStaticProps }; interface SocialLinkProps { href: string; @@ -66,11 +70,10 @@ function addAdditionalUserInfo(user: Tsc) { * @returns The Twitter SVG component. */ function TwitterSVG() { - const [isHovered, setIsHovered] = useState(false); return ( -
setIsHovered(true)} onMouseLeave={() => setIsHovered(false)}> - +
+
); } @@ -81,11 +84,10 @@ function TwitterSVG() { * @returns The GitHub SVG component. */ function GitHubSVG() { - const [isHovered, setIsHovered] = useState(false); return ( -
setIsHovered(true)} onMouseLeave={() => setIsHovered(false)}> - +
+
); } @@ -96,12 +98,11 @@ function GitHubSVG() { * @returns The LinkedIn SVG component. */ function LinkedInSVG() { - const [isHovered, setIsHovered] = useState(false); return ( -
setIsHovered(true)} onMouseLeave={() => setIsHovered(false)}> +
{/* Use the imported SVG icon component */} - +
); } diff --git a/utils/getStatic.ts b/utils/getStatic.ts index 56af2cf6b1ca..2d30a29e7230 100644 --- a/utils/getStatic.ts +++ b/utils/getStatic.ts @@ -29,7 +29,7 @@ export const getStaticPaths = () => ({ * @returns An object containing the internationalization props. */ export async function getI18nProps(ctx: any, ns = ['common']) { - const locale = ctx?.params?.lang; + const locale = ctx?.params?.lang ? ctx?.params?.lang : 'en'; const props = { ...(await serverSideTranslations(locale, ns)) }; From d5c9d59c6de5f6df0008cb164c3f8dcd47350ba3 Mon Sep 17 00:00:00 2001 From: SahilDahekar Date: Tue, 12 Nov 2024 23:35:45 +0530 Subject: [PATCH 3/3] Fixed linting errors --- components/CommunityEvents.tsx | 66 ++++++++++++++++---------------- pages/community/events/index.tsx | 4 +- pages/community/index.tsx | 2 +- pages/community/tsc.tsx | 5 +-- 4 files changed, 37 insertions(+), 40 deletions(-) diff --git a/components/CommunityEvents.tsx b/components/CommunityEvents.tsx index 5f6483f27ea7..868360265b21 100644 --- a/components/CommunityEvents.tsx +++ b/components/CommunityEvents.tsx @@ -1,45 +1,45 @@ import React, { useState } from 'react'; + import EventFilter from '@/components/navigation/EventFilter'; import EventPostItem from '@/components/navigation/EventPostItem'; -import type { Event } from '@/types/pages/community/Community'; -import { HeadingLevel, HeadingTypeStyle } from '@/types/typography/Heading'; -import { ParagraphTypeStyle } from '@/types/typography/Paragraph'; import Heading from '@/components/typography/Heading'; import Paragraph from '@/components/typography/Paragraph'; import meetings from '@/config/meetings.json'; +import type { Event } from '@/types/pages/community/Community'; +import { HeadingLevel, HeadingTypeStyle } from '@/types/typography/Heading'; +import { ParagraphTypeStyle } from '@/types/typography/Paragraph'; import { getEvents } from '@/utils/staticHelpers'; - const CommunityEvents = () => { - const [events, setEvents] = useState(getEvents(meetings)); + const [events, setEvents] = useState(getEvents(meetings)); - return ( -
-
- - All Events - -
- -
-
-
- {!events || events.length === 0 ? ( -
- - No Events. Check back later! - -
- ) : ( -
    - {events.map((event: Event, index: number) => { - return ; - })} -
- )} -
+ return ( +
+
+ + All Events + +
+
- ) -} +
+
+ {!events || events.length === 0 ? ( +
+ + No Events. Check back later! + +
+ ) : ( +
    + {events.map((event: Event, index: number) => { + return ; + })} +
+ )} +
+
+ ); +}; -export default CommunityEvents; \ No newline at end of file +export default CommunityEvents; diff --git a/pages/community/events/index.tsx b/pages/community/events/index.tsx index 517d29b54ba1..f0314cb69a6d 100644 --- a/pages/community/events/index.tsx +++ b/pages/community/events/index.tsx @@ -1,8 +1,10 @@ /* eslint-disable react/no-unescaped-entities */ import { ArrowRightIcon } from '@heroicons/react/outline'; +import CommunityEvents from '@/components/CommunityEvents'; import { HeadingLevel, HeadingTypeStyle } from '@/types/typography/Heading'; import { ParagraphTypeStyle } from '@/types/typography/Paragraph'; +import { makeStaticProps } from '@/utils/getStatic'; import GoogleCalendarButton from '../../../components/buttons/GoogleCalendarButton'; import ICSFileButton from '../../../components/buttons/ICSFileButton'; @@ -12,9 +14,7 @@ import NewsletterSubscribe from '../../../components/NewsletterSubscribe'; import Heading from '../../../components/typography/Heading'; import Paragraph from '../../../components/typography/Paragraph'; import TextLink from '../../../components/typography/TextLink'; -import CommunityEvents from '@/components/CommunityEvents'; -import { makeStaticProps } from '@/utils/getStatic'; const getStaticProps = makeStaticProps(['landing-page', 'footer', 'common']); export { getStaticProps }; diff --git a/pages/community/index.tsx b/pages/community/index.tsx index 4f918d213c7b..7b76b6407d36 100644 --- a/pages/community/index.tsx +++ b/pages/community/index.tsx @@ -3,6 +3,7 @@ import React from 'react'; import { CardType } from '@/types/components/community/CardPropsType'; import { HeadingLevel, HeadingTypeStyle } from '@/types/typography/Heading'; +import { makeStaticProps } from '@/utils/getStatic'; import Card from '../../components/community/Card'; import Header from '../../components/community/Header'; @@ -13,7 +14,6 @@ import NewsletterSubscribe from '../../components/NewsletterSubscribe'; import Heading from '../../components/typography/Heading'; import eventsData from '../../config/meetings.json'; import { getEvents } from '../../utils/staticHelpers'; -import { makeStaticProps } from '@/utils/getStatic'; const getStaticProps = makeStaticProps(['common']); diff --git a/pages/community/tsc.tsx b/pages/community/tsc.tsx index b658d7676cda..aef6af4c7995 100644 --- a/pages/community/tsc.tsx +++ b/pages/community/tsc.tsx @@ -1,6 +1,7 @@ import { sortBy } from 'lodash'; import type { Tsc } from '@/types/pages/community/Community'; +import { makeStaticProps } from '@/utils/getStatic'; import IconGithub from '../../components/icons/Github'; import IconLinkedIn from '../../components/icons/LinkedIn'; @@ -9,7 +10,6 @@ import GenericLayout from '../../components/layout/GenericLayout'; import NewsletterSubscribe from '../../components/NewsletterSubscribe'; import TextLink from '../../components/typography/TextLink'; import TSCMembersList from '../../config/MAINTAINERS.json'; -import { makeStaticProps } from '@/utils/getStatic'; const getStaticProps = makeStaticProps(['common']); @@ -70,7 +70,6 @@ function addAdditionalUserInfo(user: Tsc) { * @returns The Twitter SVG component. */ function TwitterSVG() { - return (
@@ -84,7 +83,6 @@ function TwitterSVG() { * @returns The GitHub SVG component. */ function GitHubSVG() { - return (
@@ -98,7 +96,6 @@ function GitHubSVG() { * @returns The LinkedIn SVG component. */ function LinkedInSVG() { - return (
{/* Use the imported SVG icon component */}