fix: set quantity to 1 if exceed

ref: TAPC-2456 Signed-off-by: Lionel Bueno <[email protected]>
ovh · Jan 10, 2025 · f41ea6f · f41ea6f
1 parent 103150d
commit f41ea6f
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 8 deletions.
diff --git a/packages/manager/apps/pci-savings-plan/src/components/Commitment/Commitment.tsx b/packages/manager/apps/pci-savings-plan/src/components/Commitment/Commitment.tsx
@@ -2,6 +2,7 @@ import { OdsText, OdsCard } from '@ovhcloud/ods-components/react';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { useCatalogPrice } from '@ovh-ux/manager-react-components';
+import clsx from 'clsx';
 import { getDiffInPercent } from './Commitment.utils';
 import {
   CENTS_PRICE,
@@ -38,12 +39,12 @@ const Commitment = ({
 
   return (
     <OdsCard
-      className={`flex flex-row items-center mr-5 my-4 p-5 justify-between w-full cursor-pointer ${
-        isActive
-          ? 'bg-[--ods-color-primary-050] border-[--ods-color-primary-500] border-2'
-          : ''
-      }`}
+      className={clsx(
+        'flex flex-row items-center mr-5 my-4 p-5 justify-between w-full cursor-pointer',
+        { 'border-[--ods-color-primary-500] border-2': isActive },
+      )}
       onClick={onClick}
+      color="neutral"
     >
       <span className="flex flex-row items-center justify-center">
         <OdsText>{t('commitment_month', { value: duration })}</OdsText>

diff --git a/packages/manager/apps/pci-savings-plan/src/components/CreatePlanForm/CreatePlanForm.tsx b/packages/manager/apps/pci-savings-plan/src/components/CreatePlanForm/CreatePlanForm.tsx
@@ -7,6 +7,7 @@ import {
   ODS_SPINNER_SIZE,
   OdsInputChangeEvent,
 } from '@ovhcloud/ods-components';
+
 import {
   OdsButton,
   OdsCard,
@@ -317,12 +318,17 @@ const CreatePlanForm: FC<CreatePlanFormProps> = ({
           <OdsQuantity
             onOdsChange={(event: OdsInputChangeEvent) => {
               const newValue = Number(event.detail.value);
-              if (newValue >= 1 && newValue <= 1000) onChangeQuantity(newValue);
+              if (newValue >= 1 && newValue <= 1000) {
+                onChangeQuantity(newValue);
+              } else {
+                onChangeQuantity(1);
+              }
             }}
             value={quantity}
             min={1}
             max={1000}
             name="quantity"
+            isRequired
           />
         </OdsCard>
         <OdsMessage className="my-4" isDismissible={false}>
@@ -395,7 +401,7 @@ const CreatePlanForm: FC<CreatePlanFormProps> = ({
           onClick={() => setIsLegalChecked(!isLegalChecked)}
         />
         <label htmlFor="checkbox-label">
-          <OdsText>{t('legal_checkbox')}</OdsText>
+          <OdsText>{t('legal_checkbox')} &nbsp;</OdsText>
         </label>
         <LegalLinks className="mr-[5px]" />
       </Block>

diff --git a/packages/manager/apps/pci-savings-plan/src/components/SimpleTile/SimpleTile.tsx b/packages/manager/apps/pci-savings-plan/src/components/SimpleTile/SimpleTile.tsx
@@ -17,7 +17,7 @@ const SimpleTile: React.FC<React.PropsWithChildren<{
       },
       className,
     )}
-    color={'neutral'}
+    color="neutral"
     onClick={onClick}
   >
     {children}