Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Extract the button component for datasource picker to avoid duplicate code #6559

Merged
merged 3 commits into from
Apr 25, 2024

Conversation

zhyuanqi
Copy link
Collaborator

@zhyuanqi zhyuanqi commented Apr 19, 2024

Description

Extract the button component for datasource picker to avoid duplicate code

Screenshot

Screenshot 2024-04-19 at 11 07 44 AM Screenshot 2024-04-19 at 11 07 51 AM Screenshot 2024-04-19 at 11 07 58 AM

Testing the changes

  • Add multiple datasources and click on button to see if it work as expected

Changelog

  • fix: Extract the button component for datasource picker to avoid duplicate code

Check List

  • All tests pass
    • yarn test:jest
    • yarn test:jest_integration
  • New functionality includes testing.
  • New functionality has been documented.
  • Update CHANGELOG.md
  • Commits are signed per the DCO using --signoff

@zhyuanqi zhyuanqi changed the title Extract the button component for datasource picker to avoid duplicate… Extract the button component for datasource picker to avoid duplicate code Apr 19, 2024
Copy link
Contributor

❌ Empty Changelog Section

The Changelog section in your PR description is empty. Please add a valid changelog entry or entries. If you did add a changelog entry, check to make sure that it was not accidentally included inside the comment block in the Changelog section.

Copy link
Contributor

❌ Empty Changelog Section

The Changelog section in your PR description is empty. Please add a valid changelog entry or entries. If you did add a changelog entry, check to make sure that it was not accidentally included inside the comment block in the Changelog section.

opensearch-changeset-bot bot added a commit to zhyuanqi/OpenSearch-Dashboards that referenced this pull request Apr 19, 2024
zhyuanqi pushed a commit to zhyuanqi/OpenSearch-Dashboards that referenced this pull request Apr 19, 2024
Copy link

codecov bot commented Apr 19, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 67.80%. Comparing base (d2d410b) to head (ef0e997).
Report is 34 commits behind head on main.

Additional details and impacted files
@@             Coverage Diff             @@
##             main    #6559       +/-   ##
===========================================
+ Coverage   32.93%   67.80%   +34.86%     
===========================================
  Files        2260     3411     +1151     
  Lines       45769    66740    +20971     
  Branches     7200    10860     +3660     
===========================================
+ Hits        15075    45251    +30176     
+ Misses      29984    18845    -11139     
- Partials      710     2644     +1934     
Flag Coverage Δ
Linux_1 33.18% <ø> (+0.25%) ⬆️
Linux_2 55.63% <ø> (?)
Linux_3 45.22% <100.00%> (?)
Linux_4 34.91% <20.00%> (?)
Windows_1 33.23% <ø> (?)
Windows_2 55.59% <ø> (?)
Windows_3 45.24% <100.00%> (?)
Windows_4 34.91% <20.00%> (?)

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

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@zhyuanqi zhyuanqi force-pushed the button-components branch 3 times, most recently from d2efc74 to 88ddd0d Compare April 19, 2024 22:38
@@ -156,7 +157,7 @@ export class DataSourceView extends React.Component<DataSourceViewProps, DataSou
if (this.state.showError) {
return <DataSourceErrorMenu />;
}
const label = this.state.selectedOption.length > 0 ? this.state.selectedOption[0].label : '';
const label = this.state.selectedOption.length > 0 ? this.state.selectedOption[0].label! : '';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wouldn't label be undefined here at initial render of the component if consumers pass in [{id}]?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch! Let me add check here

@zhyuanqi zhyuanqi force-pushed the button-components branch 2 times, most recently from f828569 to 878cecd Compare April 22, 2024 23:20
onClick: () => void;
}

export const PopoverButton: React.FC<PopoverButtonProps> = ({ className, label, onClick }) => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we use a more specific name, i.e. DataSourceMenuButton

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would do

return (
<>
<EuiButtonEmpty
className={`dataSourceComponentButtonTitle`}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can we use the className passed down?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah. It is the unified CSS selector to control the button length, make sure it does not exceed 16 ch. So will not need to pass down since it is unified among all pickers,

onClick: () => void;
}

export const DataSourceMenuPopoverButton: React.FC<DataSourceMenuPopoverButtonProps> = ({
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: can we change the file name as well?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes

… code

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>
Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>
@zhongnansu zhongnansu merged commit b9ac31e into opensearch-project:main Apr 25, 2024
67 checks passed
opensearch-trigger-bot bot pushed a commit that referenced this pull request Apr 25, 2024
… code (#6559)

* Extract the button component for datasource picker to avoid duplicate code

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>

* Modify the name of popover button

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>

---------

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>
(cherry picked from commit b9ac31e)
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

# Conflicts:
#	CHANGELOG.md
BionIT pushed a commit that referenced this pull request Apr 26, 2024
… code (#6559) (#6645)

* Extract the button component for datasource picker to avoid duplicate code

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>

* Modify the name of popover button

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>

---------

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>
(cherry picked from commit b9ac31e)
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>
LDrago27 pushed a commit to LDrago27/OpenSearch-Dashboards that referenced this pull request Jun 3, 2024
… code (opensearch-project#6559)

* Extract the button component for datasource picker to avoid duplicate code

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>

* Modify the name of popover button

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>

---------

Signed-off-by: Yuanqi(Ella) Zhu <zhyuanqi@amazon.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants