scality · bert-e · Dec 4, 2023 · Dec 4, 2023 · Dec 4, 2023 · Dec 4, 2023
diff --git a/src/react/ui-elements/Veeam/VeeamConfiguration.tsx b/src/react/ui-elements/Veeam/VeeamConfiguration.tsx
@@ -23,6 +23,12 @@ import {
   VEEAM_OFFICE_365,
 } from './VeeamConstants';
 
+export const unitChoices = {
+  GiB: 1024 ** 3,
+  TiB: 1024 ** 4,
+  PiB: 1024 ** 5,
+};
+
 const schema = Joi.object({
   bucketName: Joi.string().required(),
   application: Joi.string().required(),
@@ -62,7 +68,7 @@ const Configuration = () => {
       bucketName: '',
       application: VEEAM_BACKUP_REPLICATION_XML_VALUE,
       capacity: '5', //TODO: The default value will be net capacity.
-      capacityUnit: 'TiB',
+      capacityUnit: unitChoices.TiB.toString(),
       enableImmutableBackup: true,
     },
   });
@@ -76,11 +82,13 @@ const Configuration = () => {
     capacityUnit,
     enableImmutableBackup,
   }: VeeamConfiguration) => {
+    const capacityBytes = (
+      parseInt(capacity, 10) * parseInt(capacityUnit, 10)
+    ).toString();
     next({
       bucketName,
       application,
-      capacity,
-      capacityUnit,
+      capacityBytes,
       enableImmutableBackup,
       // Add advanced configuration to set the account name, for the moment we use the default account name.
       accountName: VEEAM_DEFAULT_ACCOUNT_NAME,
@@ -105,7 +113,14 @@ const Configuration = () => {
       );
 
       setValue('capacity', prettyBytesClusterCapacity.split(' ')[0]);
-      setValue('capacityUnit', prettyBytesClusterCapacity.split(' ')[1]);
+      setValue(
+        'capacityUnit',
+        `${
+          unitChoices[
+            prettyBytesClusterCapacity.split(' ')[1] as 'GiB' | 'TiB' | 'PiB'
+          ]
+        }`,
+      );
     }
   }, [clusterCapacityStatus]);
 
@@ -236,16 +251,22 @@ const Configuration = () => {
                   control={control}
                   render={({ field: { value, onChange } }) => {
                     return (
-                      <Select
-                        id="capacityUnit"
-                        onChange={onChange}
-                        value={value}
-                        size="2/3"
-                      >
-                        <Select.Option value={'GiB'}>GiB</Select.Option>
-                        <Select.Option value={'TiB'}>TiB</Select.Option>
-                        <Select.Option value={'PiB'}>PiB</Select.Option>
-                      </Select>
+                      <>
+                        <Select
+                          id="capacityUnit"
+                          onChange={onChange}
+                          value={value}
+                          size="2/3"
+                        >
+                          {Object.entries(unitChoices).map(([key, value]) => {
+                            return (
+                              <Select.Option key={key} value={`${value}`}>
+                                {key}
+                              </Select.Option>
+                            );
+                          })}
+                        </Select>
+                      </>
                     );
                   }}
                 ></Controller>

diff --git a/src/react/ui-elements/Veeam/VeeamLogo.tsx b/src/react/ui-elements/Veeam/VeeamLogo.tsx
@@ -1,30 +1,41 @@
 export const VeeamLogo = () => (
   <svg
-    width="90"
-    height="16"
-    viewBox="0 0 90 16"
+    height={30}
+    width={150}
+    class="logo__img"
+    viewBox="0 0 130 30"
     fill="none"
     xmlns="http://www.w3.org/2000/svg"
   >
+    <title>Veeam logo</title>
     <path
-      d="M16.4004 0.327354C15.6779 -0.0628899 14.7907 0.234035 14.4187 0.989072L9.11058 12.3274C8.98659 12.5713 8.8797 12.7388 8.59751 12.7388C8.31532 12.7388 8.20629 12.5713 8.08444 12.3274L2.77845 0.986951C2.40647 0.231914 1.51929 -0.0628899 0.796714 0.325233C0.0741406 0.715477 -0.208048 1.64231 0.163928 2.39522L5.34807 12.8894L5.9381 14.0813C6.45331 15.1269 7.47303 15.7759 8.59965 15.7759C9.72412 15.7759 10.7439 15.1269 11.2612 14.0813L11.8512 12.8894L17.0354 2.39522C17.4052 1.64443 17.1209 0.717598 16.4004 0.327354Z"
-      fill="#00B336"
-    />
+      d="M8.46718 0.028021C7.57553 0.028021 6.7169 0.382384 6.08744 1.01125L0.98572 6.10009C0.35526 6.72896 0 7.58442 0 8.47382V30.0001L91.5869 29.9462C92.4785 29.9462 93.3371 29.5918 93.9666 28.9629L99.0113 23.931C99.6417 23.3021 99.997 22.4467 99.997 21.5573L100 0.0270233L8.46718 0.028021Z"
+      fill="#00D15F"
+    ></path>
     <path
-      d="M86.8307 0.154465C85.8324 0.150223 84.958 0.769523 84.539 1.62C83.1901 4.34959 79.2245 12.4705 79.2074 12.498C79.1774 12.5489 79.0941 12.7377 78.923 12.7377C78.7627 12.7377 78.6686 12.5596 78.6387 12.4959C77.324 9.80027 74.7308 4.47684 73.3691 1.7218C72.8453 0.659236 71.9667 0.152344 71.0175 0.152344H71.0154C69.5552 0.152344 68.373 1.3761 68.373 3.041V14.2032C68.373 14.8819 68.7643 15.5097 69.365 15.707C70.3441 16.0251 71.1842 15.1767 71.1842 14.1736L70.979 3.29338C70.979 3.18098 71.1158 3.14068 71.1671 3.23824L76.5822 14.112C77.0845 15.1534 77.9568 15.7748 78.923 15.7748C79.8872 15.7748 80.7594 15.1534 81.2639 14.112L86.6811 3.24036C86.7345 3.13856 86.8756 3.17885 86.8756 3.29762L86.6683 14.2393C86.6683 15.1046 87.3203 15.8024 88.1177 15.7748C88.8873 15.7494 89.4795 15.0155 89.4795 14.1736C89.4795 14.1736 89.4795 5.82573 89.4795 3.04524C89.4816 1.36337 88.2951 0.160827 86.8307 0.154465Z"
-      fill="#00B336"
-    />
+      opacity="0.2"
+      d="M0 10.6598L0.0100075 29.992L34.1749 29.972C34.1749 29.972 37.9727 30.1457 40.9259 29.4939C46.3528 28.2971 49.5842 26.0032 53.6241 21.9744C60.4391 15.1767 75.7013 0 75.7013 0L42.2869 0.00399348L19.2681 22.8698C19.2681 22.8698 17.797 24.5099 15.8085 24.5109C14.3215 24.5119 13.4708 23.912 12.362 22.8898C12.0378 22.5903 0 10.6688 0 10.6598Z"
+      fill="white"
+    ></path>
     <path
-      d="M66.5741 13.5081L60.6076 1.83047C60.0902 0.791235 59.0726 0.146484 57.9524 0.146484C57.2491 0.146484 56.5885 0.39887 56.0647 0.844257C55.7505 1.10937 55.4854 1.44447 55.293 1.83259L49.3564 13.4551C49.3499 13.4678 49.3457 13.4805 49.3393 13.4911L49.3307 13.5081C49.0549 14.0489 49.1212 14.6852 49.4483 15.1475C49.4568 15.1603 49.4654 15.1709 49.4739 15.1836C49.4825 15.1963 49.4932 15.209 49.5039 15.2218C49.6108 15.3596 49.739 15.4784 49.8951 15.5717C50.3975 15.8729 50.9918 15.8284 51.4407 15.5187C51.4471 15.5145 51.4535 15.5102 51.4578 15.506C51.4899 15.4826 51.5219 15.4593 51.5519 15.4339C51.5775 15.4127 51.601 15.3893 51.6246 15.366C51.6352 15.3554 51.6459 15.3469 51.6566 15.3363C51.7635 15.2281 51.8554 15.103 51.9281 14.9588L52.1483 14.4964L53.3904 11.9132C53.4224 11.8474 53.4866 11.805 53.5571 11.805H59.0405C59.0405 11.805 59.0405 11.805 59.0427 11.805C59.7759 11.805 60.3724 11.1815 60.3724 10.4158C60.3724 9.64808 59.7759 9.02665 59.0427 9.02665H55.7526H54.9467C54.859 9.02665 54.8035 8.93334 54.8355 8.85062L55.1412 8.20799L57.3838 3.72443L57.3923 3.70534C57.3966 3.69686 57.4009 3.68837 57.4051 3.67989C57.4051 3.67989 57.4051 3.68201 57.4051 3.67989C57.4415 3.60566 57.5612 3.2854 57.7793 3.21966C57.899 3.1836 58.0251 3.18784 58.1106 3.21329C58.3372 3.28116 58.4398 3.559 58.5382 3.7626C58.5382 3.7626 58.5382 3.76472 58.5382 3.7626L63.9767 14.9651C64.2418 15.4826 64.7506 15.7796 65.2765 15.7796C65.4432 15.7796 65.6121 15.7478 65.7767 15.6863C65.7874 15.682 65.7981 15.6799 65.8067 15.6756C65.8473 15.6587 65.8858 15.6396 65.9242 15.6184C65.9392 15.612 65.9542 15.6057 65.967 15.5972C65.9755 15.5929 65.982 15.5866 65.9905 15.5823C66.0012 15.576 66.014 15.5717 66.0247 15.5632C66.0418 15.5526 66.0568 15.5399 66.0739 15.5293C66.0888 15.5187 66.1017 15.5102 66.1145 15.4996C66.1359 15.4826 66.1573 15.4678 66.1786 15.4508C66.2021 15.4317 66.2257 15.4105 66.2492 15.3893C66.2556 15.383 66.262 15.3787 66.2663 15.3724C66.7537 14.9015 66.8969 14.1401 66.5741 13.5081Z"
-      fill="#00B336"
-    />
+      d="M14.4966 22.2889L7.58752 7.89778H10.7018C10.7018 7.89778 15.6394 18.1992 15.7605 18.7213H15.8205C15.9446 18.1992 20.8792 7.89778 20.8792 7.89778H24.0235L17.1145 22.2889H14.4966Z"
+      fill="white"
+    ></path>
     <path
-      d="M20.4044 9.65641H30.4456C30.6358 9.65429 32.19 9.52916 32.19 7.78579C32.1922 3.49311 28.8465 0 24.7355 0C20.6267 0 17.2832 3.49311 17.2832 7.78791C17.2832 7.88547 17.2896 8.15695 17.2896 8.19724C17.2832 13.1007 20.46 15.7391 24.6629 15.983C24.8638 15.9936 25.0605 16 25.2529 16C26.8691 16 28.233 15.5843 29.7145 14.6554C29.8662 14.562 30.4584 14.1697 31.0634 13.3955C31.5444 12.7805 31.5872 11.8579 31.0634 11.3786C30.3088 10.6872 29.5327 11.0604 28.8401 11.6458C27.752 12.5642 26.9097 13.281 24.7398 13.2831C22.694 13.2831 20.7592 12.1251 20.2996 9.81124C20.2825 9.73065 20.3296 9.65641 20.4044 9.65641ZM20.2932 6.78261C20.5733 4.53446 22.1317 2.54083 24.7313 2.54083C27.3308 2.54083 28.9769 4.49417 29.2377 6.78261C29.2463 6.86532 29.1928 6.9438 29.1116 6.9438H20.4193C20.3381 6.9438 20.2825 6.86744 20.2932 6.78261Z"
-      fill="#00B336"
-    />
+      d="M37.4043 16.1968H26.2151C26.6174 18.5336 28.3407 20.009 30.5623 20.009C32.3826 20.009 33.5825 19.3003 34.1989 17.9796H37.095C36.2304 20.7147 33.7366 22.5903 30.5583 22.5903C26.3652 22.5903 23.284 19.5478 23.284 15.0868C23.284 10.6598 26.3042 7.58334 30.5583 7.58334C34.35 7.58334 37.4633 10.8135 37.4633 15.0868C37.4653 15.5181 37.4653 15.7656 37.4043 16.1968ZM26.2451 13.859H34.5382C34.354 11.8896 32.7519 10.1707 30.5623 10.1707C28.3407 10.1677 26.6744 11.6161 26.2451 13.859Z"
+      fill="white"
+    ></path>
     <path
-      d="M36.9221 9.65641H46.9633C47.1536 9.65429 48.7078 9.52916 48.7078 7.78579C48.7078 3.49311 45.3621 0 41.2533 0C37.1423 0 33.7988 3.49311 33.7988 7.78791C33.7988 7.88547 33.8052 8.15695 33.8052 8.19724C33.7988 13.1007 36.9756 15.7391 41.1785 15.983C41.3794 15.9936 41.5761 16 41.7685 16C43.3847 16 44.7486 15.5843 46.2301 14.6554C46.3819 14.562 46.974 14.1697 47.579 13.3955C48.06 12.7805 48.1028 11.8579 47.579 11.3786C46.8244 10.6872 46.0484 11.0604 45.3557 11.6458C44.2676 12.5642 43.4253 13.281 41.2554 13.2831C39.2096 13.2831 37.2749 12.1251 36.8152 9.81124C36.7981 9.73065 36.8452 9.65641 36.9221 9.65641ZM36.8088 6.78261C37.0889 4.53446 38.6473 2.54083 41.2469 2.54083C43.8464 2.54083 45.4925 4.49417 45.7533 6.78261C45.7619 6.86532 45.7085 6.9438 45.6272 6.9438H36.9328C36.8537 6.9438 36.7981 6.86744 36.8088 6.78261Z"
-      fill="#00B336"
-    />
+      d="M52.7545 16.1968H41.5643C41.9666 18.5336 43.6899 20.009 45.9115 20.009C47.7318 20.009 48.9317 19.3003 49.5481 17.9796H52.4443C51.5796 20.7147 49.0858 22.5903 45.9075 22.5903C41.7144 22.5903 38.6332 19.5478 38.6332 15.0868C38.6332 10.6598 41.6534 7.58334 45.9075 7.58334C49.6993 7.58334 52.8125 10.8135 52.8125 15.0868C52.8145 15.5181 52.8145 15.7656 52.7545 16.1968ZM41.5953 13.859H49.8884C49.7043 11.8896 48.1021 10.1707 45.9125 10.1707C43.6899 10.1677 42.0277 11.6161 41.5953 13.859Z"
+      fill="white"
+    ></path>
+    <path
+      d="M68.4459 15.0898V22.2859H65.9491L65.7009 20.0419C64.5911 21.7039 62.6507 22.5933 60.8904 22.5933C56.9446 22.5933 53.9544 19.457 53.9544 15.0898C53.9544 10.7866 57.1587 7.58633 61.2587 7.58633C65.0235 7.58633 68.4459 10.2915 68.4459 15.0898ZM65.6059 15.0898C65.6059 11.9235 63.5113 10.1717 61.2587 10.1717C58.7919 10.1717 56.7904 12.1411 56.7904 15.0898C56.7904 18.0425 58.6408 20.008 61.2587 20.008C63.4813 20.008 65.6059 18.1623 65.6059 15.0898Z"
+      fill="white"
+    ></path>
+    <path
+      d="M70.3564 22.2849V13.7692C70.3564 10.1717 72.669 7.59035 76.2767 7.59035C79.1728 7.59035 80.7149 9.52686 80.9331 10.2046H80.9931C81.2073 9.52886 82.7494 7.59035 85.6495 7.59035C89.2561 7.59035 91.5698 10.1717 91.5698 13.7692V22.2859H88.7338V13.9838C88.7338 11.647 87.685 10.2326 85.5595 10.2326C83.4309 10.2326 82.3851 11.647 82.3851 14.0447V22.3168H79.5491V14.0447C79.5491 11.647 78.5003 10.2326 76.3747 10.2326C74.2492 10.2326 73.2004 11.647 73.2004 13.9838V22.2859L70.3564 22.2849Z"
+      fill="white"
+    ></path>
   </svg>
 );
diff --git a/src/react/ui-elements/Veeam/VeeamSummary.tsx b/src/react/ui-elements/Veeam/VeeamSummary.tsx
@@ -1,4 +1,4 @@
-import { Banner, Form, Icon, Text } from '@scality/core-ui';
+import { Banner, Form, Icon, InfoMessage, Text } from '@scality/core-ui';
 import { Button, CopyButton } from '@scality/core-ui/dist/next';
 import { Stack } from '@scality/core-ui/dist/spacing';
 import { spacing } from '@scality/core-ui/dist/style/theme';
@@ -88,8 +88,38 @@ export const VeeamSummary = ({
           />
         </Stack>
         <br />
-        <br />
         <Stack direction="vertical" gap="r16">
+          {isPlatformAdmin ? (
+            <Stack direction="vertical" gap="r16">
+              <Text isEmphazed>{CERTIFICATE_SECTION_TITLE}</Text>
+              <InfoMessage
+                title={'How to manage Certificates?'}
+                link="/docs/standard_operations/change_certificates.html"
+                content={
+                  <>
+                    By default, all certificates are generated using the ARTESCA
+                    built-in Certificate Authority and are valid for 3 months.
+                    After that time period, the certificates are automatically
+                    renewed.
+                    <br />
+                    To avoid a service interruption every time a certificate is
+                    being renewed, you must either trust the ARTESCA built-in
+                    Certificate Authority (which is valid for 10 years), or
+                    replace certificates using a custom or external Certificate
+                    Authority.
+                  </>
+                }
+              />
+              <Stack>
+                <Text color="textSecondary">
+                  ARTESCA built-in Certificate Authority
+                </Text>
+                <CertificateDownloadButton />
+              </Stack>
+            </Stack>
+          ) : (
+            <></>
+          )}
           <Text isEmphazed>{ACCOUNT_SECTION_TITLE}</Text>
           <Table>
             <T.Body>
@@ -165,19 +195,6 @@ export const VeeamSummary = ({
             </T.Body>
           </Table>
         </Stack>
-        <br />
-        {isPlatformAdmin ? (
-          <Stack direction="vertical" gap="r16">
-            <Text isEmphazed>{CERTIFICATE_SECTION_TITLE}</Text>
-            <Text color="textSecondary">
-              Trust the ARTESCA CA Root on your Veeam server to maintain
-              uninterrupted service.
-            </Text>
-            <CertificateDownloadButton />
-          </Stack>
-        ) : (
-          <></>
-        )}
       </div>
     </Form>
   );

diff --git a/src/react/ui-elements/Veeam/VeeamTable.tsx b/src/react/ui-elements/Veeam/VeeamTable.tsx
@@ -16,8 +16,7 @@ export type VeeamTableProps = {
   accountName: string;
   bucketName: string;
   application: string;
-  capacity: string;
-  capacityUnit: string;
+  capacityBytes: string;
   enableImmutableBackup: boolean;
 };
 

diff --git a/src/react/ui-elements/Veeam/VeeamWelcomeModal.tsx b/src/react/ui-elements/Veeam/VeeamWelcomeModal.tsx
@@ -76,11 +76,10 @@ export const VeeamWelcomeModalInternal = () => {
         </Wrap>
       }
     >
-      <Text variant="Basic">
-        Get started with <br />
-        ARTESCA HW Appliance for
-      </Text>{' '}
-      <VeeamLogo />
+      <Stack gap={'r1'}>
+        <Text variant="Basic">Get started with ARTESCA Appliance for</Text>
+        <VeeamLogo />
+      </Stack>
     </CustomModal>
   );
 };

diff --git a/src/react/ui-elements/Veeam/useMutationTableData.ts b/src/react/ui-elements/Veeam/useMutationTableData.ts
@@ -37,9 +37,9 @@ export const actions = [
   'Create Veeam policy',
   'Attach Veeam policy to User',
   'Tag bucket as Veeam Bucket',
-  'Create Smart Object Storage(SOS) folder',
-  'Enable SOS API support',
-  'Set SOS API capacity',
+  'Prepare Veeam integrated object repository',
+  'Enforce Veeam integrated object repository',
+  'Set maximum repository capacity',
 ] as const;
 
 type Result = {
@@ -146,24 +146,24 @@ export const useMutationTableData = ({
             },
           ],
         };
-      } else if (isStep('Create Smart Object Storage(SOS) folder')) {
+      } else if (isStep('Prepare Veeam integrated object repository')) {
         return {
           Bucket: propsConfiguration.bucketName,
           Key: `${VEEAM_XML_PREFIX}/`,
           Body: '',
         };
-      } else if (isStep('Enable SOS API support')) {
+      } else if (isStep('Enforce Veeam integrated object repository')) {
         return {
           Bucket: propsConfiguration.bucketName,
           Key: `${VEEAM_XML_PREFIX}/system.xml`,
           Body: SYSTEM_XML_CONTENT,
           ContentType: 'text/xml',
         };
-      } else if (isStep('Set SOS API capacity')) {
+      } else if (isStep('Set maximum repository capacity')) {
         return {
           Bucket: propsConfiguration.bucketName,
           Key: `${VEEAM_XML_PREFIX}/capacity.xml`,
-          Body: GET_CAPACITY_XML_CONTENT(propsConfiguration.capacity),
+          Body: GET_CAPACITY_XML_CONTENT(propsConfiguration.capacityBytes),
           ContentType: 'text/xml',
         };
       }

diff --git a/src/react/utils/testUtil.tsx b/src/react/utils/testUtil.tsx
@@ -43,6 +43,26 @@ import { AccountsLocationsEndpointsAdapterProvider } from '../next-architecture/
 //LocationTestOK
 export const theme = {
   name: 'Dark Rebrand Theme',
+  statusHealthy: '#0AADA6',
+  statusWarning: '#F8F32B',
+  statusCritical: '#E84855',
+  selectedActive: '#037AFF',
+  highlight: '#1A3C75',
+  border: '#313131',
+  buttonPrimary: '#2F4185',
+  buttonSecondary: '#595A78',
+  buttonDelete: '#3D0808',
+  infoPrimary: '#8E8EAC',
+  infoSecondary: '#333366',
+  backgroundLevel1: '#121219',
+  backgroundLevel2: '#323245',
+  backgroundLevel3: '#232331',
+  backgroundLevel4: '#171721',
+  textPrimary: '#FFFFFF',
+  textSecondary: '#EAEAEA',
+  textTertiary: '#B5B5B5',
+  textReverse: '#000000',
+  textLink: '#71AEFF',
   brand: {
     // Dark Rebrand
     statusHealthy: '#0AADA6',