recordings is taken by nginx so refresh fails - change base to recording

This commit is contained in:
Jason Hunter 2021-06-03 13:02:40 -04:00 committed by Blake Blackshear
parent 0d96c3529d
commit 7b3abe330e
4 changed files with 7 additions and 7 deletions

View File

@ -29,7 +29,7 @@ export default function App() {
<AsyncRoute path="/cameras/:camera" getComponent={Routes.getCamera} /> <AsyncRoute path="/cameras/:camera" getComponent={Routes.getCamera} />
<AsyncRoute path="/events/:eventId" getComponent={Routes.getEvent} /> <AsyncRoute path="/events/:eventId" getComponent={Routes.getEvent} />
<AsyncRoute path="/events" getComponent={Routes.getEvents} /> <AsyncRoute path="/events" getComponent={Routes.getEvents} />
<AsyncRoute path="/recordings/:camera/:date?/:hour?/:seconds?" getComponent={Routes.getRecording} /> <AsyncRoute path="/recording/:camera/:date?/:hour?/:seconds?" getComponent={Routes.getRecording} />
<AsyncRoute path="/debug" getComponent={Routes.getDebug} /> <AsyncRoute path="/debug" getComponent={Routes.getDebug} />
<AsyncRoute path="/styleguide" getComponent={Routes.getStyleGuide} /> <AsyncRoute path="/styleguide" getComponent={Routes.getStyleGuide} />
<Cameras default path="/" /> <Cameras default path="/" />

View File

@ -27,15 +27,15 @@ export default function Sidebar() {
) : null ) : null
} }
</Match> </Match>
<Match path="/recordings/:camera/:date?/:hour?/:seconds?"> <Match path="/recording/:camera/:date?/:hour?/:seconds?">
{({ matches }) => {({ matches }) =>
matches ? ( matches ? (
<Fragment> <Fragment>
<Separator /> <Separator />
{cameras.map((camera) => ( {cameras.map((camera) => (
<Destination <Destination
path={`/recordings/${camera}/:date?/:hour?/:seconds?`} path={`/recording/${camera}/:date?/:hour?/:seconds?`}
href={`/recordings/${camera}`} href={`/recording/${camera}`}
text={camera} text={camera}
/> />
))} ))}

View File

@ -29,7 +29,7 @@ export default function RecordingPlaylist({ camera, recordings, selectedDate, se
}`} }`}
> >
<div className="flex-1"> <div className="flex-1">
<Link href={`/recordings/${camera}/${recording.date}/${item.hour}`} type="text"> <Link href={`/recording/${camera}/${recording.date}/${item.hour}`} type="text">
{item.hour}:00 {item.hour}:00
</Link> </Link>
</div> </div>
@ -87,7 +87,7 @@ export function EventCard({ camera, event, delay }) {
const duration = addSeconds(new Date(0), differenceInSeconds(end, start)); const duration = addSeconds(new Date(0), differenceInSeconds(end, start));
const seconds = Math.max(differenceInSeconds(start, startOfHour(start)) - delay - 10, 0); const seconds = Math.max(differenceInSeconds(start, startOfHour(start)) - delay - 10, 0);
return ( return (
<Link className="" href={`/recordings/${camera}/${format(start, 'yyyy-MM-dd')}/${format(start, 'HH')}/${seconds}`}> <Link className="" href={`/recording/${camera}/${format(start, 'yyyy-MM-dd')}/${format(start, 'HH')}/${seconds}`}>
<div className="flex flex-row mb-2"> <div className="flex flex-row mb-2">
<div className="w-28 mr-4"> <div className="w-28 mr-4">
<img className="antialiased" src={`${apiHost}/api/events/${event.id}/thumbnail.jpg`} /> <img className="antialiased" src={`${apiHost}/api/events/${event.id}/thumbnail.jpg`} />

View File

@ -30,7 +30,7 @@ function Camera({ name }) {
const href = `/cameras/${name}`; const href = `/cameras/${name}`;
const buttons = useMemo(() => [ const buttons = useMemo(() => [
{ name: 'Events', href: `/events?camera=${name}` }, { name: 'Events', href: `/events?camera=${name}` },
{ name: 'Recordings', href: `/recordings/${name}` } { name: 'Recordings', href: `/recording/${name}` }
], [name]); ], [name]);
const icons = useMemo( const icons = useMemo(
() => [ () => [