[Multiple DataSource]Refactor authentication type selection in create and edit data source forms #3693

zhongnansu · 2023-03-26T04:08:24Z

Description

[Multiple DataSource]Refactor authentication type selection in create and edit data source forms to use EuiSelect component
Based on #2110 (comment), I made the UI changes to multiple datasource creation page

Current UI:

Updated UI:

Issues Resolved

#3551
#2110 (comment)

Check List

codecov-commenter · 2023-03-26T04:57:35Z

Codecov Report

Merging #3693 (8cce371) into main (6b42669) will decrease coverage by 0.05%.
The diff coverage is 100.00%.

📣 This organization is not using Codecov’s GitHub App Integration. We recommend you install it so Codecov can continue to function properly for your repositories. Learn more

@@            Coverage Diff             @@
##             main    #3693      +/-   ##
==========================================
- Coverage   66.43%   66.38%   -0.05%     
==========================================
  Files        3210     3210              
  Lines       61677    61676       -1     
  Branches     9522     9522              
==========================================
- Hits        40977    40946      -31     
- Misses      18419    18445      +26     
- Partials     2281     2285       +4

Flag	Coverage Δ
Linux	`66.38% <100.00%> (+<0.01%)`	⬆️
Windows	`?`

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
src/plugins/data_source_management/public/types.ts	`100.00% <ø> (ø)`
...components/create_form/create_data_source_form.tsx	`75.00% <100.00%> (ø)`
...rce/components/edit_form/edit_data_source_form.tsx	`67.69% <100.00%> (-0.17%)`	⬇️

... and 7 files with indirect coverage changes

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

kristenTian · 2023-03-31T18:27:52Z

Could we just confirm with UX the layout is what's been advised?

zhongnansu · 2023-03-31T18:42:12Z

Could we just confirm with UX the layout is what's been advised?

@KrooshalUX Kroosh, could you take a look?

KrooshalUX · 2023-04-04T23:12:05Z

Could we just confirm with UX the layout is what's been advised?

@KrooshalUX Kroosh, could you take a look?

Assuming this is using OuiSelect - good to go from my perspective.

ashwin-pc

Just a few comments about the implementation and types. Functionality looks good.

...management/public/components/edit_data_source/components/edit_form/edit_data_source_form.tsx

src/plugins/data_source_management/public/types.ts

...management/public/components/edit_data_source/components/edit_form/edit_data_source_form.tsx

...ement/public/components/edit_data_source/components/edit_form/edit_data_source_form.test.tsx

...blic/components/create_data_source_wizard/components/create_form/create_data_source_form.tsx

… forms to use EuiSelect instead of EuiRadioGroup for better user experience Signed-off-by: Su <szhongna@amazon.com>

Signed-off-by: Su <szhongna@amazon.com>

zhongnansu · 2023-04-05T00:48:46Z

@ashwin-pc @kristenTian addressed all comments, and resolve conflict in changelog, plz take another look, thx

ashwin-pc

LGTM!

ashwin-pc · 2023-04-05T01:26:46Z

...management/public/components/edit_data_source/components/edit_form/edit_data_source_form.tsx

-            idSelected={this.state.auth.type}
-            onChange={(id) => this.onChangeAuthType(id)}
+            value={this.state.auth.type}
+            onChange={(e) => this.onChangeAuthType(e)}


Suggested change

onChange={(e) => this.onChangeAuthType(e)}

onChange={this.onChangeAuthType}

nit: not blocking the PR for this though

made the change

AMoo-Miki · 2023-04-05T16:12:09Z

CHANGELOG.md

@@ -167,6 +167,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 - [Vis Builder] Removed Hard Coded Strings and Used i18n to transalte([#2867](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2867))
 - [Console] Replace jQuery.ajax with core.http when calling OSD APIs in console ([#3080](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3080))
 - [I18n] Fix Listr type errors and error handlers ([#3629](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3629))
+- [Multiple DataSource]Refactor authentication type selection in create and edit data source forms to use EuiSelect ([#3693](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3693))


Suggested change

- [Multiple DataSource]Refactor authentication type selection in create and edit data source forms to use EuiSelect ([#3693](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3693))

- [Multiple DataSource] Present the authentication type choices in a drop-down ([#3693](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3693))

How does this sound?

this sound nicer!

AMoo-Miki · 2023-04-05T16:14:15Z

src/plugins/data_source_management/public/types.ts

+  { value: AuthType.NoAuth, text: 'No authentication' },
+  { value: AuthType.UsernamePasswordType, text: 'Username & Password' },
+  { value: AuthType.SigV4, text: 'AWS SigV4' },


Can we use i18n for these?

Signed-off-by: Su <szhongna@amazon.com>

… and edit data source forms (#3693) * Refactor authentication type selection in create and edit data source forms to use EuiSelect instead of EuiRadioGroup for better user experience Signed-off-by: Su <szhongna@amazon.com> (cherry picked from commit 44e2e34) Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> # Conflicts: # CHANGELOG.md

… and edit data source forms (#3693) (#3790) * Refactor authentication type selection in create and edit data source forms to use EuiSelect instead of EuiRadioGroup for better user experience Signed-off-by: Su <szhongna@amazon.com> (cherry picked from commit 44e2e34) Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> # Conflicts: # CHANGELOG.md Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

… and edit data source forms (opensearch-project#3693) * Refactor authentication type selection in create and edit data source forms to use EuiSelect instead of EuiRadioGroup for better user experience Signed-off-by: Su <szhongna@amazon.com> Signed-off-by: David Sinclair <david@sinclair.tech>

zhongnansu requested a review from a team as a code owner March 26, 2023 04:08

zhongnansu added multiple datasource multiple datasource project backport 2.x v2.7.0 refactor Tech debt related tasks that need refactoring labels Mar 26, 2023

zhongnansu changed the title ~~[Multiple DataSource]Refactor authentication type selection in create and edit data source forms to use EuiSelect component~~ [Multiple DataSource]Refactor authentication type selection in create and edit data source forms to use EuiSelect Mar 26, 2023

zhongnansu requested review from kristenTian, zengyan-amazon and kavilla March 26, 2023 04:15

zhongnansu changed the title ~~[Multiple DataSource]Refactor authentication type selection in create and edit data source forms to use EuiSelect~~ [Multiple DataSource]Refactor authentication type selection in create and edit data source forms Mar 26, 2023

zhongnansu mentioned this pull request Mar 26, 2023

2.7.0 Platform Upgrades for Plugins (O11y, MDS, Geospatial,+) #3674

Closed

23 tasks

joshuarrrr linked an issue Mar 30, 2023 that may be closed by this pull request

[Multiple Datasource] Convert authentication method from radio button to dropdown list #3551

Closed

ananzh assigned kristenTian Mar 31, 2023

kristenTian previously approved these changes Mar 31, 2023

View reviewed changes

zhongnansu removed request for kavilla and zengyan-amazon April 4, 2023 17:44

zhongnansu requested a review from KrooshalUX April 4, 2023 23:17

ashwin-pc self-assigned this Apr 5, 2023

ashwin-pc reviewed Apr 5, 2023

View reviewed changes

zhongnansu dismissed kristenTian’s stale review via 953bc10 April 5, 2023 00:44

zhongnansu added 2 commits April 4, 2023 17:45

Refactor authentication type selection in create and edit data source…

3edecea

… forms to use EuiSelect instead of EuiRadioGroup for better user experience Signed-off-by: Su <szhongna@amazon.com>

add changelog

74d4bc6

Signed-off-by: Su <szhongna@amazon.com>

zhongnansu force-pushed the md-authtype-ui-update branch from 953bc10 to a45cfe1 Compare April 5, 2023 00:46

address comments

26fae2a

Signed-off-by: Su <szhongna@amazon.com>

zhongnansu force-pushed the md-authtype-ui-update branch from a45cfe1 to 26fae2a Compare April 5, 2023 00:48

zhongnansu requested review from ashwin-pc and kristenTian April 5, 2023 00:48

ashwin-pc previously approved these changes Apr 5, 2023

View reviewed changes

AMoo-Miki previously approved these changes Apr 5, 2023

View reviewed changes

address comments

8cce371

Signed-off-by: Su <szhongna@amazon.com>

zhongnansu dismissed stale reviews from AMoo-Miki and ashwin-pc via 8cce371 April 5, 2023 18:00

zhongnansu requested review from AMoo-Miki and ashwin-pc April 5, 2023 18:01

AMoo-Miki approved these changes Apr 5, 2023

View reviewed changes

kristenTian approved these changes Apr 5, 2023

View reviewed changes

zhongnansu merged commit 44e2e34 into opensearch-project:main Apr 5, 2023

opensearch-trigger-bot bot mentioned this pull request Apr 5, 2023

[Backport 2.x] [Multiple DataSource]Refactor authentication type selection in create and edit data source forms #3790

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Multiple DataSource]Refactor authentication type selection in create and edit data source forms #3693

[Multiple DataSource]Refactor authentication type selection in create and edit data source forms #3693

zhongnansu commented Mar 26, 2023 •

edited

Loading

codecov-commenter commented Mar 26, 2023 •

edited

Loading

kristenTian commented Mar 31, 2023

zhongnansu commented Mar 31, 2023

KrooshalUX commented Apr 4, 2023 •

edited

Loading

ashwin-pc left a comment

zhongnansu commented Apr 5, 2023

ashwin-pc left a comment

ashwin-pc Apr 5, 2023

zhongnansu Apr 5, 2023

AMoo-Miki Apr 5, 2023

zhongnansu Apr 5, 2023

AMoo-Miki Apr 5, 2023

zhongnansu Apr 5, 2023

	onChange={(e) => this.onChangeAuthType(e)}
	onChange={this.onChangeAuthType}

	- [Multiple DataSource]Refactor authentication type selection in create and edit data source forms to use EuiSelect ([#3693](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3693))
	- [Multiple DataSource] Present the authentication type choices in a drop-down ([#3693](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3693))

[Multiple DataSource]Refactor authentication type selection in create and edit data source forms #3693

[Multiple DataSource]Refactor authentication type selection in create and edit data source forms #3693

Conversation

zhongnansu commented Mar 26, 2023 • edited Loading

Description

Issues Resolved

Check List

codecov-commenter commented Mar 26, 2023 • edited Loading

Codecov Report

kristenTian commented Mar 31, 2023

zhongnansu commented Mar 31, 2023

KrooshalUX commented Apr 4, 2023 • edited Loading

ashwin-pc left a comment

Choose a reason for hiding this comment

zhongnansu commented Apr 5, 2023

ashwin-pc left a comment

Choose a reason for hiding this comment

ashwin-pc Apr 5, 2023

Choose a reason for hiding this comment

zhongnansu Apr 5, 2023

Choose a reason for hiding this comment

AMoo-Miki Apr 5, 2023

Choose a reason for hiding this comment

zhongnansu Apr 5, 2023

Choose a reason for hiding this comment

AMoo-Miki Apr 5, 2023

Choose a reason for hiding this comment

zhongnansu Apr 5, 2023

Choose a reason for hiding this comment

zhongnansu commented Mar 26, 2023 •

edited

Loading

codecov-commenter commented Mar 26, 2023 •

edited

Loading

KrooshalUX commented Apr 4, 2023 •

edited

Loading