Skip to content

Bugfix - Fixed bottom bar registration responsiveness #771

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
wickathou merged 2 commits into from
Feb 27, 2024
Merged

Bugfix - Fixed bottom bar registration responsiveness #771

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3dfa4c9
Added ID to global navbar to target it from other components
wickathou Feb 27, 2024
0cdf406
Modified sectionsInfo to be DRY on register/index
wickathou Feb 27, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 4 additions & 2 deletions frontend/src/components/navbars/GlobalNavBar/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,10 +35,12 @@ const useStyles = makeStyles(theme => ({
export default () => {
const classes = useStyles()
return (
<div className='tw-w-full tw-py-2 tw-bg-wave-pattern ' >
<div
id="global-navbar"
className="tw-w-full tw-py-2 tw-bg-wave-pattern "
>
<div className={classes.wrapper}>
<div className={classes.inner}>

<a href="/home">
<img
src={PlatformLogo}
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/pages/_events/slug/register/RegistrationBottomBar/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ const useStyles = makeStyles(theme => ({
},
sectionsNum: {
color: 'white',
fontWeight: 'bold'
fontWeight: 'bold',
},
buttonIcon: {
marginLeft: theme.spacing(1),
Expand Down
19 changes: 9 additions & 10 deletions frontend/src/pages/_events/slug/register/RegistrationSectionCustom/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,15 @@ const useStyles = makeStyles(theme => ({
},
}))

export default ({ section, sectionsInfo, onNext, nextLabel, onPrev, prevLabel, data }) => {
export default ({
section,
sectionsInfo,
onNext,
nextLabel,
onPrev,
prevLabel,
data,
}) => {
const classes = useStyles()
const { registration } = useContext(EventDetailContext)
console.log('section', section)
Expand Down Expand Up @@ -159,15 +167,6 @@ export default ({ section, sectionsInfo, onNext, nextLabel, onPrev, prevLabel, d
key={question.name}
className={classes.question}
>
{/* <div className={classes.questionInner}>
<FastField
autoFocus={index === 0}
name={question.name}
component={RegistrationQuestion}
config={question}
isCustom={true}
/>
</div> */}
<div className={classes.questionInner}>
<FastField name={question.name}>
{props => (
Expand Down
24 changes: 15 additions & 9 deletions frontend/src/pages/_events/slug/register/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -146,11 +146,14 @@ export default RequiresPermission(() => {
finishRegistration,
} = useContext(EventDetailContext)
const userProfile = useSelector(UserSelectors.userProfile)

const [loading, setLoading] = useState(false)
const [formData, setFormData] = useState({})
const [activeStep, setActiveStep] = useState(0)
const [eventNewsLetterHidden, setEventNewsLetterHidden] = useState(true)

const globalNavbarElement = document.getElementById('global-navbar')
globalNavbarElement.style.display = 'none'

useEffect(() => {
setTimeout(function () {
window.scrollTo({ top: 0, left: 0, behavior: 'smooth' })
Expand Down Expand Up @@ -235,6 +238,13 @@ export default RequiresPermission(() => {
return sorted.concat(event?.customQuestions ?? [])
}, [event])

const sectionsInfo = (sections, index) => {
return {
sections: sections.length,
activeSection: index + 1,
}
}

const setNextStep = useCallback(
(nextStep, values, path) => {
const newFormData = path
Expand Down Expand Up @@ -287,7 +297,9 @@ export default RequiresPermission(() => {
}
AnalyticsService.events.COMPLETE_REGISTRATION(slug)
setActiveStep(sections.length + 1)
globalNavbarElement.style.display = 'block'
} catch (e) {
globalNavbarElement.style.display = 'none'
dispatch(
SnackbarActions.error(
'Oops, something went wrong... Please try again',
Expand Down Expand Up @@ -332,10 +344,7 @@ export default RequiresPermission(() => {
isActive={activeStep === index}
section={section}
data={formData}
sectionsInfo={{
sections: sections.length,
activeSection: index + 1,
}}
sectionsInfo={sectionsInfo(sections, index)}
onPrev={setPrevStep}
prevLabel={prevStep ? prevStep.label : null}
onNext={(values, path) => {
Expand All @@ -347,10 +356,7 @@ export default RequiresPermission(() => {
<RegistrationSection
isActive={activeStep === index}
data={formData}
sectionsInfo={{
sections: sections.length,
activeSection: index + 1,
}}
sectionsInfo={sectionsInfo(sections, index)}
label={section.label}
fields={section.fields}
onPrev={setPrevStep}
Expand Down