diff --git a/src/app/cart/styles.tsx b/src/app/cart/styles.tsx
index d3364a99..9598dbd4 100644
--- a/src/app/cart/styles.tsx
+++ b/src/app/cart/styles.tsx
@@ -268,7 +268,7 @@ export const DeliveryContainer = styled.div`
display: flex;
flex-direction: row;
justify-content: space-between;
- align-items: center;
+ align-items: flex-start;
`;
export const Container = styled.div`
@@ -279,7 +279,7 @@ export const Container = styled.div`
export const InformationContainer = styled.div`
width: 100%;
height: 100%;
- margin: 40px;
+ margin-left: 25px;
`;
export const OutterDiv = styled.div`
@@ -339,6 +339,7 @@ export const BackButtonDiv = styled.div`
text-align: left;
width: 800px;
margin-left: 110px;
+ margin-bottom: 40px;
`;
export const CheckoutButton = styled.button`
diff --git a/src/app/profileScreen/page.tsx b/src/app/profileScreen/page.tsx
index e550fa2c..9cbcec11 100644
--- a/src/app/profileScreen/page.tsx
+++ b/src/app/profileScreen/page.tsx
@@ -6,6 +6,7 @@ import { useEffect, useState } from 'react';
import {
Heading2,
Body3,
+ Heading3,
Heading1,
Body1Bold,
Body2Bold,
@@ -53,6 +54,7 @@ import {
ColumnDiv,
LogOutDiv,
Fullscreen,
+ MessageDiv,
} from './styles';
import { signOut } from '../../api/supabase/auth/auth';
import 'react-toastify/dist/ReactToastify.css';
@@ -68,6 +70,39 @@ function FavoriteSection(props: {
addOrRemoveProductFromFavorite(fav, false);
setFavorites(Favorites.filter(Prod => Prod.id !== fav.id));
}
+ if (Favorites.length > 0) {
+ return (
+
+
+
+ Favorites
+
+
+ {Favorites.slice(0, 2).map(favorite => (
+
+ 
+
+
+ {favorite.name}
+
+ Product ID: {favorite.id}
+
+
+ clickFunctions({ fav: favorite })}
+ >
+
+
+
+ ))}
+
+
+ );
+ }
return (
@@ -75,27 +110,9 @@ function FavoriteSection(props: {
Favorites
- {Favorites.slice(0, 2).map(favorite => (
-
-
-
-
- {favorite.name}
-
- Product ID: {favorite.id}
-
-
- clickFunctions({ fav: favorite })}
- >
-
-
-
- ))}
+
+ No Favorite Items
+
);
@@ -114,36 +131,39 @@ function OrderHistorySection(props: { Orders: Order[] }) {
const firstOrder = Orders.filter(
order => order.order_product_id_array.length !== 0,
)[0];
- const firstOrderProductIds = firstOrder.order_product_id_array.slice(
- 0,
- 3,
- );
+ // handleErrorlater
+ if (firstOrder) {
+ const firstOrderProductIds = firstOrder.order_product_id_array.slice(
+ 0,
+ 3,
+ );
- const productIds = await Promise.all(
- firstOrderProductIds.map(productId =>
- fetchOrderProductById(productId).then(
- orderproduct => orderproduct.product_id,
+ const productIds = await Promise.all(
+ firstOrderProductIds.map(productId =>
+ fetchOrderProductById(productId).then(
+ orderproduct => orderproduct.product_id,
+ ),
),
- ),
- );
+ );
- const productArray = await Promise.all(
- productIds.map(async productId =>
- fetchProductWithQuantityById(productId).then(product => product),
- ),
- );
+ const productArray = await Promise.all(
+ productIds.map(async productId =>
+ fetchProductWithQuantityById(productId).then(product => product),
+ ),
+ );
- setFirstOrderProducts(productArray);
+ setFirstOrderProducts(productArray);
- const timestamp = firstOrder.created_at;
- const date = new Date(timestamp);
- const options: Intl.DateTimeFormatOptions = {
- month: 'long',
- day: 'numeric',
- year: 'numeric',
- };
- const formattedDate = date.toLocaleDateString('en-US', options);
- setFormattedDate(formattedDate);
+ const timestamp = firstOrder.created_at;
+ const date = new Date(timestamp);
+ const options: Intl.DateTimeFormatOptions = {
+ month: 'long',
+ day: 'numeric',
+ year: 'numeric',
+ };
+ const formattedDate = date.toLocaleDateString('en-US', options);
+ setFormattedDate(formattedDate);
+ }
}
}
fetchFirstOrderProducts();
@@ -249,14 +269,9 @@ function OrderHistorySection(props: { Orders: Order[] }) {
Order History
-
- No Current Orders to Display
-
+
+ No Current Orders to Display
+
);
@@ -276,27 +291,34 @@ function AccountDetailSectionDelivery(props: { user: User }) {
Account Details
+
+ Name
+
+
+
+ {user?.first_name} {user?.last_name}
+
+
Email
{user?.email}
+
- Name
+ Phone
-
- {user?.first_name} {user?.last_name}
-
+ {user?.phone_numbers}
- Address
+ Address
-
+
{UserAddress?.street}, {UserAddress?.city}, {UserAddress?.zipcode}
-
+
@@ -381,7 +403,7 @@ export default function Profile() {
getUser();
}, []);
if (user === undefined) {
- return Error Loading User
;
+ return Loading User
;
}
return (
diff --git a/src/app/profileScreen/styles.ts b/src/app/profileScreen/styles.ts
index 46af09cd..81d02884 100644
--- a/src/app/profileScreen/styles.ts
+++ b/src/app/profileScreen/styles.ts
@@ -156,3 +156,11 @@ export const LogOutDiv = styled.div`
width: 500px;
height: 350px;
`;
+
+export const MessageDiv = styled.div`
+ display: flex;
+ width: 100%;
+ justify-content: center;
+ align-items: center;
+ height: 250px;
+`;
diff --git a/src/app/storefront/productButtons.tsx b/src/app/storefront/productButtons.tsx
index 399839fb..0cc824b7 100644
--- a/src/app/storefront/productButtons.tsx
+++ b/src/app/storefront/productButtons.tsx
@@ -11,7 +11,6 @@ import {
import { Product } from '../../schema/schema';
export default function ProductButtons(props: {
- key: number;
value: string;
setFiltredProducts: (category: Product[]) => void;
content: string;
@@ -21,7 +20,6 @@ export default function ProductButtons(props: {
clickedButton: number;
}) {
const {
- key,
value,
content,
setFiltredProducts,
@@ -88,7 +86,7 @@ export default function ProductButtons(props: {