Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

feat: added setPageNumber function for Table v2 widget#41421

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Open
tomjose92 wants to merge5 commits intorelease
base:release
Choose a base branch
Loading
fromfeat/issue-24973/table-set-page-no

Conversation

@tomjose92
Copy link
Contributor

@tomjose92tomjose92 commentedNov 26, 2025•
edited
Loading

Description

Added a setPageNumber function for Table widget to programatically change pages on the table.

This change allows the user to set the pageNo to any number value. What this means is that

  1. For Client side pagination, the user will not be restricted from changing to a page number that is greater than total number of pages.
  2. For Server side pagination, the user will have to programatically call the query to get data after programatically changing page number.

The setPageNumber function will throw error if any value that does not evaluate to a postive integer greater than 0 is passed.

Fixes24973
Fixes8440

Automation

/ok-to-test tags="@tag.Table"

🔍 Cypress test results

Warning

Tests have not run on the HEADd52ab88 yet

Thu, 27 Nov 2025 03:59:59 UTC

Communication

Should the DevRel and Marketing teams inform users about this change?

  • Yes
  • No

Summary by CodeRabbit

  • New Features

    • Table widgets expose a programmatic page-number setter to change the current page.
    • Pagination now includes a configurable page-number property with numeric validation and default.

  • Improvements

    • Server-side pagination better handles programmatic vs user-driven page changes and avoids duplicate triggers.
    • Page number display switched to an editable page-number input in the header.

  • Tests

    • Tests updated to exercise and validate the new page-number setter behavior.

✏️ Tip: You can customize this high-level summary in your review settings.

@tomjose92tomjose92 requested review froma team ascode ownersNovember 26, 2025 16:06
@tomjose92tomjose92 requested review fromrahulbarwal and removed request fora teamNovember 26, 2025 16:06
@github-actionsgithub-actionsbot added the EnhancementNew feature or request labelNov 26, 2025
@coderabbitai
Copy link
Contributor

coderabbitaibot commentedNov 26, 2025•
edited
Loading

Walkthrough

Adds a public settersetPageNumber (number) mapped topageNo, exposespageNo in TableWidgetV2 property pane, replaces page number display with an editable input, and augments widget logic to handle programmatic page changes: clamping to max pages, distinguishing programmatic vs user-driven changes, and triggering server-side pagination callbacks (onPageChange) with appropriate event types.

Changes

Cohort / File(s)Summary
TableWidgetV2 — setter & logic
app/client/src/widgets/TableWidgetV2/widget/index.tsx		AddedsetPageNumber togetSetterConfig().__setters (maps topageNo: number); added logic to clamppageNo to max pages, mark navigation direction asNEXT_PAGE when clamped, and detect programmatic calls to triggerupdatePageNumber /onPageChange with event types (ON_NEXT_PAGE /ON_PREV_PAGE) while avoiding double-trigger on clamp.
WDSTableWidget — setter config
app/client/src/widgets/wds/WDSTableWidget/config/settersConfig.ts		AddedsetPageNumber to exportedsettersConfig.__setters mapping topageNo: number.
Property pane — pagination
app/client/src/widgets/TableWidgetV2/widget/propertyConfig/contentConfig.ts		AddedpageNo property under Pagination (isBindProperty: true, isTriggerProperty: false, validation: NUMBER, min:1, default:1, natural).
Header — UI for page number
app/client/src/widgets/TableWidgetV2/component/header/actions/index.tsx		ReplacedPaginationItemWrapper occurrences withPageNumberInput for rendering/editing current page number; wiring usespageNo + 1,pageCount,disabled, andupdatePageNo.
Tests — data tree & evaluation
app/client/src/entities/DataTree/dataTreeWidget.test.ts,app/client/src/workers/Evaluation/__tests__/setters.test.ts		Updated tests/expectations to includesetPageNumber setter (paths referencing...pageNo /Table1.pageNo); added test callingsetPageNumber(2) and assertingpageNo update.

Sequence Diagram(s)

sequenceDiagram  participant Caller as External code  participant Setter as Widget Setter API  participant Widget as TableWidgetV2  participant Runtime as Evaluation / DataTree  participant Server as onPageChange handler  Note over Caller,Setter: New public setter exposed  Caller->>Setter: setPageNumber(targetPage)  Setter->>Widget: set pageNo = targetPage  %%cyan%%  alt targetPage > maxPage    Widget->>Widget: clamp pageNo = maxPage  %%orange%%    Widget->>Widget: mark navigation = NEXT_PAGE    Widget-->>Setter: resolved (clamped)  else not clamped    Widget->>Runtime: propagate pageNo change / re-evaluate bindings  %%cyan%%    Runtime-->>Widget: evaluation complete    alt server-side pagination enabled & onPageChange exists      Widget->>Server: updatePageNumber(eventType=ON_NEXT_PAGE|ON_PREV_PAGE)  %%green%%      Server-->>Widget: fetch/ack    end    Widget-->>Setter: resolved  end
Loading

Notes: colored notes indicate (cyan) typical propagation path, (orange) clamp path, (green) server callback.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

  • Pay attention to the new control flow inapp/client/src/widgets/TableWidgetV2/widget/index.tsx where:
    • Programmatic vs user-driven origin is detected.
    • Clamping logic prevents double-triggering of server callbacks.
    • Correct eventType selection foronPageChange (ON_NEXT_PAGE / ON_PREV_PAGE).
  • Verify tests indataTreeWidget.test.ts andsetters.test.ts correctly reflect setter exposure and runtime behavior.
  • ConfirmPageNumberInput integration preserves accessibility and boundary behaviors (1-based UI vs 0-based internalpageNo).

Poem

✨ A tiny setter takes the stage,
Jumping pages with a measured page,
Clamp if too far, call back when new,
Tests nod yes, UI shows the view.
PageNo set — the table turns true.

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)
Check nameStatusExplanationResolution
Docstring Coverage⚠️ WarningDocstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.You can run@coderabbitai generate docstrings to improve docstring coverage.
✅ Passed checks (4 passed)
Check nameStatusExplanation
Title check✅ PassedThe title clearly and concisely describes the main change: adding a setPageNumber function for the Table v2 widget, which aligns with the core objective of the PR.
Linked Issues check✅ PassedThe changes implement the core requirement from issue#24973: enabling direct page number setting in Table widget for both client and server-side pagination scenarios.
Out of Scope Changes check✅ PassedAll changes are directly scoped to implementing setPageNumber functionality: setter configuration files, widget component updates, test files, and property configurations align with the stated objective.
Description check✅ PassedPR description covers the feature purpose, behavior for both client and server-side pagination, error handling, and links to resolved issues.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branchfeat/issue-24973/table-set-page-no

Tip

📝 Customizable high-level summaries are now available in beta!

You can now customize how CodeRabbit generates thehigh-level summary in your pull requests — including its content, structure, tone, and formatting.

  • Provide your own instructions using thehigh_level_summary_instructions setting.
  • Format the summary however you like (bullet lists, tables, multi-section layouts, contributor stats, etc.).
  • Usehigh_level_summary_in_walkthrough to move the summary from the description to the walkthrough section.

Example instruction:

"Divide the high-level summary into five sections:

  1. 📝 Description — Summarize the main change in 50–60 words, explaining what was done.
  2. 📓 References — List relevant issues, discussions, documentation, or related PRs.
  3. 📦 Dependencies & Requirements — Mention any new/updated dependencies, environment variable changes, or configuration updates.
  4. 📊 Contributor Summary — Include a Markdown table showing contributions:
    | Contributor | Lines Added | Lines Removed | Files Changed |
  5. ✔️ Additional Notes — Add any extra reviewer context.
    Keep each section concise (under 200 words) and use bullet or numbered lists for clarity."

Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later.

Thanks for usingCodeRabbit! 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 and usage tips.

@tomjose92
Copy link
ContributorAuthor

/build-deploy-preview skip-tests=true

github-actions[bot] reacted with rocket emojigithub-actions[bot] reacted with eyes emoji

@github-actions
Copy link

Deploying Your Preview:https://github.com/appsmithorg/appsmith/actions/runs/19710098635.
Workflow:On demand build Docker image and deploy preview.
skip-tests:true.
env: ``.
PR: 41421.
recreate: .

Copy link
Contributor

@coderabbitaicoderabbitaibot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between2ff9f01 and3edb7cc.

📒 Files selected for processing (2)
  • app/client/src/widgets/TableWidgetV2/widget/index.tsx (1 hunks)
  • app/client/src/widgets/wds/WDSTableWidget/config/settersConfig.ts (1 hunks)
⏰ 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). (5)
  • GitHub Check: client-build / client-build
  • GitHub Check: client-check-cyclic-deps / check-cyclic-dependencies
  • GitHub Check: client-lint / client-lint
  • GitHub Check: client-unit-tests / client-unit-tests
  • GitHub Check: client-prettier / prettier-check
🔇 Additional comments (1)
app/client/src/widgets/wds/WDSTableWidget/config/settersConfig.ts (1)

17-20: I'll help you verify the review comment by examining how WDSTableWidget processes thepageNo property and checking for proper pagination handling.
<function_calls>

#!/bin/bash

Find WDSTableWidget implementation files

echo "=== Finding WDSTableWidget files ==="
fd -t f "WDSTableWidget" app/client/src/widgets/wds/ 2>/dev/null | head -20

echo -e "\n=== Directory structure ==="
find app/client/src/widgets/wds/WDSTableWidget -type f -name ".ts" -o -name ".tsx" 2>/dev/null | head -30


</function_calls>

<function_calls>

#!/bin/bash

Search for pageNo property handling in WDSTableWidget

echo "=== Searching for pageNo handling in WDSTableWidget ==="
rg -n "pageNo|updatePageNumber|onPageChange|setPageNumber" app/client/src/widgets/wds/WDSTableWidget/ -t ts -t tsx -A 3 -B 3 | head -100


</function_calls>

<function_calls>

#!/bin/bash

Check the settersConfig.ts file

echo "=== Current settersConfig.ts content ==="
cat -n app/client/src/widgets/wds/WDSTableWidget/config/settersConfig.ts | head -40


</function_calls>

@github-actions
Copy link

Deploy-Preview-URL:https://ce-41421.dp.appsmith.com

Copy link
Contributor

@coderabbitaicoderabbitaibot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

🧹 Nitpick comments (1)
app/client/src/entities/DataTree/dataTreeWidget.test.ts (1)

558-561:LGTM! Setter config correctly added and transformed.

ThesetPageNumber setter configuration is properly structured with:

  • Path mapped topageNo property
  • Type set tonumber
  • Correct transformation from relative path to absolute path (Table1.pageNo)

This follows the same pattern as other table setters likesetData andsetSelectedRowIndex.

Consider whether adisabled condition should be added (similar tosetSelectedRowIndex which checksmultiRowSelection). For example, shouldsetPageNumber be disabled when the table has no data or only one page?

Also applies to: 604-607

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between3edb7cc and8ae3663.

📒 Files selected for processing (2)
  • app/client/src/entities/DataTree/dataTreeWidget.test.ts (2 hunks)
  • app/client/src/workers/Evaluation/__tests__/setters.test.ts (2 hunks)
⏰ 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). (5)
  • GitHub Check: client-lint / client-lint
  • GitHub Check: client-unit-tests / client-unit-tests
  • GitHub Check: client-build / client-build
  • GitHub Check: client-prettier / prettier-check
  • GitHub Check: client-check-cyclic-deps / check-cyclic-dependencies
🔇 Additional comments (2)
app/client/src/workers/Evaluation/__tests__/setters.test.ts (2)

69-69:LGTM! Setter properly added to expected map.

ThesetPageNumber setter is correctly included in the test expectations alongside existing Table widget setters.

92-102:Implementation verified and correctly implemented.

ThesetPageNumber setter is properly configured in both TableWidgetV2 (app/client/src/widgets/TableWidgetV2/widget/index.tsx:568) and WDSTableWidget (app/client/src/widgets/wds/WDSTableWidget/config/settersConfig.ts:17), mapping to thepageNo property with typenumber. The test correctly verifies this mapping by callingsetPageNumber(2) and asserting thatpageNo equals 2.

@tomjose92tomjose92 added the ok-to-testRequired label for CI labelNov 26, 2025
@github-actionsgithub-actionsbot added Community Reportedissues reported by community members Query Widgets & IDE PodAll issues related to Query, JS, Eval, Widgets & IDE Table Widget Table Widget V2Issues related to Table Widget V2 Widgets & Accelerators PodIssues related to widgets & Accelerators Widgets ProductThis label groups issues related to widgets labelsNov 26, 2025
…ter function has been introduced that can change the value.
Copy link
Contributor

@coderabbitaicoderabbitaibot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

🧹 Nitpick comments (1)
app/client/src/widgets/TableWidgetV2/widget/propertyConfig/contentConfig.ts (1)

250-263:Polish the newpageNo control with help text (and optionally visibility rules)

The config itself looks fine and the numeric validation matches howpageNo is used. For UX consistency with the rest of the Pagination section, consider adding a shorthelpText, and, if this control is meant mainly for server-side pagination, optionally gate it behindserverSidePaginationEnabled liketotalRecordsCount.

Example minimal tweak for clarity:

      {        propertyName: "pageNo",        label: "Page number",        controlType: "INPUT_TEXT",        isBindProperty: true,        isTriggerProperty: false,+        helpText: "Current page number (1-based). Can be controlled via JS (setPageNumber).",        validation: {          type: ValidationTypes.NUMBER,          params: {            min: 1,            default: 1,          },        },      },

If you decide it should only surface for server-side pagination, you could also mirror the pattern used ontotalRecordsCount withhidden anddependencies.

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between8ae3663 and695443a.

📒 Files selected for processing (1)
  • app/client/src/widgets/TableWidgetV2/widget/propertyConfig/contentConfig.ts (1 hunks)
⏰ 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). (8)
  • GitHub Check: perform-test / server-build / server-unit-tests
  • GitHub Check: perform-test / client-build / client-build
  • GitHub Check: perform-test / rts-build / build
  • GitHub Check: client-build / client-build
  • GitHub Check: client-prettier / prettier-check
  • GitHub Check: client-check-cyclic-deps / check-cyclic-dependencies
  • GitHub Check: client-unit-tests / client-unit-tests
  • GitHub Check: client-lint / client-lint

@tomjose92
Copy link
ContributorAuthor

/build-deploy-preview skip-tests=true

github-actions[bot] reacted with rocket emojigithub-actions[bot] reacted with eyes emoji

@github-actions
Copy link

Deploying Your Preview:https://github.com/appsmithorg/appsmith/actions/runs/19723414681.
Workflow:On demand build Docker image and deploy preview.
skip-tests:true.
env: ``.
PR: 41421.
recreate: .

@github-actions
Copy link

Deploy-Preview-URL:https://ce-41421.dp.appsmith.com

@tomjose92tomjose92 removed the ok-to-testRequired label for CI labelNov 27, 2025
…e widget for users to quickly go to a later page. Also ensuring that whenever page changes for server side enabled page progrmatically, the onPageChange event gets triggered.
@tomjose92
Copy link
ContributorAuthor

/build-deploy-preview skip-tests=true

github-actions[bot] reacted with rocket emojigithub-actions[bot] reacted with eyes emoji

@github-actions
Copy link

Deploying Your Preview:https://github.com/appsmithorg/appsmith/actions/runs/19724978804.
Workflow:On demand build Docker image and deploy preview.
skip-tests:true.
env: ``.
PR: 41421.
recreate: .

@github-actions
Copy link

Deploy-Preview-URL:https://ce-41421.dp.appsmith.com

@rahulbarwal
Copy link
Contributor

Screen.Recording.2025-11-27.at.11.08.12.AM.mov

This is not production-ready; I see multiple bugs.

  • When I start, I have the input, but pressing backspace initially shows zero. I don't understand why this happens; it shouldn't occur.

  • When I type any page number, it changes to one and disables the input. No matter how much I navigate backward or forward, the input remains disabled.

  • The selected row functionality behaves oddly with next and previous.

    • The selected row might be an existing bug and may not be relevant, but I want to be 100% sure about it.
    • When pressing previous or next, a selected row is visible in the update row form during the loading state.
    • Once the page loads, the selected row disappears.

@tomjose92
Copy link
ContributorAuthor

tomjose92 commentedNov 27, 2025•
edited
Loading

@rahulbarwal , regarding points 2 and 3, could you check if this happens with a newly created Table widget set up with server side pagination.
Reason is because I was not able to reproduce the above issue, and seems like it happens only when using it with a template or building block. Need to check why could that be happening

Sign up for freeto join this conversation on GitHub. Already have an account?Sign in to comment

Reviewers

@coderabbitaicoderabbitai[bot]coderabbitai[bot] left review comments

@rahulbarwalrahulbarwalAwaiting requested review from rahulbarwalrahulbarwal is a code owner automatically assigned from appsmithorg/widgets-blocks

At least 1 approving review is required to merge this pull request.

Assignees

No one assigned

Labels

Community Reportedissues reported by community membersEnhancementNew feature or requestQuery Widgets & IDE PodAll issues related to Query, JS, Eval, Widgets & IDETable Widget V2Issues related to Table Widget V2Table WidgetWidgets & Accelerators PodIssues related to widgets & AcceleratorsWidgets ProductThis label groups issues related to widgets

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[Feature]: Enable directly setting the page number in Table Widget

2 participants

@tomjose92@rahulbarwal
[8]ページ先頭
©2009-2025 Movatter.jp