Add Traefik Hub demo in dashboard

webui/src/pages/http/HttpService.tsx

@@ -1,5 +1,6 @@
 import { Badge, Box, Flex, H1, Skeleton, styled, Text } from '@traefiklabs/faency'
 import { useMemo } from 'react'
+import { Helmet } from 'react-helmet-async'
 import { FiGlobe, FiInfo, FiShield } from 'react-icons/fi'
 import { useParams } from 'react-router-dom'
 
@@ -18,7 +19,6 @@ import { ResourceStatus } from 'components/resources/ResourceStatus'
 import { UsedByRoutersSection, UsedByRoutersSkeleton } from 'components/resources/UsedByRoutersSection'
 import Tooltip from 'components/Tooltip'
 import { ResourceDetailDataType, ServiceDetailType, useResourceDetail } from 'hooks/use-resource-detail'
-import Page from 'layout/Page'
 import { NotFound } from 'pages/NotFound'
 
 type DetailProps = {
@@ -270,17 +270,23 @@ type HttpServiceRenderProps = {
 export const HttpServiceRender = ({ data, error, name }: HttpServiceRenderProps) => {
   if (error) {
     return (
-      <Page title={name}>
+      <>
+        <Helmet>
+          <title>{name} - Traefik Proxy</title>
+        </Helmet>
         <Text data-testid="error-text">
           Sorry, we could not fetch detail information for this Service right now. Please, try again later.
         </Text>
-      </Page>
+      </>
     )
   }
 
   if (!data) {
     return (
-      <Page title={name}>
+      <>
+        <Helmet>
+          <title>{name} - Traefik Proxy</title>
+        </Helmet>
         <Skeleton css={{ height: '$7', width: '320px', mb: '$8' }} data-testid="skeleton" />
         <SpacedColumns>
           <DetailSectionSkeleton narrow />
@@ -288,7 +294,7 @@ export const HttpServiceRender = ({ data, error, name }: HttpServiceRenderProps)
           <DetailSectionSkeleton narrow />
         </SpacedColumns>
         <UsedByRoutersSkeleton />
-      </Page>
+      </>
     )
   }
 
@@ -297,11 +303,14 @@ export const HttpServiceRender = ({ data, error, name }: HttpServiceRenderProps)
   }
 
   return (
-    <Page title={name}>
+    <>
+      <Helmet>
+        <title>{data.name} - Traefik Proxy</title>
+      </Helmet>
       <H1 css={{ mb: '$7' }}>{data.name}</H1>
       <ServicePanels data={data} protocol="http" />
       <UsedByRoutersSection data={data} protocol="http" />
-    </Page>
+    </>
   )
 }