Merge pull request stakwork#234 from saithsab877/Incorrect-check-for-…

…enabling-Next-button Fix Incorrect Next Button Enablement for Zero Value in Price (Sats)
gouravmpk · Feb 14, 2024 · 1ea5e29 · 1ea5e29
2 parents c9cfc57 + dc228ca
commit 1ea5e29
Show file tree

Hide file tree

Showing 3 changed files with 147 additions and 7 deletions.
diff --git a/src/components/form/inputs/NumberSatsInput.tsx b/src/components/form/inputs/NumberSatsInput.tsx
@@ -83,7 +83,7 @@ export default function NumberInputNew({
         id={name}
         type={'text'}
         value={textValue}
-        placeholder={'0'}
+        placeholder={'1'}
         onFocus={handleFocus}
         onBlur={() => {
           handleBlur();
@@ -92,11 +92,17 @@ export default function NumberInputNew({
           }
         }}
         onChange={(e: any) => {
-          const realNumber = convertLocaleToNumber(e.target.value) ?? 0;
-          e.target.value = convertToLocaleString(realNumber);
-          handleChange(e.target.value);
-          setTextValue(e.target.value);
-          setNumberValue(convertLocaleToNumber(e.target.value));
+          const realNumber = convertLocaleToNumber(e.target.value);
+          if (realNumber > 0) {
+            const formattedValue = convertToLocaleString(realNumber);
+            handleChange(formattedValue);
+            setTextValue(formattedValue);
+            setNumberValue(realNumber);
+          } else {
+            handleChange('');
+            setTextValue('');
+            setNumberValue(0);
+          }
         }}
       />
       <label

diff --git a/src/components/form/inputs/__tests__/NumberSatsInput.spec.tsx b/src/components/form/inputs/__tests__/NumberSatsInput.spec.tsx
@@ -0,0 +1,127 @@
+import React from 'react';
+import { render, screen, fireEvent } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import { convertLocaleToNumber } from '../../../../helpers';
+import NumberInputNew from '../NumberSatsInput.tsx';
+
+describe('NumberInputNew Component', () => {
+  test('accepts numbers greater than or equal to 1', () => {
+    render(
+      <NumberInputNew
+        error={''}
+        label="Test Label"
+        name="testInput"
+        value=""
+        handleChange={() => {
+          ('');
+        }}
+        handleBlur={() => {
+          ('');
+        }}
+        handleFocus={() => {
+          ('');
+        }}
+        readOnly
+      />
+    );
+    const inputElement = screen.getByPlaceholderText('1') as HTMLInputElement;
+    fireEvent.change(inputElement, { target: { value: '123' } });
+    expect(convertLocaleToNumber(inputElement.value)).toBeGreaterThanOrEqual(1);
+  });
+
+  test('does not accept symbols', () => {
+    render(
+      <NumberInputNew
+        error={''}
+        label="Test Label"
+        name="testInput"
+        value=""
+        handleChange={() => {
+          ('');
+        }}
+        handleBlur={() => {
+          ('');
+        }}
+        handleFocus={() => {
+          ('');
+        }}
+        readOnly
+      />
+    );
+    const inputElement = screen.getByPlaceholderText('1') as HTMLInputElement;
+    fireEvent.change(inputElement, { target: { value: '@#$' } });
+    expect(inputElement.value).toBe(''); //component clears the input for invalid values
+  });
+
+  test('does not accept text', () => {
+    render(
+      <NumberInputNew
+        error={''}
+        label="Test Label"
+        name="testInput"
+        value=""
+        handleChange={() => {
+          ('');
+        }}
+        handleBlur={() => {
+          ('');
+        }}
+        handleFocus={() => {
+          ('');
+        }}
+        readOnly
+      />
+    );
+    const inputElement = screen.getByPlaceholderText('1') as HTMLInputElement;
+    fireEvent.change(inputElement, { target: { value: 'text' } });
+    expect(inputElement.value).toBe('');
+  });
+
+  test('does not accept negative numbers', () => {
+    render(
+      <NumberInputNew
+        error={''}
+        label="Test Label"
+        name="testInput"
+        value=""
+        handleChange={() => {
+          ('');
+        }}
+        handleBlur={() => {
+          ('');
+        }}
+        handleFocus={() => {
+          ('');
+        }}
+        readOnly
+      />
+    );
+    const inputElement = screen.getByPlaceholderText('1') as HTMLInputElement;
+    fireEvent.change(inputElement, { target: { value: '-123' } });
+    expect(inputElement.value).toBe('');
+  });
+
+  test('does not accept numbers less than to 0', () => {
+    render(
+      <NumberInputNew
+        error={''}
+        label="Test Label"
+        name="testInput"
+        value=""
+        handleChange={() => {
+          ('');
+        }}
+        handleBlur={() => {
+          ('');
+        }}
+        handleFocus={() => {
+          ('');
+        }}
+        readOnly
+      />
+    );
+    const inputElement = screen.getByPlaceholderText('1') as HTMLInputElement;
+    fireEvent.change(inputElement, { target: { value: '0' } });
+    expect(inputElement.value).toBe('');
+  });
+});
diff --git a/src/helpers/helpers-extended.ts b/src/helpers/helpers-extended.ts
@@ -42,9 +42,16 @@ export const convertToLocaleString = (value: number): string => {
 };
 
 export const convertLocaleToNumber = (localeString: string): number => {
+  const isNegative = localeString.startsWith('-');
+
   const numString = localeString.replace(/\D/g, '');
 
-  const num = parseInt(numString);
+  let num = parseInt(numString);
+
+  if (isNegative) {
+    num = -num;
+  }
+
   return num;
 };