feat(pci-load-balancer): add edit pool member name modal

packages/manager-react-components/src/components/ManagerButton/ManagerButton.spec.tsx

@@ -11,8 +11,9 @@ const renderComponent = (props: ManagerButtonProps) => {
   return render(<ManagerButton {...props} />);
 };
 
-const mockedHook =
-  useAuthorizationIam as unknown as jest.Mock<IamAuthorizationResponse>;
+const mockedHook = (useAuthorizationIam as unknown) as jest.Mock<
+  IamAuthorizationResponse
+>;
 
 describe('ManagerButton tests', () => {
   afterEach(() => {
@@ -27,7 +28,8 @@ describe('ManagerButton tests', () => {
         isFetched: true,
       });
       renderComponent({
-        urn: 'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
+        urn:
+          'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
         iamActions: [
           'manager-react-components:apiovh:manager-react-components/attach-action',
         ],
@@ -43,7 +45,8 @@ describe('ManagerButton tests', () => {
         isFetched: true,
       });
       renderComponent({
-        urn: 'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
+        urn:
+          'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
         iamActions: [
           'manager-react-components:apiovh:manager-react-components/attach',
         ],
@@ -64,7 +67,8 @@ describe('ManagerButton tests', () => {
         isFetched: true,
       });
       renderComponent({
-        urn: 'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
+        urn:
+          'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
         iamActions: [
           'manager-react-components:apiovh:manager-react-components/attach-action',
         ],

packages/manager-react-components/src/components/ManagerText/ManagerText.spec.tsx

@@ -10,8 +10,9 @@ jest.mock('../../hooks/iam');
 const renderComponent = (props: ManagerTextProps) => {
   return render(<ManagerText {...props} />);
 };
-const mockedHook =
-  useAuthorizationIam as unknown as jest.Mock<IamAuthorizationResponse>;
+const mockedHook = (useAuthorizationIam as unknown) as jest.Mock<
+  IamAuthorizationResponse
+>;
 
 describe('ManagerText tests', () => {
   afterEach(() => {
@@ -26,7 +27,8 @@ describe('ManagerText tests', () => {
         isFetched: true,
       });
       renderComponent({
-        urn: 'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
+        urn:
+          'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
         iamActions: [
           'manager-react-components:apiovh:manager-react-components/get-display',
         ],
@@ -43,7 +45,8 @@ describe('ManagerText tests', () => {
         isFetched: true,
       });
       renderComponent({
-        urn: 'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
+        urn:
+          'urn:v9:eu:resource:manager-react-components:vrz-a878-dsflkds-fdsfsd',
         iamActions: [
           'manager-react-components:apiovh:manager-react-components/get-display',
         ],

packages/manager-react-components/src/components/content/headers/headers.spec.tsx

@@ -11,8 +11,9 @@ import { useAuthorizationIam } from '../../../hooks/iam';
 
 jest.mock('../../../hooks/iam');
 
-const mockedHook =
-  useAuthorizationIam as unknown as jest.Mock<IamAuthorizationResponse>;
+const mockedHook = (useAuthorizationIam as unknown) as jest.Mock<
+  IamAuthorizationResponse
+>;
 
 describe('Headers component', () => {
   beforeEach(() => {

packages/manager-react-components/src/components/navigation/menus/action/action.spec.tsx

@@ -29,8 +29,9 @@ const actionItems: ActionMenuProps = {
 const setupSpecTest = async (customProps?: Partial<ActionMenuProps>) =>
   waitFor(() => render(<ActionMenu {...actionItems} {...customProps} />));
 
-const mockedHook =
-  useAuthorizationIam as unknown as jest.Mock<IamAuthorizationResponse>;
+const mockedHook = (useAuthorizationIam as unknown) as jest.Mock<
+  IamAuthorizationResponse
+>;
 
 describe('ActionMenu', () => {
   it('renders menu actions correctly', async () => {

packages/manager/apps/pci-load-balancer/public/translations/pools/members/create/Messages_de_DE.json

@@ -0,0 +1,9 @@
+{
+  "octavia_load_balancer_pools_detail_members_create_title": "Manuell hinzufügen",
+  "octavia_load_balancer_pools_detail_members_create_description": "Fügen Sie ein Mitglied manuell hinzu, wenn es nicht in der Tabelle der verfügbaren Instanzen aufgeführt ist.",
+  "octavia_load_balancer_pools_detail_members_create_cancel": "Abbrechen",
+  "octavia_load_balancer_pools_detail_members_create_confirm": "Hinzufügen",
+  "octavia_load_balancer_pools_detail_members_create_name_label": "Name (optional)",
+  "octavia_load_balancer_pools_detail_members_create_address_ip_label": "IP-Adresse",
+  "octavia_load_balancer_pools_detail_members_create_port_label": "Port"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/create/Messages_en_GB.json

@@ -0,0 +1,9 @@
+{
+  "octavia_load_balancer_pools_detail_members_create_title": "Add Manually",
+  "octavia_load_balancer_pools_detail_members_create_description": "Manually add a member if it is not found in the available instances table.",
+  "octavia_load_balancer_pools_detail_members_create_cancel": "Cancel",
+  "octavia_load_balancer_pools_detail_members_create_confirm": "Add",
+  "octavia_load_balancer_pools_detail_members_create_name_label": "Surname (optional)",
+  "octavia_load_balancer_pools_detail_members_create_address_ip_label": "IP address",
+  "octavia_load_balancer_pools_detail_members_create_port_label": "Port"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/create/Messages_es_ES.json

@@ -0,0 +1,9 @@
+{
+  "octavia_load_balancer_pools_detail_members_create_title": "Añadir manualmente",
+  "octavia_load_balancer_pools_detail_members_create_description": "Añadir un miembro manualmente si no aparece en la tabla de instancias disponibles.",
+  "octavia_load_balancer_pools_detail_members_create_cancel": "Cancelar",
+  "octavia_load_balancer_pools_detail_members_create_confirm": "Añadir",
+  "octavia_load_balancer_pools_detail_members_create_name_label": "Nombre (opcional)",
+  "octavia_load_balancer_pools_detail_members_create_address_ip_label": "Dirección IP",
+  "octavia_load_balancer_pools_detail_members_create_port_label": "Puerto"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/create/Messages_fr_CA.json

@@ -0,0 +1,9 @@
+{
+  "octavia_load_balancer_pools_detail_members_create_title": "Ajouter Manuellement",
+  "octavia_load_balancer_pools_detail_members_create_description": "Ajouter un membre manuellement s'il est introuvable dans le tableau des instances disponibles.",
+  "octavia_load_balancer_pools_detail_members_create_cancel": "Annuler",
+  "octavia_load_balancer_pools_detail_members_create_confirm": "Ajouter",
+  "octavia_load_balancer_pools_detail_members_create_name_label": "Nom (optionnel)",
+  "octavia_load_balancer_pools_detail_members_create_address_ip_label": "Adresse IP",
+  "octavia_load_balancer_pools_detail_members_create_port_label": "Port"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/create/Messages_fr_FR.json

@@ -0,0 +1,9 @@
+{
+  "octavia_load_balancer_pools_detail_members_create_title": "Ajouter Manuellement",
+  "octavia_load_balancer_pools_detail_members_create_description": "Ajouter un membre manuellement s'il est introuvable dans le tableau des instances disponibles.",
+  "octavia_load_balancer_pools_detail_members_create_cancel": "Annuler",
+  "octavia_load_balancer_pools_detail_members_create_confirm": "Ajouter",
+  "octavia_load_balancer_pools_detail_members_create_name_label": "Nom (optionnel)",
+  "octavia_load_balancer_pools_detail_members_create_address_ip_label": "Adresse IP",
+  "octavia_load_balancer_pools_detail_members_create_port_label": "Port"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/create/Messages_it_IT.json

@@ -0,0 +1,9 @@
+{
+  "octavia_load_balancer_pools_detail_members_create_title": "Aggiungi manualmente",
+  "octavia_load_balancer_pools_detail_members_create_description": "Aggiungi un membro manualmente se non riesci a trovarlo nella tabella delle istanze disponibili.",
+  "octavia_load_balancer_pools_detail_members_create_cancel": "Annullare",
+  "octavia_load_balancer_pools_detail_members_create_confirm": "Aggiungi",
+  "octavia_load_balancer_pools_detail_members_create_name_label": "Nome (facoltativo)",
+  "octavia_load_balancer_pools_detail_members_create_address_ip_label": "Indirizzo IP",
+  "octavia_load_balancer_pools_detail_members_create_port_label": "Porta"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/create/Messages_pl_PL.json

@@ -0,0 +1,9 @@
+{
+  "octavia_load_balancer_pools_detail_members_create_title": "Dodaj ręcznie",
+  "octavia_load_balancer_pools_detail_members_create_description": "Jeśli użytkownika nie ma w tabeli dostępnych instancji, dodaj go ręcznie.",
+  "octavia_load_balancer_pools_detail_members_create_cancel": "Anuluj",
+  "octavia_load_balancer_pools_detail_members_create_confirm": "Dodaj",
+  "octavia_load_balancer_pools_detail_members_create_name_label": "Nazwa (opcjonalnie)",
+  "octavia_load_balancer_pools_detail_members_create_address_ip_label": "Adres IP",
+  "octavia_load_balancer_pools_detail_members_create_port_label": "Port"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/create/Messages_pt_PT.json

@@ -0,0 +1,9 @@
+{
+  "octavia_load_balancer_pools_detail_members_create_title": "Adicionar Manualmente",
+  "octavia_load_balancer_pools_detail_members_create_description": "Adicionar um membro manualmente, se não for possível encontrá-lo na tabela das instâncias disponíveis.",
+  "octavia_load_balancer_pools_detail_members_create_cancel": "Anular",
+  "octavia_load_balancer_pools_detail_members_create_confirm": "Adicionar",
+  "octavia_load_balancer_pools_detail_members_create_name_label": "Sobrenome (facultativo)",
+  "octavia_load_balancer_pools_detail_members_create_address_ip_label": "Endereço IP",
+  "octavia_load_balancer_pools_detail_members_create_port_label": "Porta"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/edit/Messages_de_DE.json

@@ -0,0 +1,6 @@
+{
+  "octavia_load_balancer_pools_members_edit_name_title": "Den Namen Ihres Mitglieds ändern",
+  "octavia_load_balancer_pools_members_edit_name_label": "Name",
+  "octavia_load_balancer_pools_members_edit_name_cancel": "Abbrechen",
+  "octavia_load_balancer_pools_members_edit_name_confirm": "Ändern"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/edit/Messages_en_GB.json

@@ -0,0 +1,6 @@
+{
+  "octavia_load_balancer_pools_members_edit_name_title": "Change your member’s name",
+  "octavia_load_balancer_pools_members_edit_name_label": "Name",
+  "octavia_load_balancer_pools_members_edit_name_cancel": "Cancel",
+  "octavia_load_balancer_pools_members_edit_name_confirm": "Edit"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/edit/Messages_es_ES.json

@@ -0,0 +1,6 @@
+{
+  "octavia_load_balancer_pools_members_edit_name_title": "Cambiar el nombre de su miembro",
+  "octavia_load_balancer_pools_members_edit_name_label": "Nombre",
+  "octavia_load_balancer_pools_members_edit_name_cancel": "Cancelar",
+  "octavia_load_balancer_pools_members_edit_name_confirm": "Editar"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/edit/Messages_fr_CA.json

@@ -0,0 +1,6 @@
+{
+  "octavia_load_balancer_pools_members_edit_name_title": "Modifier le nom de votre membre",
+  "octavia_load_balancer_pools_members_edit_name_label": "Nom",
+  "octavia_load_balancer_pools_members_edit_name_cancel": "Annuler",
+  "octavia_load_balancer_pools_members_edit_name_confirm": "Modifier"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/edit/Messages_fr_FR.json

@@ -0,0 +1,6 @@
+{
+  "octavia_load_balancer_pools_members_edit_name_title": "Modifier le nom de votre membre",
+  "octavia_load_balancer_pools_members_edit_name_label": "Nom",
+  "octavia_load_balancer_pools_members_edit_name_cancel": "Annuler",
+  "octavia_load_balancer_pools_members_edit_name_confirm": "Modifier"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/edit/Messages_it_IT.json

@@ -0,0 +1,6 @@
+{
+  "octavia_load_balancer_pools_members_edit_name_title": "Modifica il nome del membro",
+  "octavia_load_balancer_pools_members_edit_name_label": "Nome",
+  "octavia_load_balancer_pools_members_edit_name_cancel": "Annullare",
+  "octavia_load_balancer_pools_members_edit_name_confirm": "Modificare"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/edit/Messages_pl_PL.json

@@ -0,0 +1,6 @@
+{
+  "octavia_load_balancer_pools_members_edit_name_title": "Zmień nazwę użytkownika",
+  "octavia_load_balancer_pools_members_edit_name_label": "Nazwa",
+  "octavia_load_balancer_pools_members_edit_name_cancel": "Anuluj",
+  "octavia_load_balancer_pools_members_edit_name_confirm": "Zmień"
+}

packages/manager/apps/pci-load-balancer/public/translations/pools/members/edit/Messages_pt_PT.json

@@ -0,0 +1,6 @@
+{
+  "octavia_load_balancer_pools_members_edit_name_title": "Alterar o nome do seu membro",
+  "octavia_load_balancer_pools_members_edit_name_label": "Nome",
+  "octavia_load_balancer_pools_members_edit_name_cancel": "Anular",
+  "octavia_load_balancer_pools_members_edit_name_confirm": "Alterar"
+}

packages/manager/apps/pci-load-balancer/src/api/data/pool-member.ts

@@ -49,3 +49,34 @@ export const getPoolMember = async (
   );
   return data;
 };
+
+export const updatePoolMemberName = async (
+  projectId: string,
+  region: string,
+  poolId: string,
+  memberId: string,
+  name: string,
+) => {
+  const { data } = await v6.put(
+    `/cloud/project/${projectId}/region/${region}/loadbalancing/pool/${poolId}/member/${memberId}`,
+    {
+      name,
+    },
+  );
+  return data;
+};
+
+export const createPoolMembers = async (
+  projectId: string,
+  region: string,
+  poolId: string,
+  members: TPoolMember[],
+) => {
+  const { data } = await v6.post(
+    `/cloud/project/${projectId}/region/${region}/loadbalancing/pool/${poolId}/member`,
+    {
+      members,
+    },
+  );
+  return data;
+};

packages/manager/apps/pci-load-balancer/src/api/hook/usePoolMember.tsx

@@ -4,9 +4,11 @@ import { useMutation, useQuery } from '@tanstack/react-query';
 import { useMemo } from 'react';
 import {
   TPoolMember,
+  createPoolMembers,
   deletePoolMember,
   getPoolMember,
   getPoolMembers,
+  updatePoolMemberName,
 } from '@/api/data/pool-member';
 import { paginateResults, sortResults } from '@/helpers';
 import queryClient from '@/queryClient';
@@ -102,3 +104,71 @@ export const useGetPoolMember = (
     queryKey: ['poolMembers', projectId, poolId, region, memberId],
     queryFn: () => getPoolMember(projectId, region, poolId, memberId),
   });
+
+type UpdatePoolMemberProps = {
+  projectId: string;
+  poolId: string;
+  memberId: string;
+  region: string;
+  name: string;
+  onError: (cause: Error) => void;
+  onSuccess: () => void;
+};
+
+export const useUpdatePoolMember = ({
+  projectId,
+  poolId,
+  memberId,
+  region,
+  name,
+  onError,
+  onSuccess,
+}: UpdatePoolMemberProps) => {
+  const mutation = useMutation({
+    mutationFn: async () =>
+      updatePoolMemberName(projectId, region, poolId, memberId, name),
+    onError,
+    onSuccess: async () => {
+      await queryClient.invalidateQueries({
+        queryKey: ['poolMembers', projectId],
+      });
+      onSuccess();
+    },
+  });
+  return {
+    updatePoolMemberName: () => mutation.mutate(),
+    ...mutation,
+  };
+};
+
+type CreatePoolMembersProps = {
+  projectId: string;
+  poolId: string;
+  region: string;
+  onError: (cause: Error) => void;
+  onSuccess: () => void;
+};
+
+export const useCreatePoolMembers = ({
+  projectId,
+  poolId,
+  region,
+  onError,
+  onSuccess,
+}: CreatePoolMembersProps) => {
+  const mutation = useMutation({
+    mutationFn: async (members: TPoolMember[]) =>
+      createPoolMembers(projectId, region, poolId, members),
+    onError,
+    onSuccess: async () => {
+      await queryClient.invalidateQueries({
+        queryKey: ['poolMembers', projectId],
+      });
+      onSuccess();
+    },
+  });
+  return {
+    createPoolMembers: (members: TPoolMember[]) => mutation.mutate(members),
+    ...mutation,
+  };
+};

packages/manager/apps/pci-load-balancer/src/components/detail/pools/members/Actions.component.tsx

@@ -13,7 +13,7 @@ export default function ActionsComponent({
   const items = [
     {
       id: 0,
-      href: useHref(`../${memberId}/edit`),
+      href: useHref(`./${memberId}/edit`),
       label: t('octavia_load_balancer_pools_detail_members_edit'),
     },
     {

packages/manager/apps/pci-load-balancer/src/constants.ts

@@ -251,3 +251,7 @@ export const VALUE_REGEX_BY_TYPE = {
 };
 
 export const KEY_REGEX = "^[a-zA-Z0-9!#$%&'*+-.^_`|~]+$";
+
+export const REGEX = {
+  ip: /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?).(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?).(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?).(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/,
+};