Fix EUI/OUI related type errors

[tmarkley]

Task for #1660

$tsc --noEmit
...

src/plugins/advanced_settings/public/management_app/components/field/field.test.tsx:39:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

39 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/advanced_settings/public/management_app/components/form/form.test.tsx:35:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

35 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/advanced_settings/public/management_app/components/search/search.test.tsx:34:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

34 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/advanced_settings/public/management_app/components/search/search.tsx:114:51 - error TS2322: Type '({ query, error }: { query: Query | null; error: {    message: string;} | null; }) => void' is not assignable to type '(args: ArgsWithQuery | ArgsWithError) => boolean | void'.
  Types of parameters '__0' and 'args' are incompatible.
    Type 'ArgsWithQuery | ArgsWithError' is not assignable to type '{ query: Query | null; error: { message: string; } | null; }'.
      Type 'ArgsWithQuery' is not assignable to type '{ query: Query | null; error: { message: string; } | null; }'.
        The types of 'query.ast' are incompatible between these types.
          Type 'import("@opensearch-project/oui/src/eui_components/search_bar/query/ast")._AST' is not assignable to type 'import("@opensearch-project/oui/src/components/search_bar/query/ast")._AST'.
            Types have separate declarations of a private property '_clauses'.

114         <EuiSearchBar box={box} filters={filters} onChange={this.onChange} query={query} />
                                                      ~~~~~~~~

  node_modules/@elastic/eui/oui.d.ts:16441:6
    16441      onChange?: (args: ArgsWithQuery | ArgsWithError) => void | boolean;
               ~~~~~~~~
    The expected type comes from property 'onChange' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<EuiSearchBar> & Readonly<EuiSearchBarProps> & Readonly<...>'

src/plugins/advanced_settings/public/management_app/components/search/search.tsx:114:76 - error TS2322: Type 'Query' is not assignable to type 'QueryType | undefined'.
  Type 'import("@opensearch-project/oui/src/components/search_bar/query/query").Query' is not assignable to type 'import("@opensearch-project/oui/src/eui_components/search_bar/query/query").Query'.
    Types of property 'ast' are incompatible.
      Type 'import("@opensearch-project/oui/src/components/search_bar/query/ast")._AST' is not assignable to type 'import("@opensearch-project/oui/src/eui_components/search_bar/query/ast")._AST'.
        Types have separate declarations of a private property '_clauses'.

114         <EuiSearchBar box={box} filters={filters} onChange={this.onChange} query={query} />
                                                                               ~~~~~

  node_modules/@elastic/eui/oui.d.ts:16449:6
    16449      query?: QueryType;
               ~~~~~
    The expected type comes from property 'query' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<EuiSearchBar> & Readonly<EuiSearchBarProps> & Readonly<...>'

src/plugins/dashboard/public/application/dashboard_empty_screen.test.tsx:34:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

34 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

31 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/dashboard/public/application/tests/dashboard_container.test.tsx:31:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

31 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/data/public/ui/shard_failure_modal/shard_failure_open_modal_button.test.tsx:37:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

37 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/dev_tools/public/plugin.ts:74:7 - error TS2322: Type '"/plugins/home/assets/logos/opensearch_mark_default.svg"' is not assignable to type '"string" | "number" | "function" | "color" | "copy" | "grab" | "help" | "grid" | "invert" | "dot" | "menu" | "filter" | "scale" | "wordWrap" | "cross" | "push" | "link" | "image" | ... 405 more ... | undefined'.

74       euiIconType: '/plugins/home/assets/logos/opensearch_mark_default.svg',
         ~~~~~~~~~~~

  src/core/target/types/public/application/types.d.ts:150:5
    150     euiIconType?: EuiIconType;
            ~~~~~~~~~~~
    The expected type comes from property 'euiIconType' which is declared here on type 'App<unknown>'

src/plugins/discover/public/application/angular/context/components/action_bar/action_bar.test.tsx:34:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

34 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/angular/doc_table/components/pager/tool_bar_pager_buttons.test.tsx:34:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

34 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/angular/doc_table/components/table_header/table_header.test.tsx:34:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

34 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/components/context_error_message/context_error_message.test.tsx:37:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

37 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/components/doc/doc.test.tsx:36:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

36 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/components/doc_viewer/doc_viewer.test.tsx:34:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

34 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/components/hits_counter/hits_counter.test.tsx:35:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

35 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/components/loading_spinner/loading_spinner.test.tsx:35:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

35 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/components/sidebar/discover_field_search.test.tsx:34:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

34 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/components/sidebar/discover_sidebar.test.tsx:33:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

33 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/components/table/table.test.tsx:33:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

33 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/discover/public/application/components/timechart_header/timechart_header.test.tsx:36:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

36 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/embeddable/public/lib/embeddables/embeddable_root.test.tsx:35:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

35 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/embeddable/public/lib/panel/embeddable_panel.test.tsx:35:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

35 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/embeddable/public/lib/panel/panel_header/panel_actions/add_panel/add_panel_flyout.test.tsx:44:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

44 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/input_control_vis/public/components/editor/controls_tab.test.tsx:33:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

33 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/input_control_vis/public/components/editor/list_control_editor.test.tsx:35:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

35 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/input_control_vis/public/components/editor/range_control_editor.test.tsx:36:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

36 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

src/plugins/input_control_vis/public/components/vis/input_control_vis.test.tsx:35:33 - error TS2306: File '/workspaces/OpenSearch-Dashboards/node_modules/@elastic/eui/lib/test/index.d.ts' is not a module.

35 import { findTestSubject } from '@elastic/eui/lib/test';
                                   ~~~~~~~~~~~~~~~~~~~~~~~

[Nicksqain]

I'm already working on that problem :)

[Nicksqain]

[CCI]

1. file path:
   src\plugins\dev_tools\public\plugin.ts

Did I understand correctly to use icon instead of euiIconType? Because the first one uses predefined values, as I understood, the default ones that are in eui.

The link itself was irrelevant since it's all in public. Did I put the right path? or what should the path look like with ../ ?

2. file path:
   src\plugins\advanced_settings\public\management_app\components\search\search.test.tsx

Would it be a good solution to update the eui import to the oui that is declared in '@elastic/eui/lib/test'?

3. file path:
   src\plugins\advanced_settings\public\management_app\components\search\search.tsx

Can I update the Query import from eui here
to import { Query } from '@opensearch-project/oui/src/eui_components/search_bar/query';
The right solution is to either update the dependencies or somehow change the import to the current. Ur opinion?

[Nicksqain]

@ashwin-pc @joshuarrrr :)

[joshuarrrr]

Did I understand correctly to use icon instead of euiIconType? Because the first one uses predefined values, as I understood, the default ones that are in eui.

Without looking too deep into the details, yes, that sounds correct, and I believe there are a lot of incorrectly typed icon properties - see #1496 as an example of a PR that tackles similar issues.

Would it be a good solution to update the eui import to the oui that is declared in '@elastic/eui/lib/test'?

I think that's right? Does it work? You may have seen that we actually alias @elastic/eui in our package.json: https://github.com/opensearch-project/OpenSearch-Dashboards/blob/main/package.json#L121

But, yeah, it looks like node_modules/@elastic/eui/lib/test/index.d.ts explicitly declares the module as @opensearch-project/oui/lib/test/find_test_subject

Can I update the Query import from eui here

I think the issues with that search component are a little different - the types look correctly defined, but I think the class properties are not being set correctly in a way that preserves typing.

[Nicksqain]

@joshuarrrr
Type 'import("@opensearch-project/oui/src/eui_components/search_bar/query/ast")._AST' is not assignable to type 'import("@opensearch-project/oui/src/components/search_bar/query/ast")._AST'.

I have a couple of solutions in mind, but they will add errors in the future. We need to solve something with the library itself. Is it possible to replace EuiSearchBar with OuiSearchBar? No errors with it and the types are the same. I don't understand what can be done without changing the library

[Nicksqain]

@joshuarrrr :)
And assign me pls?