From f81da0b4ca4740263c783c8380071dd779d0ae91 Mon Sep 17 00:00:00 2001
From: Laszlo Rafael <rlacko99@gmail.com>
Date: Sun, 20 Feb 2022 15:25:55 +0100
Subject: [PATCH] Sort events by date
---
src/components/pages/Schedule.js | 82 ++++++++++++++++----------------
1 file changed, 42 insertions(+), 40 deletions(-)
diff --git a/src/components/pages/Schedule.js b/src/components/pages/Schedule.js
index d4dda56..a761560 100644
--- a/src/components/pages/Schedule.js
+++ b/src/components/pages/Schedule.js
@@ -1,4 +1,4 @@
-import 'moment/locale/hu';
+import "moment/locale/hu";
import {
Accordion,
@@ -7,12 +7,12 @@ import {
Header,
Icon,
Segment,
-} from 'semantic-ui-react';
-import React, { Component } from 'react';
+} from "semantic-ui-react";
+import React, { Component } from "react";
-import { connect } from 'react-redux';
-import { getStudentEvents } from '../../actions/statistics';
-import moment from 'moment';
+import { connect } from "react-redux";
+import { getStudentEvents } from "../../actions/statistics";
+import moment from "moment";
class Schedule extends Component {
// eslint-disable-next-line react/state-in-constructor
@@ -34,32 +34,34 @@ class Schedule extends Component {
const { activeIndex } = this.state;
const { events } = this.props;
- const panels = events.map((event) => (
- <Accordion key={Math.random()}>
- <Accordion.Title
- active={activeIndex === event.id}
- index={event.id}
- onClick={this.handleClick}
- >
- <h2>
- <Grid>
- <Grid.Column floated="left" width={5} textAlign="left">
- <Icon name="calendar alternate outline" color="blue" />{' '}
- {event.name}
- </Grid.Column>
- <Grid.Column floated="right" width={8} textAlign="right">
- {moment(event.date).locale('hu').format('LLLL')}
- </Grid.Column>
- </Grid>
- </h2>
- </Accordion.Title>
- <Accordion.Content active={activeIndex === event.id}>
- <Segment textAlign="left" style={{ overflowWrap: 'break-word' }}>
- {event.description}
- </Segment>
- </Accordion.Content>
- </Accordion>
- ));
+ const panels = events
+ .sort((a, b) => a.date - b.date)
+ .map((event) => (
+ <Accordion key={Math.random()}>
+ <Accordion.Title
+ active={activeIndex === event.id}
+ index={event.id}
+ onClick={this.handleClick}
+ >
+ <h2>
+ <Grid>
+ <Grid.Column floated="left" width={5} textAlign="left">
+ <Icon name="calendar alternate outline" color="blue" />{" "}
+ {event.name}
+ </Grid.Column>
+ <Grid.Column floated="right" width={8} textAlign="right">
+ {moment(event.date).locale("hu").format("LLLL")}
+ </Grid.Column>
+ </Grid>
+ </h2>
+ </Accordion.Title>
+ <Accordion.Content active={activeIndex === event.id}>
+ <Segment textAlign="left" style={{ overflowWrap: "break-word" }}>
+ {event.description}
+ </Segment>
+ </Accordion.Content>
+ </Accordion>
+ ));
return (
<div>
@@ -68,10 +70,10 @@ class Schedule extends Component {
as="h1"
content="KĂŠpzĂŠs alkalmak"
style={{
- fontSize: '2em',
- fontWeight: 'bold',
- marginBottom: '0.5em',
- marginTop: '0.5em',
+ fontSize: "2em",
+ fontWeight: "bold",
+ marginBottom: "0.5em",
+ marginTop: "0.5em",
}}
/>
<Accordion fluid styled>
@@ -81,10 +83,10 @@ class Schedule extends Component {
as="h1"
content="TĂĄbor"
style={{
- fontSize: '2em',
- fontWeight: 'bold',
- marginBottom: '0.5em',
- marginTop: '1.5em',
+ fontSize: "2em",
+ fontWeight: "bold",
+ marginBottom: "0.5em",
+ marginTop: "1.5em",
}}
/>
</Container>
--
GitLab