feat(observability): add onboarding pages for tenants and services

resolves: #MAOBS-110

Signed-off-by: David Arsène <david.arsene.ext@ovhcloud.com>

Author: darsene

.eslintignore

@@ -46,6 +46,7 @@ packages/manager-tools/manager-pm
 packages/manager-tools/manager-muk-cli
 packages/manager/apps/pci-instances
 packages/manager/apps/pci-workflow
+packages/manager/apps/observability
 packages/manager/apps/web-domains
 packages/manager/apps/web-hosting
 packages/manager/apps/web-office

.prettierignore

@@ -12,3 +12,4 @@ packages/manager/apps/pci-databases-analytics/src/components/ui
 packages/manager/apps/pci-databases-analytics/src/lib/utils.ts
 packages/manager-ui-kit
 packages/manager-wiki
+packages/manager/apps/observability

packages/manager/apps/container/src/container/legacy/server-sidebar/universe/DedicatedSidebar.tsx

@@ -537,7 +537,7 @@ export default function DedicatedSidebar() {
             id: 'tenants',
             href: navigation.getURL('observability', '#/metrics/tenants'),
             label: t('sidebar_observability_metrics_tenants'),
-            pathMatcher: new RegExp('^/observability/metrics/tenants'),
+            pathMatcher: new RegExp('^/observability/metrics'),
             ignoreSearch: true,
             icon: observabilityIcon,
           },

packages/manager/apps/container/src/container/nav-reshuffle/sidebar/navigation-tree/services/observability.ts

@@ -45,6 +45,7 @@ sioUniverse.children = [
         routing: {
           application: 'observability',
           hash: '#/metrics/tenants',
+          // TODO: manage patchMather once merged
         },
       },
     ],

packages/manager/apps/observability/README.md

@@ -34,6 +34,14 @@ The app uses **hash-based routing**. Open the dev server URL printed by Vite (de
 ```
 #/[flavor-aware root from Routes.utils.ts]
 ```
+### Enable mock mode for API calls (temporary)
+
+Update `src/__mocks__/mock.config.ts`
+```js
+export const apiConfig = {
+  mode: 'mock',
+};
+```
 ---
 
 ## 📚 Useful Links

packages/manager/apps/observability/package.json

@@ -19,6 +19,7 @@
     "test:coverage": "manager-test run --coverage"
   },
   "dependencies": {
+    "@ovh-ux/manager-common-translations": "*",
     "@ovh-ux/manager-config": "*",
     "@ovh-ux/manager-core-api": "*",
     "@ovh-ux/manager-core-utils": "*",
@@ -51,8 +52,5 @@
     "CA",
     "EU",
     "US"
-  ],
-  "universes": [
-    "Manager"
   ]
 }

packages/manager/apps/observability/public/translations/metrics/Messages_fr_FR.json

@@ -1,3 +1,10 @@
 {
-  "title": "Metrics"
+  "listing": {
+    "service": "Service",
+    "select_observability_service": "Sélectionnez un service"
+  },
+  "onboarding": {
+    "description": "Créez votre service pour découvrir comment les métriques d'observabilité vont vous aider à accéder à une vision plus fine et granulaire des performances de votre infrastructure et vos applications.",
+    "orderButtonLabel": "Activez votre service"
+  }
 }

packages/manager/apps/observability/public/translations/tenants/Messages_fr_FR.json

@@ -1,6 +1,9 @@
 {
-  "title": "Tenants",
   "listing": {
     "title": "Liste des tenants"
+  },
+  "onboarding": {
+    "description": "Créez votre nouveau tenant pour continuer à explorer tout le potentiel des métriques d'observabilité. Vous pourrez envoyer des données, créer des tableaux de bord et configurer des alertes adaptées à vos besoins spécifiques.",
+    "orderButtonLabel": "Créez votre tenant"
   }
 }

packages/manager/apps/observability/setupTests.ts

@@ -5,6 +5,13 @@ import { vi } from 'vitest';
 
 global.fetch = fetch;
 
+// TODO remove during unmocking phase
+vi.mock('@/__mocks__/mock.config', () => ({
+  apiConfig: {
+    mode: 'api',
+  },
+}));
+
 vi.mock('react-i18next', () => ({
   useTranslation: () => ({
     t: (translationKey: string) => translationKey,

packages/manager/apps/observability/src/App.constants.ts

@@ -1,6 +1,6 @@
 export const appName = 'observability';
 
-export const AppConfig = {  
+export const AppConfig = {
   rootLabel: appName,
 } as const;