mirror of
https://github.com/vercel/commerce.git
synced 2025-07-22 20:26:49 +00:00
bug: fix bug conflict
This commit is contained in:
6
framework/vendure/schema.d.ts
vendored
6
framework/vendure/schema.d.ts
vendored
@@ -3247,9 +3247,9 @@ export type ActiveCustomerQuery = { __typename?: 'Query' } & {
|
|||||||
activeCustomer?: Maybe<
|
activeCustomer?: Maybe<
|
||||||
{ __typename?: 'Customer' } & Pick<
|
{ __typename?: 'Customer' } & Pick<
|
||||||
Customer,
|
Customer,
|
||||||
FavoriteList,
|
Favorite,
|
||||||
'id' | 'firstName' | 'lastName' | 'emailAddress' | 'favorites'
|
'id' | 'firstName' | 'lastName' | 'emailAddress' | 'addresses' | 'phoneNumber'| 'orders'
|
||||||
>,
|
>
|
||||||
>
|
>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@@ -1,17 +1,24 @@
|
|||||||
export const activeCustomerQuery = /* GraphQL */ `
|
export const activeCustomerQuery = /* GraphQL */ `
|
||||||
query activeCustomer {
|
query activeCustomer {
|
||||||
activeCustomer {
|
activeCustomer {
|
||||||
id
|
id
|
||||||
firstName
|
firstName
|
||||||
lastName
|
lastName
|
||||||
emailAddress
|
emailAddress
|
||||||
favorites{
|
favorites{
|
||||||
items{
|
items{
|
||||||
product{
|
product{
|
||||||
id
|
id
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
phoneNumber
|
||||||
|
addresses{
|
||||||
|
streetLine1
|
||||||
|
city
|
||||||
|
province
|
||||||
|
postalCode
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
`
|
`
|
||||||
|
19
framework/vendure/utils/queries/get-user-order-query.ts
Normal file
19
framework/vendure/utils/queries/get-user-order-query.ts
Normal file
@@ -0,0 +1,19 @@
|
|||||||
|
export const getUserOrderQuery = /* GraphQL */ `
|
||||||
|
query activeCustomer {
|
||||||
|
activeCustomer {
|
||||||
|
orders{
|
||||||
|
items{
|
||||||
|
lines{
|
||||||
|
productVariant{
|
||||||
|
name
|
||||||
|
}
|
||||||
|
quantity
|
||||||
|
}
|
||||||
|
total
|
||||||
|
state
|
||||||
|
code
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
@@ -1 +1,4 @@
|
|||||||
export { default as useGetFavoriteProduct } from './useGetFavoriteProduct'
|
export { default as useGetFavoriteProduct } from './useGetFavoriteProduct'
|
||||||
|
export { default as useGetUserOrder } from './useGetUserOrder';
|
||||||
|
export { default as useEditUserInfo } from './useEditUserInfo'
|
||||||
|
export { default as useEditCustomerAddress } from './useEditCustomerAddress'
|
||||||
|
@@ -4,9 +4,8 @@ import { getFavoriteProductQuery } from '@framework/utils/queries/get-favorite-p
|
|||||||
import gglFetcher from 'src/utils/gglFetcher'
|
import gglFetcher from 'src/utils/gglFetcher'
|
||||||
import useSWR from 'swr'
|
import useSWR from 'swr'
|
||||||
|
|
||||||
const useGetFavoriteProduct = (options:QueryFavorite) => {
|
const useGetFavoriteProduct = (options?:QueryFavorite) => {
|
||||||
const { data, ...rest } = useSWR<ActiveCustomerQuery>([getFavoriteProductQuery, options], gglFetcher)
|
const { data, ...rest } = useSWR<ActiveCustomerQuery>([getFavoriteProductQuery, options], gglFetcher)
|
||||||
// console.log( data?.activeCustomer?.favorites?.items);
|
|
||||||
return {
|
return {
|
||||||
itemWishlist: data?.activeCustomer?.favorites?.items?.map((item:Favorite) => normalizeFavoriteProductResult(item)),
|
itemWishlist: data?.activeCustomer?.favorites?.items?.map((item:Favorite) => normalizeFavoriteProductResult(item)),
|
||||||
totalItems: data?.activeCustomer?.favorites?.totalItems,
|
totalItems: data?.activeCustomer?.favorites?.totalItems,
|
||||||
|
20
src/components/hooks/account/useGetUserOrder.tsx
Normal file
20
src/components/hooks/account/useGetUserOrder.tsx
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
import { ActiveCustomerQuery, Order } from '@framework/schema'
|
||||||
|
import { getUserOrderQuery } from '@framework/utils/queries/get-user-order-query'
|
||||||
|
import gglFetcher from 'src/utils/gglFetcher'
|
||||||
|
import useSWR from 'swr'
|
||||||
|
|
||||||
|
const useGetUserOrder = () => {
|
||||||
|
const { data, ...rest } = useSWR<ActiveCustomerQuery>([getUserOrderQuery], gglFetcher)
|
||||||
|
|
||||||
|
const addingItem = data?.activeCustomer?.orders.items.filter((val:Order) =>val.state == 'AddingItems');
|
||||||
|
const arrangingPayment = data?.activeCustomer?.orders.items.filter((val:Order) =>val.state == 'ArrangingPayment');
|
||||||
|
const cancelled = data?.activeCustomer?.orders.items.filter((val:Order) =>val.state == "Cancelled");
|
||||||
|
return {
|
||||||
|
addingItem: addingItem,
|
||||||
|
arrangingPayment: arrangingPayment,
|
||||||
|
cancelled: cancelled,
|
||||||
|
...rest
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default useGetUserOrder
|
@@ -5,7 +5,6 @@ import useSWR from 'swr'
|
|||||||
|
|
||||||
const useActiveCustomer = () => {
|
const useActiveCustomer = () => {
|
||||||
const { data, ...rest } = useSWR<ActiveCustomerQuery>([activeCustomerQuery], gglFetcher)
|
const { data, ...rest } = useSWR<ActiveCustomerQuery>([activeCustomerQuery], gglFetcher)
|
||||||
|
|
||||||
return {
|
return {
|
||||||
customer: data?.activeCustomer,
|
customer: data?.activeCustomer,
|
||||||
userInfo:{
|
userInfo:{
|
||||||
@@ -15,7 +14,6 @@ const useActiveCustomer = () => {
|
|||||||
phoneNumber: data?.activeCustomer?.phoneNumber,
|
phoneNumber: data?.activeCustomer?.phoneNumber,
|
||||||
address: data?.activeCustomer?.addresses?.[0]
|
address: data?.activeCustomer?.addresses?.[0]
|
||||||
},
|
},
|
||||||
itemWishlist:data?.activeCustomer?.favorites?.items,
|
|
||||||
wishlistId: data?.activeCustomer?.favorites?.items.map((val:Favorite)=>val.product.id),
|
wishlistId: data?.activeCustomer?.favorites?.items.map((val:Favorite)=>val.product.id),
|
||||||
...rest
|
...rest
|
||||||
}
|
}
|
||||||
|
@@ -1,4 +1,2 @@
|
|||||||
export { default as useModalCommon } from './useModalCommon'
|
export { default as useModalCommon } from './useModalCommon'
|
||||||
export { default as useEditUserInfo } from './account/useEditUserInfo'
|
|
||||||
export { default as useEditCustomerAddress } from './account/useEditCustomerAddress'
|
|
||||||
|
|
||||||
|
@@ -1,5 +1,5 @@
|
|||||||
import { useState } from 'react'
|
import { useState } from 'react'
|
||||||
import useActiveCustomer from '../auth/useActiveCustomer'
|
import useGetFavoriteProduct from '../account/useGetFavoriteProduct'
|
||||||
import { FavoriteList } from '@framework/schema'
|
import { FavoriteList } from '@framework/schema'
|
||||||
import fetcher from 'src/utils/fetcher'
|
import fetcher from 'src/utils/fetcher'
|
||||||
import { CommonError } from 'src/domains/interfaces/CommonError'
|
import { CommonError } from 'src/domains/interfaces/CommonError'
|
||||||
@@ -12,7 +12,7 @@ interface Props {
|
|||||||
const useToggleProductWishlist = () => {
|
const useToggleProductWishlist = () => {
|
||||||
const [loading, setLoading] = useState(false)
|
const [loading, setLoading] = useState(false)
|
||||||
const [error, setError] = useState<Error | null>(null)
|
const [error, setError] = useState<Error | null>(null)
|
||||||
const { mutate } = useActiveCustomer()
|
const { mutate } = useGetFavoriteProduct();
|
||||||
|
|
||||||
const onToggleProductWishlist = (
|
const onToggleProductWishlist = (
|
||||||
{ productId }:Props ,
|
{ productId }:Props ,
|
||||||
@@ -29,7 +29,7 @@ const useToggleProductWishlist = () => {
|
|||||||
.then((data) => {
|
.then((data) => {
|
||||||
mutate()
|
mutate()
|
||||||
fCallBack(true)
|
fCallBack(true)
|
||||||
return data
|
return data
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
setError(error)
|
setError(error)
|
||||||
|
@@ -1,13 +1,11 @@
|
|||||||
import { QueryFavorite } from "@framework/schema"
|
import { QueryFavorite } from "@framework/schema"
|
||||||
import commerce from '@lib/api/commerce'
|
|
||||||
import { GetStaticPropsContext } from 'next'
|
|
||||||
import { useRouter } from "next/router"
|
import { useRouter } from "next/router"
|
||||||
import React, { useEffect, useState } from "react"
|
import React, { useEffect, useState } from "react"
|
||||||
import { HeadingCommon, TabPane } from "src/components/common"
|
import { HeadingCommon, TabPane } from "src/components/common"
|
||||||
import { useGetFavoriteProduct } from 'src/components/hooks/account'
|
import { useGetFavoriteProduct, useGetUserOrder } from 'src/components/hooks/account'
|
||||||
|
import { useActiveCustomer } from 'src/components/hooks/auth'
|
||||||
import { ACCOUNT_TAB, DEFAULT_PAGE_SIZE, QUERY_KEY } from "src/utils/constanst.utils"
|
import { ACCOUNT_TAB, DEFAULT_PAGE_SIZE, QUERY_KEY } from "src/utils/constanst.utils"
|
||||||
import { getPageFromQuery } from 'src/utils/funtion.utils'
|
import { getPageFromQuery } from 'src/utils/funtion.utils'
|
||||||
import { PromiseWithKey } from 'src/utils/types.utils'
|
|
||||||
import AccountNavigation from '../AccountNavigation/AccountNavigation'
|
import AccountNavigation from '../AccountNavigation/AccountNavigation'
|
||||||
import s from './AccountPage.module.scss'
|
import s from './AccountPage.module.scss'
|
||||||
import AccountInfomation from "./components/AccountInfomation/AccountInfomation"
|
import AccountInfomation from "./components/AccountInfomation/AccountInfomation"
|
||||||
@@ -28,6 +26,8 @@ const waiting = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const delivering = [
|
const delivering = [
|
||||||
{
|
{
|
||||||
id: "NO 123456",
|
id: "NO 123456",
|
||||||
@@ -81,7 +81,9 @@ const AccountPage = ({ defaultActiveContent="orders" } : AccountPageProps) => {
|
|||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
const {userInfo} = useActiveCustomer();
|
const {userInfo} = useActiveCustomer();
|
||||||
|
|
||||||
|
const {addingItem,arrangingPayment,cancelled} = useGetUserOrder();
|
||||||
|
|
||||||
|
|
||||||
const [activeTab, setActiveTab] = useState(defaultActiveContent==="info" ? 0 : defaultActiveContent==="orders" ? 1 : 2)
|
const [activeTab, setActiveTab] = useState(defaultActiveContent==="info" ? 0 : defaultActiveContent==="orders" ? 1 : 2)
|
||||||
const [modalVisible, setModalVisible] = useState(false);
|
const [modalVisible, setModalVisible] = useState(false);
|
||||||
@@ -125,7 +127,7 @@ const AccountPage = ({ defaultActiveContent="orders" } : AccountPageProps) => {
|
|||||||
<AccountInfomation account={userInfo} onClick={showModal} />
|
<AccountInfomation account={userInfo} onClick={showModal} />
|
||||||
</TabPane>
|
</TabPane>
|
||||||
<TabPane tabName="Your Orders">
|
<TabPane tabName="Your Orders">
|
||||||
<OrderInfomation waiting={waiting} delivering={delivering} delivered={delivered} />
|
<OrderInfomation addingItem={addingItem} arrangingPayment={arrangingPayment} cancelled={cancelled} />
|
||||||
</TabPane>
|
</TabPane>
|
||||||
<TabPane tabName="Favourite">
|
<TabPane tabName="Favourite">
|
||||||
<FavouriteProducts products={itemWishlist} totalItems={totalItems} />
|
<FavouriteProducts products={itemWishlist} totalItems={totalItems} />
|
||||||
|
@@ -8,7 +8,7 @@ import {
|
|||||||
} from 'src/components/common'
|
} from 'src/components/common'
|
||||||
import * as Yup from 'yup'
|
import * as Yup from 'yup'
|
||||||
import { Form, Formik } from 'formik'
|
import { Form, Formik } from 'formik'
|
||||||
import { useEditCustomerAddress, useEditUserInfo } from "src/components/hooks";
|
import { useEditCustomerAddress, useEditUserInfo } from "src/components/hooks/account";
|
||||||
import { LANGUAGE } from 'src/utils/language.utils'
|
import { LANGUAGE } from 'src/utils/language.utils'
|
||||||
import { useMessage } from 'src/components/contexts'
|
import { useMessage } from 'src/components/contexts'
|
||||||
interface EditInfoModalProps {
|
interface EditInfoModalProps {
|
||||||
|
@@ -4,50 +4,50 @@ import s from './OrderInformation.module.scss'
|
|||||||
import { TabCommon } from '../../../../../common'
|
import { TabCommon } from '../../../../../common'
|
||||||
import TabPane from 'src/components/common/TabCommon/components/TabPane/TabPane'
|
import TabPane from 'src/components/common/TabCommon/components/TabPane/TabPane'
|
||||||
import DeliveryItem from '../../../DeliveryItem/DeliveryItem'
|
import DeliveryItem from '../../../DeliveryItem/DeliveryItem'
|
||||||
|
import { Order } from "@framework/schema"
|
||||||
|
|
||||||
|
|
||||||
interface OrderInformationProps {
|
interface OrderInformationProps {
|
||||||
waiting: {id: string, products: string[], totalPrice: number}[],
|
addingItem?: Order[],
|
||||||
delivering: {id: string, products: string[], totalPrice: number}[],
|
arrangingPayment?: Order[],
|
||||||
delivered: {id: string, products: string[], totalPrice: number}[],
|
cancelled?: Order[],
|
||||||
}
|
}
|
||||||
|
|
||||||
const OrderInformation = ({ waiting, delivering, delivered} : OrderInformationProps) => {
|
const OrderInformation = ({ addingItem, arrangingPayment, cancelled} : OrderInformationProps) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className={s.orderInformation}>
|
<section className={s.orderInformation}>
|
||||||
<div className={s.title}>Order Information</div>
|
<div className={s.title}>Order Information</div>
|
||||||
|
|
||||||
<div className={s.tabs}>
|
<div className={s.tabs}>
|
||||||
<TabCommon>
|
<TabCommon>
|
||||||
<TabPane tabName={"Wait for Comfirmation"} >
|
<TabPane tabName={"Adding Item"} >
|
||||||
<div className={s.blank}></div>
|
<div className={s.blank}></div>
|
||||||
{
|
{
|
||||||
waiting.map((order, i) => {
|
addingItem?.map((order, i) => {
|
||||||
return (
|
return (
|
||||||
<DeliveryItem key={order.id} id={order.id} status="waiting" products={order.products} totalPrice={order.totalPrice} />
|
<DeliveryItem key={order.code} id={order.code} status="waiting" products={order.lines} totalPrice={order.total} />
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</TabPane>
|
</TabPane>
|
||||||
|
|
||||||
<TabPane tabName={"Delivering"}>
|
<TabPane tabName={"Arranging Payment"}>
|
||||||
<div className={s.blank}></div>
|
<div className={s.blank}></div>
|
||||||
{
|
{
|
||||||
delivering.map((order, i) => {
|
arrangingPayment?.map((order, i) => {
|
||||||
return (
|
return (
|
||||||
<DeliveryItem key={order.id} id={order.id} status="delivering" products={order.products} totalPrice={order.totalPrice} />
|
<DeliveryItem key={order.id} id={order.id} status="delivering" products={order.lines} totalPrice={order.total} />
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</TabPane>
|
</TabPane>
|
||||||
|
|
||||||
<TabPane tabName={"Delivered"}>
|
<TabPane tabName={"Cancelled"}>
|
||||||
<div className={s.blank}></div>
|
<div className={s.blank}></div>
|
||||||
{
|
{
|
||||||
delivered.map((order, i) => {
|
cancelled?.map((order, i) => {
|
||||||
return (
|
return (
|
||||||
<DeliveryItem key={order.id} id={order.id} status="delivered" products={order.products} totalPrice={order.totalPrice} />
|
<DeliveryItem key={order.id} id={order.id} status="delivered" products={order.lines} totalPrice={order.total} />
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@@ -5,12 +5,13 @@ import IdAndStatus from './components/IdAndStatus/IdAndStatus'
|
|||||||
import Products from './components/Products/Products'
|
import Products from './components/Products/Products'
|
||||||
import TotalPrice from './components/TotalPrice/TotalPrice'
|
import TotalPrice from './components/TotalPrice/TotalPrice'
|
||||||
import ReOrder from './components/ReOrder/ReOrder'
|
import ReOrder from './components/ReOrder/ReOrder'
|
||||||
|
import { OrderLine } from "@framework/schema"
|
||||||
|
|
||||||
|
|
||||||
interface DeliveryItemProps {
|
interface DeliveryItemProps {
|
||||||
id: string;
|
id: string;
|
||||||
status: "waiting" | "delivering" | "delivered";
|
status: "waiting" | "delivering" | "delivered";
|
||||||
products: string[];
|
products?: OrderLine[];
|
||||||
totalPrice: number;
|
totalPrice: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@@ -1,19 +1,19 @@
|
|||||||
|
import { OrderLine } from "@framework/schema";
|
||||||
import React from "react"
|
import React from "react"
|
||||||
import s from './Products.module.scss'
|
import s from './Products.module.scss'
|
||||||
|
|
||||||
interface ProductsProps {
|
interface ProductsProps {
|
||||||
products: string[];
|
products?: OrderLine[];
|
||||||
}
|
}
|
||||||
|
|
||||||
const Products = ({ products } : ProductsProps) => {
|
const Products = ({ products } : ProductsProps) => {
|
||||||
|
function toString(products?:OrderLine[]): string {
|
||||||
function toString(products:string[]): string {
|
|
||||||
let strProducts = "";
|
let strProducts = "";
|
||||||
products.map((prod, i) => {
|
products?.map((prod, i) => {
|
||||||
if (i === 0) {
|
if (i === 0) {
|
||||||
strProducts += prod;
|
strProducts += prod.productVariant?.name;
|
||||||
} else {
|
} else {
|
||||||
strProducts += `, ${prod}`
|
strProducts += `, ${prod.productVariant?.name}`
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
return strProducts;
|
return strProducts;
|
||||||
|
Reference in New Issue
Block a user