eslint and prettier

calblueprint · Apr 18, 2024 · 20ce153 · 20ce153
1 parent 9f61fe8
commit 20ce153
Show file tree

Hide file tree

Showing 11 changed files with 79 additions and 87 deletions.
diff --git a/src/api/supabase/queries/user_queries.ts b/src/api/supabase/queries/user_queries.ts
@@ -105,7 +105,6 @@ export async function arrayOfFavorites(): Promise<Product[]> {
   return arrayOfProducts;
 }
 
-
 /**
  * fetchUserAddress: Get's a user's address based on their UUID
  * @param uuid: String containing the uuid of the user

diff --git a/src/app/[productId]/Buttons.tsx b/src/app/[productId]/Buttons.tsx
@@ -11,7 +11,6 @@ import {
 
 import { addToCart } from '../../api/supabase/queries/cart_queries';
 
-
 export default function Buttons(props: { productNumber: number }) {
   const [quantity, setQuantity] = useState<number>(1);
   const { productNumber } = props;
@@ -36,11 +35,11 @@ export default function Buttons(props: { productNumber: number }) {
     <ButtonsWrapper>
       <QuantityButton>
         <PlusMinusButton type="button" onClick={decreaseQuantity}>
-          <Minus size="20"/>
+          <Minus size="20" />
         </PlusMinusButton>
         <Body1Bold>{quantity}</Body1Bold>
         <PlusMinusButton type="button" onClick={increaseQuantity}>
-          <Plus size="20"/>
+          <Plus size="20" />
         </PlusMinusButton>
       </QuantityButton>
 

diff --git a/src/app/[productId]/page.tsx b/src/app/[productId]/page.tsx
@@ -3,7 +3,10 @@
 import { useEffect, useState } from 'react';
 import { convertButtonNumberToCategory } from '@/api/supabase/queries/button_queries';
 import { Body1, Heading1, Body2Light, Body2Bold, Body3 } from '@/styles/fonts';
-import { fetchProductByID, fetchUserProducts } from '../../api/supabase/queries/product_queries';
+import {
+  fetchProductByID,
+  fetchUserProducts,
+} from '../../api/supabase/queries/product_queries';
 import BackButton from '../../components/BackButton/BackButton';
 import 'react-toastify/dist/ReactToastify.css';
 
@@ -17,7 +20,7 @@ import {
   FavoritePopup,
   HeartContainer,
   HeartIcon,
-  TopRightContainer
+  TopRightContainer,
 } from './styles';
 import { addOrRemoveProductFromFavorite } from '../../api/supabase/queries/user_queries';
 import NavBar from '../../components/NavBarFolder/NavBar';
@@ -30,9 +33,7 @@ export default function ItemDisplay({
   params: { productId: number };
 }) {
   const [Item, setItem] = useState<Product>();
-  const [IsFavorite, setIsFavorite] = useState(
-    false
-  );
+  const [IsFavorite, setIsFavorite] = useState(false);
   const [FilteredProducts, setFilteredProducts] = useState<Product[]>([]);
 
   useEffect(() => {
@@ -44,7 +45,7 @@ export default function ItemDisplay({
         );
         const data = (await fetchUserProducts()) as Product[];
 
-        setIsFavorite(!!data.find(item => item.id === params.productId))
+        setIsFavorite(!!data.find(item => item.id === params.productId));
         if (response) {
           setItem(response);
           setFilteredProducts(data);
@@ -58,7 +59,10 @@ export default function ItemDisplay({
   }, [params.productId]);
 
   async function handleFavorite() {
-    await addOrRemoveProductFromFavorite(await fetchProductByID(params.productId), !IsFavorite);
+    await addOrRemoveProductFromFavorite(
+      await fetchProductByID(params.productId),
+      !IsFavorite,
+    );
     setIsFavorite(!IsFavorite);
   }
 
@@ -74,34 +78,32 @@ export default function ItemDisplay({
 
       <DescriptionContainer>
         <LeftColumnDiv>
-        <BackButton destination="./storefront" />
-        <ImageContainer>
-          <img
-            src={Item?.photo}
-            alt={Item?.name}
-            style={{ width: '400px', height: '400px' }}
-          />
-        </ImageContainer>
+          <BackButton destination="./storefront" />
+          <ImageContainer>
+            <img
+              src={Item?.photo}
+              alt={Item?.name}
+              style={{ width: '400px', height: '400px' }}
+            />
+          </ImageContainer>
         </LeftColumnDiv>
         <TextContainer>
-        <TopRightContainer>
-          <Heading1>{Item?.name}</Heading1>
-          <HeartContainer onClick={() => handleFavorite()}>
-        <FavoritePopup>
-          <Body3>
-            {IsFavorite ? 'Remove from favorites' : 'Add to favorites'}
-          </Body3>
-        </FavoritePopup>
-        <HeartIcon $favorited={IsFavorite} />
-      </HeartContainer>
-      </TopRightContainer>
-      <Body1 style={{ fontWeight: 'normal', paddingTop: '5px' }}>
+          <TopRightContainer>
+            <Heading1>{Item?.name}</Heading1>
+            <HeartContainer onClick={() => handleFavorite()}>
+              <FavoritePopup>
+                <Body3>
+                  {IsFavorite ? 'Remove from favorites' : 'Add to favorites'}
+                </Body3>
+              </FavoritePopup>
+              <HeartIcon $favorited={IsFavorite} />
+            </HeartContainer>
+          </TopRightContainer>
+          <Body1 style={{ fontWeight: 'normal', paddingTop: '5px' }}>
             <b>Category:</b> {Item?.category}
           </Body1>
           <Buttons productNumber={params.productId} />
-          <Body2Bold style={{ paddingTop: '40px' }}>
-            Product Details:
-          </Body2Bold>
+          <Body2Bold style={{ paddingTop: '40px' }}>Product Details:</Body2Bold>
           <Body2Light style={{ paddingTop: '20px' }}>
             {Item?.description}
           </Body2Light>

diff --git a/src/app/favorites/individualItem.tsx b/src/app/favorites/individualItem.tsx
@@ -26,20 +26,20 @@ export default function IndividualItem(props: {
   const { favorite, Favorites, setFavorites } = props;
   const router = useRouter();
   const [hovering, setHovering] = useState(false);
-  
+
   useEffect(() => {
     async function changeCategory() {
-        try {
-            favorite.category = await convertButtonNumberToCategory(
-              favorite.category,
-            );
-          } catch (error) {
-            // console.error(error);
-          }
+      try {
+        favorite.category = await convertButtonNumberToCategory(
+          favorite.category,
+        );
+      } catch (error) {
+        // console.error(error);
       }
+    }
 
-      changeCategory();
-  }, []);
+    changeCategory();
+  }, [favorite]);
 
   async function clickFunctions(props2: { fav: Product }) {
     const { fav } = props2;
@@ -75,4 +75,4 @@ export default function IndividualItem(props: {
       </TransparentButton>
     </FavoriteDiv>
   );
-}
+}
diff --git a/src/app/favorites/page.tsx b/src/app/favorites/page.tsx
@@ -4,17 +4,11 @@ import { useState, useEffect } from 'react';
 import { Heading1 } from '@/styles/fonts';
 import BackButton from '../../components/BackButton/BackButton';
 
-import {
-  arrayOfFavorites,
-} from '../../api/supabase/queries/user_queries';
+import { arrayOfFavorites } from '../../api/supabase/queries/user_queries';
 
 import NavBar from '../../components/NavBarFolder/NavBar';
 
-import {
-  OutterFavoriteDiv,
-  OutterBox,
-  Fullscreen,
-} from './styles';
+import { OutterFavoriteDiv, OutterBox, Fullscreen } from './styles';
 import IndividualItem from './individualItem';
 
 import { Product } from '../../schema/schema';
@@ -39,11 +33,11 @@ export default function FavoritesPage() {
         <OutterFavoriteDiv>
           {Favorites.map(favorite => (
             <IndividualItem
-            key={favorite.id}
-            favorite={favorite}
-            setFavorites={setFavorites}
-            Favorites={Favorites}
-          />
+              key={favorite.id}
+              favorite={favorite}
+              setFavorites={setFavorites}
+              Favorites={Favorites}
+            />
           ))}
         </OutterFavoriteDiv>
       </OutterBox>

diff --git a/src/app/favorites/styles.ts b/src/app/favorites/styles.ts
@@ -69,7 +69,6 @@ export const TransparentButton = styled.button`
   cursor: pointer;
 `;
 
-
 export const Hover = styled.div<{ $ishovering?: boolean }>`
   visibility: ${props => (props.$ishovering ? 'visible' : 'hidden')};
   transform: translate(-10px, 0px);

diff --git a/src/app/globals.css b/src/app/globals.css
@@ -84,7 +84,7 @@ body {
   max-width: 100vw;
   min-height: 100vh;
 }
-button{
+button {
   &:hover {
     cursor: pointer;
   }

diff --git a/src/app/login/styles.ts b/src/app/login/styles.ts
@@ -9,7 +9,7 @@ export const LoginBox = styled.div`
   justify-self: center;
   align-self: center;
   background-color: ${COLORS.white};
-  box-shadow: 0px 4px 7px 0px rgba(0, 0, 0, 0.10);
+  box-shadow: 0px 4px 7px 0px rgba(0, 0, 0, 0.1);
   border-radius: 10px;
 `;
 

diff --git a/src/app/profileScreen/individualItem.tsx b/src/app/profileScreen/individualItem.tsx
@@ -17,20 +17,20 @@ export default function IndividualItem(props: {
 }) {
   const { favorite, Favorites, setFavorites } = props;
   const [hovering, setHovering] = useState(false);
-  
+
   useEffect(() => {
     async function changeCategory() {
-        try {
-            favorite.category = await convertButtonNumberToCategory(
-              favorite.category,
-            );
-          } catch (error) {
-            // console.error(error);
-          }
+      try {
+        favorite.category = await convertButtonNumberToCategory(
+          favorite.category,
+        );
+      } catch (error) {
+        // console.error(error);
       }
+    }
 
-      changeCategory();
-  }, []);
+    changeCategory();
+  }, [favorite]);
 
   async function clickFunctions(props2: { fav: Product }) {
     const { fav } = props2;
@@ -40,12 +40,12 @@ export default function IndividualItem(props: {
 
   return (
     <FavoriteDiv key={favorite.id}>
-              <img
-                src={favorite.photo}
-                alt={favorite.name}
-                style={{ width: '75px', height: '75px' }}
-              />
-                <ProductNameDiv>
+      <img
+        src={favorite.photo}
+        alt={favorite.name}
+        style={{ width: '75px', height: '75px' }}
+      />
+      <ProductNameDiv>
         <Body1Bold>{favorite.name}</Body1Bold>
         <Body2>Category: {favorite.category}</Body2>
       </ProductNameDiv>
@@ -59,6 +59,6 @@ export default function IndividualItem(props: {
         </Hover>
         <HeartIcon />
       </TransparentButton>
-            </FavoriteDiv>
+    </FavoriteDiv>
   );
-}
+}
diff --git a/src/app/profileScreen/page.tsx b/src/app/profileScreen/page.tsx
@@ -13,7 +13,6 @@ import {
   Body2,
 } from '@/styles/fonts';
 import {
-  addOrRemoveProductFromFavorite,
   arrayOfFavorites,
   fetchUser,
   fetchCurrentUserAddress,
@@ -55,7 +54,6 @@ import { signOut } from '../../api/supabase/auth/auth';
 import 'react-toastify/dist/ReactToastify.css';
 import IndividualItem from './individualItem';
 
-
 function FavoriteSection(props: {
   Favorites: Product[];
   setFavorites: (category: Product[]) => void;
@@ -71,11 +69,11 @@ function FavoriteSection(props: {
           </HeaderDiv>
           {Favorites.slice(0, 2).map(favorite => (
             <IndividualItem
-            key={favorite.id}
-            favorite={favorite}
-            setFavorites={setFavorites}
-            Favorites={Favorites}
-          />
+              key={favorite.id}
+              favorite={favorite}
+              setFavorites={setFavorites}
+              Favorites={Favorites}
+            />
           ))}
         </FavoritesContainer>
       </main>

diff --git a/src/components/InputFieldsFolder/styles.ts b/src/components/InputFieldsFolder/styles.ts
@@ -32,7 +32,8 @@ export const Input = styled.input<{
   color: ${COLORS.black};
   border: 1.5px solid
     ${props => (props.$wrongLogin ? COLORS.darkRed : COLORS.neutralGrey)};
-  background: ${props => (props.$pickColor ? COLORS.lightRed : COLORS.lightGrey)};
+  background: ${props =>
+    props.$pickColor ? COLORS.lightRed : COLORS.lightGrey};
   width: 420px;
   height: 40px;
   padding-left: 10px;