Merge remote-tracking branch 'origin/master'

webapp/src/api/tests/clientapi.test.tsx

@@ -0,0 +1,48 @@
+import * as api from '../api';
+import { ItemCart, Review, User } from '../../shared/shareddtypes';
+
+const myUser: User = {} as User;
+const myReview: Review = {} as Review;
+const myItem: ItemCart = {
+    id: "565656"
+} as unknown as ItemCart;
+const doNothing = () => {
+    // Intentionally empty
+}
+const emptyCart: ItemCart[] = [] as ItemCart[];
+
+/**
+ * Calls to the API methods make the appropriate logs
+ * The obtained response is given for non-working backend
+ */
+test("API logging test", async () => {
+
+    api.getUsers().then(
+        res => expect(res).toEqual({} as JSON)
+    );
+
+    api.getOrders().then( res => 
+        expect(res).toEqual({} as JSON)
+    );
+
+    api.getProducts().then(
+        res => expect(res).toBe(false)
+    );
+
+    expect(api.getCart()).toEqual(emptyCart);
+
+    api.getShippingCost();
+    api.emptyCart(doNothing);
+
+    api.getOrderByUserId("");
+    api.getProductById("565656");
+    api.getProductImages("");
+
+    api.addReview(myReview);
+    api.addToCart(myItem, 1);
+    api.addUser(myUser);
+
+    api.adminLogin("user", "password");
+    //expect(response).toBe(true);
+
+});

webapp/src/components/products/MainProducts.tsx

@@ -142,16 +142,22 @@ function MainProducts(props: MainProductsProps): JSX.Element {
 
   const [searchParams, setSearchParams] = useSearchParams();
   const [products, setProducts] = useState<Product[]>([]);
-
+  const [message, setMessage] = useState<string>("Loading products!!");
   const refreshProductList = async (query: string) => {
     if (searchParams.get("q") !== null)
       query += "&name[eq]=" + searchParams.get("q");
     setProducts(await getProducts(query));
+
   }
 
   useEffect(() => {
 
     refreshProductList(computeQueryParams());
+    if(products.length===0 && computeQueryParams()===""){
+      setMessage("Loading products!!")
+    }else{ 
+      setMessage("No products matched your filtering criteria.")
+    }
   }, [color, brand, minPrice, maxPrice, minRating]);
 
   return (
@@ -178,8 +184,9 @@ function MainProducts(props: MainProductsProps): JSX.Element {
             <div data-testid="products-retrieved">
               <ProductCard key={p.id} product={p} refreshCartList={props.refreshCartList} />
             </div>
-          )) : <Typography data-testid="loader">Loading products!!
-            <LinearProgress color="success" />
+          )) : <Typography data-testid="loader" style={{color:'#F23005', fontWeight:'bold', fontSize:'1.6em'}}>
+             {message.toString()} {message ==="Loading products!!" ? <LinearProgress color="success" />:  <></>}
+
           </Typography>
           }
         </div>

webapp/src/components/products/tests/ReviewView.test.tsx

@@ -1,14 +1,15 @@
-import React from 'react'
 import { render, screen } from '@testing-library/react';
 import { Review } from '../../../shared/shareddtypes';
 import ReviewView from '../ReviewView';
+
 const reviewTest: Review = {
     userId: "dummy",
     productId: "prod1",
     rating: 5,
     comment: "testing1",
     orderId: "order1"
 }
+
 test("Review view is rendered properly", async () => {
 
     render(<ReviewView review={reviewTest}></ReviewView>);