diff --git a/gatsby-browser.js b/gatsby-browser.js index 04e85ae..6e917ac 100644 --- a/gatsby-browser.js +++ b/gatsby-browser.js @@ -71,6 +71,6 @@ export const wrapPageElement = ({ element, props }) => ( export const wrapRootElement = ({ element }) => ( {element} - + ); diff --git a/gatsby-ssr.js b/gatsby-ssr.js index 608c0f5..1811dcf 100644 --- a/gatsby-ssr.js +++ b/gatsby-ssr.js @@ -70,6 +70,6 @@ export const wrapPageElement = ({ element, props }) => ( export const wrapRootElement = ({ element }) => ( {element} - + ); diff --git a/src/components/EventCard/Card.jsx b/src/components/EventCard/Card.jsx index c0c4d69..8ab9a21 100644 --- a/src/components/EventCard/Card.jsx +++ b/src/components/EventCard/Card.jsx @@ -23,7 +23,7 @@ const CardComponent = ({ title, club, venue, - // time, + time, date, month, // prizes, @@ -51,6 +51,8 @@ const CardComponent = ({ {date} {month} + {time} + {venue} @@ -77,10 +79,14 @@ const CardComponent = ({ {venue} - - {description} - - Contact: {contact.join(', ')} + + Contact: {contact?.join(', ')} diff --git a/src/components/EventCard/EventCard.jsx b/src/components/EventCard/EventCard.jsx deleted file mode 100644 index 69292bd..0000000 --- a/src/components/EventCard/EventCard.jsx +++ /dev/null @@ -1,42 +0,0 @@ -import React from 'react'; -import { - CardButtonContainer, - CardContainer, - CardImage, - CardTextContainer, - CardTitleContainer, - Circle, - EventClub, - EventName, - EventRegisterButton, - EventTimeVenue, - KnowButton, -} from './styles'; - -const FeaturedEventCard = () => ( - - - - - - 17 July - - LA - - - - Game Of Thrones - Knights Club - - - - - - - -); - -export default FeaturedEventCard; diff --git a/src/components/EventCard/styles.js b/src/components/EventCard/styles.js index bf16a5c..d571778 100644 --- a/src/components/EventCard/styles.js +++ b/src/components/EventCard/styles.js @@ -26,7 +26,7 @@ export const CardTitleContainer = styled.div` `; export const EventTimeVenue = styled(Body2)` - ${tw`mr-2`} + ${tw` flex items-center`} `; export const Circle = styled.div` diff --git a/src/components/Registration/RegistrationForm.jsx b/src/components/Registration/RegistrationForm.jsx index fd129c0..f728d6f 100644 --- a/src/components/Registration/RegistrationForm.jsx +++ b/src/components/Registration/RegistrationForm.jsx @@ -13,10 +13,7 @@ export const RegistrationForm = () => { const { inputData, setInputValue, isNITR, setErrorMessage, verified, setIsNITR } = useContext(RegistrationContext); - const { - token, - userData: { uid }, - } = useContext(AuthContext); + const { token, uid } = useContext(AuthContext); const api = Api.getInstance(); diff --git a/src/pages/events.js b/src/pages/events.js new file mode 100644 index 0000000..54639eb --- /dev/null +++ b/src/pages/events.js @@ -0,0 +1,15 @@ +import React from 'react'; +import useEvents from '../utils/useEvents'; + +const EventPage = () => { + const { events } = useEvents('Technical'); + console.log(events); + + return ( +
+

Events

+
+ ); +}; + +export default EventPage; diff --git a/src/pages/playground.js b/src/pages/playground.js index fa2cf29..47378b3 100644 --- a/src/pages/playground.js +++ b/src/pages/playground.js @@ -1,42 +1,34 @@ -/* eslint-disable max-len */ -/* eslint-disable jsx-a11y/click-events-have-key-events */ import React from 'react'; import { Helmet } from 'react-helmet'; import CardComponent from '../components/EventCard/Card'; +import useEvents from '../utils/useEvents'; -const cardData = { - title: 'Game Of Thrones', - club: 'Knights Club', - venue: 'LA', - time: '10:00 AM', - date: '17', - month: 'July', - prizes: 'Cash prizes and trophies', - description: - 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in rutrum metus. Pellentesque commodo ante neque, eu hendrerit lorem gravida et. Aliquam scelerisque...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus in rutrum metus. Pellentesque commodo ante neque, eu hendrerit lorem gravida et. Aliquam scelerisque...', - contact: ['Rashmi - 9848948949'], - poster: 'https://res.cloudinary.com/dw9odubkt/image/upload/v1695829352/Rectangle_1_wqmr3i.png', +const Playground = () => { + const { events } = useEvents('technical'); + + return ( + <> + + + Playground + + + + + ); }; -const Playground = () => ( - <> - - - Playground - - - - -); export default Playground; diff --git a/src/utils/Api.js b/src/utils/Api.js index 741ef40..83b5c05 100644 --- a/src/utils/Api.js +++ b/src/utils/Api.js @@ -27,7 +27,7 @@ class Api { async getEvents(event) { return this.avenueApi.get('/events', { - params: { type: event, orgID: '65133eb72c5708eb84bf53d6' }, + params: { type: event, orgID: process.env.GATSBY_ORG_ID }, }); } diff --git a/src/utils/Auth.jsx b/src/utils/Auth.jsx index 8d8af02..86053c8 100644 --- a/src/utils/Auth.jsx +++ b/src/utils/Auth.jsx @@ -17,6 +17,7 @@ const defaultValues = { token: '', login: () => {}, logout: () => {}, + uid: '', }; export const AuthContext = createContext(defaultValues); @@ -26,6 +27,7 @@ const AuthContextProvider = ({ children }) => { const [userData, setUserData] = useState({}); const [token, setToken] = useState(''); const [loading, setLoading] = useState(true); + const [uid, setUid] = useState(''); // Get the singleton instance of the API const api = Api.getInstance(); @@ -38,6 +40,7 @@ const AuthContextProvider = ({ children }) => { console.log(user.accessToken); setAuthenticated(true); setToken(user.accessToken); + setUid(user.uid); const avenueUser = await api.fetchUserDetails({ uid: user.uid, @@ -111,8 +114,9 @@ const AuthContextProvider = ({ children }) => { logout, setUserData, loading, + uid, }; - }, [authenticated, token, userData, loading]); + }, [authenticated, token, userData, loading, uid]); return {children}; }; diff --git a/src/utils/useEvents.js b/src/utils/useEvents.js index c92f009..8bf2d6a 100644 --- a/src/utils/useEvents.js +++ b/src/utils/useEvents.js @@ -1,28 +1,26 @@ import { useMemo } from 'react'; import { useQuery } from '@tanstack/react-query'; -import { avenueApi } from './Api'; - -const fetchEvents = (event) => - avenueApi.get('/events', { params: { type: event, orgID: '640892e9f785cdd0afcd8ccf' } }); +import Api from './Api'; const useEvents = (eventName) => { + const api = Api.getInstance(); + const { data, isLoading } = useQuery({ queryKey: ['events', eventName], - queryFn: () => fetchEvents(eventName), + queryFn: () => api.getEvents(eventName), }); const events = useMemo( () => data?.data ?.map((event) => { - const name = JSON.parse(event.name); const description = JSON.parse(event.description); const date = new Date(event.startDate); return { id: event.id, - title: name.heading, - club: name.subHeading, + title: event.name, + club: event.subHeading, date: date.getDate(), month: date.toDateString().split(' ')[1], time: `${date.getHours().toString().padStart(2, '0')}:${date @@ -30,8 +28,9 @@ const useEvents = (eventName) => { .toString() .padStart(2, '0')}`, description, + contact: event.contact, venue: 'LA', - prizes: name.prizeAmount, + prizes: event.prizeMoney, poster: event.poster ? event.poster : 'TODO://link', }; })