feat: Update TableWidgetV2 to include customIsLoading property#36857
feat: Update TableWidgetV2 to include customIsLoading property#36857rahulbarwal merged 9 commits intoreleasefrom
Conversation
This commit updates the TableWidgetV2 component to include a new property called userDefinedIsLoading. This property controls the loading state of the widget and is added to the TableWidgetProps interface. Additionally, the component's state is updated to include the userDefinedIsLoading property. The contentConfig file for the TableWidgetV2 is also modified to include the userDefinedIsLoading property with its corresponding label, control type, help text, and validation. These changes improve the flexibility and customization options of the TableWidgetV2 component.
rahulbarwal
changed the title
|
/build-deploy-preview skip-tests=true |
|
Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/11323758326. |
|
Deploy-Preview-URL: https://ce-36857.dp.appsmith.com |
…o rahulbarwal/issue12308
- Added a new prop `userDefinedIsLoadingValue` to TableWidgetProps interface - Updated TableWidgetV2 component to use `userDefinedIsLoadingValue` for loading state when `userDefinedIsLoading` is true - Added new property configuration for `userDefinedIsLoadingValue` in `contentConfig.ts` - Removed unused prop `userDefinedIsLoading` from TableWidgetProps interface
|
/build-deploy-preview skip-tests=true |
|
Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/11361844078. |
|
Deploy-Preview-URL: https://ce-36857.dp.appsmith.com |
…o rahulbarwal/issue12308
- Renamed userDefinedIsLoading to customIsLoading - Renamed userDefinedIsLoadingValue to customIsLoadingValue - Updated propertyConfig to reflect the changes
|
/build-deploy-preview skip-tests=true |
|
Deploying Your Preview: https://github.com/appsmithorg/appsmith/actions/runs/11439819098. |
github-actions
bot
added
Bug
WalkthroughThis pull request introduces a new feature flag, Changes
Assessment against linked issues
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
Documentation and Community
|
github-actions
bot
added
Bug
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Outside diff range and nitpick comments (5)
app/client/src/widgets/TableWidgetV2/constants.ts (2)
112-113: LGTM. Consider adding JSDoc comments.The new properties look good and follow the existing naming conventions. To improve maintainability, consider adding JSDoc comments explaining the purpose and usage of these properties.
243-244: LGTM. Consider grouping related constants.The new constant is well-named and correctly uses a feature flag. For better organization, consider grouping this constant with other related feature flag constants if they exist.
app/client/src/widgets/TableWidgetV2/widget/TableRendered.test.ts (1)
112-180: Well-structured test suite with comprehensive coverage.The test cases effectively cover both default and custom loading behaviors. Consider using more descriptive test names for better clarity, e.g., "Should not be loading when isLoading is false and custom loading is disabled".
app/client/src/widgets/TableWidgetV2/widget/index.tsx (1)
1273-1277: Consider a minor optimization for conciseness.The current implementation is correct, but we could make it slightly more concise. Consider using the logical OR operator for a more streamlined expression:
isLoading={customIsLoading ? (customIsLoadingValue || this.props.isLoading) : this.props.isLoading}This achieves the same result with a bit less code.
app/client/src/widgets/TableWidgetV2/widget/propertyConfig/contentConfig.ts (1)
510-510: Use double quotes for consistency in thelabelproperty.Replace backticks with double quotes to match the coding style used elsewhere.
Apply this diff:
- label: `Custom loading state`, + label: "Custom loading state",
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
📒 Files selected for processing (5)
- app/client/src/ce/entities/FeatureFlag.ts (2 hunks)
- app/client/src/widgets/TableWidgetV2/constants.ts (2 hunks)
- app/client/src/widgets/TableWidgetV2/widget/TableRendered.test.ts (1 hunks)
- app/client/src/widgets/TableWidgetV2/widget/index.tsx (3 hunks)
- app/client/src/widgets/TableWidgetV2/widget/propertyConfig/contentConfig.ts (2 hunks)
🧰 Additional context used
🔇 Additional comments (8)
app/client/src/ce/entities/FeatureFlag.ts (2)
42-43: LGTM: New feature flag added correctly.The new feature flag
release_table_custom_loading_state_enabledfollows the naming convention and is properly integrated into theFEATURE_FLAGobject.
79-79: Confirm default value for new feature flag.The default value for
release_table_custom_loading_state_enabledis set tofalse. This is typically a safe approach for rolling out new features. Ensure this aligns with the intended release strategy for the custom loading state feature in TableWidgetV2.app/client/src/widgets/TableWidgetV2/widget/TableRendered.test.ts (2)
1-110: Comprehensive props definition enhances test coverage.The imports are concise and the TableWidgetProps definition is extensive, which is excellent for thorough testing. The inclusion of
customIsLoadingandcustomIsLoadingValueproperties aligns with the PR objectives.
1-181: Excellent test coverage for custom loading functionality.This test file effectively covers the new custom loading behavior, addressing the objectives of the PR and issue #12308. The comprehensive props definition and well-structured test cases ensure thorough validation of the TableWidgetV2 loading states.
app/client/src/widgets/TableWidgetV2/widget/index.tsx (2)
229-230: LGTM: New properties for custom loading state.The addition of
customIsLoadingandcustomIsLoadingValueproperties provides more flexibility for managing the loading state of the table. This is a good enhancement.
1273-1277: LGTM: Proper usage of custom loading properties.The new
customIsLoadingandcustomIsLoadingValueproperties are correctly implemented in theisLoadingprop of theReactTableComponent. This allows for more granular control over the loading state display.app/client/src/widgets/TableWidgetV2/widget/propertyConfig/contentConfig.ts (2)
10-13: Imports are correctly added.The new constants are correctly imported from "../../constants".
508-517: Verify access to the feature flag in thehiddenproperty.Ensure that
Widget.getFeatureFlag(CUSTOM_LOADING_STATE_ENABLED)correctly retrieves the feature flag value.
| propertyName: "customIsLoadingValue", | ||
| label: "isLoading value", | ||
| controlType: "INPUT_TEXT", | ||
| defaultValue: "", | ||
| isBindProperty: true, | ||
| isTriggerProperty: false, | ||
| validation: { type: ValidationTypes.BOOLEAN }, | ||
| hidden: (props: TableWidgetProps) => !props.customIsLoading, | ||
| dependencies: ["customIsLoading"], | ||
| }, |
There was a problem hiding this comment.
Mismatch between controlType and validation for customIsLoadingValue.
The controlType is set to "INPUT_TEXT" but the validation expects a BOOLEAN. Consider updating the controlType to "SWITCH" or adjusting the validation accordingly.
Apply this diff to resolve the mismatch:
propertyName: "customIsLoadingValue",
label: "isLoading value",
- controlType: "INPUT_TEXT",
+ controlType: "SWITCH",
defaultValue: "",
isBindProperty: true,
isTriggerProperty: false,
validation: { type: ValidationTypes.BOOLEAN },
hidden: (props: TableWidgetProps) => !props.customIsLoading,
dependencies: ["customIsLoading"],📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| propertyName: "customIsLoadingValue", | |
| label: "isLoading value", | |
| controlType: "INPUT_TEXT", | |
| defaultValue: "", | |
| isBindProperty: true, | |
| isTriggerProperty: false, | |
| validation: { type: ValidationTypes.BOOLEAN }, | |
| hidden: (props: TableWidgetProps) => !props.customIsLoading, | |
| dependencies: ["customIsLoading"], | |
| }, | |
| propertyName: "customIsLoadingValue", | |
| label: "isLoading value", | |
| controlType: "SWITCH", | |
| defaultValue: "", | |
| isBindProperty: true, | |
| isTriggerProperty: false, | |
| validation: { type: ValidationTypes.BOOLEAN }, | |
| hidden: (props: TableWidgetProps) => !props.customIsLoading, | |
| dependencies: ["customIsLoading"], | |
| }, |
github-actions
bot
added
Bug
github-actions
bot
added
Bug
…ithorg#36857) ## Description <ins>Problem</ins> There are many problems with table loader logic, for which many users try to implement a modal for loader. These problems stem from dependency and delay on eval, discussed comprehensively in appsmithorg#12308 <ins>Solution</ins> This PR updates the TableWidgetV2 component to include a new property called `customIsLoading`. This property controls the loading state of the widget and is added to the TableWidgetProps interface. Additionally, the component's state is updated to include the `customIsLoading` property. The `contentConfig` file for the TableWidgetV2 is also modified to include the `customIsLoading` property with its corresponding label, control type, help text, and validation. These changes improve the flexibility and customization options of the TableWidgetV2 component. Fixes appsmithorg#12308 _or_ Fixes `Issue URL` > [!WARNING] > _If no issue exists, please create an issue first, and check with the maintainers if the issue is valid._ ## Automation /ok-to-test tags="@tag.Table" ### 🔍 Cypress test results <!-- This is an auto-generated comment: Cypress test results --> > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/11456273525> > Commit: 1c6f4f9 > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=11456273525&attempt=1" target="_blank">Cypress dashboard</a>. > Tags: `@tag.Table` > Spec: > <hr>Tue, 22 Oct 2024 09:17:37 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [x] No <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced a new feature flag for custom loading states in the table widget. - Added properties for managing custom loading behavior in the `TableWidgetV2`. - **Bug Fixes** - Enhanced loading state management to ensure accurate representation based on new properties. - **Tests** - Added unit tests for loading behavior in the `TableWidgetV2` component, covering default and custom loading scenarios. - **Documentation** - Updated help text for properties related to loading states to improve clarity. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
2 participants
Description
Problem
There are many problems with table loader logic, for which many users try to implement a modal for loader. These problems stem from dependency and delay on eval, discussed comprehensively in #12308
Solution
This PR updates the TableWidgetV2 component to include a new property called
customIsLoading. This property controls the loading state of the widget and is added to the TableWidgetProps interface. Additionally, the component's state is updated to include thecustomIsLoadingproperty.The
contentConfigfile for the TableWidgetV2 is also modified to include thecustomIsLoadingproperty with its corresponding label, control type, help text, and validation.These changes improve the flexibility and customization options of the TableWidgetV2 component.
Fixes #12308
or
Fixes
Issue URLWarning
If no issue exists, please create an issue first, and check with the maintainers if the issue is valid.
Automation
/ok-to-test tags="@tag.Table"
🔍 Cypress test results
Tip
🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
Workflow run: https://github.com/appsmithorg/appsmith/actions/runs/11456273525
Commit: 1c6f4f9
Cypress dashboard.
Tags:
@tag.TableSpec:
Tue, 22 Oct 2024 09:17:37 UTC
Communication
Should the DevRel and Marketing teams inform users about this change?
Summary by CodeRabbit
New Features
TableWidgetV2.Bug Fixes
Tests
TableWidgetV2component, covering default and custom loading scenarios.Documentation