Compare commits
No commits in common. "77c88b2075eb28b10f247a993f4bf1be3ad18f23" and "1b14b697c9f30dff79ec5e740d6273067c00939e" have entirely different histories.
77c88b2075
...
1b14b697c9
|
@ -10,7 +10,6 @@
|
||||||
"preview": "vite preview"
|
"preview": "vite preview"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"prop-types": "^15.8.1",
|
|
||||||
"react": "^18.3.1",
|
"react": "^18.3.1",
|
||||||
"react-dom": "^18.3.1",
|
"react-dom": "^18.3.1",
|
||||||
"swr": "^2.2.5"
|
"swr": "^2.2.5"
|
||||||
|
|
|
@ -1,55 +0,0 @@
|
||||||
import PropTypes from 'prop-types';
|
|
||||||
import useEvents from './hooks/useEvents.js';
|
|
||||||
import useSpeakers from './hooks/useSpeakers.js';
|
|
||||||
import useTracks from './hooks/useTracks.js';
|
|
||||||
import useEventTypes from './hooks/useEventTypes.js';
|
|
||||||
import useHalls from './hooks/useHalls.js';
|
|
||||||
import useSlots from './hooks/useSlots.js';
|
|
||||||
|
|
||||||
export default function Schedule({
|
|
||||||
conferenceId,
|
|
||||||
}) {
|
|
||||||
const {
|
|
||||||
data: events,
|
|
||||||
} = useEvents(conferenceId);
|
|
||||||
|
|
||||||
const {
|
|
||||||
data: speakers,
|
|
||||||
} = useSpeakers(conferenceId);
|
|
||||||
|
|
||||||
const {
|
|
||||||
data: tracks,
|
|
||||||
} = useTracks(conferenceId);
|
|
||||||
|
|
||||||
const {
|
|
||||||
data: eventTypes,
|
|
||||||
} = useEventTypes(conferenceId);
|
|
||||||
|
|
||||||
const {
|
|
||||||
data: halls,
|
|
||||||
} = useHalls(conferenceId);
|
|
||||||
|
|
||||||
const {
|
|
||||||
data: slots,
|
|
||||||
} = useSlots(conferenceId);
|
|
||||||
|
|
||||||
return (<>
|
|
||||||
<div>conference id: {conferenceId}</div>
|
|
||||||
<div>events:</div>
|
|
||||||
<div>{JSON.stringify(events)}</div>
|
|
||||||
<div>speakers:</div>
|
|
||||||
<div>{JSON.stringify(speakers)}</div>
|
|
||||||
<div>tracks:</div>
|
|
||||||
<div>{JSON.stringify(tracks)}</div>
|
|
||||||
<div>event types:</div>
|
|
||||||
<div>{JSON.stringify(eventTypes)}</div>
|
|
||||||
<div>halls:</div>
|
|
||||||
<div>{JSON.stringify(halls)}</div>
|
|
||||||
<div>slots:</div>
|
|
||||||
<div>{JSON.stringify(slots)}</div>
|
|
||||||
</>);
|
|
||||||
}
|
|
||||||
|
|
||||||
Schedule.propTypes = {
|
|
||||||
conferenceId: PropTypes.string.isRequired,
|
|
||||||
};
|
|
|
@ -1,31 +1,21 @@
|
||||||
import useConferences from './hooks/useConferences.js';
|
import useConferences from './hooks/useConferences.js';
|
||||||
import { useMemo, useState } from 'react';
|
|
||||||
import Schedule from './Schedule.jsx';
|
|
||||||
import { dateSorter } from './utils.js';
|
|
||||||
|
|
||||||
export default function ScheduleLoader() {
|
export default function ScheduleLoader() {
|
||||||
const {
|
const {
|
||||||
data,
|
conferences,
|
||||||
error,
|
error,
|
||||||
isLoading,
|
isLoading,
|
||||||
} = useConferences();
|
} = useConferences();
|
||||||
|
|
||||||
const conferences = useMemo(() => Array.isArray(data) ? data.sort(dateSorter('start_date')) : data, [data]);
|
|
||||||
|
|
||||||
const [ conferenceId, setConferenceId ] = useState();
|
|
||||||
|
|
||||||
return (<>
|
return (<>
|
||||||
{isLoading && <p>Please wait...</p>}
|
{isLoading && <p>Please wait...</p>}
|
||||||
{error && <p>Error: {error}</p>}
|
{error && <p>Error: {error}</p>}
|
||||||
{conferences && <>
|
{conferences && <>
|
||||||
<label>Select a conference</label>
|
<label>Select a conference</label>
|
||||||
<select onChange={e => setConferenceId(e.target.value)}>
|
<select>
|
||||||
{conferences.map(conference => <option key={conference.id}
|
{conferences.map(conference => <option key={conference.id}
|
||||||
value={conference.id}>{conference.title}</option>)}
|
value={conference.id}>{conference.title}</option>)}
|
||||||
</select>
|
</select>
|
||||||
</>}
|
</>}
|
||||||
{conferenceId && <div>
|
|
||||||
<Schedule conferenceId={conferenceId} />
|
|
||||||
</div>}
|
|
||||||
</>);
|
</>);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +1,17 @@
|
||||||
import useCfpRequest from './useCfpRequest.js';
|
import useCfpRequest from './useCfpRequest.js';
|
||||||
|
import { useMemo } from 'react';
|
||||||
|
import { dateSorter } from '../utils.js';
|
||||||
|
|
||||||
export default function useConferences() {
|
export default function useConferences() {
|
||||||
return useCfpRequest();
|
const {
|
||||||
|
data,
|
||||||
|
...rest
|
||||||
|
} = useCfpRequest();
|
||||||
|
|
||||||
|
const conferences = useMemo(() => Array.isArray(data) ? data.sort(dateSorter('start_date')) : data, [data]);
|
||||||
|
|
||||||
|
return {
|
||||||
|
conferences,
|
||||||
|
...rest,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +0,0 @@
|
||||||
import useCfpRequest from './useCfpRequest.js';
|
|
||||||
|
|
||||||
export default function useEventTypes(conferenceId) {
|
|
||||||
return useCfpRequest(`${conferenceId}/event_types.json`);
|
|
||||||
}
|
|
|
@ -1,5 +0,0 @@
|
||||||
import useCfpRequest from './useCfpRequest.js';
|
|
||||||
|
|
||||||
export default function useEvents(conferenceId) {
|
|
||||||
return useCfpRequest(`${conferenceId}/events.json`);
|
|
||||||
}
|
|
|
@ -1,5 +0,0 @@
|
||||||
import useCfpRequest from './useCfpRequest.js';
|
|
||||||
|
|
||||||
export default function useHalls(conferenceId) {
|
|
||||||
return useCfpRequest(`${conferenceId}/halls.json`);
|
|
||||||
}
|
|
|
@ -1,5 +0,0 @@
|
||||||
import useCfpRequest from './useCfpRequest.js';
|
|
||||||
|
|
||||||
export default function useSlots(conferenceId) {
|
|
||||||
return useCfpRequest(`${conferenceId}/slots.json`);
|
|
||||||
}
|
|
|
@ -1,5 +0,0 @@
|
||||||
import useCfpRequest from './useCfpRequest.js';
|
|
||||||
|
|
||||||
export default function useSpeakers(conferenceId) {
|
|
||||||
return useCfpRequest(`${conferenceId}/speakers.json`);
|
|
||||||
}
|
|
|
@ -1,5 +0,0 @@
|
||||||
import useCfpRequest from './useCfpRequest.js';
|
|
||||||
|
|
||||||
export default function useTracks(conferenceId) {
|
|
||||||
return useCfpRequest(`${conferenceId}/tracks.json`);
|
|
||||||
}
|
|
Loading…
Reference in New Issue