Reincorporated profile and cart buttons back into storefront

calblueprint · Oct 15, 2023 · e059fdd · e059fdd
1 parent 82ba7fc
commit e059fdd
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 3 deletions.
diff --git a/src/app/storefront/page.tsx b/src/app/storefront/page.tsx
@@ -2,7 +2,8 @@
 
 import React, { useState } from 'react';
 
-import { GlobalStyle, ButtonsContainer } from './styles';
+import Link from 'next/link';
+import { GlobalStyle, ButtonsContainer, IconButtons } from './styles';
 import ProductButtons from './productButtons';
 
 interface Product {
@@ -42,6 +43,13 @@ export default function App() {
 
   return (
     <main>
+      <GlobalStyle />
+      <IconButtons>
+        <Link href="/checkout">Cart</Link>
+      </IconButtons>
+      <IconButtons>
+        <Link href="/profileScreen">Profile</Link>
+      </IconButtons>
       <GlobalStyle />
       <ButtonsContainer>
         {buttons.map(type => (

diff --git a/src/app/storefront/productButtons.tsx b/src/app/storefront/productButtons.tsx
@@ -29,7 +29,7 @@ export default function ProductButtons(props: {
   ) {
     setIsClicked(!IsClicked);
     const category = e.currentTarget.value;
-    console.log(category);
+    // console.log(category);
 
     if (category !== 'All') {
       const products = await filterProduct(category);
@@ -50,7 +50,9 @@ export default function ProductButtons(props: {
         isClicked={IsClicked}
         key={key}
         value={value}
-        onClick={e => applyFilter(e)}
+        onClick={(e: React.MouseEvent<HTMLButtonElement, MouseEvent>) =>
+          applyFilter(e)
+        }
       />
       <Label isClicked={IsClicked}>{content}</Label>
     </IndividualContainer>

diff --git a/src/app/storefront/styles.ts b/src/app/storefront/styles.ts
@@ -42,3 +42,20 @@ export const ButtonsContainer = styled.div`
   flex-direction: row;
   align-items: center;
 `;
+export const IconButtons = styled.button`
+  margin-top: 30px;
+  margin-right: 25px;
+  color: white;
+  text-align: center;
+  font-family: sans-serif;
+  font-size: 15px;
+  font-style: normal;
+  font-weight: normal;
+  line-height: normal;
+  width: 70px;
+  height: 40px;
+  background: black;
+  border: transparent;
+  border-radius: 5px;
+  float: right;
+`;