From 77a41bc4d58b828b8717dcb12be1b270e54b9823 Mon Sep 17 00:00:00 2001
From: Elias Sanabria <eliassanabria1@gmail.com>
Date: Sat, 23 Nov 2024 22:47:19 -0700
Subject: [PATCH] Updated the return types to void, failed lint test but should
 pass now

---
 web/src/components/ItemModal.tsx | 51 ++++++++++++++++----------------
 1 file changed, 26 insertions(+), 25 deletions(-)

diff --git a/web/src/components/ItemModal.tsx b/web/src/components/ItemModal.tsx
index 8e0ef27..6b9e821 100644
--- a/web/src/components/ItemModal.tsx
+++ b/web/src/components/ItemModal.tsx
@@ -9,12 +9,12 @@ interface ItemModalProps {
 }
 
 export const ItemModal: React.FC<ItemModalProps> = ({ item, isOpen, onClose }) => {
-  let interval: number = 10 // Edit this to change the interval of increment and decrement for the inventory and buttons that display it.
+  const interval: number = 10 // Edit this to change the interval of increment and decrement for the inventory and buttons that display it.
   const [isEditing, setIsEditing] = useState(false)
   const [inventory, setInventory] = useState<number>(item?.totalInventory ?? 0)
   useEffect(() => {
     console.log(item)
-    if (item && typeof item.totalInventory === 'number') {
+    if ((item != null) && typeof item.totalInventory === 'number') {
       setInventory(item.totalInventory) // Update inventory when item changes
     }
   }, [item])
@@ -37,20 +37,19 @@ export const ItemModal: React.FC<ItemModalProps> = ({ item, isOpen, onClose }) =
 
   if (!isOpen || (item == null)) return null
 
-  
-  const handleEditClick = () => {
+  const handleEditClick = (): void => {
     setIsEditing(true)
   }
 
-  const handleIncrement = () => {
+  const handleIncrement = (): void => {
     setInventory(prev => prev + interval)
   }
 
-  const handleDecrement = () => {
+  const handleDecrement = (): void => {
     setInventory(prev => (prev - interval >= 0 ? prev - interval : 0)) // Ensure inventory doesn't go below 0
   }
 
-  const handleSave = () => {
+  const handleSave = (): void => {
     setIsEditing(false)
     alert(`Save complete. New inventory: ${inventory}`)
     // You can add your API call here later
@@ -64,25 +63,27 @@ export const ItemModal: React.FC<ItemModalProps> = ({ item, isOpen, onClose }) =
         <p>SKU: {item.sku}</p>
         <div className='inventory-edit-section'>
           <label>Total Inventory:</label>
-          {isEditing ? (
-            <div className='edit-inventory-container' style={{ display: 'flex', alignItems: 'center', gap: '10px' }}>
-              <button onClick={handleDecrement}>-{interval}</button>
-              <input
-                type='number'
-                value={inventory}
-                onChange={(e) => setInventory(Number(e.target.value))}
-                style={{ textAlign: 'center', width: '100px' }}
-              />
-              <button onClick={handleIncrement}>+{interval}</button>
-              <button onClick={handleSave}>Save</button>
-            </div>
-          ) : (
-            <span>
-              {inventory} <FaPencilAlt className='edit-icon' onClick={handleEditClick} />
-            </span>
-          )}
+          {isEditing
+            ? (
+              <div className='edit-inventory-container' style={{ display: 'flex', alignItems: 'center', gap: '10px' }}>
+                <button onClick={handleDecrement}>-{interval}</button>
+                <input
+                  type='number'
+                  value={inventory}
+                  onChange={(e) => setInventory(Number(e.target.value))}
+                  style={{ textAlign: 'center', width: '100px' }}
+                />
+                <button onClick={handleIncrement}>+{interval}</button>
+                <button onClick={handleSave}>Save</button>
+              </div>
+              )
+            : (
+              <span>
+                {inventory} <FaPencilAlt className='edit-icon' onClick={handleEditClick} />
+              </span>
+              )}
         </div>
-        <br></br>
+        <br />
         <button onClick={onClose}>Close</button>
       </div>
     </div>