Autocomplete doesn't work properly #30249
Assignees
Labels
Comments
nicobytes
added a commit
that referenced
this issue
Oct 5, 2024
3 tasks
nicobytes
added a commit
that referenced
this issue
Oct 5, 2024
3 tasks
nicobytes
added a commit
that referenced
this issue
Oct 7, 2024
nicobytes
added a commit
that referenced
this issue
Oct 7, 2024
nicobytes
added a commit
that referenced
this issue
Oct 7, 2024
nicobytes
added a commit
that referenced
this issue
Oct 7, 2024
nicobytes
added a commit
that referenced
this issue
Oct 7, 2024
nicobytes
added a commit
that referenced
this issue
Oct 7, 2024
nicobytes
added a commit
that referenced
this issue
Oct 7, 2024
nicobytes
added a commit
that referenced
this issue
Oct 7, 2024
nicobytes
added a commit
that referenced
this issue
Oct 7, 2024
github-merge-queue bot
pushed a commit
that referenced
this issue
Oct 7, 2024
### Parent Issue #30249 ### Proposed Changes * Change singal approach ### The problem This computed signal caused the error: ```ts $filteredSuggestions = computed(() => { const classes = this.$classes(); const query = this.$query(); if (!query) { return classes; } return classes.filter((item) => item.includes(query)); }); filterClasses({ query }: AutoCompleteCompleteEvent): void { this.$query.set(query); } ``` The signals functionality in PrimeNg doesn't works very well. In the previous signal, `$filteredSuggestions` doesn't trigger a change if the classes or query are the same as the current state. This is desirable. However, PrimeNg [waits](https://github.com/primefaces/primeng/blob/d6c7ffcfc5cb9a8ed355399ddae276c279836ccf/src/app/components/autocomplete/autocomplete.ts#L541) for a change in the `suggestions` input after the `completeMethod` is called to turn off the loading. This is why the loading indicator remains active but never deactivates. To address this, we manually forced a change in `$filteredSuggestions` and used `[...filteredClasses]` to create a new array. ```ts filterClasses({ query }: AutoCompleteCompleteEvent): void { const classes = this.$classes(); const filteredClasses = query ? classes.filter((item) => item.includes(query)) : classes; this.$filteredSuggestions.set([...filteredClasses]); } ``` ### Checklist - [x] Tests - [x] Translations - [x] Security Implications Contemplated (add notes if applicable) ### Screenshots https://github.com/user-attachments/assets/5a199569-9192-4acb-89bd-3fb6530aefce
github-project-automation
bot
moved this from In Review
to Internal QA
in dotCMS - Product Planning
|
QA Notes:
2024-10-07.10-03-18.mp4 |
|
Approved: Tested on trunk_298ce7a, Docker, macOS 14.5, FF v126.0.1
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Parent Issue
No response
Problem Statement
Autocomplete doesn't work properly in template section.
primg.mp4
Steps to Reproduce
Acceptance Criteria
Working as documented
https://www.dotcms.com/docs/latest/designing-a-template-with-a-theme#ClassSuggestions
dotCMS Version
lastest
Proposed Objective
User Experience
Proposed Priority
Priority 4 - Trivial
External Links... Slack Conversations, Support Tickets, Figma Designs, etc.
No response
Assumptions & Initiation Needs
No response
Quality Assurance Notes & Workarounds
No response
Sub-Tasks & Estimates
No response
The text was updated successfully, but these errors were encountered: