chore: fix changes after code review

opengovsg · Feb 19, 2024 · 9bd7e61 · 9bd7e61
1 parent 38f1ee7
commit 9bd7e61
Show file tree

Hide file tree

Showing 9 changed files with 46 additions and 44 deletions.
diff --git a/frontend/src/features/admin-form/create/end-page/EndPageContent.tsx b/frontend/src/features/admin-form/create/end-page/EndPageContent.tsx
@@ -12,18 +12,16 @@ import { useAdminForm } from '~features/admin-form/common/queries'
 import { PREVIEW_MOCK_UINFIN } from '~features/admin-form/preview/constants'
 import { useEnv } from '~features/env/queries'
 import { EndPageBlock } from '~features/public-form/components/FormEndPage/components/EndPageBlock'
-import { PaymentEndPageBlock } from '~features/public-form/components/FormEndPage/components/PaymentEndPageBlock'
-import {
-  PaymentsThankYouSvgr,
-  ThankYouSvgr,
-} from '~features/public-form/components/FormEndPage/components/ThankYouSvgr'
+import { PaymentsThankYouSvgr } from '~features/public-form/components/FormEndPage/components/PaymentsThankYouSvgr'
+import { ThankYouSvgr } from '~features/public-form/components/FormEndPage/components/ThankYouSvgr'
 import {
   FormBannerLogo,
   useFormBannerLogo,
 } from '~features/public-form/components/FormLogo'
 
 import { useDesignColorTheme } from '../builder-and-design/utils/useDesignColorTheme'
 
+import { PaymentEndPageBlock } from './PaymentEndPageBlock'
 import { dataSelector, useEndPageStore } from './useEndPageStore'
 
 export const EndPageContent = (): JSX.Element => {

diff --git a/...ndPage/components/PaymentEndPageBlock.tsx → ...m/create/end-page/PaymentEndPageBlock.tsx b/...ndPage/components/PaymentEndPageBlock.tsx → ...m/create/end-page/PaymentEndPageBlock.tsx
@@ -10,7 +10,7 @@ import {
 import { useAdminForm } from '~features/admin-form/common/queries'
 import { SubmissionData } from '~features/public-form/PublicFormContext'
 
-import { DownloadReceiptBlock } from '../../FormPaymentPage/stripe/components'
+import { DownloadReceiptBlock } from '../../../public-form/components/FormPaymentPage/stripe/components'
 
 import { paymentTypeSelection } from './payment.utils'
 

diff --git a/...s/FormEndPage/components/payment.utils.ts → ...min-form/create/end-page/payment.utils.ts b/...s/FormEndPage/components/payment.utils.ts → ...min-form/create/end-page/payment.utils.ts
diff --git a/frontend/src/features/public-form/components/FormEndPage/FormEndPageContainer.tsx b/frontend/src/features/public-form/components/FormEndPage/FormEndPageContainer.tsx
@@ -71,17 +71,17 @@ export const FormEndPageContainer = (): JSX.Element | null => {
         colorTheme={form.startPage.colorTheme}
       />
     )
-  } else
-    return (
-      <Box py={{ base: '1.5rem', md: '2.5rem' }} w="100%">
-        <FormEndPage
-          colorTheme={form.startPage.colorTheme}
-          submissionData={submissionData}
-          formTitle={form.title}
-          endPage={form.endPage}
-          isFeedbackSubmitted={isFeedbackSubmitted}
-          handleSubmitFeedback={handleSubmitFeedback}
-        />
-      </Box>
-    )
+  }
+  return (
+    <Box py={{ base: '1.5rem', md: '2.5rem' }} w="100%">
+      <FormEndPage
+        colorTheme={form.startPage.colorTheme}
+        submissionData={submissionData}
+        formTitle={form.title}
+        endPage={form.endPage}
+        isFeedbackSubmitted={isFeedbackSubmitted}
+        handleSubmitFeedback={handleSubmitFeedback}
+      />
+    </Box>
+  )
 }
diff --git a/...tend/src/features/public-form/components/FormEndPage/components/PaymentEndPagePreview.tsx b/...tend/src/features/public-form/components/FormEndPage/components/PaymentEndPagePreview.tsx
@@ -4,9 +4,10 @@ import { FormColorTheme, FormDto } from '~shared/types/form'
 
 import { SubmissionData } from '~features/public-form/PublicFormContext'
 
+import { PaymentEndPageBlock } from '../../../../admin-form/create/end-page/PaymentEndPageBlock'
+
 import { FeedbackBlock, FeedbackFormInput } from './FeedbackBlock'
-import { PaymentEndPageBlock } from './PaymentEndPageBlock'
-import { PaymentsThankYouSvgr } from './ThankYouSvgr'
+import { PaymentsThankYouSvgr } from './PaymentsThankYouSvgr'
 
 export interface PaymentEndPagePreviewProps {
   endPage: FormDto['endPage']

diff --git a/frontend/src/features/public-form/components/FormEndPage/components/PaymentsThankYouSvgr.tsx b/frontend/src/features/public-form/components/FormEndPage/components/PaymentsThankYouSvgr.tsx
@@ -0,0 +1,21 @@
+import { SVGProps } from 'react'
+import { chakra } from '@chakra-ui/react'
+
+export const PaymentsThankYouSvgr = chakra((props: SVGProps<SVGSVGElement>) => (
+  <svg
+    width="64"
+    height="64"
+    viewBox="0 0 64 64"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g id="Icon/check-circle-solid">
+      <path
+        id="Vector"
+        d="M32.0006 5.33203C17.2967 5.33203 5.33398 17.2947 5.33398 31.9987C5.33398 46.7027 17.2967 58.6654 32.0006 58.6654C46.7046 58.6654 58.6673 46.7027 58.6673 31.9987C58.6673 17.2947 46.7046 5.33203 32.0006 5.33203ZM26.67 43.7667L16.7687 33.8867L20.534 30.1107L26.6646 36.2307L40.782 22.1134L44.5527 25.884L26.67 43.7667Z"
+        fill="#05CC9A"
+      />
+    </g>
+  </svg>
+))
diff --git a/frontend/src/features/public-form/components/FormEndPage/components/ThankYouSvgr.tsx b/frontend/src/features/public-form/components/FormEndPage/components/ThankYouSvgr.tsx
@@ -75,21 +75,3 @@ export const ThankYouSvgr = chakra((props: SVGProps<SVGSVGElement>) => (
     />
   </svg>
 ))
-
-export const PaymentsThankYouSvgr = chakra((props: SVGProps<SVGSVGElement>) => (
-  <svg
-    width="64"
-    height="64"
-    viewBox="0 0 64 64"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g id="Icon/check-circle-solid">
-      <path
-        id="Vector"
-        d="M32.0006 5.33203C17.2967 5.33203 5.33398 17.2947 5.33398 31.9987C5.33398 46.7027 17.2967 58.6654 32.0006 58.6654C46.7046 58.6654 58.6673 46.7027 58.6673 31.9987C58.6673 17.2947 46.7046 5.33203 32.0006 5.33203ZM26.67 43.7667L16.7687 33.8867L20.534 30.1107L26.6646 36.2307L40.782 22.1134L44.5527 25.884L26.67 43.7667Z"
-        fill="#05CC9A"
-      />
-    </g>
-  </svg>
-))
diff --git a/frontend/src/features/public-form/components/FormPaymentPage/stripe/StripePaymentElement.tsx b/frontend/src/features/public-form/components/FormPaymentPage/stripe/StripePaymentElement.tsx
@@ -86,7 +86,7 @@ const StripePaymentContainer = ({
     refetchKey,
   })
 
-  const productsProductsType = paymentInfoData?.products?.map((product) => {
+  const productsProductsType = paymentInfoData.products?.map((product) => {
     return {
       name: product.data.name,
       quantity: product.quantity,
@@ -96,14 +96,14 @@ const StripePaymentContainer = ({
 
   const productsVariableType = [
     {
-      name: paymentInfoData?.payment_fields_snapshot?.name,
+      name: paymentInfoData.payment_fields_snapshot.name,
       quantity: 1,
-      amount_cents: paymentInfoData?.amount,
+      amount_cents: paymentInfoData.amount,
     },
   ] as ProductItemForReceipt[]
 
   const paymentProducts =
-    paymentInfoData?.payment_fields_snapshot?.payment_type ===
+    paymentInfoData.payment_fields_snapshot.payment_type ===
     PaymentType.Variable
       ? productsVariableType
       : productsProductsType

diff --git a/...end/src/features/public-form/components/FormPaymentPage/stripe/StripeReceiptContainer.tsx b/...end/src/features/public-form/components/FormPaymentPage/stripe/StripeReceiptContainer.tsx
@@ -94,7 +94,7 @@ export const StripeReceiptContainer = ({
           paymentType={paymentFieldsSnapshot.payment_type}
           name={paymentFieldsSnapshot.name || ''}
           paymentDate={paymentReceiptStatus.paymentDate}
-          endPage={form?.endPage}
+          endPage={form.endPage}
         />
       </PaymentStack>
       <Stack px={{ base: '1rem', md: '4rem' }} bg="transparent">