Bump review-ui @saferplace/api to 0.0.19 (#233)

This required a few more changes as the APIs has changed.

packages/review-ui/package.json

@@ -21,7 +21,7 @@
     "@emotion/styled": "^11.11.0",
     "@mui/icons-material": "^5.14.12",
     "@mui/material": "^5.14.9",
-    "@saferplace/api": "^0.0.18",
+    "@saferplace/api": "^0.0.19",
     "leaflet": "^1.9.4",
     "oidc-react": "^3.2.2",
     "react": "^18.2.0",

packages/review-ui/src/main.tsx

@@ -2,15 +2,15 @@ import { CssBaseline } from '@mui/material'
 import React from 'react'
 import ReactDOM from 'react-dom/client'
 import { createBrowserRouter, LoaderFunctionArgs, RouterProvider } from 'react-router-dom'
-import Incident, { Props } from './routes/incident'
+import IncidentView, { Props } from './routes/incident'
 import Pending from './routes/pending'
 import Root from './routes/root'
 import { ReviewService } from '@saferplace/api/review/v1/review_connect'
-import { BasicIncidentDetails } from '@saferplace/api/review/v1/review_pb'
 import ErrorPage from './routes/error'
 
 import { createPromiseClient, Interceptor } from '@bufbuild/connect'
 import { createConnectTransport } from '@bufbuild/connect-web'
+import { Incident } from '@saferplace/api/incident/v1/incident_pb'
 
 const addReviewerEmailInterceptor: Interceptor = (next) => async (req) => {
   req.header.set('email', localStorage.getItem('email') ?? '')
@@ -25,7 +25,7 @@ const client = createPromiseClient(
   }),
 )
 
-async function pendingLoader(): Promise<BasicIncidentDetails[]> {
+async function pendingLoader(): Promise<Incident[]> {
   const res = await client.incidentsWithoutReview({})
   return res.incidents
 }
@@ -49,7 +49,7 @@ const router = createBrowserRouter([
         loader: pendingLoader,
       }, {
         path: 'incident/:id',
-        element: <Incident />,
+        element: <IncidentView />,
         loader: incidentLoader,
       }
     ],

packages/review-ui/src/routes/incident.tsx

@@ -70,7 +70,7 @@ function Review({incident, onSubmit}: Props) {
         />
         <TextField
           label='Time Submitted'
-          value={new Date(Number(incident.timestamp) * 1000)}
+          value={incident.timestamp?.toDate().toString()}
           disabled
           fullWidth
           margin='normal'

packages/review-ui/src/routes/pending.tsx

@@ -1,11 +1,11 @@
 import { Card, CardContent, CardHeader, Stack, Typography } from '@mui/material'
 import React from 'react'
 import { useLoaderData, Link } from 'react-router-dom'
-import { BasicIncidentDetails } from '@saferplace/api/review/v1/review_pb'
 import { ArrowForwardIos } from '@mui/icons-material'
+import { Incident } from '@saferplace/api/incident/v1/incident_pb'
 
 export default function Pending() {
-  const incidents = useLoaderData() as BasicIncidentDetails[]
+  const incidents = useLoaderData() as Incident[]
   return (
     <Stack spacing={1}>
       <Typography variant='h4'>Incidents Pending Review</Typography>
@@ -18,8 +18,7 @@ export default function Pending() {
         >
           <CardHeader
             action={<ArrowForwardIos />}
-            title={new Date(Number(incident.timestamp) * 1000).toString()}
-            subheader={(new Date(Number(incident.timestamp) * 1000)).toString()}
+            title={incident.timestamp?.toDate().toString()}
           />
           <CardContent>