query-builder: typeahead for filter and post-filter #1381

MauricioUyaguari · 2022-08-04T19:59:10Z

Summary

Fixes #1382

typeAhead.mp4

changeset-bot · 2022-08-04T19:59:13Z

🦋 Changeset detected

Latest commit: 41c834b

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 21 packages

Name	Type
@finos/legend-art	Patch
@finos/legend-application-query	Minor
@finos/legend-application	Patch
@finos/legend-application-query-bootstrap	Patch
@finos/legend-application-studio-bootstrap	Patch
@finos/legend-application-studio	Patch
@finos/legend-application-taxonomy-bootstrap	Patch
@finos/legend-application-taxonomy	Patch
@finos/legend-extension-application-studio-management-toolkit	Patch
@finos/legend-extension-application-studio-query-builder	Patch
@finos/legend-extension-dsl-data-space	Patch
@finos/legend-extension-dsl-diagram	Patch
@finos/legend-extension-dsl-persistence	Patch
@finos/legend-extension-dsl-text	Patch
@finos/legend-extension-external-language-morphir	Patch
@finos/legend-extension-external-store-service	Patch
@finos/legend-manual-tests	Patch
@finos/legend-extension-dsl-persistence-cloud	Patch
@finos/legend-application-query-deployment	Patch
@finos/legend-application-studio-deployment	Patch
@finos/legend-application-taxonomy-deployment	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

codecov · 2022-08-09T18:37:12Z

Codecov Report

Merging #1381 (41c834b) into master (0a99cab) will increase coverage by 0.21%.
The diff coverage is 59.39%.

@@            Coverage Diff             @@
##           master    #1381      +/-   ##
==========================================
+ Coverage   41.89%   42.10%   +0.21%     
==========================================
  Files        1176     1179       +3     
  Lines       52484    52643     +159     
  Branches    11922    11966      +44     
==========================================
+ Hits        21987    22167     +180     
+ Misses      30422    30400      -22     
- Partials       75       76       +1

Impacted Files	Coverage Δ
...src/components/QueryBuilderFetchStructurePanel.tsx	`43.85% <ø> (ø)`
...ery/src/components/QueryBuilderPostFilterPanel.tsx	`12.02% <0.00%> (-0.30%)`	⬇️
.../legend-art/src/components/CustomSelectorInput.tsx	`12.82% <ø> (ø)`
...cation-query/src/stores/QueryBuilderFilterState.ts	`47.91% <14.28%> (-1.47%)`	⬇️
...on-query/src/stores/QueryBuilderPostFilterState.ts	`41.71% <15.38%> (-1.06%)`	⬇️
...omponents/shared/BasicValueSpecificationEditor.tsx	`12.61% <17.64%> (+0.66%)`	⬆️
...on-query/src/stores/QueryBuilderTypeaheadHelper.ts	`63.26% <63.26%> (ø)`
...n-query/src/components/QueryBuilderFilterPanel.tsx	`56.95% <75.00%> (+0.90%)`	⬆️
...lication-query/src/stores/QueryBuilderTestUtils.ts	`95.00% <95.00%> (ø)`
...uery/src/stores/QueryBuilderFetchStructureState.ts	`100.00% <100.00%> (ø)`
... and 28 more

akphi

Quite an elegant solution! Besides most of the suggested refactor, I think typeahead should be treated as one word.

.changeset/smart-cake.md

packages/legend-application/src/components/shared/BasicValueSpecificationEditor.tsx

packages/legend-application-query/src/stores/QueryBuilderFilterState.ts

packages/legend-application-query/src/components/QueryBuilderFilterPanel.tsx

packages/legend-application-query/src/components/QueryBuilderPostFilterPanel.tsx

akphi · 2022-08-10T04:09:20Z

packages/legend-application/src/components/shared/BasicValueSpecificationEditor.tsx

+            noOptionsMessage={noOptionsMessage}
+          />
+        ) : (
+          <input


In terms of styling, from the video, I notice the discrepancy in height of the custom selector component and the height of its container causes a jump when users input, let's fix that.

Also, I think we should consider whether we should show the caret down here as it suggests auto-complete is available as people type and it's sort of distracting. What we want to do here is just let people have the feeling like they are typing some text value per usual, and happen to have these suggestions popping up.

packages/legend-application/src/components/shared/BasicValueSpecificationEditor.tsx

packages/legend-art/src/components/CustomSelectorInput.tsx

.../legend-application-query/src/stores/__tests__/TEST_DATA__QueryBuilder_TestTypeaheadSarch.ts

packages/legend-application-query/src/components/QueryEditorComponentTestUtils.tsx

akphi

Nice stuff! I left some comments, let's address them after merging.

packages/legend-application-query/src/stores/QueryBuilderTypeaheadHelper.ts

akphi · 2022-08-12T04:36:06Z

packages/legend-application/src/components/shared/BasicValueSpecificationEditor.tsx

@@ -604,6 +684,16 @@ export const BasicValueSpecificationEditor: React.FC<{
  className?: string | undefined;
  setValueSpecification: (val: ValueSpecification) => void;
  resetValue: () => void;
+  selectorConfig?:


I'm not entirely convinced of this approach, I think what we should do is just let people pass in a function to return Promise<string[]> and we keep all the other states (loading, results) as part of this component or so.

packages/legend-application-query/src/stores/QueryBuilderOperatorLoader.ts

packages/legend-application-query/src/stores/QueryBuilderFetchStructureState.ts

packages/legend-application-query/src/stores/__tests__/QueryBuilder_Typeahead.test.ts

akphi · 2022-08-12T04:41:22Z

packages/legend-application-query/src/components/QueryBuilderPostFilterPanel.tsx

@@ -466,6 +474,26 @@ const QueryBuilderPostFilterConditionEditor = observer(
        node.condition.operator.getDefaultFilterConditionValue(node.condition),
      );
    };
+    const debouncedTypeaheadSearch = useMemo(


I want to simplify the API of BasicValueSpecification further here. Also, I just thought of a case I don't know if we need to handle, that is what happens if we do typeahead search and the returns are booleans or numbers?

we can further enhance that for numbers.
Maybe not yet for booleans.

finos-cla-bot bot added the cla-present CLA Signed label Aug 4, 2022

MauricioUyaguari self-assigned this Aug 4, 2022

MauricioUyaguari changed the title ~~first draft of fuzzy search~~ Type Ahead for Filter and Post Filter Aug 4, 2022

MauricioUyaguari force-pushed the fuzzy branch 3 times, most recently from 43a0239 to e1d939c Compare August 9, 2022 14:54

MauricioUyaguari marked this pull request as ready for review August 9, 2022 14:55

MauricioUyaguari requested review from pierredebelen and akphi as code owners August 9, 2022 14:55

MauricioUyaguari force-pushed the fuzzy branch 2 times, most recently from ba4f34e to c69b6ef Compare August 9, 2022 15:06

add support for type ahead search for filter and post filter

3196ab6

MauricioUyaguari force-pushed the fuzzy branch from c69b6ef to 3196ab6 Compare August 9, 2022 15:18

fix tests

de7d3d4

akphi changed the title ~~Type Ahead for Filter and Post Filter~~ query-builder: typeahead for filter and post-filter Aug 10, 2022

akphi suggested changes Aug 10, 2022

View reviewed changes

MauricioUyaguari force-pushed the fuzzy branch 3 times, most recently from cad7f0e to 6ace4d2 Compare August 10, 2022 20:27

add tests

85d1b80

MauricioUyaguari force-pushed the fuzzy branch 5 times, most recently from 2013830 to b1f2bea Compare August 11, 2022 14:43

akphi suggested changes Aug 11, 2022

View reviewed changes

MauricioUyaguari force-pushed the fuzzy branch 2 times, most recently from 72e00f4 to cde8767 Compare August 11, 2022 17:53

MauricioUyaguari force-pushed the fuzzy branch from cde8767 to 9553c5e Compare August 11, 2022 19:56

rewrite preview data query to builder queryBuilderState + add tests

0ebd8cc

MauricioUyaguari force-pushed the fuzzy branch from 9553c5e to 0ebd8cc Compare August 11, 2022 20:44

fix

09239ff

akphi previously approved these changes Aug 12, 2022

View reviewed changes

fix circular dependency for tests

41c834b

MauricioUyaguari dismissed akphi’s stale review via 41c834b August 12, 2022 02:39

MauricioUyaguari force-pushed the fuzzy branch from d152784 to 41c834b Compare August 12, 2022 02:39

akphi approved these changes Aug 12, 2022

View reviewed changes

akphi merged commit 7a892e6 into finos:master Aug 12, 2022

akphi deleted the fuzzy branch August 12, 2022 04:43

github-actions bot mentioned this pull request Aug 12, 2022

Iteration Release v7.3.0 #1390

Merged

akphi mentioned this pull request Aug 15, 2022

query-builder: add support for light theme #1388

Merged

46 tasks

MauricioUyaguari mentioned this pull request Aug 23, 2022

cleanup #1401

Merged

3 tasks

query-builder: typeahead for filter and post-filter #1381

query-builder: typeahead for filter and post-filter #1381

Uh oh!

Conversation

MauricioUyaguari commented Aug 4, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Uh oh!

changeset-bot bot commented Aug 4, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

codecov bot commented Aug 9, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

akphi left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

akphi Aug 10, 2022

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

akphi left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

akphi Aug 12, 2022

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

akphi Aug 12, 2022

Choose a reason for hiding this comment

Uh oh!

MauricioUyaguari Aug 12, 2022

Choose a reason for hiding this comment

Uh oh!

Uh oh!

MauricioUyaguari commented Aug 4, 2022 •

edited

Loading

changeset-bot bot commented Aug 4, 2022 •

edited

Loading

codecov bot commented Aug 9, 2022 •

edited

Loading