@@ -25,13 +30,6 @@ const Event = ({ talk, event, type, size, lang }) => {
)}
-
@@ -40,13 +38,29 @@ const Event = ({ talk, event, type, size, lang }) => {
)}
+ {speakers && (
+
+
+ {speakers.map((speaker) => (
+
+
+ {speaker.first_name} {speaker.last_name}
+
+
+ ))}
+
+
+ )}
+
{talk?.spoken_language && event?.room && (
<>
{talk?.spoken_language}
-
{event?.room || ''}
+
+ {event?.room || ''}
+
>
)}
diff --git a/src/app/[lang]/schedule/components/Events.js b/src/app/[lang]/schedule/components/Events.js
index 7e70e56..00a8b1d 100644
--- a/src/app/[lang]/schedule/components/Events.js
+++ b/src/app/[lang]/schedule/components/Events.js
@@ -4,11 +4,15 @@ import Row from 'react-bootstrap/Row';
import Col from 'react-bootstrap/Col';
import Event from './Event';
-const Events = ({ order, lang, talksList }) => {
+const Events = ({ order, lang, talksList, speakersList }) => {
const getTalkById = (id) => {
return talksList.find((talk) => talk.id === id);
};
+ const getSpeakersByIds = (ids) => {
+ return speakersList.filter((speaker) => (ids || []).includes(speaker.id));
+ };
+
return (
@@ -21,17 +25,20 @@ const Events = ({ order, lang, talksList }) => {
className={`event-container ${order.type}`}>
{order.hour}
- {order.events.map((event) => {
+ {order.events.map((event, index) => {
const talk = getTalkById(event.event_id) || {};
+ const speakers = getSpeakersByIds(talk.speakers);
return (
);
})}
@@ -60,8 +67,6 @@ Events.propTypes = {
github: propTypes.string,
website: propTypes.string
}),
- reverse: propTypes.bool,
- index: propTypes.number,
lang: propTypes.string
};
diff --git a/src/app/[lang]/schedule/components/Schedule.js b/src/app/[lang]/schedule/components/Schedule.js
index 74c073e..d55cd17 100644
--- a/src/app/[lang]/schedule/components/Schedule.js
+++ b/src/app/[lang]/schedule/components/Schedule.js
@@ -5,13 +5,15 @@ import propTypes from 'prop-types';
import Container from 'react-bootstrap/Container';
import Row from 'react-bootstrap/Row';
import Col from 'react-bootstrap/Col';
+import { faCircleArrowRight, faCircleArrowLeft } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import Events from '@/app/[lang]/schedule/components/Events';
import Title from '@/app/[lang]/schedule/components/Title';
import { useI18n } from '@/contexts/I18nContext';
-const Schedule = ({ lang, scheduleData, talksList }) => {
+const Schedule = ({ lang, scheduleData, talksList, speakersList }) => {
const i18nDictionary = useI18n();
const [currentDate, setCurrentDate] = useState('');
const [currentOrder, setCurrentOrder] = useState([]);
@@ -56,22 +58,37 @@ const Schedule = ({ lang, scheduleData, talksList }) => {
-
- {new Date(currentDate).toLocaleString('en-US', {
- month: 'long',
- day: 'numeric',
- zone: 'UTC-5'
- })}
-
+ {currentDate && (
+
+ {new Date(currentDate).toLocaleDateString(lang === 'en' ? 'en-US' : 'es-CO', {
+ weekday: 'long',
+ month: 'long',
+ day: 'numeric'
+ })}
+
+ )}
- {previousDate && }
- {nextDate && }
+ {previousDate && (
+
+ Previous day
+
+ )}
+ {nextDate && (
+
+ Next day
+
+ )}
-
+
diff --git a/src/app/[lang]/schedule/page.js b/src/app/[lang]/schedule/page.js
index 5852e8c..c96a5e2 100644
--- a/src/app/[lang]/schedule/page.js
+++ b/src/app/[lang]/schedule/page.js
@@ -3,6 +3,7 @@ import propTypes from 'prop-types';
import Schedule from './components/Schedule';
import talksList from '@/data/talks.json';
+import speakersList from '@/data/speakers.json';
import scheduleData from '@/data/schedule.json';
import en from '@/data/dictionaries/en.json';
@@ -19,7 +20,14 @@ export async function generateMetadata({ params: { lang } }, parent) {
}
const Page = ({ params: { lang } }) => {
- return ;
+ return (
+
+ );
};
Page.propTypes = {
diff --git a/src/data/schedule.json b/src/data/schedule.json
index ba7e2de..a217824 100644
--- a/src/data/schedule.json
+++ b/src/data/schedule.json
@@ -1,7 +1,7 @@
[
{
- "date": "2024-06-07",
- "next_date": "2024-06-08",
+ "date": "2024/06/07",
+ "next_date": "2024/06/08",
"order": [
{
"hour": "08:00",
@@ -195,9 +195,9 @@
]
},
{
- "date": "2024-06-08",
- "next_date": "2024-06-09",
- "previous_date": "2024-06-07",
+ "date": "2024/06/08",
+ "next_date": "2024/06/09",
+ "previous_date": "2024/06/07",
"order": [
{
"hour": "08:00",
@@ -377,8 +377,8 @@
]
},
{
- "date": "2024-06-09",
- "previous_date": "2024-06-08",
+ "date": "2024/06/09",
+ "previous_date": "2024/06/08",
"order": [
{
"hour": "10:00",
diff --git a/src/styles/partials/_schedule.sass b/src/styles/partials/_schedule.sass
index e70a82f..97c9142 100644
--- a/src/styles/partials/_schedule.sass
+++ b/src/styles/partials/_schedule.sass
@@ -6,6 +6,13 @@
border-radius: 30px
padding: 40px 30px
+ .previous-button, .next-button
+ color: variables.$fuchsia
+ font-size: 20px
+ font-weight: 500
+ cursor: pointer
+ padding: 0 10px
+
.event-container
border: 1px solid variables.$white
border-radius: 10px
@@ -27,6 +34,8 @@
border-right: 1px solid variables.$white
&:last-child
border-right: none
+ &.no-border
+ border-right: none
.talk-card
overflow-x: hidden
@@ -43,5 +52,12 @@
font-size: 17px
.event-title
font-size: 15px
+ line-height: 20px
+ a
+ color: variables.$white
+ .event-speaker
+ font-size: 15px
+ line-height: 12px
+ margin: 10px 0
.event-description
font-size: 13px