To receive notifications about scheduled maintenance, please subscribe to the mailing-list gitlab-operations@sympa.ethz.ch. You can subscribe to the mailing-list at https://sympa.ethz.ch

Verified Commit 4338f66b authored by Sandro Lutz's avatar Sandro Lutz
Browse files

Change ExpansionPanel to Accordion

Naming has changed for the ExpansionPanel of MaterialUI to have a more
consistent naming scheme.
parent 1b9a94ec
Pipeline #82878 passed with stages
in 12 minutes and 59 seconds
import React from 'react' import React from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import { import {
ExpansionPanel, Accordion,
ExpansionPanelDetails, AccordionDetails,
ExpansionPanelSummary, AccordionSummary,
} from '@material-ui/core' } from '@material-ui/core'
import ExpandMoreIcon from '@material-ui/icons/ExpandMore' import ExpandMoreIcon from '@material-ui/icons/ExpandMore'
import { makeStyles } from '@material-ui/styles' import { makeStyles } from '@material-ui/styles'
...@@ -49,7 +49,7 @@ const FilteredListItem = React.forwardRef( ...@@ -49,7 +49,7 @@ const FilteredListItem = React.forwardRef(
} }
return ( return (
<ExpansionPanel <Accordion
component="li" component="li"
ref={ref} ref={ref}
classes={{ classes={{
...@@ -61,7 +61,7 @@ const FilteredListItem = React.forwardRef( ...@@ -61,7 +61,7 @@ const FilteredListItem = React.forwardRef(
TransitionProps={{ unmountOnExit: true }} TransitionProps={{ unmountOnExit: true }}
{...props} {...props}
> >
<ExpansionPanelSummary <AccordionSummary
classes={{ classes={{
root: classes.summaryRoot, root: classes.summaryRoot,
content: classes.summaryContent, content: classes.summaryContent,
...@@ -69,11 +69,11 @@ const FilteredListItem = React.forwardRef( ...@@ -69,11 +69,11 @@ const FilteredListItem = React.forwardRef(
expandIcon={<ExpandMoreIcon />} expandIcon={<ExpandMoreIcon />}
> >
{summary} {summary}
</ExpansionPanelSummary> </AccordionSummary>
<ExpansionPanelDetails classes={{ root: classes.detailsRoot }}> <AccordionDetails classes={{ root: classes.detailsRoot }}>
{children} {children}
</ExpansionPanelDetails> </AccordionDetails>
</ExpansionPanel> </Accordion>
) )
} }
) )
......
...@@ -4,10 +4,10 @@ import { useSelector, useDispatch } from 'react-redux' ...@@ -4,10 +4,10 @@ import { useSelector, useDispatch } from 'react-redux'
import ExpandMoreIcon from '@material-ui/icons/ExpandMore' import ExpandMoreIcon from '@material-ui/icons/ExpandMore'
import Autocomplete from '@material-ui/lab/Autocomplete' import Autocomplete from '@material-ui/lab/Autocomplete'
import { import {
ExpansionPanel, Accordion,
ExpansionPanelSummary, AccordionSummary,
Button, Button,
ExpansionPanelDetails, AccordionDetails,
Typography, Typography,
Toolbar, Toolbar,
Breadcrumbs, Breadcrumbs,
...@@ -309,7 +309,7 @@ const StudydocumentsQuickFilter = ({ ...props }) => { ...@@ -309,7 +309,7 @@ const StudydocumentsQuickFilter = ({ ...props }) => {
} }
return ( return (
<ExpansionPanel <Accordion
component="div" component="div"
classes={{ classes={{
root: classes.root, root: classes.root,
...@@ -320,7 +320,7 @@ const StudydocumentsQuickFilter = ({ ...props }) => { ...@@ -320,7 +320,7 @@ const StudydocumentsQuickFilter = ({ ...props }) => {
onChange={(_, isExpanded) => setExpanded(isExpanded)} onChange={(_, isExpanded) => setExpanded(isExpanded)}
{...props} {...props}
> >
<ExpansionPanelSummary <AccordionSummary
classes={{ classes={{
root: classes.summaryRoot, root: classes.summaryRoot,
expanded: classes.summaryExpanded, expanded: classes.summaryExpanded,
...@@ -331,8 +331,8 @@ const StudydocumentsQuickFilter = ({ ...props }) => { ...@@ -331,8 +331,8 @@ const StudydocumentsQuickFilter = ({ ...props }) => {
<Typography> <Typography>
<FormattedMessage id="studydocuments.quickfilter.title" /> <FormattedMessage id="studydocuments.quickfilter.title" />
</Typography> </Typography>
</ExpansionPanelSummary> </AccordionSummary>
<ExpansionPanelDetails classes={{ root: classes.detailsRoot }}> <AccordionDetails classes={{ root: classes.detailsRoot }}>
<Toolbar disableGutters> <Toolbar disableGutters>
{breadcrumbs} {breadcrumbs}
<div className={classes.toolbarSeparator} /> <div className={classes.toolbarSeparator} />
...@@ -341,8 +341,8 @@ const StudydocumentsQuickFilter = ({ ...props }) => { ...@@ -341,8 +341,8 @@ const StudydocumentsQuickFilter = ({ ...props }) => {
</Button> </Button>
</Toolbar> </Toolbar>
{content} {content}
</ExpansionPanelDetails> </AccordionDetails>
</ExpansionPanel> </Accordion>
) )
} }
......
...@@ -6,9 +6,9 @@ import { makeStyles } from '@material-ui/core/styles' ...@@ -6,9 +6,9 @@ import { makeStyles } from '@material-ui/core/styles'
import ExpandMoreIcon from '@material-ui/icons/ExpandMore' import ExpandMoreIcon from '@material-ui/icons/ExpandMore'
import { import {
Typography, Typography,
ExpansionPanel, Accordion,
ExpansionPanelDetails, AccordionDetails,
ExpansionPanelSummary, AccordionSummary,
} from '@material-ui/core' } from '@material-ui/core'
import { listLoadNextPage, listLoadAllPages } from '~store/common/actions' import { listLoadNextPage, listLoadAllPages } from '~store/common/actions'
...@@ -121,8 +121,8 @@ const EventsPage = ({ eventId: eventIdProp }) => { ...@@ -121,8 +121,8 @@ const EventsPage = ({ eventId: eventIdProp }) => {
<EventsFilter /> <EventsFilter />
{/* Event Calendar */} {/* Event Calendar */}
<ExpansionPanel className={classes.calendarPanel}> <Accordion className={classes.calendarPanel}>
<ExpansionPanelSummary <AccordionSummary
classes={{ classes={{
root: classes.calendarSummary, root: classes.calendarSummary,
}} }}
...@@ -131,16 +131,16 @@ const EventsPage = ({ eventId: eventIdProp }) => { ...@@ -131,16 +131,16 @@ const EventsPage = ({ eventId: eventIdProp }) => {
<Typography className={classes.heading}> <Typography className={classes.heading}>
<FormattedMessage id="events.agenda" /> <FormattedMessage id="events.agenda" />
</Typography> </Typography>
</ExpansionPanelSummary> </AccordionSummary>
<ExpansionPanelDetails classes={{ root: classes.calendarDetails }}> <AccordionDetails classes={{ root: classes.calendarDetails }}>
<iframe <iframe
src="https://calendar.google.com/calendar/embed?showTitle=0&amp;showPrint=0&amp;showTabs=0&amp;showCalendars=0&amp;showTz=0&amp;height=600&amp;wkst=2&amp;bgcolor=%23FFFFFF&amp;src=mdk91hfvr18q8rrlh3sedlhgvo%40group.calendar.google.com&amp;color=%23B1365F&amp;ctz=Europe%2FZurich" src="https://calendar.google.com/calendar/embed?showTitle=0&amp;showPrint=0&amp;showTabs=0&amp;showCalendars=0&amp;showTz=0&amp;height=600&amp;wkst=2&amp;bgcolor=%23FFFFFF&amp;src=mdk91hfvr18q8rrlh3sedlhgvo%40group.calendar.google.com&amp;color=%23B1365F&amp;ctz=Europe%2FZurich"
style={{ width: '100%', height: '550px', borderWidth: 0 }} style={{ width: '100%', height: '550px', borderWidth: 0 }}
frameBorder="0" frameBorder="0"
scrolling="no" scrolling="no"
/> />
</ExpansionPanelDetails> </AccordionDetails>
</ExpansionPanel> </Accordion>
{/* Pinned event */} {/* Pinned event */}
{pinnedId && ( {pinnedId && (
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment