Merge branch 'develop' into release

urfit-tech · Nov 1, 2023 · b1ed7ee · b1ed7ee
2 parents beeb395 + 3114955
commit b1ed7ee
Show file tree

Hide file tree

Showing 15 changed files with 57 additions and 21 deletions.
diff --git a/src/components/package/ProgramPackagePlanCard.tsx b/src/components/package/ProgramPackagePlanCard.tsx
@@ -38,6 +38,7 @@ const ProgramPackagePlanCard: React.VFC<
     programPackageId: string
     loading?: boolean
     isEnrolled?: boolean
+    isPublished?: boolean
   }
 > = ({
   id,
@@ -54,6 +55,7 @@ const ProgramPackagePlanCard: React.VFC<
   enrollmentCount,
   programPackageId,
   isEnrolled,
+  isPublished,
 }) => {
   const { formatMessage } = useIntl()
   const isOnSale = soldAt ? Date.now() < soldAt.getTime() : false
@@ -109,6 +111,7 @@ const ProgramPackagePlanCard: React.VFC<
             target={id}
             price={isOnSale && salePrice ? salePrice : listPrice}
             isSubscription={isSubscription}
+            isPublished={isPublished}
           />
         )}
       </div>

diff --git a/src/components/project/FundingCommentsPane.tsx b/src/components/project/FundingCommentsPane.tsx
@@ -24,7 +24,8 @@ const StyledDescription = styled.div`
 const FundingCommentsPane: React.VFC<{
   comments: FundingCommentProps[]
   projectPlans: ProjectPlanProps[]
-}> = ({ comments, projectPlans }) => {
+  publishedAt: Date | null
+}> = ({ comments, projectPlans, publishedAt }) => {
   return (
     <div className="container">
       <div className="row">
@@ -43,7 +44,7 @@ const FundingCommentsPane: React.VFC<{
           ))}
         </div>
         <div className="col-12 col-lg-4 mb-5">
-          <ProjectPlanCollection projectPlans={projectPlans} />
+          <ProjectPlanCollection projectPlans={projectPlans} publishedAt={publishedAt} />
         </div>
       </div>
     </div>

diff --git a/src/components/project/FundingContentsPane.tsx b/src/components/project/FundingContentsPane.tsx
@@ -56,7 +56,8 @@ const FundingContentsPane: React.VFC<{
     }[]
   }[]
   projectPlans: ProjectPlanProps[]
-}> = ({ contents, projectPlans }) => {
+  publishedAt: Date | null
+}> = ({ contents, projectPlans, publishedAt }) => {
   return (
     <div className="container">
       <div className="row">
@@ -83,7 +84,7 @@ const FundingContentsPane: React.VFC<{
           ))}
         </div>
         <div className="col-12 col-lg-4 mb-5">
-          <ProjectPlanCollection projectPlans={projectPlans} />
+          <ProjectPlanCollection projectPlans={projectPlans} publishedAt={publishedAt} />
         </div>
       </div>
     </div>

diff --git a/src/components/project/FundingIntroductionPane.tsx b/src/components/project/FundingIntroductionPane.tsx
@@ -44,7 +44,8 @@ const StyledExpandButton = styled(Button)`
 const FundingIntroductionPane: React.VFC<{
   introduction: string
   projectPlans: ProjectPlanProps[]
-}> = ({ introduction, projectPlans }) => {
+  publishedAt: Date | null
+}> = ({ introduction, projectPlans, publishedAt }) => {
   const [collapsed, setCollapsed] = useState(false)
   const { formatMessage } = useIntl()
   const [isPlanListSticky, setIsPlanListSticky] = useState(false)
@@ -73,7 +74,7 @@ const FundingIntroductionPane: React.VFC<{
 
         <div className="col-12 col-lg-4">
           <div className={`${isPlanListSticky ? 'projectPlanSticky' : ''}`} ref={planListHeightRef}>
-            <ProjectPlanCollection projectPlans={projectPlans} />
+            <ProjectPlanCollection projectPlans={projectPlans} publishedAt={publishedAt} />
           </div>
         </div>
       </div>

diff --git a/src/components/project/FundingPlansPane.tsx b/src/components/project/FundingPlansPane.tsx
@@ -26,13 +26,14 @@ const StyledWrapper = styled.div`
 
 const FundingPlansPane: React.VFC<{
   projectPlans: ProjectPlanProps[]
-}> = ({ projectPlans }) => {
+  publishedAt: Date | null
+}> = ({ projectPlans, publishedAt }) => {
   return (
     <div className="container mb-5" id="funding-plans">
       <div className="row">
         <div className="col-12">
           <StyledWrapper className="d-flex align-items-start justify-content-start flex-wrap">
-            <ProjectPlanCollection projectPlans={projectPlans} />
+            <ProjectPlanCollection projectPlans={projectPlans} publishedAt={publishedAt} />
           </StyledWrapper>
         </div>
       </div>

diff --git a/src/components/project/FundingUpdatesPane.tsx b/src/components/project/FundingUpdatesPane.tsx
@@ -41,7 +41,8 @@ const FundingUpdatesPane: React.VFC<{
     description: string
   }[]
   projectPlans: ProjectPlanProps[]
-}> = ({ updates, projectPlans }) => {
+  publishedAt: Date | null
+}> = ({ updates, projectPlans, publishedAt }) => {
   return (
     <div className="container">
       <div className="row">
@@ -58,7 +59,7 @@ const FundingUpdatesPane: React.VFC<{
           </StyledTimeline>
         </div>
         <div className="col-12 col-lg-4 mb-5">
-          <ProjectPlanCollection projectPlans={projectPlans} />
+          <ProjectPlanCollection projectPlans={projectPlans} publishedAt={publishedAt} />
         </div>
       </div>
     </div>

diff --git a/src/components/project/OnSaleProjectPlanSection.tsx b/src/components/project/OnSaleProjectPlanSection.tsx
@@ -56,7 +56,8 @@ const StyledContainer = styled.div`
 
 const OnSaleProjectPlanSection: React.VFC<{
   projectPlans: ProjectPlanProps[]
-}> = ({ projectPlans }) => {
+  publishedAt: Date | null
+}> = ({ projectPlans, publishedAt }) => {
   const { formatMessage } = useIntl()
 
   return (
@@ -67,7 +68,7 @@ const OnSaleProjectPlanSection: React.VFC<{
         <StyledContainer className="row">
           {projectPlans.map(projectPlan => (
             <div key={projectPlan.id} className="col-lg-6 col-12">
-              <ProjectPlanCard {...projectPlan} />
+              <ProjectPlanCard {...projectPlan} publishedAt={publishedAt} />
             </div>
           ))}
         </StyledContainer>

diff --git a/src/components/project/ProjectPlanCard.tsx b/src/components/project/ProjectPlanCard.tsx
@@ -64,7 +64,11 @@ const StyledProjectPlanInfoBlock = styled.div<{ active?: boolean }>`
   }
 `
 
-const ProjectPlanCard: React.VFC<ProjectPlanProps> = ({
+const ProjectPlanCard: React.VFC<
+  ProjectPlanProps & {
+    publishedAt: Date | null
+  }
+> = ({
   id,
   projectTitle,
   coverUrl,
@@ -84,6 +88,7 @@ const ProjectPlanCard: React.VFC<ProjectPlanProps> = ({
   isLimited,
   buyableQuantity,
   projectPlanEnrollmentCount,
+  publishedAt,
 }) => {
   const { formatMessage } = useIntl()
   const { settings } = useApp()
@@ -140,6 +145,7 @@ const ProjectPlanCard: React.VFC<ProjectPlanProps> = ({
               target={id}
               price={isOnSale && salePrice ? salePrice : listPrice}
               isSubscription={isSubscription}
+              isPublished={!!publishedAt}
             />
           ) : null}
         </div>

diff --git a/src/components/project/ProjectPlanCollection.tsx b/src/components/project/ProjectPlanCollection.tsx
@@ -4,12 +4,13 @@ import ProjectPlanCard from './ProjectPlanCard'
 
 const ProjectPlanCollection: React.VFC<{
   projectPlans: ProjectPlanProps[]
-}> = ({ projectPlans }) => {
+  publishedAt: Date | null
+}> = ({ projectPlans, publishedAt }) => {
   return (
     <>
       {projectPlans.map(projectPlan => (
         <div key={projectPlan.id} className="mb-4">
-          <ProjectPlanCard {...projectPlan} />
+          <ProjectPlanCard {...projectPlan} publishedAt={publishedAt} />
         </div>
       ))}
     </>

diff --git a/src/hasura.d.ts b/src/hasura.d.ts
@@ -143136,7 +143136,7 @@ export type GET_PROGRAM_PACKAGE_INTRODUCTIONVariables = Exact<{
 }>;
 
 
-export type GET_PROGRAM_PACKAGE_INTRODUCTION = { __typename?: 'query_root', program_package_by_pk?: { __typename?: 'program_package', id: any, title: string, cover_url?: string | null, description?: string | null, meta_tag?: any | null, program_package_programs: Array<{ __typename?: 'program_package_program', id: any, program: { __typename?: 'program', id: any, title: string, cover_url?: string | null, program_categories: Array<{ __typename?: 'program_category', id: any, category: { __typename?: 'category', id: string, name: string, position: number } }> } }>, program_package_plans: Array<{ __typename?: 'program_package_plan', id: any, title: string, description?: string | null, is_subscription: boolean, is_participants_visible: boolean, period_amount?: any | null, period_type?: string | null, list_price: any, sale_price?: any | null, sold_at?: any | null, discount_down_price?: any | null, program_package_plan_enrollments_aggregate: { __typename?: 'program_package_plan_enrollment_aggregate', aggregate?: { __typename?: 'program_package_plan_enrollment_aggregate_fields', count: number } | null } }> } | null };
+export type GET_PROGRAM_PACKAGE_INTRODUCTION = { __typename?: 'query_root', program_package_by_pk?: { __typename?: 'program_package', id: any, title: string, cover_url?: string | null, description?: string | null, meta_tag?: any | null, published_at?: any | null, program_package_programs: Array<{ __typename?: 'program_package_program', id: any, program: { __typename?: 'program', id: any, title: string, cover_url?: string | null, program_categories: Array<{ __typename?: 'program_category', id: any, category: { __typename?: 'category', id: string, name: string, position: number } }> } }>, program_package_plans: Array<{ __typename?: 'program_package_plan', id: any, title: string, description?: string | null, is_subscription: boolean, is_participants_visible: boolean, period_amount?: any | null, period_type?: string | null, list_price: any, sale_price?: any | null, sold_at?: any | null, discount_down_price?: any | null, program_package_plan_enrollments_aggregate: { __typename?: 'program_package_plan_enrollment_aggregate', aggregate?: { __typename?: 'program_package_plan_enrollment_aggregate_fields', count: number } | null } }> } | null };
 
 export type GET_ENROLLED_PROGRAM_PACKAGE_PLAN_IDSVariables = Exact<{
   memberId: Scalars['String'];

diff --git a/src/hooks/programPackage.ts b/src/hooks/programPackage.ts
@@ -17,6 +17,7 @@ export const useProgramPackageIntroduction = (programPackageId: string) => {
           cover_url
           description
           meta_tag
+          published_at
           program_package_programs(order_by: { position: asc }) {
             id
             program {
@@ -69,13 +70,15 @@ export const useProgramPackageIntroduction = (programPackageId: string) => {
           description: null,
           plans: [],
           programs: [],
+          publishedAt: null,
         }
       : {
           id: programPackageId,
           title: data.program_package_by_pk.title,
           coverUrl: data.program_package_by_pk.cover_url || null,
           description: data.program_package_by_pk.description || '',
           metaTag: data.program_package_by_pk.meta_tag,
+          publishedAt: data.program_package_by_pk.published_at,
           plans: data.program_package_by_pk.program_package_plans.map(programPackagePlan => ({
             id: programPackagePlan.id,
             title: programPackagePlan.title,
@@ -307,6 +310,7 @@ export const useProgramPackage = (programPackageId: string, memberId: string | n
     coverUrl: data?.program_package_by_pk?.cover_url || null,
     description: null,
     isEnrolled: !!data?.program_package_plan_enrollment.length,
+    publishedAt: data?.program_package_by_pk?.published_at,
   }
 
   const isTempoDelivery =

diff --git a/src/pages/ProgramPackagePage/ProgramPackagePage.tsx b/src/pages/ProgramPackagePage/ProgramPackagePage.tsx
@@ -167,6 +167,7 @@ const ProgramPackagePageContent: React.VFC<{ programPackageId: string }> = ({ pr
                         {...programPackagePlan}
                         loading={loadingProgramPackageIds}
                         isEnrolled={enrolledProgramPackagePlanIds.includes(programPackagePlan.id)}
+                        isPublished={!!programPackageIntroduction.publishedAt}
                       />
                     </div>
                   ))}

diff --git a/src/pages/ProjectPage/FundingPage.tsx b/src/pages/ProjectPage/FundingPage.tsx
@@ -179,14 +179,19 @@ const FundingPage: React.VFC<ProjectProps> = ({
               <FundingIntroductionPane
                 introduction={(isDesktop && introductionDesktop ? introductionDesktop : introduction) || ''}
                 projectPlans={projectPlans}
+                publishedAt={publishedAt}
               />
             )}
           </Tabs.TabPane>
           {projectSections &&
             projectSections.map(projectSection =>
               projectSection.type === 'funding_contents' ? (
                 <Tabs.TabPane tab={projectSection.options.title} key="contents">
-                  <FundingContentsPane contents={projectSection.options.items} projectPlans={projectPlans || []} />
+                  <FundingContentsPane
+                    contents={projectSection.options.items}
+                    projectPlans={projectPlans || []}
+                    publishedAt={publishedAt}
+                  />
                 </Tabs.TabPane>
               ) : projectSection.type === 'funding_updates' ? (
                 <Tabs.TabPane
@@ -197,17 +202,25 @@ const FundingPage: React.VFC<ProjectProps> = ({
                   }
                   key="updates"
                 >
-                  <FundingUpdatesPane updates={projectSection.options.items} projectPlans={projectPlans || []} />
+                  <FundingUpdatesPane
+                    updates={projectSection.options.items}
+                    projectPlans={projectPlans || []}
+                    publishedAt={publishedAt}
+                  />
                 </Tabs.TabPane>
               ) : projectSection.type === 'funding_comments' ? (
                 <Tabs.TabPane tab={projectSection.options.title} key="comments">
-                  <FundingCommentsPane comments={projectSection.options.items} projectPlans={projectPlans || []} />
+                  <FundingCommentsPane
+                    comments={projectSection.options.items}
+                    projectPlans={projectPlans || []}
+                    publishedAt={publishedAt}
+                  />
                 </Tabs.TabPane>
               ) : null,
             )}
 
           <Tabs.TabPane tab={formatMessage(productMessages.project.tab.project)} key="plans">
-            <FundingPlansPane projectPlans={projectPlans || []} />
+            <FundingPlansPane projectPlans={projectPlans || []} publishedAt={publishedAt} />
           </Tabs.TabPane>
         </StyledTabs>
       </div>

diff --git a/src/pages/ProjectPage/OnSalePage.tsx b/src/pages/ProjectPage/OnSalePage.tsx
@@ -27,6 +27,7 @@ const OnSalePage: React.VFC<ProjectProps> = ({
   updates,
   comments,
   projectPlans,
+  publishedAt
 }) => {
   const isDesktop = useMediaQuery({ minWidth: BREAK_POINT })
 
@@ -47,7 +48,7 @@ const OnSalePage: React.VFC<ProjectProps> = ({
       <OnSaleTrialSection {...contents.trial} />
       <OnSaleComparisonSection comparisons={contents.comparisons} />
 
-      <OnSaleProjectPlanSection projectPlans={projectPlans || []} />
+      <OnSaleProjectPlanSection projectPlans={projectPlans || []} publishedAt={publishedAt} />
 
       <OnSaleCommentSection comments={comments} />
       <OnSaleCallToActionSection updates={updates} expiredAt={expiredAt} projectId={id} />

diff --git a/src/types/programPackage.ts b/src/types/programPackage.ts
@@ -7,6 +7,7 @@ export type ProgramPackageProps = {
   coverUrl: string | null
   description: string | null
   metaTag?: MetaTag
+  publishedAt: Date | null
 }
 
 export type ProgramPackagePlanProps = {