Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Conversation

@johnsoncherian
Copy link
Collaborator

@johnsoncherian johnsoncherian commented Dec 19, 2025

QA Checklist

  • Integration Testing.
  • Smoke Testing.
  • Bug Fixes Verification.
  • Cross browser UI check. (Firefox, safari,chrome)
  • Verify features on Dark and Light mode.
  • Automation Testing.
  • Import/Export
  • GitSync/Cloning
  • Test System Upgrade

manishkushare and others added 13 commits December 19, 2025 14:05
…data change (#14686)

* fix: add effect to clear edited rows and update exposed variables on data change

* added commnet for future reference
* Fixed multiline codehinter suggestions getting clipped in mozilla firefox

* Fix for custom component and single line code editor
…tions (#14705)

* Enhance canvas functionality with auto-scrolling during widget drag operations

- Introduced a new custom hook `useCanvasAutoScroll` to manage auto-scrolling behavior when dragging widgets near the edges of the canvas.
- Updated `Grid` component to integrate auto-scroll functionality, ensuring smooth user experience during drag-and-drop actions.
- Removed redundant code related to canvas and sidebar element checks, streamlining the drop handler logic.
- Adjusted widget positioning logic to account for scroll deltas, improving accuracy during drag operations.

* Enhance widget drag functionality with bounds clamping

- Implemented bounds clamping in the `Grid` component to prevent widgets from being dragged outside the canvas area.
- Updated the `useCanvasAutoScroll` hook to include canvas width checks, ensuring elements remain within the visible area during drag operations.

* Add autoscroll on resize

* Add group dragging

* Refactor

* Remove resizing part

* refactor

* refactor
* feat: add show currency flag option

* update server config

* migrate showFlag variable

* update import export service

* fix import export service
* feat: add migration for app_history table and update entity structure

* feat: refactor AppHistory module imports and add new services and guards

* Fix: Vertical page menu minor enhancements

* feat: add stream history feature and update related permissions and constants

* feat: add AppStateRepository to AppHistoryModule imports and providers

* feat: add NameResolverRepository to AppHistoryModule imports and providers

* feat: implement NameResolverRepository and NameResolverService for component and page name resolution

* feat: remove QueueHistoryIntegrationService and update AppHistoryModule to reflect changes

* feat: update AppHistoryModule and AppHistoryRepository with new methods and refactor imports

* feat: refactor AppHistoryModule and related services to streamline name resolution and history capture

* feat: add AppStateRepository and HistoryQueueProcessor, refactor AppStateAggregatorService to utilize repository methods

* feat: rename methods in AppStateRepository for clarity and update AppStateAggregatorService to reflect changes

* feat: refactor history capture logic to use synchronous execution and improve error handling across services

* Fix: Mobile view page menu UI enhancements

* feat: enhance ability guards and repository methods for app history validation

* Update submodule references

* Migrate to shadcn sidebar component

* plan

* Fix: Components not getting pasted at correct position if user scrolled and pasted inside container components

* Fix: Group components not getting pasted at correct position horizontally inside container components

* POC for removing overlap prevention logic if not enough space present,  incase user clicks somewhere to respect click position

* Update frontend/src/AppBuilder/AppCanvas/Container.jsx

Co-authored-by: Copilot <[email protected]>

* modules and customGroup

* feat: enhance AppHistoryModule registration with isMainImport flag

* feat: update settings method to queue history capture after successful update

* chore: update subproject commit reference in frontend/ee

* feat: add function to delete app history for structural migrations

* Refactor imports and enhance code organization across multiple files

- Updated import paths to reflect the new directory structure in TooljetDatabase and AppBuilder components.
- Consolidated utility functions in appUtils.js, removing redundant code and improving readability.
- Enhanced error handling and state management in dataQueriesStore and resolverStore.
- Added Bundle Analyzer plugin to webpack configuration for better performance insights.
- Improved chunking strategy in webpack to optimize loading of libraries and components.
- Refactored ErrorBoundary imports to maintain consistency across UI components.

* feat: enhance UI components with new icons and styling adjustments

* refactor: remove unused components and icons from QueryManager

- Deleted QueryManagerHeader component and its associated logic.
- Removed SuccessNotificationInputs component and its functionality.
- Eliminated Transformation component and related code.
- Deleted BreadcrumbsIcon, CreateIcon, PreviewIcon, RenameIcon, RunIcon, and ToggleQueryEditorIcon.
- Updated imports in appUtils.js to reflect new icon paths.

* Refactor editorHelpers and utils: Remove unused functions and imports, streamline background update logic, and adjust state handling. Comment out or delete handleReferenceTransactions and related logic in various stores to simplify data flow and improve maintainability.

* Refactor queryPanelStore and storeHelper by commenting out unused imports and code. This cleanup improves code readability and maintainability.

* builder roggle

* role name

* revert: Reverted the lazy loading changes

* revert: Reverted the changes on App & AppRoute

* Fix: Inside side effects, get the correct canvas element, disable page scrolling and reposition modal container when modal is opened

* Fix: Use the side effects when modal is opened and closed

* Update submodule references

* struct

* fix

* sus

* field fix

* create app btn

* fix: Corrected zustandDevTools enabled option logic

* module visible

* refactor: update license validation logic and improve feature access checks

* app module

* feat: Added modules support for public apps

* update ee-frontend submodule ref

* Enhance: Vertical page menu default styles

* refactor: migrate license management to a new store and update related components

* workflow enabled

* feat: integrate license validation into Viewer component and remove deprecated license check

* Revert "feat: integrate license validation into Viewer component and remove deprecated license check"

This reverts commit b4b5218.

* Revert "refactor: migrate license management to a new store and update related components"

This reverts commit cd2936b.

* chore: update subproject commit reference in server/ee

* chore: merged with lts

* chore: moved components from Editor to AppBuilder folder

* chore: cleaned up the appbuilder imports

* refactor: update license checks in PageSettingsTab components to use appPermissionPages feature flag

* refactor: update license checks in QueryCardMenu and Inspector components to use appPermission feature flags

* chore: update subproject commit reference

* update submodule ref

* Enhance: Horizontal page menu default styles

* fix: Global search for multiselect column

* Fix: More button on pages overflow is getting cropped and remove unnecessary calculations related to it

* Refactor page menu code

* Integrate shadcn navigation menu component for horizontal page menu

* Update submodule ref

* refactor: add license checks for page, query, and component permissions in app-permissions feature configuration

* chore: update subproject commit reference in server/ee to latest version

* chore: update subproject commit reference in server/ee to latest version

* update submodule ref

* Fix: Minimum width of the popup in horizontal page menu

* Fixed UI issues

* Removed commented code

* Removed wrapper and unwanted code

* Fix: Minor page menu bugs inside Editor

* Fix: popover overflow issue and other minor bugs

* Remove unnecessary package.json change

* chore: fix import path casing for RealTimeEditor

* Fix: Grid resizing issue and component selector overflow

* Fix: Increased transition duration to 200

* Removed the classname change

* Fix: Scrollbar visible in viewer in vertical page menu

* Fix: Remove arbitrary variant chains since not supported in Tailwind v3 to fix animations in horizontal page menu

* chore: update subproject commits for frontend and server

* Refactored code

* Update ee-frontend submodule reference

* Removed leading and trailing icon width

* chore: update subproject commit reference in server/ee to latest version

* Refactor page menu styling part to make it reusable for mobile view

* Integrate Shacn Sidebar component in page menu for mobile view

* Update submodule references

* fix: merge issues and minor bugs

* Update frontend/src/_styles/pages-sidebar.scss

Co-authored-by: Copilot <[email protected]>

* update submodule ref

* fixed: custom validation working for dropdown inside the listview

* update submodule references

* Fix: Broken app logo in editor incase app logo url is incorrect

* Fix: Default styles

* update submodule reference

* Fix: Implement changes for legacy modal as well

* Fix: Change state logic to dom manipulation logic on canvas scroll to prevent unnecessary re-renders

* Fix: Change default border color to cc-Border/weak

* Fix: Remove max width on overflow menu in horizontal page menu and prevent right sidebar to open on toggling page groups in overflow menu

* Fix: Box shadow should only be visible for horizontal page menu only when canvas is scrolled and not on top

* Update submodule references

* Feat: Add support for icon in modal trigger

* Update frontend/src/AppBuilder/Widgets/ModalV2/ModalV2.jsx

Co-authored-by: Copilot <[email protected]>

* Update frontend/src/AppBuilder/Widgets/ModalV2/helpers/stylesFactory.js

Co-authored-by: Copilot <[email protected]>

* chore: update subproject commit reference in frontend/ee

* refactor: clean up controller methods and remove unused streamHistory and getEvents methods

* chore: update subproject commit reference in frontend/ee

* update submodule references

* Fix: Scrollbar behaviour in vertical page menu

* Fix: Group closes on selecting a page on vertical page menu

* Remove log

* fix: update BoundedBox widget styles and fix class names; add datepicker styles

* feat: add permission checks based on selected data source scope in QueryCard component

* Border weak added to containers

* Added border weak to table and code editor

* fix: enhance error handling in streamHistoryUpdates and update subproject reference

* fix: fixed the bug on app history in capturing the query deletion

* fix: Fixed unknown component issue while adding an event in query and pages. Added resolveEntityName method to handle entity name resolution for components, queries, and pages

* feat: Add captureSettingsUpdateHistory method to log app version settings updates

* fix: pageSettings were not properly restored while restoring the app history and version change

* fix: Enhance settings update history capture with action type differentiation

* feat: Optimize layout updates by batching component layout changes

* fix: Prevent redundant canvasHeight updates when the value is unchanged

* Changed default size of container based components to that of form

* Organized accordians for ModalV2, Form and Container and added divider colors

* Added container styles to some components

* style: Update padding and spacing in app history styles for improved layout

* chore: Update subproject commit reference for frontend/ee

* chore: Update subproject commit references for frontend and server

* Fix: update hover effect for app name display in EditAppName component

* Fix: remove redundant darkMode prop from FormField component

* fix: add !important to primary color for rc-slider track and handle

* feat: implement batching for form component updates and layout changes

* feat: enhance form component handling with batching and parent ID extraction

* Update submodule references

* Fix: Page of type app or url gets converted to default page on app import

* feat: enhance page cloning with history capture functionality

* fix: optimize parent change detection to prevent unnecessary batch updates during drag operations

* feat: optimize query saving logic to skip unnecessary updates for name changes

* Fix: Group not selected after nested page selection until hovered in horizontal menu

* Revert "Revert "[refactor]: Fix leftsidebar on opening disturbing the scroll""

This reverts commit d712c47.

* Fix: Navigation menu disappears when view switched between desktop and mobile view in editor

* update ee-server submodule ref

* update submodule references

* Fix: Icon alignment issue

* Reverted default sizes for calendar & kanban and made header title center aligned for form and container

* feat: implement bulk creation of event handlers and optimize component event handling

* chore: update subproject commit reference in frontend/ee

* Revert "POC for removing overlap prevention logic if not enough space present,  incase user clicks somewhere to respect click position"

This reverts commit 8aec525.

* feat: disable client overlay in webpack configuration

* update the submodule refs

* update submodule refs

* update submodule reference for server/ee

* refactor: rename `defaultDataSources` prop to `staticDataSources` in `DataSourceSelect` component.

* update submodule refs

* feat: add AppHistoryStreamService to manage app history streaming

* update submodule reference for server/ee

* update submodule reference for server/ee

* fix: add null check in onHideSideEffects and remove unnecessary !important from sidebar height

* fix: update submodule reference for server/ee

* Fix: Page menu header overflowing the canvas on app mode change

* Fix: Canvas width changes on opening left and right sidebar when page menu is side aligned and opened

* Fix: App logo and name getting wrapped to new line in mobile view

* chore: update submodule to latest commit ddc3418f for server/ee

* Fix: Released app mobile view

* Fix: sidebar footer getting cutoff in mobile view

* chore: update submodules for frontend and server to latest commits

* Update ee-server submodule reference

* Update ee-server submodule reference

* Button accordian renamed to trigger button

* Migrations added

* Migrations added

* Submodule update

* Comments resolved

---------

Co-authored-by: Kavin Venkatachalam <[email protected]>
Co-authored-by: devanshu052000 <[email protected]>
Co-authored-by: Rudhra Deep Biswas <[email protected]>
Co-authored-by: Copilot <[email protected]>
Co-authored-by: manishkushare <[email protected]>
Co-authored-by: Johnson Cherian <[email protected]>
Co-authored-by: Nishidh Jain <[email protected]>
Co-authored-by: Kavin Venkatachalam <[email protected]>
…roperties panel (#14641)

* Fix on canvas click closing popover would also switch right sidebar properties panel

* Fix closing of date and time format popovers

* update submodule

* Add for table action button popover and inspector header actions
…tainer with child components has reduced width from original component (#14743)
* refactor: BaseInput Component Structure

* fix: Input overflowing over padding space in top alignment in default size
* feat: enhance AppHistoryModule registration with isMainImport flag

* feat: update settings method to queue history capture after successful update

* chore: update subproject commit reference in frontend/ee

* feat: add function to delete app history for structural migrations

* Refactor imports and enhance code organization across multiple files

- Updated import paths to reflect the new directory structure in TooljetDatabase and AppBuilder components.
- Consolidated utility functions in appUtils.js, removing redundant code and improving readability.
- Enhanced error handling and state management in dataQueriesStore and resolverStore.
- Added Bundle Analyzer plugin to webpack configuration for better performance insights.
- Improved chunking strategy in webpack to optimize loading of libraries and components.
- Refactored ErrorBoundary imports to maintain consistency across UI components.

* feat: enhance UI components with new icons and styling adjustments

* refactor: remove unused components and icons from QueryManager

- Deleted QueryManagerHeader component and its associated logic.
- Removed SuccessNotificationInputs component and its functionality.
- Eliminated Transformation component and related code.
- Deleted BreadcrumbsIcon, CreateIcon, PreviewIcon, RenameIcon, RunIcon, and ToggleQueryEditorIcon.
- Updated imports in appUtils.js to reflect new icon paths.

* Refactor editorHelpers and utils: Remove unused functions and imports, streamline background update logic, and adjust state handling. Comment out or delete handleReferenceTransactions and related logic in various stores to simplify data flow and improve maintainability.

* Refactor queryPanelStore and storeHelper by commenting out unused imports and code. This cleanup improves code readability and maintainability.

* builder roggle

* role name

* revert: Reverted the lazy loading changes

* revert: Reverted the changes on App & AppRoute

* Fix: Inside side effects, get the correct canvas element, disable page scrolling and reposition modal container when modal is opened

* Fix: Use the side effects when modal is opened and closed

* Update submodule references

* struct

* fix

* sus

* field fix

* create app btn

* fix: Corrected zustandDevTools enabled option logic

* module visible

* refactor: update license validation logic and improve feature access checks

* app module

* feat: Added modules support for public apps

* update ee-frontend submodule ref

* Enhance: Vertical page menu default styles

* refactor: migrate license management to a new store and update related components

* workflow enabled

* feat: integrate license validation into Viewer component and remove deprecated license check

* Revert "feat: integrate license validation into Viewer component and remove deprecated license check"

This reverts commit b4b5218.

* Revert "refactor: migrate license management to a new store and update related components"

This reverts commit cd2936b.

* chore: update subproject commit reference in server/ee

* chore: merged with lts

* chore: moved components from Editor to AppBuilder folder

* chore: cleaned up the appbuilder imports

* refactor: update license checks in PageSettingsTab components to use appPermissionPages feature flag

* refactor: update license checks in QueryCardMenu and Inspector components to use appPermission feature flags

* chore: update subproject commit reference

* update submodule ref

* Enhance: Horizontal page menu default styles

* fix: Global search for multiselect column

* Fix: More button on pages overflow is getting cropped and remove unnecessary calculations related to it

* Refactor page menu code

* Integrate shadcn navigation menu component for horizontal page menu

* Update submodule ref

* refactor: add license checks for page, query, and component permissions in app-permissions feature configuration

* chore: update subproject commit reference in server/ee to latest version

* chore: update subproject commit reference in server/ee to latest version

* update submodule ref

* Fix: Minimum width of the popup in horizontal page menu

* Fixed UI issues

* Removed commented code

* Removed wrapper and unwanted code

* Fix: Minor page menu bugs inside Editor

* Fix: popover overflow issue and other minor bugs

* Remove unnecessary package.json change

* chore: fix import path casing for RealTimeEditor

* Fix: Grid resizing issue and component selector overflow

* Fix: Increased transition duration to 200

* Removed the classname change

* Fix: Scrollbar visible in viewer in vertical page menu

* Fix: Remove arbitrary variant chains since not supported in Tailwind v3 to fix animations in horizontal page menu

* chore: update subproject commits for frontend and server

* Refactored code

* Update ee-frontend submodule reference

* Removed leading and trailing icon width

* chore: update subproject commit reference in server/ee to latest version

* Refactor page menu styling part to make it reusable for mobile view

* Integrate Shacn Sidebar component in page menu for mobile view

* Update submodule references

* fix: merge issues and minor bugs

* Update frontend/src/_styles/pages-sidebar.scss

Co-authored-by: Copilot <[email protected]>

* update submodule ref

* fixed: custom validation working for dropdown inside the listview

* update submodule references

* Fix: Broken app logo in editor incase app logo url is incorrect

* Fix: Default styles

* update submodule reference

* Fix: Implement changes for legacy modal as well

* Fix: Change state logic to dom manipulation logic on canvas scroll to prevent unnecessary re-renders

* Fix: Change default border color to cc-Border/weak

* Fix: Remove max width on overflow menu in horizontal page menu and prevent right sidebar to open on toggling page groups in overflow menu

* Fix: Box shadow should only be visible for horizontal page menu only when canvas is scrolled and not on top

* Update submodule references

* Feat: Add support for icon in modal trigger

* Update frontend/src/AppBuilder/Widgets/ModalV2/ModalV2.jsx

Co-authored-by: Copilot <[email protected]>

* Update frontend/src/AppBuilder/Widgets/ModalV2/helpers/stylesFactory.js

Co-authored-by: Copilot <[email protected]>

* chore: update subproject commit reference in frontend/ee

* refactor: clean up controller methods and remove unused streamHistory and getEvents methods

* chore: update subproject commit reference in frontend/ee

* Update default styles for Table component

* Remove padding from table

* Update all colors and their opacity and add change indicator

* Add support for tabler-icons in AppButton

* Update UI for Save/Discard changes buttons

* Update UI for search input

* Update icon and button for filter popup

* Update styles for filter button and search input

* Update table header interaction and icons

* Enhance overlay trigger component

* Update footer styling and alignment

* Revamp the table action buttons in Table footer and update UI for popups

* Update UI for pagination in Table footer

* Fix style for different row styles

* Fix all row interactions

* update submodule references

* Update frontend/src/AppBuilder/Widgets/NewTable/_components/Footer/_components/ControlButtons.jsx

Co-authored-by: Copilot <[email protected]>

* Fix: Scrollbar behaviour in vertical page menu

* Fix: Group closes on selecting a page on vertical page menu

* Remove log

* fix: update BoundedBox widget styles and fix class names; add datepicker styles

* feat: add permission checks based on selected data source scope in QueryCard component

* Fix: default styles for header casing and cell height

* Fix: column header changes height when sorting is added

* Fix: Dropdown to select visibility of columns should not have max width

* Fix: Icon and placeholder shifts when I focus on the search input

* Fix: Border under header is missing when row style changed to striped

* Fix: refactor logic

* Fix: Pagination button's hover state still visible when disabled

* Fix: Change UI for the row selection checkbox

* fix: enhance error handling in streamHistoryUpdates and update subproject reference

* fix: fixed the bug on app history in capturing the query deletion

* fix: Fixed unknown component issue while adding an event in query and pages. Added resolveEntityName method to handle entity name resolution for components, queries, and pages

* feat: Add captureSettingsUpdateHistory method to log app version settings updates

* fix: pageSettings were not properly restored while restoring the app history and version change

* fix: Enhance settings update history capture with action type differentiation

* feat: Optimize layout updates by batching component layout changes

* fix: Prevent redundant canvasHeight updates when the value is unchanged

* Fix: Column should have border on all side when hovered and height shouldn't flicker

* style: Update padding and spacing in app history styles for improved layout

* Fix: Increase min column width to 68px and fix column header UI accordingly

* Fix: row height diff between striped and regular row style and colors in striped row style

* chore: Update subproject commit reference for frontend/ee

* chore: Update subproject commit references for frontend and server

* Fix: update hover effect for app name display in EditAppName component

* Fix: remove redundant darkMode prop from FormField component

* fix: add !important to primary color for rc-slider track and handle

* feat: implement batching for form component updates and layout changes

* feat: enhance form component handling with batching and parent ID extraction

* Update submodule references

* Fix: Page of type app or url gets converted to default page on app import

* feat: enhance page cloning with history capture functionality

* fix: optimize parent change detection to prevent unnecessary batch updates during drag operations

* feat: optimize query saving logic to skip unnecessary updates for name changes

* Fix: Group not selected after nested page selection until hovered in horizontal menu

* Revert "Revert "[refactor]: Fix leftsidebar on opening disturbing the scroll""

This reverts commit d712c47.

* Fix: Navigation menu disappears when view switched between desktop and mobile view in editor

* update ee-server submodule ref

* update submodule references

* Fix: Icon alignment issue

* feat: implement bulk creation of event handlers and optimize component event handling

* chore: update subproject commit reference in frontend/ee

* Revert "POC for removing overlap prevention logic if not enough space present,  incase user clicks somewhere to respect click position"

This reverts commit 8aec525.

* feat: disable client overlay in webpack configuration

* update the submodule refs

* update submodule refs

* update submodule reference for server/ee

* refactor: rename `defaultDataSources` prop to `staticDataSources` in `DataSourceSelect` component.

* update submodule refs

* feat: add AppHistoryStreamService to manage app history streaming

* update submodule reference for server/ee

* update submodule reference for server/ee

* fix: add null check in onHideSideEffects and remove unnecessary !important from sidebar height

* fix: update submodule reference for server/ee

* Fix: Page menu header overflowing the canvas on app mode change

* Fix: Canvas width changes on opening left and right sidebar when page menu is side aligned and opened

* Fix: App logo and name getting wrapped to new line in mobile view

* chore: update submodule to latest commit ddc3418f for server/ee

* Fix: Released app mobile view

* Fix: sidebar footer getting cutoff in mobile view

* update submodule references

* Fix: Change min column width back to 60px for backward compatibility

* Fix: While dragging table ensure all popups close

* chore: update submodules for frontend and server to latest commits

* Update ee-server submodule reference

* Update ee-server submodule reference

* update submodule references

* Fix: Add button to go to last/first page in pagination popover

* update submodule ref

* Fix: The last/first page button should stick to the top and bottom respectively

* Fix: Implemented virtualization for the pagination popup

* update submodule references

* Fix: Change behaviour of Last/First page buttons in pagination popover

---------

Co-authored-by: Rudhra Deep Biswas <[email protected]>
Co-authored-by: Kavin Venkatachalam <[email protected]>
Co-authored-by: manishkushare <[email protected]>
Co-authored-by: Johnson Cherian <[email protected]>
Co-authored-by: Nishidh Jain <[email protected]>
Co-authored-by: Kavin Venkatachalam <[email protected]>
Co-authored-by: Copilot <[email protected]>
…nside list view and kanban component (#14791)

* fix: Tags not visible and radio buttons being disabled when dropped inside list view and kanban component

* fix: Clicking on radio options other than from row 1 still updates the value for the first row instead of current row option
@bito-code-review
Copy link

Bito Automatic Review Skipped - Branch Excluded

Bito didn't auto-review because the source or target branch is excluded from automatic reviews.
No action is needed if you didn't intend for the agent to review it. Otherwise, to manually trigger a review, type /review in a comment and save.
You can change the branch exclusion settings here, or contact your Bito workspace admin at [email protected].

…stview subcontainers (#14688)

* fix: enhance ConfigHandle to prevent rendering in read-only Kanban/Listview subcontainers

* chore : removed comments

* fix: pass readOnly prop to ConfigHandle in WidgetWrapper

* fix: move readOnly check to prevent rendering of ConfigHandle
@bito-code-review
Copy link

Bito Automatic Review Skipped - Branch Excluded

Bito didn't auto-review because the source or target branch is excluded from automatic reviews.
No action is needed if you didn't intend for the agent to review it. Otherwise, to manually trigger a review, type /review in a comment and save.
You can change the branch exclusion settings here, or contact your Bito workspace admin at [email protected].

@diffray-bot
Copy link

Changes Summary

This PR contains a significant AppBuilder sprint release (S20) with 14 commits introducing canvas auto-scrolling during widget drag operations, major Table component styling overhaul, BaseInput component refactoring, new 'Reset Query' action, fixes for components inside ListView/Kanban containers, and multiple widget styling enhancements with new default styles for several components.

Type: mixed

Components Affected: AppCanvas/Grid (auto-scroll during drag), Table/NewTable (styling and UI overhaul), BaseInput (component structure refactoring), Form (header/footer dividers, exposed variables), ModalV2 (divider styling), Dropdown/MultiSelect (scroll to selected option), RadioButtonV2 (fix for ListView/Kanban), ConfigHandle (read-only mode handling), QueryPanel (reset query functionality), EventManager/ActionTypes (reset-query action), Calendar, Chat, CodeEditor, PDF, CustomComponent, Container, CurrencyInput (default styles)

Architecture Impact
  • New Patterns: useCanvasAutoScroll hook for drag-and-drop auto-scrolling, Canvas height dynamic extension during drag operations, Reset query action type in event system
  • Coupling: Form component now exposes functions in children (deepCloneWithFunctions), Grid component tightly integrated with new auto-scroll hook
  • Breaking Changes: Table component padding changed from 8px to 0px, Form borderColor default changed from #fff to var(--cc-weak-border), Multiple widget default styles changed which may affect existing apps (handled by data migrations)

Risk Areas: Data migrations (3 new migrations) for updating component styles - risk of incomplete migration affecting existing apps, Canvas auto-scroll feature interacts with multiple drag operations (single, group, virtual target) - complex state management, BaseInput refactoring changes height calculation and styling which could affect all input-type widgets, Form exposed variables now include functions via deepCloneWithFunctions - potential serialization issues, Table styling overhaul with many CSS changes could cause visual regressions, RadioButton ID generation change for subcontainers could break accessibility or label associations

Suggestions
  • Verify data migrations run correctly in both directions (up/down) and handle edge cases
  • Test auto-scroll behavior extensively with different container types (Canvas, Form, Modal, ListView, Kanban)
  • Ensure backward compatibility for apps created before this release with existing Table and Form styling
  • Test RadioButton and other components inside nested containers (ListView within Form, etc.)
  • Verify the new reset-query action works correctly in all event contexts (component events, page events, query events)

Full review in progress... | Powered by diffray

<SolidIcon fill={'var(--icons-default)'} width="16" name="TriangleUpCenter" />
</div>
</div>
);

Choose a reason for hiding this comment

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

🟡 MEDIUM - Missing dependencies in useEffect hook
Category: bug

Description:
The useEffect hook uses props.setExposedVariable but dependency array only includes inputLogic.value

Suggestion:
Add props.setExposedVariable to the dependency array, or verify it's stable

Confidence: 75%
Rule: react_conditional_hook_call

Comment on lines 57 to +66
useEffect(() => {
const completedLabelColor = component?.component?.definition?.styles?.completedLabel?.value;
if (variant !== prevVariant) {
if (variant === "numbers" && completedLabelColor === "#1B1F24") {
paramUpdated({ name: 'completedLabel' }, 'value', "#FFFFFF", 'styles', false, {});
} else if (variant === "titles" && completedLabelColor === "#FFFFFF") {
paramUpdated({ name: 'completedLabel' }, 'value', "#1B1F24", 'styles', false, {});
if (variant === 'numbers' && completedLabelColor === '#1B1F24') {
paramUpdated({ name: 'completedLabel' }, 'value', '#FFFFFF', 'styles', false, {});
} else if (variant === 'titles' && completedLabelColor === '#FFFFFF') {
paramUpdated({ name: 'completedLabel' }, 'value', '#1B1F24', 'styles', false, {});
}
}

}, [variant])
}, [variant]);

Choose a reason for hiding this comment

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

🟡 MEDIUM - Missing dependencies in useEffect hook
Category: bug

Description:
useEffect uses component, prevVariant, paramUpdated but only [variant] in dependency array

Suggestion:
Add component and paramUpdated to dependency array or wrap in useCallback

Confidence: 78%
Rule: react_conditional_hook_call

const overRideFunction = React.useCallback((context) => autoCompleteExtensionConfig(context), [paramList]);
const { handleTogglePopupExapand, isOpen, setIsOpen, forceUpdate } = portalProps;
let cyLabel = paramLabel ? paramLabel.toLowerCase().trim().replace(/\s+/g, '-') : props.cyLabel;

Choose a reason for hiding this comment

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

🟡 MEDIUM - Missing dependencies in useCallback hook
Category: bug

Description:
useCallback for overRideFunction calls autoCompleteExtensionConfig which uses workflowSuggestions, getSuggestions, getServerSideGlobalResolveSuggestions, isInsideQueryManager, lang but only includes [paramList]

Suggestion:
Add missing dependencies to useCallback or document why they're intentionally excluded

Confidence: 80%
Rule: react_conditional_hook_call

Comment on lines +64 to +75
for (const component of components) {
const styles = component.styles ? { ...component.styles } : {};
const componentType = component.type;

this.applyDefaultStyles(styles, componentType);

// Updating component using raw query
await queryRunner.query(`UPDATE components SET styles = $1 WHERE id = $2`, [
JSON.stringify(styles),
component.id,
]);
}

Choose a reason for hiding this comment

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

🔴 CRITICAL - N+1 Query Pattern: Individual UPDATE queries in loop
Category: performance

Description:
Migration processes components in batches but executes individual UPDATE for each component. With thousands of components, this creates N individual UPDATE statements.

Suggestion:
Use bulk UPDATE with CASE statements or PostgreSQL's UPDATE with unnest() to reduce N queries to 1 per batch

Confidence: 95%
Rule: sql_n_plus_one_query

}
}
setPreviewLoading(false);
setIsPreviewQueryLoading(false);

Choose a reason for hiding this comment

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

🟡 MEDIUM - Console.log in production code
Category: quality

Description:
console.log statement in catch block should be removed or replaced with proper logging

Suggestion:
Remove console.log or replace with proper logging mechanism

Confidence: 90%
Rule: quality_avoid_console_in_production

Comment on lines 184 to +195

return (
<div style={{ display: visibility ? 'flex' : 'none', width: width - 3, height, boxShadow }} data-cy={dataCy}>
<div className="d-flex position-relative h-100 flex-column" style={{ margin: '0 auto', overflow: 'hidden' }}>
<div
className="d-flex position-relative h-100 flex-column"
style={{
margin: '0 auto',
overflow: 'hidden',
borderRadius: `${borderRadius}px`,
border: `1px solid ${borderColor}`,
}}
>

Choose a reason for hiding this comment

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

🟡 MEDIUM - Potential SSRF in PDF download
Category: security

Description:
The downloadFile function uses fetch() with a user-controlled URL without validation. This could allow an attacker to make the client fetch arbitrary URLs.

Suggestion:
Validate the PDF URL before fetching: 1) Ensure URL uses safe protocols (http/https only), 2) Validate against allowlist of trusted domains, 3) Consider proxying PDF downloads through your backend.

Confidence: 75%
Rule: frontend_prevent_open_redirect_dom

Comment on lines +38 to +42
const TablerIcon = ({ name, ...props }) => {
// eslint-disable-next-line import/namespace
const IconElement = Icons[name] === undefined ? Icons['IconHome2'] : Icons[name];
return <IconElement {...props} />;
};

Choose a reason for hiding this comment

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

🔵 LOW - Component defined inside render function
Category: quality

Description:
The TablerIcon component is defined inside the ButtonBase component. This creates a new component definition on every render, which can cause performance issues and break React's reconciliation.

Suggestion:
Move TablerIcon outside of ButtonBase as a standalone component or use useMemo to memoize it.

Confidence: 85%
Rule: ts_component_files

inputRef.current.style.height = '100%';
return;
}
inputRef.current.style.height = 'auto';

Choose a reason for hiding this comment

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

🔵 LOW - useCallback with mutable ref in dependencies
Category: quality

Description:
The resizeTextArea useCallback references inputRef.current in its dependency array which is a mutable ref value that React cannot track.

Suggestion:
Remove inputRef?.current from the dependency array since React refs are stable. The function will always have access to the current ref value.

Confidence: 85%
Rule: ts_memoize_components_and_callbacks_when_pr

Comment on lines +17 to +24
export const deepCloneWithFunctions = (obj) => {
return cloneDeepWith(obj, (value) => {
if (typeof value === 'function') {
return value; // Return function reference as-is
}
// Return undefined to let lodash handle default cloning
});
};

Choose a reason for hiding this comment

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

🟠 HIGH - New function deepCloneWithFunctions lacks test coverage
Category: testing

Description:
A new utility function deepCloneWithFunctions was added but no corresponding tests were created. This function is used in production code (Form.jsx) but has no test coverage.

Suggestion:
Add comprehensive tests for deepCloneWithFunctions covering: deep cloning with function preservation, nested functions, null/undefined values, and arrays containing functions.

Confidence: 90%
Rule: test_new_parameter_coverage

}
}

private async processUpdates(queryRunner: QueryRunner, components: any[]) {

Choose a reason for hiding this comment

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

🟡 MEDIUM - Using 'any' type for components array
Category: bug

Description:
The 'components' parameter is typed as 'any[]', which bypasses type checking and can lead to runtime errors when accessing component properties.

Suggestion:
Define a proper interface for component objects that includes 'id' and 'properties' fields with their expected types.

Confidence: 75%
Rule: ts_any_type_usage

@diffray-bot
Copy link

Review Summary

Free public review - Want AI code reviews on your PRs? Check out diffray.ai

Validated 102 issues: 55 kept, 47 filtered

Issues Found: 55

See 36 individual line comment(s) for details.

📊 30 unique issue type(s) across 55 location(s)

📋 Full issue list (click to expand)

🔴 CRITICAL - Stale closure bug in setColumnOrder callback

Category: bug

File: frontend/src/AppBuilder/Widgets/NewTable/_components/TableData/_components/TableHeader.jsx:138-142

Description: The setColumnOrder callback receives currentOrder as parameter but uses outer columnOrder variable in arrayMove, causing stale closure bug.

Suggestion: Use currentOrder (the parameter) instead of columnOrder: return arrayMove(currentOrder, oldIndex, newIndex);

Confidence: 98%

Rule: bug_array_bounds


🔴 CRITICAL - N+1 Query Pattern: Individual UPDATE queries in loop (3 occurrences)

Category: performance

📍 View all locations
File Description Suggestion Confidence
server/data-migrations/1765313746517-BackfillDefaultComponentStyles.ts:64-75 Migration processes components in batches but executes individual UPDATE for each component. With th... Use bulk UPDATE with CASE statements or PostgreSQL's UPDATE with unnest() to reduce N queries to 1 p... 95%
server/data-migrations/1764930484535-UpdateShowFlagForCurrencyInput.ts:31-49 Migration fetches CurrencyInput components in batches of 100 but executes individual UPDATE queries ... Use bulk UPDATE with PostgreSQL's array operations or batch the updates into a single query per batc... 92%
server/src/modules/apps/services/app-import-export.service.ts:590-594 The code iterates through all app versions and executes individual UPDATE queries to update globalSe... Batch all updates and execute a single query using createQueryBuilder or bulk update operations 85%

Rule: sql_n_plus_one_query


🟠 HIGH - Form input without associated label (2 occurrences)

Category: quality

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/Widgets/NewTable/_components/Header/_components/SearchBar.jsx:24-37 Search input lacks aria-label or associated label element. Screen readers cannot identify the input'... Add aria-label="Search table" to the input element 92%
frontend/src/AppBuilder/Widgets/NewTable/_components/IndeterminateCheckbox/IndeterminateCheckbox.jsx:18-36 The checkbox input lacks an associated label or aria-label. Screen reader users cannot identify the ... Add aria-label="Select row" or aria-label="Select all rows" depending on context 82%

Rule: fe_form_labels


🟠 HIGH - Interactive element without keyboard accessibility (3 occurrences)

Category: quality

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/Widgets/NewTable/_components/Header/_components/SearchBar.jsx:38-53 The clear icon uses a div with onClick but lacks keyboard accessibility (no tabIndex, no keyboard ev... Replace div with for proper semantics and keyboard ... 90%
frontend/src/AppBuilder/Widgets/NumberInput.jsx:54-68 Number input increment/decrement controls use div elements with onClick handlers but lack keyboard a... Replace divs with button elements: <button type="button" onClick={handleIncrement} aria-label="Incre... 88%
frontend/src/AppBuilder/Widgets/PasswordInput.jsx:15-19 Password visibility toggle uses div with onClick but lacks keyboard accessibility and proper ARIA at... Replace div with <button type="button" aria-label={inputLogic.iconVisibility ? 'Hide password' : 'Sh... 90%

Rule: fe_button_vs_anchor


🟠 HIGH - Missing cleanup and incomplete dependency array in useEffect

Category: bug

File: frontend/src/AppBuilder/Widgets/NewTable/_components/Footer/_components/Pagination/Pagination.jsx:79-93

Description: useEffect uses setTimeout without cleanup, and the dependency array doesn't include virtualizer or pageIndex which are used inside the effect.

Suggestion: The code at lines 81-91 already includes cleanup. However, empty dependency array [] is intentional (runs once on mount). Issue is overstated.

Confidence: 60%

Rule: ts_clear_timers_on_teardown_unmount


🟠 HIGH - Event listener added without cleanup (2 occurrences)

Category: bug

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/RightSideBar/Inspector/EventManager.jsx:123-130 An event listener is added to document.body for 'mousedown' events during render without correspondi... Move this logic into a useEffect with proper cleanup function 95%
frontend/src/AppBuilder/AppCanvas/Grid/Grid.jsx:454-460 Event listeners are added to moveableBox conditionally, but cleanup attempts to remove them uncondit... Store the element reference for cleanup: const moveableBoxRef = moveableBox; and check it in cleanup... 88%

Rule: fe_memory_leak_event_listeners


🟠 HIGH - Single Responsibility Principle violation - runQuery (2 occurrences)

Category: quality

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/_stores/slices/queryPanelSlice.js:322-725 The runQuery function is 400+ lines handling query execution, state management, authentication, tran... Extract separate responsibilities into focused functions: QueryExecutor, QueryStateManager, Transfor... 90%
frontend/src/AppBuilder/_stores/slices/eventsSlice.js:495-960 The executeAction function is a 450+ line switch statement handling 20+ different action types with ... Refactor using Command or Strategy pattern to separate each action type into its own handler 85%

Rule: arch_srp_violation


🟠 HIGH - Extremely long function (322 lines)

Category: quality

File: frontend/src/AppBuilder/_stores/slices/gridSlice.js:116-438

Description: The adjustComponentPositions function is over 300 lines with deeply nested logic and multiple responsibilities for visibility calculation, height calculation, layout calculations, etc.

Suggestion: Break it down into: calculateContainerHeight(), adjustChildrenPositions(), handleDynamicHeight(), updateTemporaryLayouts()

Confidence: 92%

Rule: quality_missing_project_pattern


🟠 HIGH - N+1 Query Pattern: Individual findOne queries for DataSourceOptions (4 occurrences)

Category: performance

📍 View all locations
File Description Suggestion Confidence
server/src/modules/apps/services/app-import-export.service.ts:1536-1550 When creating data source options for existing app environments, the code executes individual findOn... Fetch all existing DataSourceOptions in a single query using IN clause, then filter in memory. 92%
server/src/modules/apps/services/app-import-export.service.ts:1555-1573 Similar to the previous issue, this loop checks for existing DataSourceOptions individually for each... Batch the existence check by fetching all matching DataSourceOptions in a single query using IN clau... 92%
server/src/modules/apps/services/app-import-export.service.ts:939-947 The code calls updateEventActionsForNewVersionWithNewMappingIds for each app version sequentially. E... If possible, batch process all versions at once by fetching all events for all versions in a single ... 80%
server/src/modules/apps/services/app-import-export.service.ts:1917-1975 The code creates and saves AppVersion entities one at a time in a for loop. Explicitly saving in a l... Batch create all versions and save once using manager.save(AppVersion, versionsToCreate). 72%

Rule: perf_n_plus_one_queries


🟠 HIGH - Quadratic loops in group drag: O(N×M) lookup (2 occurrences)

Category: performance

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/AppCanvas/Grid/Grid.jsx:1166-1183 During onDragGroup, the code iterates through all events and performs boxList.find() for each, creat... Pre-compute a Map indexed by component ID before the loop: `const widgetMap = new Map(boxList.map(bo... 95%
frontend/src/AppBuilder/AppCanvas/Grid/hooks/useCanvasAutoScroll.js:85-109 In group drag mode, the code iterates over elements and performs find() on boxList for each element,... Pre-compute a Map of component heights indexed by ID before the loop 88%

Rule: perf_quadratic_loops


🟠 HIGH - Dynamic code execution using Function constructor (2 occurrences)

Category: security

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/_stores/slices/queryPanelSlice.js:1127-1143 The code uses the Function constructor to dynamically execute user-controlled transformation code. T... Consider implementing a safer code execution sandbox using Web Workers or isolate the execution cont... 85%
frontend/src/AppBuilder/_stores/slices/queryPanelSlice.js:1432-1448 The code uses new Function() to dynamically create an AsyncFunction constructor, then uses it to exe... Implement a secure sandboxed execution environment such as Web Workers with limited API access. Add ... 90%

Rule: frontend_avoid_eval


🟠 HIGH - New function deepCloneWithFunctions lacks test coverage

Category: testing

File: frontend/src/_helpers/utilities/utils.helpers.js:17-24

Description: A new utility function deepCloneWithFunctions was added but no corresponding tests were created. This function is used in production code (Form.jsx) but has no test coverage.

Suggestion: Add comprehensive tests for deepCloneWithFunctions covering: deep cloning with function preservation, nested functions, null/undefined values, and arrays containing functions.

Confidence: 90%

Rule: test_new_parameter_coverage


🟡 MEDIUM - Missing dependencies in useEffect hook (4 occurrences)

Category: bug

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/Widgets/NumberInput.jsx:71-75 The useEffect hook uses props.setExposedVariable but dependency array only includes inputLogic.value... Add props.setExposedVariable to the dependency array, or verify it's stable 75%
frontend/src/AppBuilder/RightSideBar/Inspector/Components/Steps.jsx:57-66 useEffect uses component, prevVariant, paramUpdated but only [variant] in dependency array Add component and paramUpdated to dependency array or wrap in useCallback 78%
frontend/src/AppBuilder/CodeEditor/MultiLineCodeEditor.jsx:198 useCallback for overRideFunction calls autoCompleteExtensionConfig which uses workflowSuggestions, g... Add missing dependencies to useCallback or document why they're intentionally excluded 80%
frontend/src/AppBuilder/RightSideBar/Inspector/Inspector.jsx:874-876 The comparison function for React.memo doesn't return a value, causing the component to always re-re... Add a return statement: return prevProps.componentName === nextProps.componentName; 100%

Rule: react_conditional_hook_call


🟡 MEDIUM - Missing dependency in useEffect - variable name mismatch (2 occurrences)

Category: bug

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/RightSideBar/Inspector/Components/Steps.jsx:337-339 useEffect dependency uses isDynamicStepsEnabled but constructSteps references isDynamicOptionsEnable... Use same variable name consistently: isDynamicStepsEnabled is declared at line 336, isDynamicOptions... 85%
frontend/src/AppBuilder/AppCanvas/Grid/Grid.jsx:160-163 useEffect calls updateCanvasBottomHeight(boxList, moduleId) but is missing boxList and `moduleId... Add missing dependencies: boxList, moduleId, updateCanvasBottomHeight 88%

Rule: react_missing_dependency


🟡 MEDIUM - Console.log in production code

Category: quality

File: frontend/src/AppBuilder/_stores/slices/queryPanelSlice.js:962

Description: console.log statement in catch block should be removed or replaced with proper logging

Suggestion: Remove console.log or replace with proper logging mechanism

Confidence: 90%

Rule: quality_avoid_console_in_production


🟡 MEDIUM - Inline component definition causes unnecessary re-renders (2 occurrences)

Category: performance

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/Widgets/NewTable/_components/Footer/_components/ControlButtons.jsx:21-41 RenderButton is defined inside ControlButtons component body, recreated on every render. However, th... Move RenderButton outside ControlButtons and wrap with React.memo for better performance 70%
frontend/src/AppBuilder/Widgets/NewTable/_components/Footer/_components/Pagination/Pagination.jsx:70-148 PaginationPopoverContent component is defined inside the Pagination component, causing the entire co... Move PaginationPopoverContent outside Pagination or memoize it with React.memo. 90%

Rule: ts_avoid_using_bind_or_arrow_functions_in_j


🟡 MEDIUM - Direct DOM manipulation using querySelector

Category: quality

File: frontend/src/AppBuilder/CodeEditor/MultiLineCodeEditor.jsx:69

Description: Using document.querySelector to check for parent elements violates React best practices. However, this runs during component initialization outside React lifecycle.

Suggestion: Use React refs and context to determine if component is inside query pane

Confidence: 72%

Rule: fe_direct_dom_manipulation


🟡 MEDIUM - Hardcoded user-facing string with typo (2 occurrences)

Category: quality

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/Widgets/NewTable/_components/Footer/_components/ControlButtons.jsx:74 The button label 'Selects All' is hardcoded with a typo (should be 'Select All') and not using i18n.... Use the translation system for user-facing text: label={t('table.selectAll', 'Select All')} 85%
frontend/src/AppBuilder/Widgets/NewTable/_components/Footer/_components/ControlButtons.jsx:118-138 Multiple button labels in the download popover are hardcoded: 'Download as CSV', 'Download as Excel'... Replace hardcoded strings with translation keys 80%

Rule: fe_hardcoded_strings


🟡 MEDIUM - Module-level mutable state creates implicit singleton

Category: quality

File: frontend/src/AppBuilder/AppCanvas/Grid/gridUtils.js:435-437

Description: Module-level mutable variables (previousActiveWidgets, previousActiveCanvas, processedComponents) act as implicit singletons creating shared mutable state across the app.

Suggestion: Refactor to encapsulate state within a class or closure, or pass state as parameters

Confidence: 75%

Rule: arch_singleton_state_js


🟡 MEDIUM - Potential NaN in value parsing

Category: bug

File: frontend/src/AppBuilder/Widgets/NumberInput.jsx:11-13

Description: parseFloat(props.properties.value) could return NaN if value is null, undefined, or non-numeric string. Number(NaN.toFixed(...)) returns NaN.

Suggestion: Add null/undefined check: value: props.properties.value != null && !isNaN(parseFloat(props.properties.value)) ? Number(...) : null

Confidence: 80%

Rule: bug_null_pointer


🟡 MEDIUM - JSDoc @param missing for moduleId parameter (2 occurrences)

Category: docs

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/_stores/slices/componentsSlice.js:2223-2228 The function generateUniqueComponentNameFromBaseName has a moduleId parameter with default value 'ca... Add @param {string} [moduleId='canvas'] - The module ID to generate unique name for 95%
server/src/modules/apps/services/app-import-export.service.ts:2530-2542 The function migrateProperties has 4 parameters but the JSDoc only documents 3 parameters. The toolj... Add @param {string | null} tooljetVersion - The ToolJet version for backward compatibility checks 95%

Rule: ts_jsdoc_param_mismatch


🟡 MEDIUM - Magic numbers without named constants (2 occurrences)

Category: quality

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/AppCanvas/Grid/hooks/useCanvasAutoScroll.js:8-17 Multiple magic numbers (30, 10, 50, 300, 350) used in DEFAULT_CONFIG without clear explanation Extract to named constants: const SCROLL_EDGE_THRESHOLD_PX = 30; const SCROLL_SPEED_PX_PER_FRAME = 1... 75%
frontend/src/AppBuilder/Widgets/NewTable/_components/Footer/_components/Pagination/Pagination.jsx:52-64 Magic numbers 3, 2, 460 used in pagination logic without explanation Extract to named constants: const MAX_VISIBLE_PAGES = 3; const PAGES_FROM_EDGE = 2; const MOBILE_WID... 70%

Rule: qual_magic_numbers_js


🟡 MEDIUM - Array index used as React key

Category: quality

File: frontend/src/AppBuilder/Widgets/NewTable/_components/Footer/_components/ControlButtons.jsx:194-200

Description: Using array index as key (line 196) can cause incorrect component state when the list order changes.

Suggestion: Use a stable unique identifier for keys based on button type instead of index.

Confidence: 68%

Rule: ts_avoid_array_indexes_as_keys_in_react_lis


🟡 MEDIUM - Open redirect vulnerability in open-webpage action (2 occurrences)

Category: security

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/_stores/slices/eventsSlice.js:618-623 The code uses window.open() with a URL from getResolvedValue without validation. No allowlist or pro... Implement URL validation: 1) Validate against allowlist of trusted domains, 2) Check URL protocol (o... 80%
frontend/src/AppBuilder/Widgets/PDF.jsx:164-175 The downloadFile function uses fetch() with a user-controlled URL without validation. This could all... Validate the PDF URL before fetching: 1) Ensure URL uses safe protocols (http/https only), 2) Valida... 75%

Rule: frontend_prevent_open_redirect_dom


🟡 MEDIUM - JSON.parse without try-catch in event handlers (2 occurrences)

Category: security

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/Widgets/NewTable/_components/DataTypes/JSON.jsx:90-104 JSON.parse() is called on user content in onBlur and onKeyDown handlers without try-catch protection... Wrap the JSON.parse calls at lines 93 and 101 in try-catch blocks to handle malformed JSON gracefull... 85%
frontend/src/AppBuilder/Widgets/CustomComponent/CustomComponent.jsx:46 The code parses JSON from postMessage event data without validating the origin. PostMessage is sent ... 1. Validate the postMessage origin instead of accepting '*'. 2. Validate the parsed parameters struc... 88%

Rule: frontend_validate_json_parsing


🟡 MEDIUM - Using 'any' type for components array

Category: bug

File: server/data-migrations/1764930484535-UpdateShowFlagForCurrencyInput.ts:31

Description: The 'components' parameter is typed as 'any[]', which bypasses type checking and can lead to runtime errors when accessing component properties.

Suggestion: Define a proper interface for component objects that includes 'id' and 'properties' fields with their expected types.

Confidence: 75%

Rule: ts_any_type_usage


🔵 LOW - Using != instead of !== for comparison

Category: bug

File: frontend/src/AppBuilder/Widgets/BaseComponents/BaseInput.jsx:106

Description: The code uses != (loose equality) to check width and label length which can lead to unexpected type coercion behavior.

Suggestion: Use strict equality (!==) for comparisons: width !== 0 && label?.length !== 0

Confidence: 70%

Rule: ts_falsy_zero_in_ternary


🔵 LOW - React.memo comparison function returns nothing (4 occurrences)

Category: quality

📍 View all locations
File Description Suggestion Confidence
frontend/src/AppBuilder/RightSideBar/Inspector/Inspector.jsx:873-876 The custom comparison function for React.memo only performs an expression without returning the resu... Add a return statement: `(prevProps, nextProps) => prevProps.componentName === nextProps.componentNa... 98%
frontend/src/AppBuilder/CodeEditor/MultiLineCodeEditor.jsx:70-73 The useMemo dependency array uses wrapperRef.current which is a mutable ref value. React cannot tr... Use a state variable to track the DOM element instead of relying on ref.current in the dependency ar... 92%
frontend/src/AppBuilder/Widgets/NewTable/_components/Header/_components/SearchBar.jsx:14-15 The useMemo hook for debouncedChange has empty dependency array but depends on setGlobalFilter. ... Add setGlobalFilter to the dependency array: `useMemo(() => debounce(onChange, 500), [setGlobalFil... 88%
frontend/src/AppBuilder/Widgets/TextArea.jsx:24 The resizeTextArea useCallback references inputRef.current in its dependency array which is a mu... Remove inputRef?.current from the dependency array since React refs are stable. The function will ... 85%

Rule: ts_memoize_components_and_callbacks_when_pr


🔵 LOW - Console.log left in production code

Category: quality

File: frontend/src/AppBuilder/_stores/slices/componentsSlice.js:779

Description: A console.log statement 'console.log('here--- initDependencyGraph--- ');' is present. This appears to be debug code that should be removed before merging.

Suggestion: Remove the console.log statement.

Confidence: 95%

Rule: quality_commented_code_blocks


🔵 LOW - Component defined inside render function

Category: quality

File: frontend/src/_ui/AppButton/AppButton.jsx:38-42

Description: The TablerIcon component is defined inside the ButtonBase component. This creates a new component definition on every render, which can cause performance issues and break React's reconciliation.

Suggestion: Move TablerIcon outside of ButtonBase as a standalone component or use useMemo to memoize it.

Confidence: 85%

Rule: ts_component_files


Powered by diffray - AI Code Review Agent

@bito-code-review
Copy link

Bito Automatic Review Skipped - Branch Excluded

Bito didn't auto-review because the source or target branch is excluded from automatic reviews.
No action is needed if you didn't intend for the agent to review it. Otherwise, to manually trigger a review, type /review in a comment and save.
You can change the branch exclusion settings here, or contact your Bito workspace admin at [email protected].

@bito-code-review
Copy link

Bito Automatic Review Skipped - Branch Excluded

Bito didn't auto-review because the source or target branch is excluded from automatic reviews.
No action is needed if you didn't intend for the agent to review it. Otherwise, to manually trigger a review, type /review in a comment and save.
You can change the branch exclusion settings here, or contact your Bito workspace admin at [email protected].

@nakulnagargade nakulnagargade self-requested a review December 22, 2025 13:02
@bito-code-review
Copy link

Bito Automatic Review Skipped - Branch Excluded

Bito didn't auto-review because the source or target branch is excluded from automatic reviews.
No action is needed if you didn't intend for the agent to review it. Otherwise, to manually trigger a review, type /review in a comment and save.
You can change the branch exclusion settings here, or contact your Bito workspace admin at [email protected].

@kavinvenkatachalam kavinvenkatachalam merged commit 5bafb53 into lts-3.16 Dec 22, 2025
12 checks passed
@kavinvenkatachalam kavinvenkatachalam deleted the release/appbuilder-s20 branch December 22, 2025 13:54
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.