diff --git a/client/ecommerce/src/components/ProfileInfo.tsx b/client/ecommerce/src/components/ProfileInfo.tsx index d2ceec3..59a74e7 100644 --- a/client/ecommerce/src/components/ProfileInfo.tsx +++ b/client/ecommerce/src/components/ProfileInfo.tsx @@ -92,9 +92,6 @@ export const ProfileInfo = ({ user }: { user: ExtendedUserWithProfile }) => { {user.username} - - good reputation - ) : ( diff --git a/client/ecommerce/src/components/TabPanel.tsx b/client/ecommerce/src/components/TabPanel.tsx new file mode 100644 index 0000000..640e84c --- /dev/null +++ b/client/ecommerce/src/components/TabPanel.tsx @@ -0,0 +1,183 @@ +import Tabs from "@mui/material/Tabs"; +import Tab from "@mui/material/Tab"; +import Typography from "@mui/material/Typography"; +import Box from "@mui/material/Box"; +import { useState } from "react"; +import { ProductWithImageAndUser } from "../types/types"; +import { Card, CardContent, CardMedia, Grid, Link } from "@mui/material"; +import { useMediaQuery } from "../hooks/useMediaQuery"; +import StarBorderOutlinedIcon from "@mui/icons-material/StarBorderOutlined"; +interface TabPanelProps { + children?: React.ReactNode; + index: number; + value: number; + memberProducts?: ProductWithImageAndUser[]; + reviews?: unknown[]; +} + +function CustomTabPanel(props: TabPanelProps) { + const below700 = useMediaQuery(700); + const below1200 = useMediaQuery(1200); + const { children, value, index, ...other } = props; + + return ( + + ); +} + +function a11yProps(index: number) { + return { + id: `simple-tab-${index}`, + "aria-controls": `simple-tabpanel-${index}`, + }; +} + +export default function BasicTabs({ + memberProducts, +}: { + memberProducts: ProductWithImageAndUser[]; +}) { + const [value, setValue] = useState(0); + const handleChange = (event: React.SyntheticEvent, newValue: number) => { + setValue(newValue); + }; + + return ( + + + + + + + + + + + ); +} diff --git a/client/ecommerce/src/components/conversation-details/ConversationDetailsNavbar.tsx b/client/ecommerce/src/components/conversation-details/ConversationDetailsNavbar.tsx index 41db9b4..1dfee8e 100644 --- a/client/ecommerce/src/components/conversation-details/ConversationDetailsNavbar.tsx +++ b/client/ecommerce/src/components/conversation-details/ConversationDetailsNavbar.tsx @@ -1,7 +1,4 @@ import { Box, Button, Typography } from "@mui/material"; -import { Conversation } from "../../types/types"; -import { useUserContext } from "../../contexts/UserContext"; -import { getRecipientFromConversation } from "../../utils/getRecipientFromConversation"; import ClearIcon from "@mui/icons-material/Clear"; export const ConversationDetailsNavbar = ({ setIsConversationDetailsOpen, diff --git a/client/ecommerce/src/components/pages/Member.tsx b/client/ecommerce/src/components/pages/Member.tsx index f5e25d0..900e1e5 100644 --- a/client/ecommerce/src/components/pages/Member.tsx +++ b/client/ecommerce/src/components/pages/Member.tsx @@ -4,6 +4,8 @@ import { CardContent, CardMedia, Grid, + Tab, + Tabs, Typography, } from "@mui/material"; import { Link, useParams } from "wouter"; @@ -11,12 +13,13 @@ import { ProfileInfo } from "../ProfileInfo"; import { useAllProducts } from "../../hooks/useAllProducts"; import { useMediaQuery } from "../../hooks/useMediaQuery"; import { useUserInfo } from "../../hooks/useUserInfo"; +import BasicTabs from "../TabPanel"; export const Member = () => { const below700 = useMediaQuery(700); const below1200 = useMediaQuery(1200); const params = useParams(); - + const userId = params?.userId; const { data: user, isLoading: isUserLoading } = useUserInfo( parseInt(userId!) @@ -61,17 +64,19 @@ export const Member = () => { sx={{ maxWidth: "1260px", width: "100%", - display: "flex", + display: "column", padding: "20x", }} > - + + {/* {memberProducts.length} items - + */} - { ))} - + */} ); }; diff --git a/client/ecommerce/src/components/pages/MenCatalog.tsx b/client/ecommerce/src/components/pages/MenCatalog.tsx index 9632f95..ecb5aaf 100644 --- a/client/ecommerce/src/components/pages/MenCatalog.tsx +++ b/client/ecommerce/src/components/pages/MenCatalog.tsx @@ -30,10 +30,7 @@ export const MenCatalog = () => { const [order, setOrder] = useState(""); const { user } = useUserContext(); const [category] = useState("Men"); - console.log("chosen brand"); - console.log(brand); - console.log(user); - console.log(order); + useEffect(() => { const params = new URLSearchParams(); if (brand && order) { @@ -52,7 +49,7 @@ export const MenCatalog = () => { const { data: products, isLoading: isProductsLoading } = useFilteredProducts( brand, order, - category, + category ); if (isProductsLoading) { @@ -61,7 +58,6 @@ export const MenCatalog = () => { if (!products) { return; } - console.log(products); const handlePriceSelected = (price: string) => { setOrder(price); }; diff --git a/client/ecommerce/src/components/pages/Product.tsx b/client/ecommerce/src/components/pages/Product.tsx index d962c5f..e5934bc 100644 --- a/client/ecommerce/src/components/pages/Product.tsx +++ b/client/ecommerce/src/components/pages/Product.tsx @@ -10,7 +10,6 @@ import { sendProductInfoToCheckout } from "../../api/axios"; import { useStripe } from "@stripe/react-stripe-js"; import { useMutation } from "@tanstack/react-query"; import { useUserContext } from "../../contexts/UserContext"; -import { useEffect, useState } from "react"; import { useDeleteProduct } from "../../hooks/useDeleteProduct"; export const Product = () => { diff --git a/server/ecommerce/src/products/products.service.ts b/server/ecommerce/src/products/products.service.ts index f97e2ea..f41e230 100644 --- a/server/ecommerce/src/products/products.service.ts +++ b/server/ecommerce/src/products/products.service.ts @@ -245,7 +245,6 @@ export class ProductsService { async sortByPrice(order: Order, products: Product[]) { const sortedProducts = [...products]; - console.log(order); if (order === 'price_high_to_low') { sortedProducts.sort((a, b) => b.price - a.price); @@ -261,7 +260,7 @@ export class ProductsService { return products.filter((product) => product.brand === brand); } - public isValidBrand(brand: any): boolean { + public isValidBrand(brand: any): brand is Brand { const validBrands: Brand[] = [ 'Zara', 'Reserved', @@ -274,9 +273,10 @@ export class ProductsService { return validBrands.includes(brand); } - public isValidOrder(order: string): boolean { + public isValidOrder(order: string): order is Order { console.log(order); const validOrders: Order[] = ['price_high_to_low', 'price_low_to_high']; + return validOrders.includes(order as Order); } diff --git a/server/ecommerce/src/utils/ZodExceptionFilter.ts b/server/ecommerce/src/utils/ZodExceptionFilter.ts index b651be7..01e77c6 100644 --- a/server/ecommerce/src/utils/ZodExceptionFilter.ts +++ b/server/ecommerce/src/utils/ZodExceptionFilter.ts @@ -18,7 +18,5 @@ export class ZodExceptionFilter extends BaseExceptionFilter { }); } - private isZodError = (err: any): err is ZodError => { - return err.name === 'ZodError'; - }; + private isZodError = (err: any): err is ZodError => err.name === 'ZodError'; }