add page titles

pages/realtime/[id]/index.js

@@ -1,17 +1,23 @@
 import { useRouter } from 'next/router';
 import AppLayout from 'components/layout/AppLayout';
 import RealtimeDashboard from 'components/pages/realtime/RealtimeDashboard';
+import useMessages from 'hooks/useMessages';
+import useApi from 'hooks/useApi';
 
 export default function RealtimeDetailsPage() {
   const router = useRouter();
   const { id: websiteId } = router.query;
+  const { formatMessage, labels } = useMessages();
+  const { get, useQuery } = useApi();
+  const { data: website } = useQuery(['websites', websiteId], () => get(`/websites/${websiteId}`));
+  const title = formatMessage(labels.realtime) + ' | ' + website?.name;
 
   if (!websiteId) {
     return null;
   }
 
   return (
-    <AppLayout>
+    <AppLayout title={title}>
       <RealtimeDashboard key={websiteId} websiteId={websiteId} />
     </AppLayout>
   );

pages/realtime/index.js

@@ -1,9 +1,11 @@
 import AppLayout from 'components/layout/AppLayout';
 import RealtimeHome from 'components/pages/realtime/RealtimeHome';
+import useMessages from 'hooks/useMessages';
 
 export default function RealtimePage() {
+  const { formatMessage, labels } = useMessages();
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.realtime)}>
       <RealtimeHome />
     </AppLayout>
   );