Commit 6cd8ddc9 authored by Florent Chehab's avatar Florent Chehab

Moved useless divs to react fragments <></>

parent 50d6e34e
...@@ -74,13 +74,11 @@ class ThemeProvider extends CustomComponentForAPI { ...@@ -74,13 +74,11 @@ class ThemeProvider extends CustomComponentForAPI {
const theme = Object.assign({}, this.state.theme, siteSettings); const theme = Object.assign({}, this.state.theme, siteSettings);
return ( return (
<div> <MuiThemeProvider theme={createMuiTheme(theme)}>
<MuiThemeProvider theme={createMuiTheme(theme)}> <Router>
<Router> {this.props.children}
{this.props.children} </Router>
</Router> </MuiThemeProvider>
</MuiThemeProvider>
</div>
); );
} }
} }
......
...@@ -16,7 +16,7 @@ import AssignmentIcon from "@material-ui/icons/Assignment"; ...@@ -16,7 +16,7 @@ import AssignmentIcon from "@material-ui/icons/Assignment";
import { NavLink } from "react-router-dom"; import { NavLink } from "react-router-dom";
export const mainListItems = ( export const mainListItems = (
<div> <>
<NavLink to={"/app/"} style={{ textDecoration: "none" }}> <NavLink to={"/app/"} style={{ textDecoration: "none" }}>
{/* TODO add styling */} {/* TODO add styling */}
<ListItem button> <ListItem button>
...@@ -54,11 +54,11 @@ export const mainListItems = ( ...@@ -54,11 +54,11 @@ export const mainListItems = (
</ListItem> </ListItem>
</NavLink> </NavLink>
</div> </>
); );
export const secondaryListItems = ( export const secondaryListItems = (
<div> <>
<ListItem button> <ListItem button>
<ListItemIcon> <ListItemIcon>
<AssignmentIcon /> <AssignmentIcon />
...@@ -72,12 +72,12 @@ export const secondaryListItems = ( ...@@ -72,12 +72,12 @@ export const secondaryListItems = (
</ListItemIcon> </ListItemIcon>
<ListItemText primary="Informations" /> <ListItemText primary="Informations" />
</ListItem> </ListItem>
</div> </>
); );
export const thirdListItems = ( export const thirdListItems = (
<div> <>
<NavLink to={"/app/settings/"} style={{ textDecoration: "none" }}> <NavLink to={"/app/settings/"} style={{ textDecoration: "none" }}>
<ListItem button> <ListItem button>
<ListItemIcon> <ListItemIcon>
...@@ -86,5 +86,5 @@ export const thirdListItems = ( ...@@ -86,5 +86,5 @@ export const thirdListItems = (
<ListItemText primary="Paramètres" /> <ListItemText primary="Paramètres" />
</ListItem> </ListItem>
</NavLink> </NavLink>
</div> </>
); );
...@@ -44,14 +44,12 @@ class Loading extends React.Component { ...@@ -44,14 +44,12 @@ class Loading extends React.Component {
{ completionPercentage } = this.state; { completionPercentage } = this.state;
return ( return (
<div> <CircularProgress
<CircularProgress className={classes.progress}
className={classes.progress} variant="determinate"
variant="determinate" size={size}
size={size} value={completionPercentage}
value={completionPercentage} />
/>
</div>
); );
} }
} }
......
...@@ -41,7 +41,7 @@ class Search extends CustomComponentForAPI { ...@@ -41,7 +41,7 @@ class Search extends CustomComponentForAPI {
const { classes } = this.props; const { classes } = this.props;
return ( return (
<div> <>
<TextField <TextField
id="full-width" id="full-width"
label="" label=""
...@@ -55,7 +55,7 @@ class Search extends CustomComponentForAPI { ...@@ -55,7 +55,7 @@ class Search extends CustomComponentForAPI {
onChange={(e) => this.getSuggestions(e.target.value)} onChange={(e) => this.getSuggestions(e.target.value)}
/> />
<UnivList universitiesToList={this.state.suggestions} /> <UnivList universitiesToList={this.state.suggestions} />
</div> </>
); );
} }
} }
......
...@@ -77,7 +77,7 @@ class UniversityTemplate extends Component { ...@@ -77,7 +77,7 @@ class UniversityTemplate extends Component {
} }
return ( return (
<div> <>
<div> <div>
<CoverGallery></CoverGallery> <CoverGallery></CoverGallery>
...@@ -109,8 +109,8 @@ class UniversityTemplate extends Component { ...@@ -109,8 +109,8 @@ class UniversityTemplate extends Component {
{/* {value === 4 && <TabContainer> <CampusesCitiesTab /> </TabContainer>} */} {/* {value === 4 && <TabContainer> <CampusesCitiesTab /> </TabContainer>} */}
{/* {value === 5 && <TabContainer> <MoreTab /> </TabContainer>} */} {/* {value === 5 && <TabContainer> <MoreTab /> </TabContainer>} */}
</div> </div>
</div>
</>
); );
} }
} }
......
...@@ -21,13 +21,13 @@ const styles = theme => ({ ...@@ -21,13 +21,13 @@ const styles = theme => ({
class CountryDriForm extends Form { class CountryDriForm extends Form {
render() { render() {
return ( return (
<div> <>
{this.renderTitleField()} {this.renderTitleField()}
{this.renderImportanceLevelField()} {this.renderImportanceLevelField()}
{this.renderCountriesField()} {this.renderCountriesField()}
{this.renderCommentField()} {this.renderCommentField()}
{this.renderUsefulLinksField()} {this.renderUsefulLinksField()}
</div> </>
); );
} }
} }
......
...@@ -19,13 +19,13 @@ const styles = theme => ({ ...@@ -19,13 +19,13 @@ const styles = theme => ({
class UniversityDriForm extends Form { class UniversityDriForm extends Form {
render() { render() {
return ( return (
<div> <>
{this.renderTitleField()} {this.renderTitleField()}
{this.renderImportanceLevelField()} {this.renderImportanceLevelField()}
{this.renderUniversitiesField()} {this.renderUniversitiesField()}
{this.renderCommentField()} {this.renderCommentField()}
{this.renderUsefulLinksField()} {this.renderUsefulLinksField()}
</div> </>
); );
} }
} }
......
...@@ -21,7 +21,7 @@ const styles = theme => ({ ...@@ -21,7 +21,7 @@ const styles = theme => ({
class UniversityGeneralForm extends Form { class UniversityGeneralForm extends Form {
render() { render() {
return ( return (
<div> <>
<TextField label={"Nom de l'université"} <TextField label={"Nom de l'université"}
{...this.getReferenceAndValue("name")} {...this.getReferenceAndValue("name")}
required={true} required={true}
...@@ -42,7 +42,7 @@ class UniversityGeneralForm extends Form { ...@@ -42,7 +42,7 @@ class UniversityGeneralForm extends Form {
isUrl={true} isUrl={true}
urlExtensions={["jpg", "png", "svg"]} urlExtensions={["jpg", "png", "svg"]}
/> />
</div> </>
); );
} }
} }
......
...@@ -50,7 +50,7 @@ class UniversitySemestersDatesForm extends Form { ...@@ -50,7 +50,7 @@ class UniversitySemestersDatesForm extends Form {
render() { render() {
return ( return (
<div> <>
{this.renderObjModerationLevelField()} {this.renderObjModerationLevelField()}
<DateField label={"Date de début du semestre de printemps"} <DateField label={"Date de début du semestre de printemps"}
{...this.getReferenceAndValue("spring_begin", dateStrToDate)} {...this.getReferenceAndValue("spring_begin", dateStrToDate)}
...@@ -66,7 +66,7 @@ class UniversitySemestersDatesForm extends Form { ...@@ -66,7 +66,7 @@ class UniversitySemestersDatesForm extends Form {
/> />
{this.renderCommentField()} {this.renderCommentField()}
{this.renderUsefulLinksField()} {this.renderUsefulLinksField()}
</div> </>
); );
} }
} }
......
...@@ -60,7 +60,7 @@ function renderCore(rawModelData, classes) { ...@@ -60,7 +60,7 @@ function renderCore(rawModelData, classes) {
spring_end = convertDateStrToStr(spring_end); spring_end = convertDateStrToStr(spring_end);
return ( return (
<div> <>
<div className={classes.root}> <div className={classes.root}>
<Table > <Table >
<TableHead> <TableHead>
...@@ -98,7 +98,7 @@ function renderCore(rawModelData, classes) { ...@@ -98,7 +98,7 @@ function renderCore(rawModelData, classes) {
</Table> </Table>
</div> </div>
<Markdown source={comment} /> <Markdown source={comment} />
</div> </>
); );
} }
......
...@@ -21,7 +21,7 @@ class Alert extends React.Component { ...@@ -21,7 +21,7 @@ class Alert extends React.Component {
> >
{ {
this.props.open ? this.props.open ?
<div> <>
<DialogTitle>{this.props.title}</DialogTitle> <DialogTitle>{this.props.title}</DialogTitle>
<DialogContent> <DialogContent>
<DialogContentText style={{ whiteSpace: "pre-wrap" }}> <DialogContentText style={{ whiteSpace: "pre-wrap" }}>
...@@ -35,7 +35,7 @@ class Alert extends React.Component { ...@@ -35,7 +35,7 @@ class Alert extends React.Component {
{this.props.infoText} {this.props.infoText}
</Button> </Button>
: :
<div> <>
<Button <Button
onClick={() => { this.props.handleClose(); this.props.handleResponse(false); }} onClick={() => { this.props.handleClose(); this.props.handleResponse(false); }}
color='secondary' color='secondary'
...@@ -52,12 +52,12 @@ class Alert extends React.Component { ...@@ -52,12 +52,12 @@ class Alert extends React.Component {
> >
{this.props.agreeText} {this.props.agreeText}
</Button> </Button>
</div> </>
} }
</DialogActions> </DialogActions>
</div> </>
: :
<div></div> <></>
} }
</Dialog > </Dialog >
); );
......
...@@ -222,7 +222,7 @@ class Editor extends Component { ...@@ -222,7 +222,7 @@ class Editor extends Component {
renderEditor() { renderEditor() {
const { classes } = this.props; const { classes } = this.props;
return ( return (
<div> <>
<Alert <Alert
{...this.state.alert} {...this.state.alert}
handleClose={() => this.handleCloseAlertRequest()} handleClose={() => this.handleCloseAlertRequest()}
...@@ -243,12 +243,12 @@ class Editor extends Component { ...@@ -243,12 +243,12 @@ class Editor extends Component {
<Paper className={classes.paper}> <Paper className={classes.paper}>
{this.renderForm()} {this.renderForm()}
</Paper> </Paper>
</div> </>
); );
} }
render() { render() {
return <div></div>; return <></>;
} }
......
...@@ -137,7 +137,7 @@ class History extends Component { ...@@ -137,7 +137,7 @@ class History extends Component {
renderPanel() { renderPanel() {
const { classes } = this.props; const { classes } = this.props;
return ( return (
<div> <>
<AppBar className={classes.appBar} > <AppBar className={classes.appBar} >
<Toolbar> <Toolbar>
<IconButton color="inherit" onClick={() => this.closeHistory()} aria-label="Close"> <IconButton color="inherit" onClick={() => this.closeHistory()} aria-label="Close">
...@@ -151,7 +151,7 @@ class History extends Component { ...@@ -151,7 +151,7 @@ class History extends Component {
<Paper className={classes.paper}> <Paper className={classes.paper}>
{this.renderHistory()} {this.renderHistory()}
</Paper> </Paper>
</div> </>
); );
} }
...@@ -178,7 +178,7 @@ class History extends Component { ...@@ -178,7 +178,7 @@ class History extends Component {
let { rawModelData } = this.props.renderer.props; let { rawModelData } = this.props.renderer.props;
const newRawModelData = Object.assign({}, rawModelData, versions[activeStep]); const newRawModelData = Object.assign({}, rawModelData, versions[activeStep]);
return ( return (
<div> <>
<MobileStepper <MobileStepper
steps={versions.length} steps={versions.length}
position="static" position="static"
...@@ -202,7 +202,7 @@ class History extends Component { ...@@ -202,7 +202,7 @@ class History extends Component {
<br></br> <br></br>
{this.props.renderer.renderTitle(newRawModelData)} {this.props.renderer.renderTitle(newRawModelData)}
{this.props.renderer.renderCore(newRawModelData)} {this.props.renderer.renderCore(newRawModelData)}
</div> </>
); );
} }
...@@ -223,7 +223,7 @@ class History extends Component { ...@@ -223,7 +223,7 @@ class History extends Component {
dateInfo = `${data.date} à ${data.time}`; dateInfo = `${data.date} à ${data.time}`;
} }
return ( return (
<div> <>
<Typography variant='caption' align='center'>Les versions successives d'un même utilisateur ne sont pas enregistrés (dans de tels cas, seul la dernière est conservée).</Typography> <Typography variant='caption' align='center'>Les versions successives d'un même utilisateur ne sont pas enregistrés (dans de tels cas, seul la dernière est conservée).</Typography>
<Typography variant='h6' align='center'>Version n°{versions.length - this.state.versionInView} du {dateInfo}</Typography> <Typography variant='h6' align='center'>Version n°{versions.length - this.state.versionInView} du {dateInfo}</Typography>
<Button <Button
...@@ -235,13 +235,13 @@ class History extends Component { ...@@ -235,13 +235,13 @@ class History extends Component {
Éditer à partir de cette version Éditer à partir de cette version
</Button> </Button>
<Divider /> <Divider />
</div> </>
); );
} }
// Dumb render function for the component // Dumb render function for the component TODO remove ?
render() { render() {
return <div></div>; return <></>;
} }
} }
......
...@@ -128,16 +128,14 @@ class ModuleWrapper extends CustomComponentForAPI { ...@@ -128,16 +128,14 @@ class ModuleWrapper extends CustomComponentForAPI {
} }
renderTitle = (rawModelData) => ( renderTitle = (rawModelData) => (
<div> renderTitle(rawModelData, this.props.classes, this.props.buildTitle)
{renderTitle(rawModelData, this.props.classes, this.props.buildTitle)}
</div>
) )
renderCore = (rawModelData) => ( renderCore = (rawModelData) => (
<div> <>
{this.props.renderCore(rawModelData, this.props.coreClasses, this.props.outsideData)} {this.props.renderCore(rawModelData, this.props.coreClasses, this.props.outsideData)}
{renderUsefulLinks(rawModelData, this.props.classes, this.props.theme)} {renderUsefulLinks(rawModelData, this.props.classes, this.props.theme)}
</div> </>
) )
userCanModerate() { userCanModerate() {
...@@ -159,7 +157,7 @@ class ModuleWrapper extends CustomComponentForAPI { ...@@ -159,7 +157,7 @@ class ModuleWrapper extends CustomComponentForAPI {
return ( return (
<div> <>
<Alert <Alert
{...this.state.alert} {...this.state.alert}
handleClose={this.handleCloseAlert} handleClose={this.handleCloseAlert}
...@@ -193,7 +191,7 @@ class ModuleWrapper extends CustomComponentForAPI { ...@@ -193,7 +191,7 @@ class ModuleWrapper extends CustomComponentForAPI {
{renderFirstRow.bind(this)(userCanModerate)} {renderFirstRow.bind(this)(userCanModerate)}
{this.renderCore(this.props.rawModelData)} {this.renderCore(this.props.rawModelData)}
</Paper> </Paper>
</div> </>
); );
} }
} }
......
...@@ -70,7 +70,7 @@ class PendingModeration extends Component { ...@@ -70,7 +70,7 @@ class PendingModeration extends Component {
*/ */
renderPendingModerationInfo(rawModelData) { renderPendingModerationInfo(rawModelData) {
return ( return (
<div> <>
<Button <Button
variant='outlined' variant='outlined'
color="primary" color="primary"
...@@ -80,7 +80,7 @@ class PendingModeration extends Component { ...@@ -80,7 +80,7 @@ class PendingModeration extends Component {
Éditer à partir de cette version Éditer à partir de cette version
</Button> </Button>
{ {
this.props.userCanModerate ? <div></div> : <Typography variant='caption' align='center'>Vous n'avez pas les droits nécessaires pour modérer cet élément.</Typography> this.props.userCanModerate ? <></> : <Typography variant='caption' align='center'>Vous n'avez pas les droits nécessaires pour modérer cet élément.</Typography>
} }
<Button <Button
variant='outlined' variant='outlined'
...@@ -92,7 +92,7 @@ class PendingModeration extends Component { ...@@ -92,7 +92,7 @@ class PendingModeration extends Component {
Valider cette version Valider cette version
</Button> </Button>
<Divider /> <Divider />
</div> </>
); );
} }
...@@ -118,7 +118,7 @@ class PendingModeration extends Component { ...@@ -118,7 +118,7 @@ class PendingModeration extends Component {
pendingModelData = this.getRawModelDataFromPending(); pendingModelData = this.getRawModelDataFromPending();
return ( return (
<div> <>
<AppBar className={classes.appBar} > <AppBar className={classes.appBar} >
<Toolbar> <Toolbar>
<IconButton color="inherit" onClick={() => this.closePanel()} aria-label="Close"> <IconButton color="inherit" onClick={() => this.closePanel()} aria-label="Close">
...@@ -135,12 +135,12 @@ class PendingModeration extends Component { ...@@ -135,12 +135,12 @@ class PendingModeration extends Component {
{this.props.renderer.renderTitle(pendingModelData)} {this.props.renderer.renderTitle(pendingModelData)}
{this.props.renderer.renderCore(pendingModelData)} {this.props.renderer.renderCore(pendingModelData)}
</Paper> </Paper>
</div> </>
); );
} }
render() { render() {
return <div></div>; return <></>;
} }
}