diff --git a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_de_DE.json b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_de_DE.json index 4807f7f26ec0..a89b2d1a9273 100644 --- a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_de_DE.json +++ b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_de_DE.json @@ -2,5 +2,7 @@ "see_more_label": "Mehr erfahren", "octavia_load_balancer_logs_breadcrumb_label": "Logs", "octavia_load_balancer_logs_main_description": "Im Folgenden finden Sie die Logs Ihres Loadbalancers für TCP-, HTTP-, HTTPS- und TERMINATED_HTTPS-Listener (UDP wird nicht unterstützt). Diese Logs werden von der Open-Source-Komponente HAProxy generiert.", - "octavia_load_balancer_data_streams_description_haproxy": "Wenn Sie die HAProxy-Logs Ihres Loadbalancers abonnieren, werden sie auf die Logs Data Platform übertragen. Sie können sie mit Ihren anderen Logs zentralisieren, erweiterte Suchvorgänge durchführen, ihre Aufbewahrung verwalten, Alarme definieren und Dashboards erstellen, um Ihre Anwendungen mit Loadbalancer zu überwachen." + "octavia_load_balancer_data_streams_description_haproxy": "Wenn Sie die HAProxy-Logs Ihres Loadbalancers abonnieren, werden sie auf die Logs Data Platform übertragen. Sie können sie mit Ihren anderen Logs zentralisieren, erweiterte Suchvorgänge durchführen, ihre Aufbewahrung verwalten, Alarme definieren und Dashboards erstellen, um Ihre Anwendungen mit Loadbalancer zu überwachen.", + "logs_list_add_data_stream_button": "Stream hinzufügen", + "logs_list_title": "Streams" } diff --git a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_en_GB.json b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_en_GB.json index c4ef3c8e8894..5e3face83983 100644 --- a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_en_GB.json +++ b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_en_GB.json @@ -2,5 +2,7 @@ "see_more_label": "Find out more", "octavia_load_balancer_logs_breadcrumb_label": "Logs", "octavia_load_balancer_logs_main_description": "Below are the logs for your load balancer, separated into categories such as TCP, HTTP, HTTPS, and TERMINATED_HTTPS (please note that UDP is not supported). These logs are those generated by the HAProxy OpenSource component.", - "octavia_load_balancer_data_streams_description_haproxy": "By subscribing to your Load Balancer’s haproxy logs, they will be seamlessly transferred to the Logs Data Platform. You can centralise them with your other logs, conduct advanced searches, manage their retention, set alerts, and set up dashboards to monitor your applications using Load Balancers." + "octavia_load_balancer_data_streams_description_haproxy": "By subscribing to your Load Balancer’s haproxy logs, they will be seamlessly transferred to the Logs Data Platform. You can centralise them with your other logs, conduct advanced searches, manage their retention, set alerts, and set up dashboards to monitor your applications using Load Balancers.", + "logs_list_add_data_stream_button": "Add data stream", + "logs_list_title": "Data stream" } diff --git a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_es_ES.json b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_es_ES.json index 5a4c814e958b..5f19cde0f653 100644 --- a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_es_ES.json +++ b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_es_ES.json @@ -2,5 +2,7 @@ "see_more_label": "Más información", "octavia_load_balancer_logs_breadcrumb_label": "Logs", "octavia_load_balancer_logs_main_description": "A continuación encontrará los logs de su Load Balancer para los «listeners» de tipo TCP, HTTP, HTTPS y TERMINATED_HTTPS (UDP no es compatible). Estos son los logs generados por el componente open source HAProxy.", - "octavia_load_balancer_data_streams_description_haproxy": "Al suscribirse a los logs HAProxy de su Load Balancer, estos registros se transferirán a Logs Data Platform, desde donde podrá gestionarlos de forma centralizada junto con el resto de sus logs. Además, podrá realizar búsquedas más avanzadas, gestionar sus retenciones, definir alertas y «dashboards» para monitorizar sus aplicaciones que utilizan Load Balancers." + "octavia_load_balancer_data_streams_description_haproxy": "Al suscribirse a los logs HAProxy de su Load Balancer, estos registros se transferirán a Logs Data Platform, desde donde podrá gestionarlos de forma centralizada junto con el resto de sus logs. Además, podrá realizar búsquedas más avanzadas, gestionar sus retenciones, definir alertas y «dashboards» para monitorizar sus aplicaciones que utilizan Load Balancers.", + "logs_list_add_data_stream_button": "Añadir un flujo de datos", + "logs_list_title": "Flujos de datos" } diff --git a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_fr_CA.json b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_fr_CA.json index c62a246c3407..55b532858457 100644 --- a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_fr_CA.json +++ b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_fr_CA.json @@ -2,5 +2,8 @@ "see_more_label": "En savoir plus", "octavia_load_balancer_logs_breadcrumb_label": "Logs", "octavia_load_balancer_logs_main_description": "Vous trouverez ci-dessous les logs de votre load balancer pour les listeners de type TCP, HTTP, HTTPS & TERMINATED_HTTPS (UDP n'est pas supporté). Ces logs sont ceux générés par le composant OpenSource HAProxy.", - "octavia_load_balancer_data_streams_description_haproxy": "En vous abonnant aux logs haproxy de votre Load Balancer, ils seront transférés dans Logs Data Platform et vous pourrez les centraliser avec vos autres logs, effectuer des recherches avancées, gérer leurs rétentions, définir des alertes ainsi que des tableaux de bord pour observer vos applications utilisant des Load Balancers." + "octavia_load_balancer_data_streams_description_haproxy": "En vous abonnant aux logs haproxy de votre Load Balancer, ils seront transférés dans Logs Data Platform et vous pourrez les centraliser avec vos autres logs, effectuer des recherches avancées, gérer leurs rétentions, définir des alertes ainsi que des tableaux de bord pour observer vos applications utilisant des Load Balancers.", + "logs_list_add_data_stream_button": "Ajouter un flux de données", + "kube_logs_tab_title": "Logs", + "logs_list_title": "Flux de données" } diff --git a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_fr_FR.json b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_fr_FR.json index c62a246c3407..55b532858457 100644 --- a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_fr_FR.json +++ b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_fr_FR.json @@ -2,5 +2,8 @@ "see_more_label": "En savoir plus", "octavia_load_balancer_logs_breadcrumb_label": "Logs", "octavia_load_balancer_logs_main_description": "Vous trouverez ci-dessous les logs de votre load balancer pour les listeners de type TCP, HTTP, HTTPS & TERMINATED_HTTPS (UDP n'est pas supporté). Ces logs sont ceux générés par le composant OpenSource HAProxy.", - "octavia_load_balancer_data_streams_description_haproxy": "En vous abonnant aux logs haproxy de votre Load Balancer, ils seront transférés dans Logs Data Platform et vous pourrez les centraliser avec vos autres logs, effectuer des recherches avancées, gérer leurs rétentions, définir des alertes ainsi que des tableaux de bord pour observer vos applications utilisant des Load Balancers." + "octavia_load_balancer_data_streams_description_haproxy": "En vous abonnant aux logs haproxy de votre Load Balancer, ils seront transférés dans Logs Data Platform et vous pourrez les centraliser avec vos autres logs, effectuer des recherches avancées, gérer leurs rétentions, définir des alertes ainsi que des tableaux de bord pour observer vos applications utilisant des Load Balancers.", + "logs_list_add_data_stream_button": "Ajouter un flux de données", + "kube_logs_tab_title": "Logs", + "logs_list_title": "Flux de données" } diff --git a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_it_IT.json b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_it_IT.json index 8ba8c21c7b9e..81118b084856 100644 --- a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_it_IT.json +++ b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_it_IT.json @@ -2,5 +2,8 @@ "see_more_label": "Scopri di più", "octavia_load_balancer_logs_breadcrumb_label": "Log", "octavia_load_balancer_logs_main_description": "Qui sotto sono disponibili i log del tuo Load Balancer per i listener di tipo TCP, HTTP, HTTPS & TERMINATED_HTTPS (UDP non supportato). Questi log sono quelli generati dal componente OpenSource HAProxy.", - "octavia_load_balancer_data_streams_description_haproxy": "Abbonandoti ai log haproxy del tuo Load Balancer, saranno trasferiti in Logs Data Platform e potrai centralizzarli con altri log, effettuare ricerche avanzate, gestire la loro retention, definire allarmi e creare dashboard per osservare le applicazioni che utilizzano i Load Balancer." + "octavia_load_balancer_data_streams_description_haproxy": "Abbonandoti ai log haproxy del tuo Load Balancer, saranno trasferiti in Logs Data Platform e potrai centralizzarli con altri log, effettuare ricerche avanzate, gestire la loro retention, definire allarmi e creare dashboard per osservare le applicazioni che utilizzano i Load Balancer.", + "logs_list_add_data_stream_button": "Aggiungere un flusso di dati", + "kube_logs_tab_title": "Log", + "logs_list_title": "Flussi di dati" } diff --git a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_pl_PL.json b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_pl_PL.json index a00b77e0a91d..4c8cb36b4dc2 100644 --- a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_pl_PL.json +++ b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_pl_PL.json @@ -2,5 +2,8 @@ "see_more_label": "Dowiedz się więcej", "octavia_load_balancer_logs_breadcrumb_label": "Logi", "octavia_load_balancer_logs_main_description": "Poniżej znajdziesz logi Load Balancera dla nasłuchów TCP, HTTP, HTTPS i TERMINATED_HTTPS (UDP nie jest obsługiwany). Logi te są generowane przez komponent OpenSource HAProxy.", - "octavia_load_balancer_data_streams_description_haproxy": "Po tym, jak zasubskrybujesz logi haproxy Load Balancera, zostaną one przeniesione do Logs Data Platform. Będziesz mógł je scentralizować z innymi logami, uruchamiać zaawansowane wyszukiwanie, zarządzać retencją, definiować alerty oraz dashboardy umożliwiające obserwację aplikacji korzystających z Load Balancerów." + "octavia_load_balancer_data_streams_description_haproxy": "Po tym, jak zasubskrybujesz logi haproxy Load Balancera, zostaną one przeniesione do Logs Data Platform. Będziesz mógł je scentralizować z innymi logami, uruchamiać zaawansowane wyszukiwanie, zarządzać retencją, definiować alerty oraz dashboardy umożliwiające obserwację aplikacji korzystających z Load Balancerów.", + "logs_list_add_data_stream_button": "Dodaj strumień danych", + "kube_logs_tab_title": "Logi", + "logs_list_title": "Strumień danych" } diff --git a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_pt_PT.json b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_pt_PT.json index 6a387864ab3d..89aa0741a984 100644 --- a/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_pt_PT.json +++ b/packages/manager/apps/pci-load-balancer/public/translations/logs/Messages_pt_PT.json @@ -2,5 +2,8 @@ "see_more_label": "Saber mais", "octavia_load_balancer_logs_breadcrumb_label": "Logs", "octavia_load_balancer_logs_main_description": "Encontrará abaixo os logs do seu Load Balancer para os “listeners” de tipo TCP, HTTP, HTTPS e TERMINATED_HTTPS (UDP não é suportado). Estes são os logs gerados pelo componente open source HAProxy.", - "octavia_load_balancer_data_streams_description_haproxy": "Ao subscrever os logs HAProxy do seu Load Balancer, estes registos serão transferidos para o Logs Data Platform, de onde poderá geri-los de forma centralizada com os seus outros logs. Além disso, poderá efetuar pesquisas mais avançadas, gerir as suas retenções, definir alertas, bem como painéis de controlo para monitorizar as aplicações que utilizam Load Balancers." + "octavia_load_balancer_data_streams_description_haproxy": "Ao subscrever os logs HAProxy do seu Load Balancer, estes registos serão transferidos para o Logs Data Platform, de onde poderá geri-los de forma centralizada com os seus outros logs. Além disso, poderá efetuar pesquisas mais avançadas, gerir as suas retenções, definir alertas, bem como painéis de controlo para monitorizar as aplicações que utilizam Load Balancers.", + "logs_list_add_data_stream_button": "Adicionar um fluxo de dados", + "kube_logs_tab_title": "Logs", + "logs_list_title": "Fluxo de dados" } diff --git a/packages/manager/apps/pci-load-balancer/src/helpers/index.ts b/packages/manager/apps/pci-load-balancer/src/helpers/index.ts index 8c2c02c019e4..045f46ecc062 100644 --- a/packages/manager/apps/pci-load-balancer/src/helpers/index.ts +++ b/packages/manager/apps/pci-load-balancer/src/helpers/index.ts @@ -41,7 +41,7 @@ export const sortResults = (items: T[], sorting: ColumnSort): T[] => { }; export const getFormattedDate = (date: string | null, formatStr = 'PPpp') => { - const { i18n } = useTranslation('common'); + const { i18n } = useTranslation(); const locales = useRef({ ...dateFnsLocales }).current; diff --git a/packages/manager/apps/pci-load-balancer/src/main.tsx b/packages/manager/apps/pci-load-balancer/src/main.tsx index 5409e73f4def..f12afbd86678 100644 --- a/packages/manager/apps/pci-load-balancer/src/main.tsx +++ b/packages/manager/apps/pci-load-balancer/src/main.tsx @@ -27,8 +27,8 @@ const init = async ( await initI18n({ context, reloadOnLocaleChange, - ns: ['common'], - defaultNS: 'common', + ns: ['pci-common'], + defaultNS: 'pci-common', }); ReactDOM.createRoot(document.getElementById('root')).render( diff --git a/packages/manager/apps/pci-load-balancer/src/pages/detail/log/LoadBalancerLogsProvider.tsx b/packages/manager/apps/pci-load-balancer/src/pages/detail/log/LoadBalancerLogsProvider.tsx new file mode 100644 index 000000000000..eb69e44e84a2 --- /dev/null +++ b/packages/manager/apps/pci-load-balancer/src/pages/detail/log/LoadBalancerLogsProvider.tsx @@ -0,0 +1,50 @@ +import { LogProvider } from '@ovh-ux/manager-pci-common'; +import { useMe } from '@ovh-ux/manager-react-components'; +import { LOAD_BALANCER_LOGS_SERVICE_GUIDE_LINK } from '@/constants'; + +export interface KubeLogsProviderProps { + loadBalancerId: string; + projectId: string; + region: string; +} + +export function LoadBalancerLogsProvider({ + children, + loadBalancerId, + projectId, + region, +}: React.PropsWithChildren) { + const ovhSubsidiary = useMe()?.me?.ovhSubsidiary; + return ( + + {children} + + ); +} diff --git a/packages/manager/apps/pci-load-balancer/src/pages/detail/log/Log.page.tsx b/packages/manager/apps/pci-load-balancer/src/pages/detail/log/Log.page.tsx index 9ae9d7b56253..8673c23d2d71 100644 --- a/packages/manager/apps/pci-load-balancer/src/pages/detail/log/Log.page.tsx +++ b/packages/manager/apps/pci-load-balancer/src/pages/detail/log/Log.page.tsx @@ -1,5 +1,4 @@ -import { useState } from 'react'; -import { clsx } from 'clsx'; +import { useNavigate, useParams } from 'react-router-dom'; import { OsdsIcon, OsdsLink, OsdsText } from '@ovhcloud/ods-components/react'; import { ODS_THEME_COLOR_INTENT } from '@ovhcloud/ods-common-theming'; import { @@ -11,20 +10,25 @@ import { import { OdsHTMLAnchorElementTarget } from '@ovhcloud/ods-common-core'; import { Notifications, useMe } from '@ovh-ux/manager-react-components'; import { useTranslation } from 'react-i18next'; -// import { useParams } from 'react-router-dom'; +import { LogsView } from '@ovh-ux/manager-pci-common'; import { LOAD_BALANCER_LOGS_SERVICE_GUIDE_LINK } from '@/constants'; +import { LoadBalancerLogsProvider } from './LoadBalancerLogsProvider'; export default function LogsPage() { const { t } = useTranslation('logs'); - // const { projectId, region, loadBalancerId } = useParams(); - const [isFullscreen /* setIsFullscreen */] = useState(false); + const { projectId, loadBalancerId, region } = useParams(); + const navigate = useNavigate(); const ovhSubsidiary = useMe()?.me?.ovhSubsidiary; const infoLink = LOAD_BALANCER_LOGS_SERVICE_GUIDE_LINK[ovhSubsidiary] || LOAD_BALANCER_LOGS_SERVICE_GUIDE_LINK.DEFAULT; return ( - <> + -
-
- -
-
- + navigate('./streams')} /> + ); } diff --git a/packages/manager/apps/pci-load-balancer/src/pages/detail/log/Streams.page.tsx b/packages/manager/apps/pci-load-balancer/src/pages/detail/log/Streams.page.tsx new file mode 100644 index 000000000000..4c5b12a08c7d --- /dev/null +++ b/packages/manager/apps/pci-load-balancer/src/pages/detail/log/Streams.page.tsx @@ -0,0 +1,124 @@ +import { useHref, useParams } from 'react-router-dom'; +import { + ODS_BUTTON_SIZE, + ODS_BUTTON_VARIANT, + ODS_ICON_NAME, + ODS_ICON_SIZE, + ODS_TEXT_LEVEL, + ODS_TEXT_SIZE, +} from '@ovhcloud/ods-components'; +import { ODS_THEME_COLOR_INTENT } from '@ovhcloud/ods-common-theming'; +import { + OsdsButton, + OsdsIcon, + OsdsLink, + OsdsText, +} from '@ovhcloud/ods-components/react'; +import { useTranslation } from 'react-i18next'; +import { useContext, useState } from 'react'; +import { + Notifications, + useNotifications, +} from '@ovh-ux/manager-react-components'; +import { ShellContext } from '@ovh-ux/manager-react-shell-client'; +import { + DbaasLogsAccountSelector, + StreamsList, + TDbaasLog, +} from '@ovh-ux/manager-pci-common'; +import { LoadBalancerLogsProvider } from './LoadBalancerLogsProvider'; + +export default function StreamsPage() { + const { projectId, loadBalancerId, region } = useParams(); + const { t } = useTranslation('logs'); + const { t: tCommon } = useTranslation('pci-common'); + const { navigation } = useContext(ShellContext).shell; + const backHref = useHref('../logs'); + const { clearNotifications } = useNotifications(); + const [account, setAccount] = useState(); + + const gotoAddDataStream = async () => + navigation + .getURL( + 'dedicated', + `#/dbaas/logs/${account?.serviceName}/streams/add`, + {}, + ) + .then((url: string) => window.open(url, '_blank')); + + return ( + + +
+ { + clearNotifications(); + }} + > + + + + {tCommon('common_back_button_back_to_previous_page')} + +
+ + {t('logs_list_title')} + +

+ + {t('octavia_load_balancer_data_streams_description_haproxy')} + +

+ + { + gotoAddDataStream(); + }} + inline + > + + + + {t('logs_list_add_data_stream_button')} + + + + + {account && ( +
+ +
+ )} + + ); +} diff --git a/packages/manager/apps/pci-load-balancer/src/routes.tsx b/packages/manager/apps/pci-load-balancer/src/routes.tsx index 4abd7bf2566e..5530012b0f20 100644 --- a/packages/manager/apps/pci-load-balancer/src/routes.tsx +++ b/packages/manager/apps/pci-load-balancer/src/routes.tsx @@ -27,6 +27,7 @@ export const ROUTE_PATHS = { STATISTICS: 'statistics', CERTIFICATES: 'certificates', LOGS: 'logs', + STREAMS: 'logs/streams', DELETE: ':region/:loadBalancerId/delete', }; @@ -90,6 +91,7 @@ const CertificatesPage = lazy(() => import('@/pages/detail/certificates/Certificates.page'), ); const LogsPage = lazy(() => import('@/pages/detail/log/Log.page')); +const StreamsPage = lazy(() => import('@/pages/detail/log/Streams.page')); const DeletePage = lazy(() => import('@/pages/delete/Delete.page')); const EditLoadBalancerNamePage = lazy(() => import('@/pages/detail/edit/Edit.page'), @@ -214,6 +216,7 @@ const Routes = ( Component={CertificatesPage} /> + Page not found}> diff --git a/packages/manager/modules/manager-pci-common/src/api/hook/useLogs.ts b/packages/manager/modules/manager-pci-common/src/api/hook/useLogs.ts index 60bd273de928..9e3beed66764 100644 --- a/packages/manager/modules/manager-pci-common/src/api/hook/useLogs.ts +++ b/packages/manager/modules/manager-pci-common/src/api/hook/useLogs.ts @@ -148,7 +148,13 @@ export const useLogsDetails = (logsApiURL: string, logsKind: string) => { return useQueries({ queries: subscribedLogs?.map(({ serviceName, streamId }) => ({ - queryKey: ['dbaas-logs-details', logsApiURL, logsKind], + queryKey: [ + 'dbaas-logs-details', + logsApiURL, + logsKind, + serviceName, + streamId, + ], queryFn: async () => { const stream = await getStream(serviceName, streamId); const streamURL = await getStreamURL(serviceName, streamId);