feat(deployment): enable top up free trial #2175
Conversation
WalkthroughAdds a static API keys documentation banner and renders it in the API key list, removes the Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant EmailVerifyPage as Email Verify Page
participant UrlService
participant Onboarding as Onboarding Flow
User->>EmailVerifyPage: Click "Continue"
EmailVerifyPage->>UrlService: Request onboarding URL (UrlService.onboarding())
UrlService-->>EmailVerifyPage: Return onboarding URL
EmailVerifyPage->>Onboarding: Navigate to onboarding
Onboarding-->>User: Show onboarding flow
Note over EmailVerifyPage: Replaces previous flow that used UrlService.home()
sequenceDiagram
autonumber
participant DeploymentUI as Deployment UI
participant WalletHook as useWallet()
rect rgb(238,246,255)
note over DeploymentUI,WalletHook: Auto top-up gating — Before vs After
end
DeploymentUI->>WalletHook: read isManaged, isTrialing, env flag (before)
alt Before
WalletHook-->>DeploymentUI: isManaged + isTrialing + env flag
DeploymentUI->>DeploymentUI: Render auto top-up only if isManaged && isTrialing && env flag
else After
WalletHook-->>DeploymentUI: isManaged
DeploymentUI->>DeploymentUI: Render auto top-up if isManaged
end
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes
Possibly related PRs
Suggested reviewers
Poem
Pre-merge checks and finishing touches❌ Failed checks (3 warnings)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (1)
🧰 Additional context used📓 Path-based instructions (3)**/*.spec.{ts,tsx}📄 CodeRabbit inference engine (.cursor/rules/no-jest-mock.mdc)
Files:
**/*.{ts,tsx}📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
Files:
**/*.{js,ts,tsx}📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
Files:
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
🔇 Additional comments (1)
Comment |
Codecov Report❌ Patch coverage is ❌ Your patch status has failed because the patch coverage (0.00%) is below the target coverage (50.00%). You can increase the patch coverage or adjust the target coverage. Additional details and impacted files@@ Coverage Diff @@
## main #2175 +/- ##
==========================================
- Coverage 46.70% 46.36% -0.35%
==========================================
Files 1019 1010 -9
Lines 28929 28589 -340
Branches 7515 7471 -44
==========================================
- Hits 13512 13255 -257
+ Misses 15103 14148 -955
- Partials 314 1186 +872
*This pull request uses carry forward flags. Click here to find out more.
🚀 New features to boost your workflow:
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx (1)
40-45: Normalize env-derived trial duration before using it
browserEnvConfigsurfaces env vars as strings, so feedingtrialDurationstraight intouseTrialDeploymentTimeRemainingrelies on implicit coercion. If the value ever ships with whitespace or units (e.g."48 "or"48h"),calculateTrialTimeRemainingwill end up withNaN, and the trial countdown quietly disappears. Please normalize to a finite number (or fall back toundefined) before passing it along.Apply this diff:
- const trialDuration = browserEnvConfig.NEXT_PUBLIC_TRIAL_DEPLOYMENTS_DURATION_HOURS; - const { timeRemainingText: trialTimeRemaining } = useTrialDeploymentTimeRemaining({ + const trialDurationEnv = browserEnvConfig.NEXT_PUBLIC_TRIAL_DEPLOYMENTS_DURATION_HOURS; + const trialDuration = + trialDurationEnv !== undefined ? Number(trialDurationEnv) : undefined; + const normalizedTrialDuration = Number.isFinite(trialDuration) ? trialDuration : undefined; + const { timeRemainingText: trialTimeRemaining } = useTrialDeploymentTimeRemaining({ createdHeight: deployment.createdAt, - trialDurationHours: trialDuration, + trialDurationHours: normalizedTrialDuration, averageBlockTime: 6 });
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (7)
apps/deploy-web/src/components/api-keys/ApiKeyDocsBanner.tsx(1 hunks)apps/deploy-web/src/components/api-keys/ApiKeyList.tsx(2 hunks)apps/deploy-web/src/components/deployments/DeploymentDetailTopBar.tsx(2 hunks)apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx(3 hunks)apps/deploy-web/src/config/browser-env.config.ts(0 hunks)apps/deploy-web/src/config/env-config.schema.ts(0 hunks)apps/deploy-web/src/pages/user/verify-email/index.tsx(2 hunks)
💤 Files with no reviewable changes (2)
- apps/deploy-web/src/config/browser-env.config.ts
- apps/deploy-web/src/config/env-config.schema.ts
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
Never use type any or cast to type any. Always define the proper TypeScript types.
Files:
apps/deploy-web/src/components/api-keys/ApiKeyDocsBanner.tsxapps/deploy-web/src/components/deployments/DeploymentDetailTopBar.tsxapps/deploy-web/src/components/deployments/DeploymentSubHeader.tsxapps/deploy-web/src/components/api-keys/ApiKeyList.tsxapps/deploy-web/src/pages/user/verify-email/index.tsx
**/*.{js,ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
**/*.{js,ts,tsx}: Never use deprecated methods from libraries.
Don't add unnecessary comments to the code
Files:
apps/deploy-web/src/components/api-keys/ApiKeyDocsBanner.tsxapps/deploy-web/src/components/deployments/DeploymentDetailTopBar.tsxapps/deploy-web/src/components/deployments/DeploymentSubHeader.tsxapps/deploy-web/src/components/api-keys/ApiKeyList.tsxapps/deploy-web/src/pages/user/verify-email/index.tsx
🧬 Code graph analysis (4)
apps/deploy-web/src/components/api-keys/ApiKeyDocsBanner.tsx (1)
apps/provider-console/src/components/shared/ExternalLink.tsx (1)
ExternalLink(10-19)
apps/deploy-web/src/components/deployments/DeploymentDetailTopBar.tsx (1)
apps/deploy-web/src/context/WalletProvider/WalletProvider.tsx (1)
useWallet(355-357)
apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx (2)
apps/deploy-web/src/config/browser-env.config.ts (1)
browserEnvConfig(4-41)apps/deploy-web/src/hooks/useTrialDeploymentTimeRemaining.ts (1)
useTrialDeploymentTimeRemaining(65-91)
apps/deploy-web/src/components/api-keys/ApiKeyList.tsx (1)
apps/deploy-web/src/components/api-keys/ApiKeyDocsBanner.tsx (1)
ApiKeyDocsBanner(6-20)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: validate / validate-app
- GitHub Check: test-build
🔇 Additional comments (1)
apps/deploy-web/src/pages/user/verify-email/index.tsx (1)
19-40: Redirect now preserves onboarding flowThanks for swapping the handler to use
UrlService.onboarding()—this keeps verified users inside the onboarding experience instead of dumping them back at the console.
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx (2)
39-46: Consider conditional hook execution for performance.The
useTrialDeploymentTimeRemaininghook is called unconditionally, even when!isAnonymousFreeTrialEnabled && isTrialingis false (lines 144, 154). This means the hook fetches block data and performs calculations that won't be used.Apply this diff to call the hook conditionally:
const { isCustodial, isTrialing } = useWallet(); const isAnonymousFreeTrialEnabled = useFlag("anonymous_free_trial"); const { appConfig } = useServices(); + const shouldShowTrialInfo = !isAnonymousFreeTrialEnabled && isTrialing; const trialDuration = appConfig.NEXT_PUBLIC_TRIAL_DEPLOYMENTS_DURATION_HOURS; const { timeRemainingText: trialTimeRemaining } = useTrialDeploymentTimeRemaining({ createdHeight: deployment.createdAt, trialDurationHours: trialDuration, - averageBlockTime: 6 + averageBlockTime: 6, + dependencies: shouldShowTrialInfo ? undefined : { useBlock: () => ({ data: null }) } });Alternatively, conditionally call the hook:
const { isCustodial, isTrialing } = useWallet(); const isAnonymousFreeTrialEnabled = useFlag("anonymous_free_trial"); const { appConfig } = useServices(); + const shouldShowTrialInfo = !isAnonymousFreeTrialEnabled && isTrialing; const trialDuration = appConfig.NEXT_PUBLIC_TRIAL_DEPLOYMENTS_DURATION_HOURS; - const { timeRemainingText: trialTimeRemaining } = useTrialDeploymentTimeRemaining({ + const { timeRemainingText: trialTimeRemaining } = shouldShowTrialInfo ? useTrialDeploymentTimeRemaining({ createdHeight: deployment.createdAt, trialDurationHours: trialDuration, averageBlockTime: 6 - }); + }) : { timeRemainingText: null };Note: The second approach violates React's rules of hooks if the condition changes during component lifecycle. The first approach or memoization would be safer.
144-144: Extract repeated condition to improve maintainability.The condition
!isAnonymousFreeTrialEnabled && isTrialingis duplicated on lines 144 and 154. This violates the DRY principle and makes future updates more error-prone.Apply this diff to extract the condition:
const { isCustodial, isTrialing } = useWallet(); const isAnonymousFreeTrialEnabled = useFlag("anonymous_free_trial"); const { appConfig } = useServices(); + const shouldShowTrialInfo = !isAnonymousFreeTrialEnabled && isTrialing; const trialDuration = appConfig.NEXT_PUBLIC_TRIAL_DEPLOYMENTS_DURATION_HOURS; const { timeRemainingText: trialTimeRemaining } = useTrialDeploymentTimeRemaining({ createdHeight: deployment.createdAt, trialDurationHours: trialDuration, averageBlockTime: 6 }); return ( <div className="grid grid-cols-2 gap-4 p-4"> ... - {!isAnonymousFreeTrialEnabled && isTrialing && <TrialDeploymentBadge createdHeight={deployment.createdAt} />} + {shouldShowTrialInfo && <TrialDeploymentBadge createdHeight={deployment.createdAt} />} ... - {!isAnonymousFreeTrialEnabled && isTrialing && trialTimeRemaining && <span className="text-xs text-primary">(Trial: {trialTimeRemaining})</span>} + {shouldShowTrialInfo && trialTimeRemaining && <span className="text-xs text-primary">(Trial: {trialTimeRemaining})</span>}Also applies to: 154-154
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
apps/deploy-web/src/components/api-keys/ApiKeyDocsBanner.tsx(1 hunks)apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx(3 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- apps/deploy-web/src/components/api-keys/ApiKeyDocsBanner.tsx
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
Never use type any or cast to type any. Always define the proper TypeScript types.
Files:
apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx
**/*.{js,ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/general.mdc)
**/*.{js,ts,tsx}: Never use deprecated methods from libraries.
Don't add unnecessary comments to the code
Files:
apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx
🧠 Learnings (1)
📚 Learning: 2025-06-05T21:07:51.985Z
Learnt from: baktun14
Repo: akash-network/console PR: 1432
File: apps/deploy-web/src/components/deployments/DeploymentAlerts/DeploymentCloseAlert.tsx:38-38
Timestamp: 2025-06-05T21:07:51.985Z
Learning: The ContactPointSelect component in apps/deploy-web/src/components/alerts/ContactPointSelectForm/ContactPointSelect.tsx uses the useFormContext hook internally to connect to React Hook Form, so it doesn't need to be wrapped in a FormField component.
Applied to files:
apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx
🧬 Code graph analysis (1)
apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx (2)
apps/deploy-web/src/context/ServicesProvider/ServicesProvider.tsx (1)
useServices(30-32)apps/deploy-web/src/hooks/useTrialDeploymentTimeRemaining.ts (1)
useTrialDeploymentTimeRemaining(65-91)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: validate / validate-app
- GitHub Check: test-build
🔇 Additional comments (1)
apps/deploy-web/src/components/deployments/DeploymentSubHeader.tsx (1)
8-8: LGTM! Imports are properly used.All new imports are utilized within the component and follow the project's import path conventions.
Also applies to: 13-14, 18-18
closes #2174
Summary by CodeRabbit
New Features
Bug Fixes / Improvements