[WIP][P2][Sourcing]Need validation handling for filters in fdp-table

[vish-swami]

Is this a bug, enhancement, or feature request?

Feature request

Describe your proposal.

Would like to have validation emit or options for filters in exclude and include section of fdp-table, currently conflicting conditions can be added to include and exclude. in case of error filter pop should have error message. e.g. INCLUDE : include users with mobile numbers, EXCLUDE users with mobile numbers

Can you handle that on the application side

No

Which versions of Angular and Fundamental Library for Angular are affected? Please, specify the exact version. (If this is a feature request, use current version.)

V15.x

If this is a bug, please provide steps for reproducing it; the exact components you are using;

Please provide relevant source code (if applicable).

Please provide stackblitz example(s).

In case this is Accessibility related topic, did you consult with an accessibility expert? If not, please do so and share their recommendations.

Did you check the documentation and the API?

Did you search for similar issues?

Is there anything else we should know?

[droshev]

@vish-swami Can you create a stackblitz example with your scenario?

[vish-swami]

@droshev https://stackblitz.com/edit/rbacj3?file=src%2Fapp%2Fplatform-table-preserved-state-example.component.html scenario 1: INCLUDE: verfied as YES EXCLUDE: verfied as Yes

scenario 2: INCLUDE: verfied as YES INCLUDE: verfied as NO

if we add above filter in the stackbliz, this will return 0 results which makes sense. but same when we pass these filters to backend this is complex to resolve and user may receive 0 records. Also if number of boolean filters are more then user may feel confused with these combinations.

If we can get a way to add validation on this pop-up with error message, that would be helpful

[mikerodonnell89]

So I think the best path to making this happen is to expose an input, something like [enableSaveButton] on the settings dialog and p13 dialog components that would allow the developer to disable the button based on some conditions. Then I believe, using angular forms along with a custom settings dialog like we see in the "Column Filtering" example on this page, the developer can take it from there. However I think we can make it significantly easier for the dev by adding eventing to the settings/p13 child components. For example inside of each of the p13 child components (TableP13SortComponent, TableP13FilterComponent, etc) we need to bubble changes using an event up through the parent p13 dialog component and the dev can handle those as needed. So for the dev's template it would look like

<fdp-table-p13-dialog [table]="table" 
    (personalizationSettingsChanged)="handleSettingsChanges($event)" 
    [enableSaveButton]="someConditional()">
</fdp-table-p13-dialog>

Where the developer implements handleSettingsChanges and someConditional. Thoughts? @SAP/fundamental-denoland-team

[mikerodonnell89]

We have decided to take a similar route to the value help dialog validation handling: https://fundamental-ngx.netlify.app/#/platform/value-help-dialog#basic

<fdp-value-help-dialog [tokenValidator]="validator">

    validator = (value: VhdValueChangeEvent) =>
        of(value.selected.length <= 10).pipe(
            delay(5000),
            tap((result) => {
                if (result) {
                    return;
                }

                const content = {
                    title: 'Wrong number of selected items',
                    approveButton: 'Ok',
                    cancelButton: 'Cancel',
                    approveButtonCallback: () => messageBoxRef.close('Approved'),
                    cancelButtonCallback: () => messageBoxRef.close('Canceled'),
                    closeButtonCallback: () => messageBoxRef.dismiss('Dismissed'),
                    content: 'You must select less than 10 items'
                };

                const messageBoxRef = this.messageBoxService.open(content, { type: 'error' });
            })
        );

Validator function can take another parameter for the type of dialog i.e. filter/sort/etc

[vish-swami]

So, I will get all the rules array in validator function where i can customise validation logic and error text to be shown, right? and is it all right to show pop-up over filter pop-up, i was thinking to have error text just below the rules drop-down.

[mikerodonnell89]

So, I will get all the rules array in validator function where i can customise validation logic and error text to be shown, right? and is it all right to show pop-up over filter pop-up, i was thinking to have error text just below the rules drop-down.

@vish-swami It will work the same way as the VHD error pop up, when you click Ok, the message will be shown and the filter pop up will not close. It's important for us to maintain consistent behavior in cases like this across the library

[vish-swami]

Hi @droshev @mikerodonnell89 , i see the issue is closed so do we have fix ready or released ?