diff --git a/src/components/DetailDialog/ScheduleTable.jsx b/src/components/DetailDialog/ScheduleTable.jsx
index aba368b..94b387f 100644
--- a/src/components/DetailDialog/ScheduleTable.jsx
+++ b/src/components/DetailDialog/ScheduleTable.jsx
@@ -1,30 +1,102 @@
import React from "react"
+import styled from "styled-components"
import { Crosshead, CrossheadSub, Columns, Table } from "./DetailDialog.styles"
import { twelveHourTime } from "../../lib/utils"
+export const EventList = styled.div`
+ margin-bottom: 30px;
+ &:last-of-type {
+ margin-bottom: 0px;
+ }
+ div {
+ margin-bottom: 20px;
+ &:last-of-type {
+ margin-bottom: 0px;
+ }
+ }
+ /* @supports (display: grid) {
+ @media screen and (min-width: ${props => props.theme.styles.breakpointM}) {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ column-gap: 35px;
+ row-gap: 25px;
+ div {
+ margin-bottom: 0px;
+ }
+ }
+ } */
+`
+
+export const List = styled.ul`
+ padding-left: 30px;
+`
+
+export const ListItem = styled.li`
+ position: relative;
+ line-height: 1.5;
+ padding-left: 15px;
+ margin-bottom: 10px;
+ &:last-of-type {
+ margin-bottom: 0px;
+ }
+`
+
const ScheduleTable = ({ title, subtitle, regular_schedules }) => {
+ const { event_times, opening_times } = regular_schedules.reduce(
+ (acc, sched) => {
+ if (sched.dtstart) {
+ acc.event_times.push(sched)
+ } else {
+ acc.opening_times.push(sched)
+ }
+ return acc
+ },
+ { event_times: [], opening_times: [] }
+ )
+
+ const OpeningTimes = () => (
+
+
+ {opening_times.map((sched, i) => (
+
+
+ {sched.weekday}s
+ |
+
+ {twelveHourTime(sched.opens_at)} to{" "}
+ {twelveHourTime(sched.closes_at)}
+ |
+
+ ))}
+
+
+ )
+
+ const EventTimes = () => (
+
+ {event_times.map((sched, i) => (
+ {sched.description}
+ ))}
+
+ )
+
return (
- regular_schedules.length > 0 && (
-
- {title && {title}}
- {subtitle && {subtitle}}
-
-
- {regular_schedules.map((sched, i) => (
-
-
- {sched.weekday}s
- |
-
- {twelveHourTime(sched.opens_at)} to{" "}
- {twelveHourTime(sched.closes_at)}
- |
-
- ))}
-
-
-
- )
+ <>
+ {opening_times.length > 0 && (
+
+ {title && {title}}
+ {subtitle && {subtitle}}
+
+
+ )}
+ {event_times.length > 0 && (
+
+ {title && {title}}
+ {subtitle && {subtitle}}
+
+
+ )}
+ >
)
}
diff --git a/src/components/DetailDialog/index.jsx b/src/components/DetailDialog/index.jsx
index 2054cd1..deed225 100644
--- a/src/components/DetailDialog/index.jsx
+++ b/src/components/DetailDialog/index.jsx
@@ -149,6 +149,43 @@ const DetailDialog = ({ serviceId, location, navigate }) => {
if (service.name) {
let goodToKnow = buildGoodToKnow(service)
let categories = service.taxonomies
+
+ const all_location_regular_schedules = service.regular_schedules.filter(
+ v => v.service_at_location === null
+ )
+
+ const {
+ all_location_event_times,
+ all_location_opening_times,
+ } = all_location_regular_schedules.reduce(
+ (acc, sched) => {
+ if (sched.dtstart) {
+ acc.all_location_event_times.push(sched)
+ } else {
+ acc.all_location_opening_times.push(sched)
+ }
+ return acc
+ },
+ { all_location_event_times: [], all_location_opening_times: [] }
+ )
+
+ const location_regular_schedules = service.service_at_locations.reduce(
+ (acc, schedule) => {
+ if (schedule.regular_schedule && schedule.regular_schedule.length > 0) {
+ const locationId = schedule.location_id
+ if (!acc[locationId]) {
+ acc[locationId] = {
+ location: schedule.location,
+ regular_schedules: [],
+ }
+ }
+ acc[locationId].regular_schedules.push(...schedule.regular_schedule)
+ }
+ return acc
+ },
+ {}
+ )
+
return (