feat: wrap up the funding init page

src/components/molecules/index.ts

@@ -1,3 +1,4 @@
+export * from '../../modules/project/pages1/projectFunding/views/fundingInit/sections/DonationInput'
 export * from '../../modules/project/pages1/projectView/views/rewards/components/UpdateCurrencyModal'
 export * from '../../shared/molecules/CalendarButton'
 export * from '../../shared/molecules/CreatorEmailButton'
@@ -9,7 +10,6 @@ export * from './AuthModal'
 export * from './CopyText'
 export * from './DeleteConfirmModal'
 export * from './DescriptionLinkWithIconComponent'
-export * from '../../modules/project/pages1/projectFunding/views/fundingInit/components/DonationInput'
 export * from './IdComponent'
 export * from './projectActivity'
 export * from './projectDisplay'

src/config/routes/routeGroups.ts

@@ -71,6 +71,19 @@ export const projectPostCreatorRoutes = [
   getPath('projectPostEdit', PathName.projectName, PathName.postId),
 ]
 
+export const projectFundingRoutes = [
+  getPath('projectFunding', PathName.projectName),
+  getPath('fundingDetails', PathName.projectName),
+  getPath('fundingPayment', PathName.projectName),
+  getPath('fundingPaymentLightning', PathName.projectName),
+  getPath('fundingPaymentOnchain', PathName.projectName),
+  getPath('fundingPaymentOnchainProcessing', PathName.projectName),
+  getPath('fundingPaymentOnchainRefund', PathName.projectName),
+  getPath('fundingPaymentOnchainRefundInitiated', PathName.projectName),
+  getPath('fundingSuccess', PathName.projectName),
+  getPath('fundingFailed', PathName.projectName),
+]
+
 export const ProjectPageRoutesWithNavBarForDesktop = [...projectBaseRoutes, ...projectDashboardRoutes]
 
 export const ProjectPageRoutesWithNavBarForMobile = [

src/helpers/fundingCalculation.tsx

@@ -13,6 +13,24 @@ export const useFundCalc = (state: IFundForm) => {
   const { btcRate } = useBtcContext()
   const { getUSDAmount, getSatoshisFromUSDCents } = useBTCConverter()
 
+  const getRewardsAmount = (type: 'sats' | 'dollar') => {
+    if (type === 'sats') {
+      const rewardsCost =
+        state.rewardCurrency === RewardCurrency.Usdcent
+          ? getSatoshisFromUSDCents(state.rewardsCost as USDCents)
+          : state.rewardsCost
+
+      return rewardsCost
+    }
+
+    const rewardsDollarCost =
+      state.rewardCurrency === RewardCurrency.Usdcent
+        ? state.rewardsCost / 100
+        : getUSDAmount(state.rewardsCost as Satoshis)
+
+    return parseFloat(Number(rewardsDollarCost).toFixed(2))
+  }
+
   const getTotalAmount = (type: 'sats' | 'dollar', projectName = '') => {
     const shippingAmount = hasShipping(projectName) ? getShippingCost() : 0
 
@@ -54,6 +72,7 @@ export const useFundCalc = (state: IFundForm) => {
   return {
     getTotalAmount,
     getShippingCost,
+    getRewardsAmount,
     getRewardsQuantity,
     btcRate,
   }

src/modules/navigation/topNavBar/TopNavBar.tsx

@@ -62,8 +62,8 @@ export const TopNavBar = () => {
     <>
       <HStack
         paddingY={{ base: 4, lg: 8 }}
-        paddingX={{ base: 3, lg: 5 }}
-        maxWidth={{ base: dimensions.maxWidth + 24, lg: dimensions.maxWidth + 40 }}
+        paddingX={{ base: 3, lg: 6 }}
+        maxWidth={{ base: dimensions.maxWidth + 24, lg: dimensions.maxWidth + 48 }}
         width="100%"
         backgroundColor={'utils.pbg'}
         position="fixed"

src/modules/navigation/topNavBar/topNavBarAtom.ts

@@ -2,6 +2,7 @@ import { atom, useAtomValue } from 'jotai'
 
 import {
   projectDashboardRoutes,
+  projectFundingRoutes,
   projectPostCreatorRoutes,
   projectRewardCreatorRoutes,
   projectRoutes,
@@ -18,6 +19,7 @@ const isProjectRoutesAtom = atom(
     ...projectDashboardRoutes,
     ...projectPostCreatorRoutes,
     ...projectRewardCreatorRoutes,
+    ...projectFundingRoutes,
   ]),
 )
 const isProjectMainPageAtom = atom(routeMatchForAtom([getPath('project', PathName.projectName)]))
@@ -34,8 +36,6 @@ export const shouldShowProjectLogoAtom = atom((get) => {
 
   const isProjectMainPage = get(isProjectMainPageAtom)
   const mainProjectPageScrolledPassThreshold = get(mainProjectPageScrolledPassThresholdAtom)
-  console.log('checking isProjectMainPage', isProjectMainPage)
-  console.log('checking mainProjectPageScrolledPassThreshold', mainProjectPageScrolledPassThreshold)
 
   if (!isProjectMainPage) {
     return true

src/modules/project/components/RightSideStickyLayout.tsx

@@ -16,7 +16,7 @@ export const RightSideStickyLayout = ({ children, ...props }: PropsWithChildren<
       width="full"
       maxWidth={dimensions.project.rightSideNav.width}
       justifyContent="start"
-      paddingBottom={4}
+      paddingBottom={10}
       {...props}
     >
       {children}

src/modules/project/context/FundingProvider.tsx

@@ -3,6 +3,7 @@ import React, { createContext, PropsWithChildren, useContext, useEffect } from '
 
 import { useFundingFormState, UseFundingFormStateReturn } from '../../../shared/hooks'
 import { FundingInput, FundingTxFragment, ProjectRewardFragment, WalletLimitsFragment } from '../../../types'
+import { useProjectRewardsAPI } from '../API/useProjectRewardsAPI'
 import { useFundingFlow } from '../funding/hooks/useFundingFlow'
 import { FundingFlowGraphQLError } from '../funding/state'
 import { projectAtom, ProjectState } from '../state/projectAtom'
@@ -60,6 +61,9 @@ export const FundingProvider = ({ children, project, limits, rewards }: FundingP
 
 /** Used if the project context is available */
 export const FundingProviderWithProjectContext: React.FC<PropsWithChildren> = ({ children }) => {
+  /** Initialize rewards if they have not been initialized yet */
+  useProjectRewardsAPI(true)
+
   const project = useAtomValue(projectAtom)
   const wallet = useAtomValue(walletAtom)
   const rewards = useAtomValue(rewardsAtom)

src/modules/project/funding/hooks/useFundingFormState.ts

@@ -205,18 +205,18 @@ export const useFundingFormState = ({ rewards, rewardCurrency, walletLimits }: U
   )
 
   const validateInputAmount = useCallback(
-    (name: string) => {
-      const isException = isProjectAnException(name)
+    (projectName: string) => {
+      const isException = isProjectAnException(projectName)
 
-      if (!isException && walletLimits?.max && getTotalAmount('sats', name) >= walletLimits.max) {
+      if (!isException && walletLimits?.max && getTotalAmount('sats', projectName) >= walletLimits.max) {
         return {
           title: `Amount above the project wallet limit: ${commaFormatted(walletLimits.max)} sats.`,
           description: 'Please update the amount, or contact us for donating a higher amount.',
           valid: false,
         }
       }
 
-      if (walletLimits?.min && getTotalAmount('sats', name) < walletLimits.min) {
+      if (walletLimits?.min && getTotalAmount('sats', projectName) < walletLimits.min) {
         return {
           title: `The payment minimum is ${walletLimits.min} satoshi.`,
           description: 'Please update the amount.',

src/modules/project/funding/state/index.ts

@@ -1,6 +1,35 @@
-export * from './errorAtom'
-export * from './fundingStagesAtom'
-export * from './fundingTxAtom'
-export * from './invoiceRefreshAtom'
-export * from './keyPairAtom'
-export * from './swapAtom'
+export type { FundingFlowGraphQLError } from './errorAtom'
+export { fundingFlowErrorAtom, fundingRequestErrorAtom, swapError, weblnErrorAtom } from './errorAtom'
+export {
+  fundingStageAtom,
+  fundingStageAtomEffect,
+  fundingStageAtomInitialValue,
+  FundingStages,
+  resetFundingStageAtom,
+  setNextFundingStageAtom,
+  stageList,
+  useFundingStage,
+} from './fundingStagesAtom'
+export {
+  ConfirmationMethod,
+  fundingTxAtom,
+  selectedGoalIdAtom,
+  useCheckFundingStatus,
+  useFundingTx,
+} from './fundingTxAtom'
+export { invoiceRefreshErrorAtom, invoiceRefreshLoadingAtom } from './invoiceRefreshAtom'
+export { keyPairAtom, useKeyPairAtomValue, useSetKeyPairAtom } from './keyPairAtom'
+export type { SwapContributionInfo, SwapData } from './swapAtom'
+export {
+  clearRefundedSwapDataAtom,
+  currentSwapIdAtom,
+  refundedSwapDataAtom,
+  swapAtom,
+  useClearRefundedSwapData,
+  useParseResponseToSwapAtom,
+  useRefundedSwapData,
+  useRefundFileAdd,
+  useRefundFileValue,
+  useRemoveRefundFile,
+  useSetCurrentSwapId,
+} from './swapAtom'

src/modules/project/navigation/ProjectNavContainer.tsx

@@ -10,7 +10,7 @@ export const ProjectNavContainer = ({ children, ...props }: PropsWithChildren<St
       <HStack
         padding="2px"
         borderRadius={{ base: '10px', lg: '12px' }}
-        backgroundColor="neutral1.2"
+        backgroundColor="neutral1.3"
         w="full"
         justifyContent="space-between"
       >

src/modules/project/pages/projectView/views/projectActivityPanel/components/index.ts

@@ -1,7 +1,7 @@
 export * from '../../../../../../../shared/molecules/AvatarElement'
+export * from '../../../../../pages1/projectFunding/views/fundingInit/components/FundingFormRewardItem'
 export * from '../../../components/FollowButton'
 export * from '../ContributeButton'
-export * from './FundingFormRewardItem'
 export * from './ProjectRewardPanel'
 export * from './SectionTitle'
 export * from './SectionTitleBlock'

src/modules/project/pages/projectView/views/projectActivityPanel/screens/contributionInfo/ContributionInfoBox.tsx

@@ -13,7 +13,7 @@ import {
 import { FundingStatus, InvoiceStatus, ProjectReward, Satoshis } from '../../../../../../../../types'
 import { hasOwnNode } from '../../../../../../../../utils/helpers'
 import { useFundingContext } from '../../../../../../context'
-import { Badge } from '../fundingForm/components/Badge'
+import { Badge } from '../../../../../../pages1/projectFunding/components/Badge'
 import { CopyProjectLink } from './components'
 import { DownloadInvoice } from './components/DownloadInvoice'