Skip to content

refactor(react-virtualized-helpers): migrate withInfiniteLoader from … - #4744

Merged
mergify[bot] merged 1 commit into
box:masterfrom
bonchevskyi:refactor/flow-to-ts-react-virtualized-helpers
Aug 7, 2026
Merged

refactor(react-virtualized-helpers): migrate withInfiniteLoader from …#4744
mergify[bot] merged 1 commit into
box:masterfrom
bonchevskyi:refactor/flow-to-ts-react-virtualized-helpers

Conversation

@bonchevskyi

@bonchevskyi bonchevskyi commented Aug 4, 2026

Copy link
Copy Markdown
Contributor

Convert withInfiniteLoader to TypeScript

This PR converts src/components/react-virtualized-helpers from Flow to TypeScript.

Changes

  • Converted withInfiniteLoader.js to TypeScript with exported interfaces
  • Converted the folder barrel and test to TypeScript
  • Added .js.flow files for backward compatibility
  • Preserved the existing HOC contract and pass-through props

Testing

  • 2 tests pass
  • yarn lint passes
  • yarn flow check passes with 0 errors

Summary by CodeRabbit

  • New Features

    • Added support for automatically loading additional rows as users scroll through long, virtualized lists.
    • Wrapped list components now receive loading callbacks and configuration while preserving their existing properties.
    • Exposed the infinite-loading helper and related configuration types for easier integration.
  • Tests

    • Added coverage for infinite-loader configuration forwarding and child component property handling.

@bonchevskyi
bonchevskyi requested a review from a team as a code owner August 4, 2026 12:23
@coderabbitai

coderabbitai Bot commented Aug 4, 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: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 5c21e76e-b4af-478a-8fbd-0fe5b8195c42

📥 Commits

Reviewing files that changed from the base of the PR and between 9811f57 and b9d91d7.

📒 Files selected for processing (1)
  • src/components/react-virtualized-helpers/withInfiniteLoader.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • src/components/react-virtualized-helpers/withInfiniteLoader.tsx

Walkthrough

Adds the withInfiniteLoader higher-order component with Flow and TypeScript definitions, barrel exports, and tests for loader configuration and child prop forwarding.

Changes

Infinite loader helper

Layer / File(s) Summary
HOC implementation
src/components/react-virtualized-helpers/withInfiniteLoader.tsx, src/components/react-virtualized-helpers/withInfiniteLoader.js.flow
Defines loader configuration and wrapper props. Integrates InfiniteLoader, forwards props, injects onRowsRendered and registerChild, and sets a derived display name.
Exports and validation
src/components/react-virtualized-helpers/index.ts, src/components/react-virtualized-helpers/index.js.flow, src/components/react-virtualized-helpers/__tests__/withInfiniteLoader.test.tsx
Exports the helper and its public types. Tests loader configuration and child prop forwarding.

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

Suggested labels: ready-to-merge

Suggested reviewers: vitali-usik, tjiang-box, jpan-box

Sequence Diagram(s)

sequenceDiagram
  participant Consumer
  participant withInfiniteLoader
  participant InfiniteLoader
  participant WrappedComponent
  Consumer->>withInfiniteLoader: provide loader configuration and component props
  withInfiniteLoader->>InfiniteLoader: render with loader configuration
  InfiniteLoader->>WrappedComponent: inject onRowsRendered and registerChild
  withInfiniteLoader->>WrappedComponent: forward remaining props
Loading

Poem

A rabbit checks the loading rows,
InfiniteLoader directs their flows.
Props pass through, callbacks start,
Types and exports keep each part smart.
Tests confirm the wrapper’s art.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly identifies the migration of withInfiniteLoader, which is the main change in the pull request.
Description check ✅ Passed The description explains the migration, lists the main changes, and reports relevant validation results.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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.

🧹 Nitpick comments (1)
src/components/react-virtualized-helpers/withInfiniteLoader.tsx (1)

12-16: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Use concrete callback signatures for InfiniteLoaderConfig.

Replace isRowLoaded: Function and loadMoreRows: Function with the InfiniteLoader callback signatures: (index: number) => boolean and (startIndex: number, stopIndex: number) => PromiseLike<unknown>.

This keeps the public configuration API type-safe from unrelated callbacks and missing return values.

🤖 Prompt for 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.

In `@src/components/react-virtualized-helpers/withInfiniteLoader.tsx` around lines
12 - 16, In the InfiniteLoaderConfig interface, replace the generic Function
types for the isRowLoaded and loadMoreRows properties with concrete callback
signatures. Update isRowLoaded to use (index: number) => boolean and
loadMoreRows to use (startIndex: number, stopIndex: number) =>
PromiseLike<unknown>. This ensures the configuration API enforces type safety
and prevents callbacks with incorrect signatures or missing return values from
being accepted.
🤖 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.

Nitpick comments:
In `@src/components/react-virtualized-helpers/withInfiniteLoader.tsx`:
- Around line 12-16: In the InfiniteLoaderConfig interface, replace the generic
Function types for the isRowLoaded and loadMoreRows properties with concrete
callback signatures. Update isRowLoaded to use (index: number) => boolean and
loadMoreRows to use (startIndex: number, stopIndex: number) =>
PromiseLike<unknown>. This ensures the configuration API enforces type safety
and prevents callbacks with incorrect signatures or missing return values from
being accepted.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: f10fe41d-f93c-4301-a5fa-410a807a3a85

📥 Commits

Reviewing files that changed from the base of the PR and between 6038e8a and d6633f9.

📒 Files selected for processing (5)
  • src/components/react-virtualized-helpers/__tests__/withInfiniteLoader.test.tsx
  • src/components/react-virtualized-helpers/index.js.flow
  • src/components/react-virtualized-helpers/index.ts
  • src/components/react-virtualized-helpers/withInfiniteLoader.js.flow
  • src/components/react-virtualized-helpers/withInfiniteLoader.tsx

Comment thread src/components/react-virtualized-helpers/index.ts Outdated
Comment thread src/components/react-virtualized-helpers/withInfiniteLoader.tsx
@bonchevskyi
bonchevskyi force-pushed the refactor/flow-to-ts-react-virtualized-helpers branch 2 times, most recently from caaa911 to 9811f57 Compare August 4, 2026 15:40

@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.

🧹 Nitpick comments (1)
src/components/react-virtualized-helpers/withInfiniteLoader.tsx (1)

38-58: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Tighten WithInfiniteLoaderProps to avoid the unsafe double cast.

The [key: string]: unknown index signature on WithInfiniteLoaderProps (Line 40) makes rest at Line 58 lose its connection to P, which is why the code needs rest as unknown as P. This double cast bypasses type checking for every pass-through prop, so a mismatch between rest and P at the call site would not be caught by the compiler. This directly follows up on the past review feedback about avoiding overly loose types, this time on the props side rather than the function-signature side.

Remove the catch-all index signature and let rest type naturally as Omit<P, keyof WithOnRowsRendered>, which lets the spread type-check without an unknown detour.

💡 Proposed refactor to remove the catch-all index signature
 export interface WithInfiniteLoaderProps {
-    /** Properties passed through to the wrapped component. */
-    [key: string]: unknown;
     /** Configuration passed to the react-virtualized InfiniteLoader. */
     infiniteLoaderProps: InfiniteLoaderConfig;
 }

 function withInfiniteLoader<P extends WithOnRowsRendered>(WrappedComponent: React.ComponentClass<P>) {
     const InfiniteLoaderComponent = ({
         infiniteLoaderProps: { isRowLoaded, loadMoreRows, minimumBatchSize, rowCount, threshold },
         ...rest
     }: WithInfiniteLoaderProps & Omit<P, keyof WithOnRowsRendered>) => (
         <InfiniteLoader
             isRowLoaded={isRowLoaded}
             loadMoreRows={loadMoreRows}
             minimumBatchSize={minimumBatchSize}
             rowCount={rowCount}
             threshold={threshold}
         >
             {({ onRowsRendered, registerChild }) => (
-                <WrappedComponent {...(rest as unknown as P)} ref={registerChild} onRowsRendered={onRowsRendered} />
+                <WrappedComponent {...(rest as Omit<P, keyof WithOnRowsRendered>)} ref={registerChild} onRowsRendered={onRowsRendered} />
             )}
         </InfiniteLoader>
     );
🤖 Prompt for 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.

In `@src/components/react-virtualized-helpers/withInfiniteLoader.tsx` around lines
38 - 58, Remove the catch-all string index signature from
WithInfiniteLoaderProps and type the component props so the destructured rest
value is Omit<P, keyof WithOnRowsRendered>. Update the WrappedComponent render
in withInfiniteLoader to spread rest directly, eliminating the unsafe unknown
double cast while preserving the existing InfiniteLoader props and
ref/onRowsRendered wiring.
🤖 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.

Nitpick comments:
In `@src/components/react-virtualized-helpers/withInfiniteLoader.tsx`:
- Around line 38-58: Remove the catch-all string index signature from
WithInfiniteLoaderProps and type the component props so the destructured rest
value is Omit<P, keyof WithOnRowsRendered>. Update the WrappedComponent render
in withInfiniteLoader to spread rest directly, eliminating the unsafe unknown
double cast while preserving the existing InfiniteLoader props and
ref/onRowsRendered wiring.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 9174d11f-feb7-44b2-b276-717ad24646a9

📥 Commits

Reviewing files that changed from the base of the PR and between caaa911 and 9811f57.

📒 Files selected for processing (5)
  • src/components/react-virtualized-helpers/__tests__/withInfiniteLoader.test.tsx
  • src/components/react-virtualized-helpers/index.js.flow
  • src/components/react-virtualized-helpers/index.ts
  • src/components/react-virtualized-helpers/withInfiniteLoader.js.flow
  • src/components/react-virtualized-helpers/withInfiniteLoader.tsx
🚧 Files skipped from review as they are similar to previous changes (4)
  • src/components/react-virtualized-helpers/index.js.flow
  • src/components/react-virtualized-helpers/index.ts
  • src/components/react-virtualized-helpers/withInfiniteLoader.js.flow
  • src/components/react-virtualized-helpers/tests/withInfiniteLoader.test.tsx

vitali-usik
vitali-usik previously approved these changes Aug 5, 2026
@bonchevskyi
bonchevskyi force-pushed the refactor/flow-to-ts-react-virtualized-helpers branch from 9811f57 to 8ca8023 Compare August 5, 2026 10:55
Comment thread src/components/react-virtualized-helpers/withInfiniteLoader.tsx Outdated
@bonchevskyi
bonchevskyi force-pushed the refactor/flow-to-ts-react-virtualized-helpers branch from 8ca8023 to b9d91d7 Compare August 7, 2026 14:21

@jpan-box jpan-box 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.

LGTM — prior feedback addressed.

@bonchevskyi
bonchevskyi force-pushed the refactor/flow-to-ts-react-virtualized-helpers branch from b9d91d7 to c1fd5d7 Compare August 7, 2026 17:17
@mergify mergify Bot added the queued label Aug 7, 2026
@mergify

mergify Bot commented Aug 7, 2026

Copy link
Copy Markdown
Contributor

Merge Queue Status

  • Entered queue2026-08-07 17:54 UTC · Rule: Automatic strict merge · triggered by rule Automatic merge queue
  • Checks skipped · PR is already up-to-date
  • Merged2026-08-07 17:55 UTC · at c1fd5d707768ee7ede42bdc999502e94a6f43782 · squash

This pull request spent 12 seconds in the queue, including 1 second running CI.

Required conditions to merge
  • github-review-approved [🛡 GitHub branch protection]
  • any of [🛡 GitHub branch protection]:
    • check-success = Summary
    • check-neutral = Summary
    • check-skipped = Summary
  • any of [🛡 GitHub branch protection]:
    • check-success = lint_test_build
    • check-neutral = lint_test_build
    • check-skipped = lint_test_build
  • any of [🛡 GitHub branch protection]:
    • check-success = license/cla
    • check-neutral = license/cla
    • check-skipped = license/cla
  • any of [🛡 GitHub branch protection]:
    • check-success = lint_pull_request
    • check-neutral = lint_pull_request
    • check-skipped = lint_pull_request

@mergify
mergify Bot merged commit 1cb5786 into box:master Aug 7, 2026
9 of 10 checks passed
@mergify mergify Bot removed the queued label Aug 7, 2026
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.

3 participants