Comments, appointments adjustments, fixed some issues

web/components/ProductProfile.js

@@ -9,6 +9,7 @@ const fieldLabelCls = "w-[140px] text-[0.9rem] font-semibold text-[#888] upperca
 const fieldValueCls = "text-base text-[#333]";
 const qtyBtnCls = "w-7 h-7 border border-[#ddd] rounded-md bg-white text-base cursor-pointer flex items-center justify-center transition-colors hover:border-[#e68672] disabled:opacity-50";
 
+//Full detail view for a single product, shown on the product detail page
 export default function ProductProfile({ prodId, prodName, categoryName, prodDesc, prodPrice, imageUrl }) {
   const { user } = useAuth();
   const { addItem, selectedStoreId } = useCart();
@@ -17,8 +18,10 @@ export default function ProductProfile({ prodId, prodName, categoryName, prodDes
   const [adding, setAdding] = useState(false);
   const [feedback, setFeedback] = useState(null);
 
+  //Increments or decrements quantity, minimum of 1
   function changeQty(delta) { setQuantity((q) => Math.max(1, q + delta)); }
 
+  //Adds the chosen quantity to the cart and shows a success or error message
   async function handleAddToCart() {
     setAdding(true);
     setFeedback(null);
@@ -56,17 +59,17 @@ export default function ProductProfile({ prodId, prodName, categoryName, prodDes
         <div className="flex flex-col border border-[#eee] rounded-[10px] overflow-hidden">
           <div className={fieldRowCls}>
             <span className={fieldLabelCls}>Category</span>
-            <span className={fieldValueCls}>{categoryName ?? "—"}</span>
+            <span className={fieldValueCls}>{categoryName ?? "-"}</span>
           </div>
           <div className={fieldRowCls}>
             <span className={fieldLabelCls}>Price</span>
             <span className={`${fieldValueCls} font-bold text-[#1a7a3c] text-[1.1rem]`}>
-              {prodPrice != null ? `$${parseFloat(prodPrice).toFixed(2)}` : "—"}
+              {prodPrice != null ? `$${parseFloat(prodPrice).toFixed(2)}` : "-"}
             </span>
           </div>
           <div className={fieldRowCls}>
             <span className={fieldLabelCls}>Description</span>
-            <span className={fieldValueCls}>{prodDesc ?? "—"}</span>
+            <span className={fieldValueCls}>{prodDesc ?? "-"}</span>
           </div>
         </div>