Skip to content

feat(deployment): add bid-expiry countdown to the configure header#3379

Merged
ygrishajev merged 1 commit into
mainfrom
configure-header-cost
Jul 1, 2026
Merged

feat(deployment): add bid-expiry countdown to the configure header#3379
ygrishajev merged 1 commit into
mainfrom
configure-header-cost

Conversation

@ygrishajev

@ygrishajev ygrishajev commented Jun 30, 2026

Copy link
Copy Markdown
Contributor

Why

Once quotes arrive, users need to see what the deployment will cost in USD in the configure header,
and how long the current quotes stay valid before bids expire.

Closes CON-522.

What

Two additions to the configure-flow header, both driven by the live on-chain bids:

Deployment cost

  • Derived per placement from the current bids: a selected provider fixes that placement's price,
    otherwise it contributes the cheapest–priciest range of its open bids, otherwise 0 until it bids.
  • The header sums these into a min – max hourly USD total that collapses to a single value when the
    bounds match, and shows until the first bid.

Quote-expiry countdown

  • Once the first bid arrives, a countdown to bid expiry shows under the cost — ⏱ expires in M:SS,
    muted, turning red in the final minute. The window is the deployment's creation time + ~5 minutes
    (matching the legacy builder, including its 20s create→bid buffer).
  • When the window elapses, the header's primary CTA becomes Close and Edit (closes the deployment
    and returns to editing) — the recovery path the legacy builder offered once bids closed.
  • The timer row is always reserved, so the summary doesn't shift as bids arrive or expire.

Implementation notes

  • useDeploymentCost and useQuoteExpiry both read the shared, dseq-keyed listBids query the
    marketplace already polls (React Query dedupes by key) — no extra fetch or polling.
  • Cost renders through the existing price stack: PricePerTimeUnit's per-block→hourly factor is
    extracted into a shared perBlockToHourly helper, and PriceValue does USD formatting (ACT is 1:1 USD).
  • No new-Figma countdown — that was dropped from the design; the timer follows the legacy builder's
    behavior and the reference screenshot.

Testing

  • useDeploymentCost: range over an unselected placement's open bids, fixed contribution for a selected
    bid, multi-placement sum, 0 contribution before a placement bids, null before any bid, closed-bid
    filtering, fallback to the open range when a selected bid is no longer open.
  • useQuoteExpiry: seconds-left from the dseq creation time, expiry past the deadline, ticking once a
    second, inert when disabled or before a deployment exists.
  • ConfigureDeploymentHeader: cost single value / range / ; the countdown appears on the first bid,
    turns red under 60s, and is hidden before any bid; the CTA flips to Close and Edit on expiry; and the
    sdl/selections are threaded into the cost hook.
  • perBlockToHourly: per-block → hourly conversion.
Screenshot 2026-06-30 at 19 06 15 Screenshot 2026-06-30 at 19 06 37 Screenshot 2026-06-30 at 19 10 43

Summary by CodeRabbit

  • New Features
    • Added a quote-expiry countdown under Deployment cost during the quoting phase, including an “expired” state.
    • Updated header actions to support new CTA behavior: “Cancelling…” during closing and “Close and Edit” when quotes have expired and no open bids remain.
  • Bug Fixes
    • Improved countdown visibility and accuracy across edge cases (e.g., missing timing data, expiry when bids close, and styling as time runs out).
  • Tests
    • Expanded automated tests for quote-expiry timing, countdown updates, and CTA/expiry interaction.

@codecov

codecov Bot commented Jun 30, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 68.44%. Comparing base (7c00a1a) to head (d30e27d).

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #3379      +/-   ##
==========================================
- Coverage   69.80%   68.44%   -1.37%     
==========================================
  Files        1100     1010      -90     
  Lines       26925    24592    -2333     
  Branches     6455     5997     -458     
==========================================
- Hits        18795    16831    -1964     
+ Misses       7142     6805     -337     
+ Partials      988      956      -32     
Flag Coverage Δ *Carryforward flag
api 85.10% <ø> (ø) Carriedforward from 7c00a1a
deploy-web 55.02% <ø> (ø) Carriedforward from 7c00a1a
log-collector ?
notifications 91.44% <ø> (ø) Carriedforward from 7c00a1a
provider-console 81.38% <ø> (ø) Carriedforward from 7c00a1a
provider-inventory ?
provider-proxy 86.26% <ø> (ø) Carriedforward from 7c00a1a
tx-signer ?

*This pull request uses carry forward flags. Click here to find out more.

Files with missing lines Coverage Δ
...gureDeploymentHeader/ConfigureDeploymentHeader.tsx 0.00% <ø> (ø)

... and 90 files with indirect coverage changes

🚀 New features to boost your workflow:
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@ygrishajev ygrishajev enabled auto-merge July 1, 2026 07:49
@ygrishajev ygrishajev force-pushed the configure-header-cost branch from ed6e63d to a70fb5e Compare July 1, 2026 07:50
@coderabbitai

coderabbitai Bot commented Jul 1, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 2612f960-88e1-412a-8fbf-af9ff3f58cbb

📥 Commits

Reviewing files that changed from the base of the PR and between a03bdb8 and d30e27d.

📒 Files selected for processing (4)
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.spec.tsx
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.tsx
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.spec.ts
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.ts
🚧 Files skipped from review as they are similar to previous changes (4)
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.spec.tsx
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.tsx
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.ts
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.spec.ts

📝 Walkthrough

Walkthrough

Adds a block-anchored quote-expiry hook and wires it into the deployment header. The header now shows expiry countdown state and changes CTA labels and actions based on quote expiration and closing phase, with updated tests.

Changes

Quote Expiry Feature

Layer / File(s) Summary
useQuoteExpiry hook
apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.ts
Adds the quote-expiry timer hook, latched bid-window helpers, and the exported QuoteExpiry return shape.
useQuoteExpiry tests
apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.spec.ts
Adds deterministic hook tests for null states, countdown progression, expiration rules, bid-state transitions, rerendering, and timer updates.
Header wiring and CTA states
apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.tsx
Injects quote expiry into the deployment header, renders the countdown line, and switches CTA text and actions for quoting and closing phases.
Header spec updates
apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.spec.tsx
Extends the header suite to mock quote expiry, assert the cancelling CTA, and cover countdown visibility, styling, expired text, and edit-after-expiry behavior.

Estimated code review effort: 3 (Moderate) | ~25 minutes

Possibly related PRs

Suggested reviewers: stalniy, baktun14

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch configure-header-cost

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint install failed. For unrecoverable errors, disable the tool in CodeRabbit configuration.


Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In
`@apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.ts`:
- Around line 7-8: The quote expiry calculation in useQuoteExpiry is using dseq
as if it were a creation timestamp, which causes the timer logic to break.
Update the hook and any callers so it receives the actual deployment creation
time field instead of dseq, and keep dseq only as the deployment sequence
identifier. In useQuoteExpiry, add a guard for missing or non-numeric timestamp
input before computing the remaining time so the rendered timer never becomes
NaN:NaN.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 003d27b3-5bac-4bb8-b23e-3003983c6c6e

📥 Commits

Reviewing files that changed from the base of the PR and between b6fecee and a70fb5e.

📒 Files selected for processing (4)
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.spec.tsx
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.tsx
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.spec.ts
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.ts

@ygrishajev ygrishajev force-pushed the configure-header-cost branch from a70fb5e to 99c152b Compare July 1, 2026 11:17

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In
`@apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.ts`:
- Around line 46-47: The quote expiry hook only refetches the latest block, so
an empty initial result from useListBids can leave the countdown stuck because
the bid query never updates. Update useQuoteExpiry to explicitly poll
useListBids while the quote window is active by adding a refetch interval or
equivalent polling on bidsQuery, alongside the existing useBlock latest polling,
so the hook can detect newly closed bids and transition from null promptly.
- Around line 62-80: The useQuoteExpiry hook can briefly report expired when
expiresAt changes from null to a value because secondsLeft still carries the
previous 0 during the first render. Fix this in useQuoteExpiry by either
deriving the current secondsLeft directly from secondsUntil(expiresAt) during
render, or by reinitializing the state when expiresAt becomes non-null so
isExpired cannot flash true. Keep the ticking logic in the tickUntilExpiry
effect and ensure the returned object from useQuoteExpiry always reflects the
fresh deadline state.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: b4e56a30-4a86-4e3a-8aee-6196b221f916

📥 Commits

Reviewing files that changed from the base of the PR and between a70fb5e and 99c152b.

📒 Files selected for processing (4)
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.spec.tsx
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.tsx
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.spec.ts
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.ts
🚧 Files skipped from review as they are similar to previous changes (3)
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/useQuoteExpiry/useQuoteExpiry.spec.ts
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.spec.tsx
  • apps/deploy-web/src/components/deployments/ConfigureDeployment/ConfigureDeploymentHeader/ConfigureDeploymentHeader.tsx

@ygrishajev ygrishajev force-pushed the configure-header-cost branch from 99c152b to a03bdb8 Compare July 1, 2026 11:35
Once the first bid arrives, show a countdown to bid expiry under the deployment cost,
derived from the deployment's creation timestamp (~5 minutes, matching the legacy builder):
muted, turning red in the final minute. When the window elapses the header's primary CTA
becomes "Close and Edit", closing the deployment and returning to editing.
@ygrishajev ygrishajev force-pushed the configure-header-cost branch from a03bdb8 to d30e27d Compare July 1, 2026 11:44
@ygrishajev ygrishajev added this pull request to the merge queue Jul 1, 2026
Merged via the queue into main with commit f5726e7 Jul 1, 2026
57 checks passed
@ygrishajev ygrishajev deleted the configure-header-cost branch July 1, 2026 12:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants