diff --git a/apps/web/src/app/user-profile/page.tsx b/apps/web/src/app/user-profile/page.tsx index 0c1d2d6..768feee 100644 --- a/apps/web/src/app/user-profile/page.tsx +++ b/apps/web/src/app/user-profile/page.tsx @@ -7,22 +7,13 @@ import { useState } from "react"; import { ProfileCard } from "~/app/_components/features/ProfileCard"; import { ProfileOptions } from "~/app/_components/features/ProfileOptions"; import Main from "~/app/_components/layout/Main"; - -type Badge = "Lover" | "Contributor" | "Producer"; - -type UserProfile = { - name: string; - country: string; - memberSince: number; - thumbnailUrl: string; - badges: Badge[]; -}; +import type { UserProfileType } from "~/types"; export default function UserProfile() { const { address } = useAccount(); const { disconnect } = useDisconnect(); - const [user] = useState({ + const [user] = useState({ name: "John Doe", country: "United States", memberSince: 2020, diff --git a/apps/web/src/app/user/edit-profile/page.tsx b/apps/web/src/app/user/edit-profile/page.tsx index 431b49d..c8a4fa9 100644 --- a/apps/web/src/app/user/edit-profile/page.tsx +++ b/apps/web/src/app/user/edit-profile/page.tsx @@ -2,14 +2,7 @@ import { ChevronRightIcon } from "@heroicons/react/24/outline"; import Image from "next/image"; import Link from "next/link"; import { ProfileOptionLayout } from "~/app/_components/features/ProfileOptionLayout"; - -type EditProfileOption = { - imgUrl: string; - label: string; - href: string; - customClass?: string; - iconColor?: string; -}; +import type { EditProfileOption } from "~/types"; const editProfileOptions: EditProfileOption[] = [ { diff --git a/apps/web/src/app/user/my-claims/[id]/page.tsx b/apps/web/src/app/user/my-claims/[id]/page.tsx index 95ae1bf..9b0043c 100644 --- a/apps/web/src/app/user/my-claims/[id]/page.tsx +++ b/apps/web/src/app/user/my-claims/[id]/page.tsx @@ -4,22 +4,12 @@ import { useParams } from "next/navigation"; import React, { useEffect, useState } from "react"; import ProductStatusDetails from "~/app/_components/features/ProductStatusDetails"; import { ProfileOptionLayout } from "~/app/_components/features/ProfileOptionLayout"; - -type SaleDetails = { - productName: string; - status: string; - roast: string; - type: string; - quantity: string; - delivery: string; - totalPrice: string; - address?: string; -}; +import type { SaleDetailsType } from "~/types"; export default function MySaleDetails() { const { id: saleId } = useParams(); - const [saleDetails, setSaleDetails] = useState(null); + const [saleDetails, setSaleDetails] = useState(null); // TODO: Fetch user role based on user id or from session/context/token const [isProducer, setIsProducer] = useState(false); @@ -41,7 +31,7 @@ export default function MySaleDetails() { setIsProducer(true); }, [saleId]); - const updateSaleDetails = (productDetails: SaleDetails) => { + const updateSaleDetails = (productDetails: SaleDetailsType) => { // TODO: Implement logic to update sale details setSaleDetails(productDetails); }; diff --git a/apps/web/src/app/user/my-claims/page.tsx b/apps/web/src/app/user/my-claims/page.tsx index b4a6ab8..5b2282d 100644 --- a/apps/web/src/app/user/my-claims/page.tsx +++ b/apps/web/src/app/user/my-claims/page.tsx @@ -11,23 +11,7 @@ import { useEffect, useState } from "react"; import OrderListItem from "~/app/_components/features/OrderListItem"; import OrderListPriceItem from "~/app/_components/features/OrderListPriceItem"; import { ProfileOptionLayout } from "~/app/_components/features/ProfileOptionLayout"; - -const SalesStatusEnum = { - Paid: "Paid", - Prepared: "Prepared", - Shipped: "Shipped", - Delivered: "Delivered", -} as const; - -type SalesStatus = (typeof SalesStatusEnum)[keyof typeof SalesStatusEnum]; - -const DeliveryMethodEnum = { - Address: "Address", - Meetup: "Meetup", -} as const; - -type DeliveryMethod = - (typeof DeliveryMethodEnum)[keyof typeof DeliveryMethodEnum]; +import { DeliveryMethod, SalesStatusType } from "~/types"; const mockedOrders = [ { @@ -37,8 +21,8 @@ const mockedOrders = [ id: "1", productName: "productName", buyerName: "buyer1_fullname", - status: SalesStatusEnum.Delivered as SalesStatus, - delivery: DeliveryMethodEnum.Address as DeliveryMethod, + status: SalesStatusType.Delivered, + delivery: DeliveryMethod.Address, price: 30, claimed: false, }, @@ -46,8 +30,8 @@ const mockedOrders = [ id: "2", productName: "productName2", buyerName: "buyer2_fullname", - status: SalesStatusEnum.Delivered as SalesStatus, - delivery: DeliveryMethodEnum.Meetup as DeliveryMethod, + status: SalesStatusType.Delivered, + delivery: DeliveryMethod.Meetup, price: 30, claimed: false, }, @@ -60,8 +44,8 @@ const mockedOrders = [ id: "3", productName: "productName3", buyerName: "buyer1_fullname", - status: SalesStatusEnum.Delivered as SalesStatus, - delivery: DeliveryMethodEnum.Address as DeliveryMethod, + status: SalesStatusType.Delivered, + delivery: DeliveryMethod.Address, price: 30, claimed: true, }, @@ -69,8 +53,8 @@ const mockedOrders = [ id: "4", productName: "productName4", buyerName: "buyer2_fullname", - status: SalesStatusEnum.Delivered as SalesStatus, - delivery: DeliveryMethodEnum.Meetup as DeliveryMethod, + status: SalesStatusType.Delivered, + delivery: DeliveryMethod.Meetup, price: 30, claimed: true, }, diff --git a/apps/web/src/app/user/my-orders/[id]/page.tsx b/apps/web/src/app/user/my-orders/[id]/page.tsx index 8e4aacc..e4783b3 100644 --- a/apps/web/src/app/user/my-orders/[id]/page.tsx +++ b/apps/web/src/app/user/my-orders/[id]/page.tsx @@ -4,22 +4,14 @@ import { useParams } from "next/navigation"; import React, { useEffect, useState } from "react"; import ProductStatusDetails from "~/app/_components/features/ProductStatusDetails"; import { ProfileOptionLayout } from "~/app/_components/features/ProfileOptionLayout"; - -type OrderDetails = { - productName: string; - status: string; - roast: string; - type: string; - quantity: string; - delivery: string; - totalPrice: string; - address?: string; -}; +import type { OrderDetailsType } from "~/types"; export default function OrderDetails() { const { id: orderId } = useParams(); - const [orderDetails, setOrderDetails] = useState(null); + const [orderDetails, setOrderDetails] = useState( + null, + ); // TODO: Fetch user role based on user id or from session/context/token const [isProducer, setIsProducer] = useState(false); @@ -42,7 +34,7 @@ export default function OrderDetails() { setIsProducer(true); }, [orderId]); - const updateProductDetails = (productDetails: OrderDetails) => { + const updateProductDetails = (productDetails: OrderDetailsType) => { // TODO: Implement logic to update order details setOrderDetails(productDetails); }; diff --git a/apps/web/src/app/user/my-orders/page.tsx b/apps/web/src/app/user/my-orders/page.tsx index 5ede822..b6f61ed 100644 --- a/apps/web/src/app/user/my-orders/page.tsx +++ b/apps/web/src/app/user/my-orders/page.tsx @@ -7,28 +7,10 @@ import CheckBox from "@repo/ui/form/checkBox"; import { useRouter } from "next/navigation"; import { useEffect, useState } from "react"; import { useForm } from "react-hook-form"; -import { z } from "zod"; import OrderListItem from "~/app/_components/features/OrderListItem"; import { ProfileOptionLayout } from "~/app/_components/features/ProfileOptionLayout"; import BottomModal from "~/app/_components/ui/BottomModal"; - -const SalesStatusEnum = { - Paid: "Paid", - Prepared: "Prepared", - Shipped: "Shipped", - Delivered: "Delivered", -} as const; - -type SalesStatus = (typeof SalesStatusEnum)[keyof typeof SalesStatusEnum]; - -const filtersSchema = z.object({ - statusPaid: z.boolean().optional(), - statusPrepared: z.boolean().optional(), - statusShipped: z.boolean().optional(), - statusDelivered: z.boolean().optional(), -}); - -type FormValues = z.infer; +import { type FormValues, SalesStatusType, filtersSchema } from "~/types"; const mockedOrders = [ { @@ -38,13 +20,13 @@ const mockedOrders = [ id: "1", productName: "Edit profile", sellerName: "seller1_fullname", - status: SalesStatusEnum.Paid as SalesStatus, + status: SalesStatusType.Paid, }, { id: "2", productName: "My Orders", sellerName: "seller2_fullname", - status: SalesStatusEnum.Paid as SalesStatus, + status: SalesStatusType.Paid, }, ], }, @@ -55,13 +37,13 @@ const mockedOrders = [ id: "3", productName: "productName", sellerName: "seller1_fullname", - status: SalesStatusEnum.Delivered as SalesStatus, + status: SalesStatusType.Delivered, }, { id: "4", productName: "productName", sellerName: "seller2_fullname", - status: SalesStatusEnum.Delivered as SalesStatus, + status: SalesStatusType.Delivered, }, ], }, @@ -120,13 +102,13 @@ export default function MyOrders() { const matchesStatus = activeStatusFilters.some(Boolean) ? (activeFilters.statusPaid && - item.status === SalesStatusEnum.Paid) ?? + item.status === SalesStatusType.Paid) ?? (activeFilters.statusPrepared && - item.status === SalesStatusEnum.Prepared) ?? + item.status === SalesStatusType.Prepared) ?? (activeFilters.statusShipped && - item.status === SalesStatusEnum.Shipped) ?? + item.status === SalesStatusType.Shipped) ?? (activeFilters.statusDelivered && - item.status === SalesStatusEnum.Delivered) + item.status === SalesStatusType.Delivered) : true; return matchesSearch && matchesStatus; @@ -197,26 +179,26 @@ export default function MyOrders() {
<>
diff --git a/apps/web/src/app/user/my-sales/[id]/page.tsx b/apps/web/src/app/user/my-sales/[id]/page.tsx index 4ce3807..9c0b29b 100644 --- a/apps/web/src/app/user/my-sales/[id]/page.tsx +++ b/apps/web/src/app/user/my-sales/[id]/page.tsx @@ -4,22 +4,12 @@ import { useParams } from "next/navigation"; import React, { useEffect, useState } from "react"; import ProductStatusDetails from "~/app/_components/features/ProductStatusDetails"; import { ProfileOptionLayout } from "~/app/_components/features/ProfileOptionLayout"; - -type SaleDetails = { - productName: string; - status: string; - roast: string; - type: string; - quantity: string; - delivery: string; - totalPrice: string; - address?: string; -}; +import type { SaleDetailsType } from "~/types"; export default function SaleDetails() { const { id: saleId } = useParams(); - const [saleDetails, setSaleDetails] = useState(null); + const [saleDetails, setSaleDetails] = useState(null); // TODO: Fetch user role based on user id or from session/context/token const [isProducer, setIsProducer] = useState(false); @@ -41,7 +31,7 @@ export default function SaleDetails() { setIsProducer(true); }, [saleId]); - const updateSaleDetails = (productDetails: SaleDetails) => { + const updateSaleDetails = (productDetails: SaleDetailsType) => { // TODO: Implement logic to update sale details setSaleDetails(productDetails); }; diff --git a/apps/web/src/app/user/my-sales/page.tsx b/apps/web/src/app/user/my-sales/page.tsx index b6bece5..35e6c19 100644 --- a/apps/web/src/app/user/my-sales/page.tsx +++ b/apps/web/src/app/user/my-sales/page.tsx @@ -11,34 +11,12 @@ import { z } from "zod"; import OrderListItem from "~/app/_components/features/OrderListItem"; import { ProfileOptionLayout } from "~/app/_components/features/ProfileOptionLayout"; import BottomModal from "~/app/_components/ui/BottomModal"; - -const SalesStatusEnum = { - Paid: "Paid", - Prepared: "Prepared", - Shipped: "Shipped", - Delivered: "Delivered", -} as const; - -type SalesStatus = (typeof SalesStatusEnum)[keyof typeof SalesStatusEnum]; - -const DeliveryMethodEnum = { - Address: "Address", - Meetup: "Meetup", -} as const; - -type DeliveryMethod = - (typeof DeliveryMethodEnum)[keyof typeof DeliveryMethodEnum]; - -const filtersSchema = z.object({ - statusPaid: z.boolean().optional(), - statusPrepared: z.boolean().optional(), - statusShipped: z.boolean().optional(), - statusDelivered: z.boolean().optional(), - deliveryAddress: z.boolean().optional(), - deliveryMeetup: z.boolean().optional(), -}); - -type FormValues = z.infer; +import { + DeliveryMethod, + type FormValues, + SalesStatusType, + filtersSchema, +} from "~/types"; const mockedOrders = [ { @@ -48,15 +26,15 @@ const mockedOrders = [ id: "1", productName: "Edit profile", buyerName: "buyer1_fullname", - status: SalesStatusEnum.Paid as SalesStatus, - delivery: DeliveryMethodEnum.Address as DeliveryMethod, + status: SalesStatusType.Paid, + delivery: DeliveryMethod.Address, }, { id: "2", productName: "My Orders", buyerName: "buyer2_fullname", - status: SalesStatusEnum.Paid as SalesStatus, - delivery: DeliveryMethodEnum.Meetup as DeliveryMethod, + status: SalesStatusType.Paid, + delivery: DeliveryMethod.Meetup, }, ], }, @@ -67,15 +45,15 @@ const mockedOrders = [ id: "3", productName: "productName", buyerName: "buyer1_fullname", - status: SalesStatusEnum.Delivered as SalesStatus, - delivery: DeliveryMethodEnum.Address as DeliveryMethod, + status: SalesStatusType.Delivered, + delivery: DeliveryMethod.Address, }, { id: "4", productName: "productName", buyerName: "buyer2_fullname", - status: SalesStatusEnum.Delivered as SalesStatus, - delivery: DeliveryMethodEnum.Meetup as DeliveryMethod, + status: SalesStatusType.Delivered, + delivery: DeliveryMethod.Meetup, }, ], }, @@ -137,13 +115,13 @@ export default function MySales() { const matchesStatus = !activeStatusFilters.some(Boolean) ? true : (activeFilters.statusPaid && - item.status === SalesStatusEnum.Paid) ?? + item.status === SalesStatusType.Paid) ?? (activeFilters.statusPrepared && - item.status === SalesStatusEnum.Prepared) ?? + item.status === SalesStatusType.Prepared) ?? (activeFilters.statusShipped && - item.status === SalesStatusEnum.Shipped) ?? + item.status === SalesStatusType.Shipped) ?? (activeFilters.statusDelivered && - item.status === SalesStatusEnum.Delivered); + item.status === SalesStatusType.Delivered); const activeDeliveryFilters = [ activeFilters.deliveryAddress, @@ -153,9 +131,9 @@ export default function MySales() { const matchesDelivery = !activeDeliveryFilters.some(Boolean) ? true : (activeFilters.deliveryAddress && - item.delivery === DeliveryMethodEnum.Address) ?? + item.delivery === DeliveryMethod.Address) ?? (activeFilters.deliveryMeetup && - item.delivery === DeliveryMethodEnum.Meetup); + item.delivery === DeliveryMethod.Meetup); return matchesSearch && matchesStatus && matchesDelivery; }), @@ -225,14 +203,14 @@ export default function MySales() {
<>
@@ -243,26 +221,26 @@ export default function MySales() {
<>
diff --git a/apps/web/src/app/user/register-coffee/page.tsx b/apps/web/src/app/user/register-coffee/page.tsx index 1e54989..8d85545 100644 --- a/apps/web/src/app/user/register-coffee/page.tsx +++ b/apps/web/src/app/user/register-coffee/page.tsx @@ -12,6 +12,7 @@ import Image from "next/image"; import { useForm } from "react-hook-form"; import { z } from "zod"; import { ProfileOptionLayout } from "~/app/_components/features/ProfileOptionLayout"; +import { RoastLevel } from "~/types"; const schema = z.object({ roast: z.string().min(1, "Roast level is required"), @@ -29,14 +30,6 @@ const schema = z.object({ type FormData = z.infer; -const RoastLevel = { - LIGHT: "Light", - MEDIUM: "Medium", - STRONG: "Strong", -} as const; - -type RoastLevelType = (typeof RoastLevel)[keyof typeof RoastLevel]; - export default function RegisterCoffee() { const handleImageUpload = () => { alert("Implement image upload"); @@ -152,7 +145,7 @@ export default function RegisterCoffee() { Roast level
- {(Object.values(RoastLevel) as RoastLevelType[]).map((level) => ( + {Object.values(RoastLevel).map((level) => (
{level} diff --git a/apps/web/src/types/index.ts b/apps/web/src/types/index.ts new file mode 100644 index 0000000..eebc816 --- /dev/null +++ b/apps/web/src/types/index.ts @@ -0,0 +1,70 @@ +import { z } from "zod"; + +export type Badge = "Lover" | "Contributor" | "Producer"; + +export type UserProfileType = { + name: string; + country: string; + memberSince: number; + thumbnailUrl: string; + badges: Badge[]; +}; + +export type EditProfileOption = { + imgUrl: string; + label: string; + href: string; + customClass?: string; + iconColor?: string; +}; + +export enum RoastLevel { + LIGHT = "Light", + MEDIUM = "Medium", + STRONG = "Strong", +} + +export type SaleDetailsType = { + productName: string; + status: string; + roast: string; + type: string; + quantity: string; + delivery: string; + totalPrice: string; + address?: string; +}; + +export enum SalesStatusType { + Paid = "Paid", + Prepared = "Prepared", + Shipped = "Shipped", + Delivered = "Delivered", +} + +export type OrderDetailsType = { + productName: string; + status: string; + roast: string; + type: string; + quantity: string; + delivery: string; + totalPrice: string; + address?: string; +}; + +export enum DeliveryMethod { + Address = "Address", + Meetup = "Meetup", +} + +export const filtersSchema = z.object({ + statusPaid: z.boolean().optional(), + statusPrepared: z.boolean().optional(), + statusShipped: z.boolean().optional(), + statusDelivered: z.boolean().optional(), + deliveryAddress: z.boolean().optional(), + deliveryMeetup: z.boolean().optional(), +}); + +export type FormValues = z.infer;