chore: set default datamodel felt

[JamalAlabdullah]

Description

We need to set a default data model filed when the user select a data model to prevent the error message in preview.

CLOSES: #17048

Solution

---

Screen.Recording.2025-11-26.at.12.53.04.mov

---

Verification

• Related issues are connected (if applicable)
• Your code builds clean without any errors or warnings
• Manual testing done (required)
• Relevant automated test added (if you find this hard, leave it and we'll help out)

Summary by CodeRabbit

• New Features

  • Auto-selection of the first available data field when creating bindings.
  • Automatic persistence of bindings (auto-save) to streamline workflow.
  • Form field now defaults to a derived selected data field value when none is set.

• Tests

  • Unit tests updated to await asynchronous binding updates and adjusted assertions for additional update invocations.
  • UI automation enhanced with explicit checks for selected value and save button enabled; redundant save steps removed.

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

[coderabbitai]

Walkthrough

When a component mounts with a selected data type but no binding.field, the first available data model field is auto-selected and persisted via a new saveBinding flow; tests and Playwright helpers were updated to await and assert this asynchronous auto-selection and add post-condition checks.

Changes

Cohort / File(s)	Summary
Test updates for async auto-selection src/Designer/frontend/packages/ux-editor/src/components/Properties/DataModelBindings.test.tsx, src/Designer/frontend/packages/ux-editor/src/components/config/editModal/EditDataModelBinding/EditBinding/EditBinding.test.tsx	Tests now import/use waitFor, await the auto-selection/update, and assert increased invocation counts (initial auto-update + explicit save). Test queries/roles and descriptions adjusted to reflect auto-select behaviour and updated assertion counts (e.g., handleUpdate/debounceSave and handleComponentChange).
Auto-save and binding persistence src/Designer/frontend/packages/ux-editor/src/components/config/editModal/EditDataModelBinding/EditBinding/EditBinding.tsx	Added useCallback/useEffect and getDataModelFields usage. Introduced saveBinding to centralise binding updates (computes derived fields like required, timeStamp, maxCount) and a handleAutoSave effect that auto-populates and saves the first data model field when appropriate.
Selected field derived value src/Designer/frontend/packages/ux-editor/src/components/config/editModal/EditDataModelBinding/EditBinding/SelectDataFieldBinding.tsx	Introduced selectedDataField which prefers the current field or falls back to the first available field; FormField value now uses this derived value when there is no binding error.
Playwright helper robustness src/Designer/frontend/testing/playwright/pages/UiEditorPage.ts	Cached locators and added post-condition assertions: verify combobox value after selectOption, assert save button is enabled before clicking, and adjusted post-condition from hidden→disabled for selection completion.
E2E test flow simplification src/Designer/frontend/testing/playwright/tests/ui-editor/ui-editor-data-model-binding-and-gitea.spec.ts	Removed explicit intermediate save actions after selecting a data model property option, relying on the auto-save/updated flow.

Sequence Diagram(s)

sequenceDiagram
    autonumber
    actor User
    participant EditBinding as EditBinding.tsx
    participant SelectField as SelectDataFieldBinding.tsx
    participant DataModel as Data Model

    User->>EditBinding: mount with dataTypeToUse (no binding.field)
    activate EditBinding
    EditBinding->>EditBinding: useEffect -> handleAutoSave checks
    EditBinding->>DataModel: getDataModelFields(dataTypeToUse)
    DataModel-->>EditBinding: field list
    EditBinding->>EditBinding: saveBinding(firstField)
    note right of EditBinding `#DDFFDD`: compute derived fields\ntrigger onSuccess update
    deactivate EditBinding

    EditBinding->>SelectField: provide updated binding
    activate SelectField
    SelectField->>SelectField: derive selectedDataField (current || first)
    SelectField->>User: render auto-selected field
    deactivate SelectField

    User->>SelectField: optionally change selection
    SelectField->>EditBinding: handleDataModelFieldChange(newField)
    EditBinding->>EditBinding: saveBinding(newField)

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

• Review focus areas:
  • Dependency arrays and timing of useEffect/useCallback in EditBinding.tsx.
  • Correctness of computed derived fields (required, timeStamp, maxCount) in saveBinding.
  • Tests' awaits and invocation-count assertions for stable async behaviour.
  • Playwright locator caching and post-condition assertions.

"I nibbled through code at dawn's first light,
First field chosen to set everything right.
A hop, a save, a tiny binding cheer,
Debounce and update both call twice here.
— 🐇"

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Title check	⚠️ Warning	The title contains a typo ('felt' instead of 'field') and is vague without specifying that it involves auto-selection of default data model fields.	Consider revising to 'feat: auto-select default data model field on model selection' or similar to clarify the actual implementation.

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description check	✅ Passed	The description clearly explains the issue being fixed, references the linked issue, and provides verification details. All template sections are addressed.
Linked Issues check	✅ Passed	The PR code changes implement auto-selection of the first available data model field when a user selects a data model [EditBinding.tsx], addressing the core requirement of issue #17048 to prevent preview errors.
Out of Scope Changes check	✅ Passed	All changes are directly related to implementing the default data model field selection feature and its corresponding test updates. No extraneous modifications detected.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch 17048-default-innhold-på-datamodellfelt

---

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9ab691e and 1a67baf.

📒 Files selected for processing (1)

• src/Designer/frontend/testing/playwright/pages/UiEditorPage.ts (2 hunks)

🚧 Files skipped from review as they are similar to previous changes (1)

• src/Designer/frontend/testing/playwright/pages/UiEditorPage.ts

⏰ 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). (4)

• GitHub Check: Typechecking and linting
• GitHub Check: Testing
• GitHub Check: CodeQL
• GitHub Check: Build environment and run e2e test

---

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

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[codecov]

Codecov Report

❌ Patch coverage is 84.61538% with 4 lines in your changes missing coverage. Please review.
✅ Project coverage is 96.19%. Comparing base (f63ea9c) to head (1a67baf).
⚠️ Report is 392 commits behind head on main.

Files with missing lines	Patch %	Lines
...l/EditDataModelBinding/EditBinding/EditBinding.tsx	83.33%	2 Missing and 2 partials ⚠️

Additional details and impacted files

@@           Coverage Diff            @@
##             main   #17055    +/-   ##
========================================
  Coverage   96.19%   96.19%            
========================================
  Files        2447     2395    -52     
  Lines       30790    30468   -322     
  Branches     3544     3514    -30     
========================================
- Hits        29618    29310   -308     
+ Misses        864      851    -13     
+ Partials      308      307     -1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.