ovh · sachinrameshn · Oct 14, 2024 · Oct 10, 2024 · Oct 10, 2024 · Oct 10, 2024
@@ -30,5 +30,8 @@
   "serviceIdLabel": "Dienst-ID",
   "serviceIdCopyToast": "Die Dienst-ID wurde kopiert.",
   "billingLink": "Abrechnung verwalten",
-  "supportLink": "Support kontaktieren"
+  "supportLink": "Support kontaktieren",
+  "connectionDetailsCertificateLabel": "Zertifikat",
+  "connectionDetailsCertificateCopyToast": "Das CA-Zertifikat wurde in die Zwischenablage kopiert.",
+  "connectionDetailsCertificateDownloadToast": "Das CA-Zertifikat wurde hochgeladen."
 }
@@ -30,5 +30,8 @@
   "serviceIdLabel": "Service ID",
   "serviceIdCopyToast": "The service ID has been copied",
   "billingLink": "Manage billing",
-  "supportLink": "Contact support"
+  "supportLink": "Contact support",
+  "connectionDetailsCertificateLabel": "Certificate",
+  "connectionDetailsCertificateCopyToast": "The CA certificate has been copied to your clipboard",
+  "connectionDetailsCertificateDownloadToast": "The CA certificate has been uploaded"
 }
@@ -30,5 +30,8 @@
   "serviceIdLabel": "ID del servicio",
   "serviceIdCopyToast": "Se ha copiado el ID del servicio",
   "billingLink": "Gestionar la facturación",
-  "supportLink": "Contactar con el soporte"
+  "supportLink": "Contactar con el soporte",
+  "connectionDetailsCertificateLabel": "Certificado",
+  "connectionDetailsCertificateCopyToast": "El certificado CA se ha copiado en el portapapeles.",
+  "connectionDetailsCertificateDownloadToast": "Se ha cargado el certificado CA."
 }
@@ -16,6 +16,9 @@
   "connectionDetailsTableSSLMode": "obligatoire",
   "connectionDetailsHostCopyToast": "L'url de l'hote a été copiée",
   "connectionDetailsURICopyToast": "L'URI a été copiée",
+  "connectionDetailsCertificateLabel": "Certificat",
+  "connectionDetailsCertificateCopyToast": "Le certificat CA a été copié dans votre presse papier",
+  "connectionDetailsCertificateDownloadToast": "Le certificat CA a été téléchargé",
   "maintenanceTitle": "Maintenance",
   "noMaintenanceDescription": "Aucune maintenance n'est prévue sur votre service.",
   "oneMaintenanceDescription1": "{{number}} maintenance",

@@ -16,6 +16,9 @@
   "connectionDetailsTableSSLMode": "obligatoire",
   "connectionDetailsHostCopyToast": "L'url de l'hote a été copiée",
   "connectionDetailsURICopyToast": "L'URI a été copiée",
+  "connectionDetailsCertificateLabel": "Certificat",
+  "connectionDetailsCertificateCopyToast": "Le certificat CA a été copié dans votre presse papier",
+  "connectionDetailsCertificateDownloadToast": "Le certificat CA a été téléchargé",
   "maintenanceTitle": "Maintenance",
   "noMaintenanceDescription": "Aucune maintenance n'est prévue sur votre service.",
   "oneMaintenanceDescription1": "{{number}} maintenance",

@@ -30,5 +30,8 @@
   "serviceIdLabel": "ID del servizio",
   "serviceIdCopyToast": "L'ID del servizio è stato copiato",
   "billingLink": "Gestisci la fatturazione",
-  "supportLink": "Contattare il supporto"
+  "supportLink": "Contattare il supporto",
+  "connectionDetailsCertificateLabel": "Certificato",
+  "connectionDetailsCertificateCopyToast": "Il certificato CA è stato copiato negli appunti",
+  "connectionDetailsCertificateDownloadToast": "Il certificato CA è stato scaricato"
 }
@@ -30,5 +30,8 @@
   "serviceIdLabel": "Identyfikator usługi",
   "serviceIdCopyToast": "Identyfikator usługi został skopiowany",
   "billingLink": "Zarządzaj płatnościami",
-  "supportLink": "Skontaktuj się z pomocą techniczną"
+  "supportLink": "Skontaktuj się z pomocą techniczną",
+  "connectionDetailsCertificateLabel": "Certyfikat",
+  "connectionDetailsCertificateCopyToast": "Certyfikat CA został skopiowany do schowka",
+  "connectionDetailsCertificateDownloadToast": "Certyfikat CA został pobrany"
 }
@@ -30,5 +30,8 @@
   "serviceIdLabel": "ID do serviço",
   "serviceIdCopyToast": "O ID do serviço foi copiado",
   "billingLink": "Gerir a faturação",
-  "supportLink": "Contactar o Apoio ao Cliente"
+  "supportLink": "Contactar o Apoio ao Cliente",
+  "connectionDetailsCertificateLabel": "Certificado",
+  "connectionDetailsCertificateCopyToast": "O certificado CA foi copiado para a área de transferência",
+  "connectionDetailsCertificateDownloadToast": "O certificado CA foi descarregado"
 }
@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import { Files } from 'lucide-react';
+import { Download, Files } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { Button } from '@/components/ui/button';
 import {
@@ -12,19 +12,36 @@ import {
 import { Table, TableBody, TableCell, TableRow } from '@/components/ui/table';
 import * as database from '@/types/cloud/project/database';
 import { useToast } from '@/components/ui/use-toast';
+import { useServiceData } from '../../Service.context';
+import { useGetCertificate } from '@/hooks/api/database/certificate/useGetCertificate.hook';
+import useDownload from '@/hooks/useDownload';
 
 interface ConnectionDetailsProps {
   endpoints: database.service.Endpoint[];
 }
 
 const ConnectionDetails = ({ endpoints }: ConnectionDetailsProps) => {
+  const { service, projectId } = useServiceData();
+
+  const certificateQuery = useGetCertificate(
+    projectId,
+    service.engine,
+    service.id,
+    {
+      enabled:
+        service.capabilities.certificates?.read ===
+        database.service.capability.StateEnum.enabled,
+    },
+  );
+
   const [selectedEndpoint, setSelectedEndpoint] = useState<
     database.service.Endpoint
   >(endpoints[0]);
   const { t } = useTranslation(
     'pci-databases-analytics/services/service/dashboard',
   );
   const toast = useToast();
+  const { download } = useDownload();
   return (
     <div data-testid="connection-details-container">
       {endpoints.length > 1 && (
@@ -60,13 +77,13 @@ const ConnectionDetails = ({ endpoints }: ConnectionDetailsProps) => {
               </TableCell>
               <TableCell>
                 <p
-                  className="flex-1 truncate h-6 max-w-[300px] m-0"
+                  className="flex-1 truncate h-6 max-w-[250px] m-0"
                   title={selectedEndpoint.domain}
                 >
                   {selectedEndpoint.domain}
                 </p>
               </TableCell>
-              <TableCell>
+              <TableCell className="justify-items-center">
                 <Button
                   data-testid="dashboard-connection-detail-domain-button"
                   type="button"
@@ -84,7 +101,7 @@ const ConnectionDetails = ({ endpoints }: ConnectionDetailsProps) => {
               </TableCell>
             </TableRow>
           )}
-          {selectedEndpoint?.port && (
+          {selectedEndpoint?.port > 0 && (
             <TableRow>
               <TableCell className="font-semibold">
                 {t('connectionDetailsTableHeaderPort')}
@@ -115,7 +132,7 @@ const ConnectionDetails = ({ endpoints }: ConnectionDetailsProps) => {
               </TableCell>
               <TableCell>
                 <p
-                  className="flex-1 truncate h-6 max-w-[300px]"
+                  className="flex-1 truncate h-6 max-w-[250px]"
                   title={selectedEndpoint.uri}
                 >
                   {selectedEndpoint.uri}
@@ -139,6 +156,53 @@ const ConnectionDetails = ({ endpoints }: ConnectionDetailsProps) => {
               </TableCell>
             </TableRow>
           )}
+          {certificateQuery.isSuccess && certificateQuery?.data?.ca && (
+            <TableRow>
+              <TableCell className="font-semibold">
+                {t('connectionDetailsCertificateLabel')}
+              </TableCell>
+              <TableCell>
+                <p
+                  className="flex-1 truncate h-6 max-w-[250px]"
+                  title={certificateQuery.data.ca}
+                >
+                  {certificateQuery.data.ca}
+                </p>
+              </TableCell>
+              <TableCell>
+                <div className="flex flex-row gap-1">
+                  <Button
+                    data-testid="connection-details-copy-certificate-action"
+                    type="button"
+                    size="table"
+                    variant="table"
+                    onClick={() => {
+                      navigator.clipboard.writeText(certificateQuery.data.ca);
+                      toast.toast({
+                        title: t('connectionDetailsCertificateCopyToast'),
+                      });
+                    }}
+                  >
+                    <Files className="w-4 h-4" />
+                  </Button>
+                  <Button
+                    data-testid="connection-details-download-ca-action"
+                    type="button"
+                    size="table"
+                    variant="table"
+                    onClick={() => {
+                      download(certificateQuery.data.ca, 'ca.pem');
+                      toast.toast({
+                        title: t('connectionDetailsCertificateDownloadToast'),
+                      });
+                    }}
+                  >
+                    <Download className="w-4 h-4" />
+                  </Button>
+                </div>
+              </TableCell>
+            </TableRow>
+          )}
         </TableBody>
       </Table>
     </div>

@@ -15,7 +15,9 @@ module.exports = {
   rules: {
     'import/extensions': 'off',
     '@typescript-eslint/no-non-null-assertion': 'off',
-    'arrow-body-style': ["error", "as-needed"],
+    'arrow-body-style': ['error', 'as-needed'],
     'prefer-const': 'error',
+    'react/jsx-curly-brace-presence': ['error', { props: 'never', children: 'never' }],
+    'react/jsx-boolean-value': ['error', 'never'],
   },
 };
@@ -0,0 +1,53 @@
+import { describe, it, vi } from 'vitest';
+import { renderHook, waitFor } from '@testing-library/react';
+import * as useMeModule from '@ovh-ux/manager-react-components';
+import { IMe } from '@ovh-ux/manager-react-components';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { getCatalog, TCatalog } from '@ovh-ux/manager-pci-common';
+import { useCatalog } from './useCatalog';
+
+vi.mock('@ovh-ux/manager-pci-common', () => ({
+  getCatalog: vi.fn().mockResolvedValue({}),
+  getCatalogUrl: vi.fn().mockReturnValue('catalogUrl'),
+}));
+
+const client = new QueryClient();
+const wrapper = ({ children }) => (
+  <QueryClientProvider client={client}>{children}</QueryClientProvider>
+);
+
+describe('useCatalog', () => {
+  it('useCatalog returns catalog when user is present', async ({ expect }) => {
+    const mockCatalog = ({ id: 'testCatalog' } as unknown) as TCatalog;
+    const useMeSpy = vi.spyOn(useMeModule, 'useMe');
+    const iMe: IMe = {
+      ovhSubsidiary: 'subsidiary',
+      currency: {
+        code: 'USD',
+      },
+    };
+    useMeSpy.mockReturnValue({ me: iMe });
+    vi.mocked(getCatalog).mockResolvedValue(mockCatalog);
+
+    const { result } = renderHook(() => useCatalog(), { wrapper });
+    waitFor(() => {
+      expect(result.current.data).toEqual(mockCatalog);
+    });
+  });
+
+  it('useCatalog returns error when fetching catalog fails', async ({
+    expect,
+  }) => {
+    const mockError = new Error('Failed to fetch catalog');
+    const useMeSpy = vi.spyOn(useMeModule, 'useMe');
+
+    useMeSpy.mockReturnValue({ me: { ovhSubsidiary: 'subsidiary' } as IMe });
+    vi.mocked(getCatalog).mockRejectedValue(mockError);
+
+    const { result } = renderHook(() => useCatalog(), { wrapper });
+
+    waitFor(() => {
+      expect(result.current.error).toEqual(mockError);
+    });
+  });
+});
@@ -0,0 +1,44 @@
+import { describe, it, vi } from 'vitest';
+import { renderHook, waitFor } from '@testing-library/react';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { useInactiveRegions } from './useInactiveRegions';
+import { getInactiveRegions, TInactiveRegion } from '@/api/data/regions';
+
+const client = new QueryClient();
+const wrapper = ({ children }) => (
+  <QueryClientProvider client={client}>{children}</QueryClientProvider>
+);
+
+vi.mock('@/api/data/regions', () => ({
+  getInactiveRegions: vi.fn().mockResolvedValue([]),
+  getInactiveRegionsUrl: vi.fn().mockReturnValue('inactiveRegionsUrl'),
+}));
+
+describe('useInactiveRegions', () => {
+  it('useInactiveRegions returns inactive regions when project id is present', async () => {
+    const mockInactiveRegions = ([
+      { id: 'region1' },
+      { id: 'region2' },
+    ] as unknown) as TInactiveRegion[];
+
+    vi.mocked(getInactiveRegions).mockResolvedValue(mockInactiveRegions);
+
+    const { result } = renderHook(() => useInactiveRegions('projectId'), {
+      wrapper,
+    });
+    await waitFor(() =>
+      expect(result.current.data).toEqual(mockInactiveRegions),
+    );
+  });
+
+  it('useInactiveRegions returns error when fetching inactive regions fails', () => {
+    const mockError = new Error('Failed to fetch inactive regions');
+
+    vi.mocked(getInactiveRegions).mockRejectedValue(mockError);
+
+    const { result } = renderHook(() => useInactiveRegions('projectId'), {
+      wrapper,
+    });
+    waitFor(() => expect(result.current.error).toEqual(mockError));
+  });
+});