From 880a3a8f1fefa999c8fff7a65659f8d104ca1c97 Mon Sep 17 00:00:00 2001 From: ponchimeow Date: Wed, 4 Oct 2023 16:01:10 +0800 Subject: [PATCH 1/4] feat: move hook to outside component --- .../appointment/AppointmentPeriodCollection.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/components/appointment/AppointmentPeriodCollection.tsx b/src/components/appointment/AppointmentPeriodCollection.tsx index e7184095f..c9ad77935 100644 --- a/src/components/appointment/AppointmentPeriodCollection.tsx +++ b/src/components/appointment/AppointmentPeriodCollection.tsx @@ -27,11 +27,12 @@ const AppointmentPeriodBlock: React.VFC<{ reservationAmount: number capacity: number } + services: { id: string; gateway: string }[] + loadingServices: boolean onClick: (period: AppointmentPeriod) => void -}> = ({ periods, creatorId, appointmentPlan, onClick }) => { +}> = ({ periods, creatorId, appointmentPlan, services, loadingServices, onClick }) => { const { setVisible: setAuthModalVisible } = useContext(AuthModalContext) const { isAuthenticated } = useAuth() - const { loading: loadingServices, services } = useService() const [overLapPeriods, setOverLapPeriods] = useState([]) return ( @@ -102,6 +103,7 @@ const AppointmentPeriodCollection: React.VFC<{ appointmentPeriods: AppointmentPeriod[] onClick: (period: AppointmentPeriod) => void }> = ({ creatorId, appointmentPlan, appointmentPeriods, onClick }) => { + const { loading: loadingServices, services } = useService() const periods = groupBy( period => dayjs(period.startedAt).format('YYYY-MM-DD(dd)'), appointmentPeriods.filter(v => @@ -120,6 +122,8 @@ const AppointmentPeriodCollection: React.VFC<{ creatorId={creatorId} appointmentPlan={appointmentPlan} onClick={onClick} + services={services} + loadingServices={loadingServices} /> ))} From 8fd9c657f0f18cb43f94c3acf4cb764886874594 Mon Sep 17 00:00:00 2001 From: Hanz Date: Sat, 7 Oct 2023 04:46:22 +0800 Subject: [PATCH 2/4] fix: meet us landing page --- src/pages/MeetingPage/MeetingPage.tsx | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/src/pages/MeetingPage/MeetingPage.tsx b/src/pages/MeetingPage/MeetingPage.tsx index ab0b5d7a1..9464eb23a 100644 --- a/src/pages/MeetingPage/MeetingPage.tsx +++ b/src/pages/MeetingPage/MeetingPage.tsx @@ -4,7 +4,6 @@ import axios from 'axios' import gql from 'graphql-tag' import Cookies from 'js-cookie' import { useApp } from 'lodestar-app-element/src/contexts/AppContext' -import queryString from 'query-string' import { useState } from 'react' import { useParams } from 'react-router-dom' import styled from 'styled-components' @@ -29,14 +28,7 @@ const MeetingPage = () => { const { id: appId, settings } = useApp() const { username: managerUsername } = useParams<{ username: string }>() const [isSubmitting, setIsSubmitting] = useState(false) - const queryUrl = window.location.search - const { query } = queryString.parseUrl(queryUrl) - - const meetsQueryArray = JSON.parse(settings['custom'])?.['meets'] || [] - const meetQueryObject = meetsQueryArray.map((meet: { key: string; name: string }) => ({ - name: meet.name, - value: query[meet.key] || '', - })) + const landingPage = Cookies.get('landing') // setting from backend const customAdProperty = (propertyName: string) => { return JSON.parse(settings['custom.ad_property.list'] || '{}')?.['meeting']?.[propertyName] || '' @@ -102,7 +94,7 @@ const MeetingPage = () => { name: '行銷活動', value: customMeetingMarketingActivitiesProperty, }, - ...meetQueryObject, + ...(landingPage && { name: '來源網址', value: landingPage }), ], }, { From 953c606450096a41e24920d925dbb37d1698bc3c Mon Sep 17 00:00:00 2001 From: Hanz Date: Sun, 8 Oct 2023 05:40:33 +0800 Subject: [PATCH 3/4] fix: meet us landing page error handle --- src/pages/MeetingPage/MeetingPage.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/pages/MeetingPage/MeetingPage.tsx b/src/pages/MeetingPage/MeetingPage.tsx index 9464eb23a..23b4386ea 100644 --- a/src/pages/MeetingPage/MeetingPage.tsx +++ b/src/pages/MeetingPage/MeetingPage.tsx @@ -28,7 +28,6 @@ const MeetingPage = () => { const { id: appId, settings } = useApp() const { username: managerUsername } = useParams<{ username: string }>() const [isSubmitting, setIsSubmitting] = useState(false) - const landingPage = Cookies.get('landing') // setting from backend const customAdProperty = (propertyName: string) => { return JSON.parse(settings['custom.ad_property.list'] || '{}')?.['meeting']?.[propertyName] || '' @@ -64,6 +63,7 @@ const MeetingPage = () => { const referal = formEntries.find(entry => entry[0] === 'referal')?.[1] const fields = formEntries.filter(entry => entry[0] === 'field').flatMap(entry => entry[1].toString().split('/')) const timeslots = formEntries.filter(entry => entry[0] === 'timeslot').map(entry => entry[1]) + const landingPage = Cookies.get('landing') // setting from backend let utm try { @@ -94,7 +94,7 @@ const MeetingPage = () => { name: '行銷活動', value: customMeetingMarketingActivitiesProperty, }, - ...(landingPage && { name: '來源網址', value: landingPage }), + { name: '來源網址', value: landingPage || '' }, ], }, { @@ -113,7 +113,7 @@ const MeetingPage = () => { alert(`發生錯誤，請聯繫網站管理員。錯誤訊息：${message}`) } } catch (error) { - console.log(error) + alert(`發生錯誤，請聯繫網站管理員。錯誤訊息：${error}`) } finally { setIsSubmitting(false) window.location.reload() From 53f1f984550ee5d15463fd19997eaa18e26e15c5 Mon Sep 17 00:00:00 2001 From: ponchimeow Date: Tue, 10 Oct 2023 18:00:51 +0800 Subject: [PATCH 4/4] fix: reservationAmount typo --- .../appointment/AppointmentCollectionTabs.tsx | 4 +- src/hooks/appointment.ts | 117 +++++++++--------- src/types/appointment.ts | 2 +- 3 files changed, 62 insertions(+), 61 deletions(-) diff --git a/src/components/appointment/AppointmentCollectionTabs.tsx b/src/components/appointment/AppointmentCollectionTabs.tsx index f7d489df9..dd82f1277 100644 --- a/src/components/appointment/AppointmentCollectionTabs.tsx +++ b/src/components/appointment/AppointmentCollectionTabs.tsx @@ -206,7 +206,7 @@ export const AppointmentPlanCollection: React.FC<{ id: appointmentPlan.id, defaultMeetGateway: appointmentPlan.defaultMeetGateway, reservationType: appointmentPlan.rescheduleType, - reservationAmount: appointmentPlan.rescheduleAmount, + reservationAmount: appointmentPlan.reservationAmount, capacity: appointmentPlan.capacity, }} appointmentPeriods={appointmentPlan.periods} @@ -244,7 +244,7 @@ export const AppointmentPlanCollection: React.FC<{ id: appointmentPlan.id, defaultMeetGateway: appointmentPlan.defaultMeetGateway, reservationType: appointmentPlan.rescheduleType, - reservationAmount: appointmentPlan.rescheduleAmount, + reservationAmount: appointmentPlan.reservationAmount, capacity: appointmentPlan.capacity, }} appointmentPeriods={appointmentPlan.periods} diff --git a/src/hooks/appointment.ts b/src/hooks/appointment.ts index ab513fb51..cec368d37 100644 --- a/src/hooks/appointment.ts +++ b/src/hooks/appointment.ts @@ -52,47 +52,44 @@ export const useAppointmentPlanCollection = (memberId: string, startedAt: Date, const appointmentPlans: (AppointmentPlan & { periods: AppointmentPeriod[] - })[] = - loading || error || !data - ? [] - : data.appointment_plan.map(appointmentPlan => ({ - id: appointmentPlan.id, - title: appointmentPlan.title, - description: appointmentPlan.description || '', - duration: appointmentPlan.duration, - price: appointmentPlan.price, - phone: null, - supportLocales: appointmentPlan.support_locales, - capacity: appointmentPlan.capacity, - defaultMeetGateway: appointmentPlan.default_meet_gateway, - meetGenerationMethod: appointmentPlan.meet_generation_method, - currency: { - id: appointmentPlan.currency.id, - label: appointmentPlan.currency.label, - unit: appointmentPlan.currency.unit, - name: appointmentPlan.currency.name, - }, - rescheduleAmount: appointmentPlan.reschedule_amount, - rescheduleType: appointmentPlan.reschedule_type as ReservationType, - periods: appointmentPlan.appointment_periods.map(period => ({ - id: `${period.started_at}`, - startedAt: new Date(period.started_at), - endedAt: new Date(period.ended_at), - booked: period.booked, - available: !!period.available, - isBookedReachLimit: appointmentPlan.capacity !== -1 && period.booked >= appointmentPlan.capacity, - currentMemberBooked: appointmentPlan.appointment_enrollments.some( - enrollment => - enrollment.member_id === currentMemberId && - enrollment.appointment_plan_id === appointmentPlan.id && - enrollment.started_at === period.started_at && - !enrollment.canceled_at, - ), - })), - isPrivate: appointmentPlan.is_private, - reservationAmount: appointmentPlan.reservation_amount, - reservationType: (appointmentPlan.reservation_type as ReservationType) || 'hour', - })) + })[] = data?.appointment_plan.map(appointmentPlan => ({ + id: appointmentPlan.id, + title: appointmentPlan.title, + description: appointmentPlan.description || '', + duration: appointmentPlan.duration, + price: appointmentPlan.price, + phone: null, + supportLocales: appointmentPlan.support_locales, + capacity: appointmentPlan.capacity, + defaultMeetGateway: appointmentPlan.default_meet_gateway, + meetGenerationMethod: appointmentPlan.meet_generation_method, + currency: { + id: appointmentPlan.currency.id, + label: appointmentPlan.currency.label, + unit: appointmentPlan.currency.unit, + name: appointmentPlan.currency.name, + }, + rescheduleAmount: appointmentPlan.reschedule_amount, + rescheduleType: appointmentPlan.reschedule_type as ReservationType, + periods: appointmentPlan.appointment_periods.map(period => ({ + id: `${period.started_at}`, + startedAt: new Date(period.started_at), + endedAt: new Date(period.ended_at), + booked: period.booked, + available: !!period.available, + isBookedReachLimit: appointmentPlan.capacity !== -1 && period.booked >= appointmentPlan.capacity, + currentMemberBooked: appointmentPlan.appointment_enrollments.some( + enrollment => + enrollment.member_id === currentMemberId && + enrollment.appointment_plan_id === appointmentPlan.id && + enrollment.started_at === period.started_at && + !enrollment.canceled_at, + ), + })), + isPrivate: appointmentPlan.is_private, + reservationAmount: appointmentPlan.reservation_amount, + reservationType: (appointmentPlan.reservation_type as ReservationType) || 'hour', + })) || [] return { loadingAppointmentPlans: loading, @@ -162,16 +159,16 @@ export const useAppointmentPlan = (appointmentPlanId: string, currentMemberId?: const appointmentPlan: | (AppointmentPlan & { - periods: AppointmentPeriod[] - creator: { - id: string - avatarUrl: string | null - name: string - abstract: string | null - } - }) + periods: AppointmentPeriod[] + creator: { + id: string + avatarUrl: string | null + name: string + abstract: string | null + } + }) | null = data?.appointment_plan_by_pk - ? { + ? { id: data.appointment_plan_by_pk.id, title: data.appointment_plan_by_pk.title, description: data.appointment_plan_by_pk.description || '', @@ -216,8 +213,12 @@ export const useAppointmentPlan = (appointmentPlanId: string, currentMemberId?: abstract: data.appointment_plan_by_pk.creator?.abstract || null, }, } - : null + : null + if (appointmentPlan) { + console.log(appointmentPlan.id) + console.log(appointmentPlan?.rescheduleAmount) + } return { loadingAppointmentPlan: loading, errorAppointmentPlan: error, @@ -347,13 +348,13 @@ export const useMeetByAppointmentPlanIdAndPeriod = (appointmentPlanId: string, s ) const meet = data?.meet?.[0] ? { - id: data.meet[0].id, - hostMemberId: data.meet[0].host_member_id, - meetMembers: data.meet[0].meet_members.map(v => ({ - id: v.id, - memberId: v.member_id, - })), - } + id: data.meet[0].id, + hostMemberId: data.meet[0].host_member_id, + meetMembers: data.meet[0].meet_members.map(v => ({ + id: v.id, + memberId: v.member_id, + })), + } : null return { diff --git a/src/types/appointment.ts b/src/types/appointment.ts index ffbcdf315..4d8ce2bcc 100644 --- a/src/types/appointment.ts +++ b/src/types/appointment.ts @@ -11,7 +11,7 @@ export type AppointmentPlan = { supportLocales: string[] | null currency: CurrencyProps isPrivate?: boolean - reservationAmount?: number + reservationAmount: number reservationType?: ReservationType | null rescheduleAmount: number rescheduleType: ReservationType | null