diff --git a/src/components/events/IndividualEventModal.jsx b/src/components/events/IndividualEventModal.jsx
index e87c07c..e6b3a2c 100644
--- a/src/components/events/IndividualEventModal.jsx
+++ b/src/components/events/IndividualEventModal.jsx
@@ -16,12 +16,13 @@ import CustomAlert from '../customcomponents/CustomAlert'
import { uploadToCloudinary } from '../../utils/uploadToCloudinary'
import {
+ Container,
RegisterCompleteCardText,
RegisterCompleteCardTextContainer
} from './teamRegistrationModal'
import { RegistrationSchema } from '../../config/content/teamRegistration/registerSchema'
-export const IndiEventModal = ({ EventId, EventTitle, mongoId, hasPdfUpload }) => {
+export const IndiEventModal = ({ EventId, EventTitle, mongoId, hasPdfUpload, handleScroll }) => {
const [aicheID, setAicheID] = useState('')
const [show, setShow] = useState(true)
const [error, setError] = useState(null)
@@ -117,7 +118,7 @@ export const IndiEventModal = ({ EventId, EventTitle, mongoId, hasPdfUpload }) =
return (
<>
{show ? (
-
+
{EventTitle}
(*single member Participation*)
User ID
@@ -145,7 +146,7 @@ export const IndiEventModal = ({ EventId, EventTitle, mongoId, hasPdfUpload }) =
{errorContent && {errorContent}}
{hasPdfUpload && (
- Upload PDF
+ Submit your abstracts here
{loading ? 'Registering...' : 'Register'}
-
+
) : (
Hurray! Ur Registration Completed
@@ -175,5 +176,6 @@ IndiEventModal.propTypes = {
EventTitle: PropTypes.string.isRequired,
closeRegisterModal: PropTypes.func,
mongoId: PropTypes.string,
- hasPdfUpload: PropTypes.bool
+ hasPdfUpload: PropTypes.bool,
+ handleScroll: PropTypes.func
}
diff --git a/src/components/events/Register2Modal.jsx b/src/components/events/Register2Modal.jsx
index afc6716..66d4a9d 100644
--- a/src/components/events/Register2Modal.jsx
+++ b/src/components/events/Register2Modal.jsx
@@ -3,25 +3,45 @@ import { Button2, Container, Section } from './registerModal.style'
import TeamEventModal from './TeamEventModal'
import { IndiEventModal } from './IndividualEventModal'
import { eventsWithPdfs } from '../../config/content/events/events'
+import { useState } from 'react'
+import { ProgressBar } from './eventModal.styles'
-export const RegisterModal = ({ event: { id, name, isTeamEvent }, closeModal, mongoId }) => {
+export const RegisterModal = ({
+ event: { id, name, isTeamEvent, maxTeamSize },
+ closeModal,
+ mongoId
+}) => {
+ const [scrollPosition, setScrollPosition] = useState(0)
+
+ function handleScroll(e) {
+ const element = e.target
+ const scrollTop = element.scrollTop
+ const scrollHeight = element.scrollHeight - element.clientHeight
+ const scrollPercentage = (scrollTop / scrollHeight) * 100
+ setScrollPosition(scrollPercentage)
+ }
const hasPdfUpload = eventsWithPdfs.includes(name)
return (
+
Back
{isTeamEvent ? (
) : (
)}
@@ -34,7 +54,8 @@ RegisterModal.propTypes = {
event: PropTypes.shape({
id: PropTypes.string.isRequired,
name: PropTypes.string.isRequired,
- isTeamEvent: PropTypes.bool
+ isTeamEvent: PropTypes.bool,
+ maxTeamSize: PropTypes.number
}),
closeModal: PropTypes.func,
mongoId: PropTypes.string
diff --git a/src/components/events/TeamEventModal.jsx b/src/components/events/TeamEventModal.jsx
index 620ca3f..004b914 100644
--- a/src/components/events/TeamEventModal.jsx
+++ b/src/components/events/TeamEventModal.jsx
@@ -1,6 +1,6 @@
import { useState } from 'react'
import PropTypes from 'prop-types'
-import { Button1 } from './registerModal.style'
+// import { Button1 } from './registerModal.style'
import { useMutation } from '@apollo/client'
import { CREATE_TEAM_REGISTRATIONS } from '../../graphQL/mutations/teamRegistration'
import CustomAlert from '../customcomponents/CustomAlert'
@@ -18,15 +18,24 @@ import {
IconButtonContainer,
RegisterCompleteCardText,
RegisterCompleteCardTextContainer,
- Container
+ Container,
+ Button1
} from './teamRegistrationModal'
import { TeamRegistrationSchema } from '../../config/content/teamRegistration/registerSchema'
import { toast } from 'react-toastify'
import { MinusButtonUrl, PlusButtonUrl } from '../../config/content/teamRegistration/registermodal'
import { InputContainer1, FileUpload } from './registerModal.style'
import { uploadToCloudinary } from '../../utils/uploadToCloudinary'
+import { edpEvents, edpLink } from '../../config/content/events/events'
-export const TeamEventModal = ({ EventId, EventTitle, hasPdfUpload, mongoId }) => {
+export const TeamEventModal = ({
+ EventId,
+ EventTitle,
+ maxTeamSize,
+ hasPdfUpload,
+ mongoId,
+ handleScroll
+}) => {
const [formData, setFormData] = useState({
teamname: '',
teamleadid: '',
@@ -40,6 +49,8 @@ export const TeamEventModal = ({ EventId, EventTitle, hasPdfUpload, mongoId }) =
const [teamRegisterEvent] = useMutation(CREATE_TEAM_REGISTRATIONS)
+ const maxUsers = maxTeamSize
+
const handleChange = (key, value) => {
setFormData({
...formData,
@@ -48,8 +59,6 @@ export const TeamEventModal = ({ EventId, EventTitle, hasPdfUpload, mongoId }) =
setError(null)
}
- console.log(mongoId)
-
const handleUserIdChange = (index, value) => {
const newUserIds = [...formData.userIds]
newUserIds[index] = value
@@ -60,7 +69,7 @@ export const TeamEventModal = ({ EventId, EventTitle, hasPdfUpload, mongoId }) =
}
const addUserId = () => {
- if (formData.userIds.length > 4) {
+ if (formData.userIds.length > maxUsers - 2) {
return toast.error("you've reached maximum team limit")
}
setFormData({
@@ -169,10 +178,11 @@ export const TeamEventModal = ({ EventId, EventTitle, hasPdfUpload, mongoId }) =
return id.split('-')[1]
}
+ const doesContainEDP = edpEvents.includes(EventTitle)
return (
<>
{show ? (
-
+
{EventTitle}
(*Team Participation*)
@@ -218,6 +228,15 @@ export const TeamEventModal = ({ EventId, EventTitle, hasPdfUpload, mongoId }) =
))}
+ {doesContainEDP && (
+ {
+ window.open(edpLink, '_blank')
+ }}
+ >
+ Click to submit your EDPs here
+
+ )}
{hasPdfUpload && (
@@ -246,7 +265,9 @@ TeamEventModal.propTypes = {
EventTitle: PropTypes.string.isRequired,
closeRegisterModal: PropTypes.func,
hasPdfUpload: PropTypes.bool,
- mongoId: PropTypes.string
+ mongoId: PropTypes.string,
+ maxTeamSize: PropTypes.number,
+ handleScroll: PropTypes.func
}
export default TeamEventModal
diff --git a/src/components/events/eventModal.styles.jsx b/src/components/events/eventModal.styles.jsx
index 16a6d1e..b67ddd6 100644
--- a/src/components/events/eventModal.styles.jsx
+++ b/src/components/events/eventModal.styles.jsx
@@ -17,7 +17,7 @@ export const Container = styled.main`
`
export const Section = styled.section`
- ${tw`bg-black-1 text-brown-2 relative max-w-[600px] w-full rounded-[23.06px] font-Poppins h-[97vh] h-auto overflow-scroll`}
+ ${tw`bg-black-1 text-brown-2 relative max-w-[600px] w-full rounded-[23.06px] font-Poppins max-h-[97vh] overflow-scroll`}
padding-top: 10px;
scrollbar-width: none;
`
@@ -25,7 +25,7 @@ export const Section = styled.section`
export const ProgressBar = styled.div`
${tw`fixed top-0 left-0 h-1 bg-orange-500`}
width: ${({ width }) => width}%;
- transition: width 0.1s ease-out;
+ transition: width 0.5s linear;
`
export const ContentWrapper = styled.div`
diff --git a/src/components/events/registerModal.style.jsx b/src/components/events/registerModal.style.jsx
index f10ec09..68b0e49 100644
--- a/src/components/events/registerModal.style.jsx
+++ b/src/components/events/registerModal.style.jsx
@@ -27,8 +27,10 @@ export const FileUpload = styled.input`
`
export const Section = styled.section`
- ${tw`bg-brown-2 border-4 border-black-1 relative max-w-[600px] w-full rounded-[23.06px] font-Poppins max-h-[100vh] h-auto overflow-y-auto `}
+ ${tw`bg-brown-2 border-4 border-black-1 relative max-w-[600px] w-full rounded-[23.06px] font-Poppins max-h-[97vh] overflow-scroll `}
+ scrollbar-width: none;
`
+
export const Text = styled.div`
${tw`text-[34px] 0.8xsm:text-[37px]
0.9xsm:text-[40px] text-center w-full mt-7 font-bold font-Poppins`}
@@ -98,7 +100,7 @@ export const Button1 = styled.button`
export const Button2 = styled.button`
${tw`p-1
- mt-6 ml-6 mr-6
+ m-6
w-[20%]
diff --git a/src/components/events/teamRegistrationModal.jsx b/src/components/events/teamRegistrationModal.jsx
index daede66..144c929 100644
--- a/src/components/events/teamRegistrationModal.jsx
+++ b/src/components/events/teamRegistrationModal.jsx
@@ -3,6 +3,7 @@ import tw from 'twin.macro'
export const Container = styled.div`
${tw`max-h-[85vh] overflow-scroll`}
+ scrollbar-width: none;
`
export const GridContainer = styled.div`
@@ -83,3 +84,28 @@ export const RemoveButton = styled.button`
export const IconButtonContainer = styled.div`
${tw`flex justify-center`}
`
+
+export const Button1 = styled.button`
+ ${tw` px-2
+ mt-10
+ mb-12
+ w-[80%]
+ ml-[10%]
+ py-2
+ rounded-[11.53px]
+ bg-orange-1
+ text-brown-5
+ font-semibold
+ text-1.5lg
+ md:text-2xl
+ border-brown-5
+ border-2
+ transition
+ duration-300
+ ease-in-out
+ active:transform
+ active:translate-x-[3px]
+ active:translate-y-[3px]
+ active:shadow-none
+ shadow-[3px 3px 0px #1d1d1d ]`}
+`
diff --git a/src/graphQL/queries/getEvents.js b/src/graphQL/queries/getEvents.js
index 61ba7dd..a185f88 100644
--- a/src/graphQL/queries/getEvents.js
+++ b/src/graphQL/queries/getEvents.js
@@ -12,6 +12,7 @@ export const GET_EVENTS_BY_ORGID = gql`
status
id
subHeading
+ maxTeamSize
}
}
`