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

fix(react-examples): Change item names to match icon in OverflowSet example #16494

Merged
merged 2 commits into from
Jan 19, 2021
Merged

Conversation

andrefcdias
Copy link
Contributor

Pull request checklist

  • Addresses an existing issue: Fixes microsoftdesign/fluentui#10282
  • Include a change request file using $ yarn change: No change files are needed

Description of changes

Add descriptive names for the icons used in the OverflowSet Vertical example.
Removed unused icon props for the overflowItems

@fabricteam
Copy link
Collaborator

Perf Analysis

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 840 822 5000
BaseButtonCompat mount 883 876 5000
Breadcrumb mount 43447 43452 5000
Checkbox mount 1499 1467 5000
CheckboxBase mount 1248 1259 5000
ChoiceGroup mount 4664 4689 5000
ComboBox mount 1003 968 1000
CommandBar mount 10156 10108 1000
ContextualMenu mount 6132 6088 1000
DefaultButtonCompat mount 1145 1124 5000
DetailsRow mount 3594 3616 5000
DetailsRowFast mount 3665 3610 5000
DetailsRowNoStyles mount 3450 3415 5000
Dialog mount 1444 1426 1000
DocumentCardTitle mount 1829 1833 1000
Dropdown mount 3364 3298 5000
FocusTrapZone mount 1819 1802 5000
FocusZone mount 1789 1857 5000
IconButtonCompat mount 1775 1733 5000
Label mount 340 335 5000
Layer mount 1781 1763 5000
Link mount 462 469 5000
MakeStyles mount 1973 1946 50000
MenuButtonCompat mount 1473 1456 5000
MessageBar mount 2010 2088 5000
Nav mount 3250 3209 1000
OverflowSet mount 1038 1056 5000
Panel mount 1433 1457 1000
Persona mount 845 870 1000
Pivot mount 1402 1412 1000
PrimaryButtonCompat mount 1248 1275 5000
Rating mount 7551 7510 5000
SearchBox mount 1329 1329 5000
Shimmer mount 2467 2510 5000
Slider mount 1904 1867 5000
SpinButton mount 5115 4958 5000
Spinner mount 428 410 5000
SplitButtonCompat mount 3176 3099 5000
Stack mount 502 502 5000
StackWithIntrinsicChildren mount 1527 1542 5000
StackWithTextChildren mount 4494 4448 5000
SwatchColorPicker mount 10182 10246 5000
Tabs mount 1390 1405 1000
TagPicker mount 2804 2844 5000
TeachingBubble mount 11627 11556 5000
Text mount 412 406 5000
TextField mount 1343 1329 5000
ThemeProvider mount 2183 2162 5000
ThemeProvider virtual-rerender 651 646 5000
Toggle mount 812 792 5000
button mount 675 670 5000
buttonNative mount 115 112 5000

Perf Analysis (Fluent)

Perf comparison
Status Scenario Fluent TPI Fabric TPI Ratio Iterations Ticks
🦄 Avatar.Fluent 0.18 0.51 0.35:1 2000 353
🦄 Button.Fluent 0.12 0.2 0.6:1 5000 581
🔧 Checkbox.Fluent 0.65 0.34 1.91:1 1000 651
🎯 Dialog.Fluent 0.16 0.21 0.76:1 5000 804
🔧 Dropdown.Fluent 2.99 0.39 7.67:1 1000 2990
🔧 Icon.Fluent 0.13 0.06 2.17:1 5000 668
🦄 Image.Fluent 0.08 0.13 0.62:1 5000 406
🔧 Slider.Fluent 1.63 0.43 3.79:1 1000 1627
🔧 Text.Fluent 0.07 0.03 2.33:1 5000 365
🦄 Tooltip.Fluent 0.12 0.88 0.14:1 5000 580

🔧 Needs work     🎯 On target     🦄 Amazing

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
ButtonMinimalPerf.default 199 184 1.08:1
ListNestedPerf.default 614 569 1.08:1
AnimationMinimalPerf.default 436 414 1.05:1
CarouselMinimalPerf.default 470 449 1.05:1
PortalMinimalPerf.default 177 168 1.05:1
Avatar.Fluent 353 337 1.05:1
AvatarMinimalPerf.default 214 205 1.04:1
ReactionMinimalPerf.default 435 417 1.04:1
Checkbox.Fluent 651 627 1.04:1
ChatDuplicateMessagesPerf.default 389 378 1.03:1
DialogMinimalPerf.default 811 789 1.03:1
DropdownManyItemsPerf.default 747 728 1.03:1
GridMinimalPerf.default 365 353 1.03:1
HeaderSlotsPerf.default 809 787 1.03:1
InputMinimalPerf.default 1340 1300 1.03:1
MenuMinimalPerf.default 884 855 1.03:1
RadioGroupMinimalPerf.default 463 451 1.03:1
TextAreaMinimalPerf.default 499 486 1.03:1
Slider.Fluent 1627 1579 1.03:1
ButtonUseCssPerf.default 841 822 1.02:1
FlexMinimalPerf.default 321 315 1.02:1
HeaderMinimalPerf.default 391 383 1.02:1
ListCommonPerf.default 652 640 1.02:1
ListMinimalPerf.default 506 494 1.02:1
LoaderMinimalPerf.default 757 745 1.02:1
PopupMinimalPerf.default 727 716 1.02:1
RefMinimalPerf.default 249 244 1.02:1
SkeletonMinimalPerf.default 392 385 1.02:1
TreeMinimalPerf.default 806 794 1.02:1
Image.Fluent 406 398 1.02:1
BoxMinimalPerf.default 379 376 1.01:1
CheckboxMinimalPerf.default 2848 2821 1.01:1
DatepickerMinimalPerf.default 48558 48105 1.01:1
CustomToolbarPrototype.default 3808 3755 1.01:1
VideoMinimalPerf.default 638 633 1.01:1
Button.Fluent 581 576 1.01:1
Dropdown.Fluent 2990 2966 1.01:1
Text.Fluent 365 363 1.01:1
AccordionMinimalPerf.default 159 159 1:1
AttachmentSlotsPerf.default 1208 1213 1:1
ButtonOverridesMissPerf.default 1714 1719 1:1
ButtonUseCssNestingPerf.default 1088 1089 1:1
DropdownMinimalPerf.default 3011 3006 1:1
EmbedMinimalPerf.default 4170 4162 1:1
FormMinimalPerf.default 421 422 1:1
ImageMinimalPerf.default 409 407 1:1
ItemLayoutMinimalPerf.default 1225 1228 1:1
LayoutMinimalPerf.default 434 436 1:1
MenuButtonMinimalPerf.default 1582 1589 1:1
ProviderMinimalPerf.default 967 966 1:1
SplitButtonMinimalPerf.default 3780 3782 1:1
TableMinimalPerf.default 430 431 1:1
TooltipMinimalPerf.default 825 825 1:1
Dialog.Fluent 804 804 1:1
Tooltip.Fluent 580 579 1:1
ChatMinimalPerf.default 631 637 0.99:1
LabelMinimalPerf.default 430 434 0.99:1
ListWith60ListItems.default 611 619 0.99:1
ProviderMergeThemesPerf.default 1630 1644 0.99:1
StatusMinimalPerf.default 750 754 0.99:1
IconMinimalPerf.default 687 691 0.99:1
TextMinimalPerf.default 361 366 0.99:1
ToolbarMinimalPerf.default 947 953 0.99:1
TreeWith60ListItems.default 186 188 0.99:1
RosterPerf.default 1186 1216 0.98:1
SegmentMinimalPerf.default 371 379 0.98:1
SliderMinimalPerf.default 1601 1629 0.98:1
TableManyItemsPerf.default 2035 2068 0.98:1
Icon.Fluent 668 681 0.98:1
ButtonSlotsPerf.default 588 606 0.97:1
CardMinimalPerf.default 564 583 0.97:1
DividerMinimalPerf.default 379 392 0.97:1
AttachmentMinimalPerf.default 175 182 0.96:1
ChatWithPopoverPerf.default 447 467 0.96:1
AlertMinimalPerf.default 292 307 0.95:1

@size-auditor
Copy link

size-auditor bot commented Jan 15, 2021

Asset size changes

⚠️ Insufficient baseline data to detect size changes

Unable to find bundle size details for Baseline commit: d6adc18

Possible causes

  • The baseline build d6adc18 is broken
  • The Size Auditor run for the baseline build d6adc18 was not triggered

Recommendations

  • Please merge your branch for this Pull request with the latest master build and commit your changes once again

@codesandbox-ci
Copy link

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 0e8eb08:

Sandbox Source
Fluent UI Button Configuration
codesandbox-react-template Configuration
codesandbox-react-northstar-template Configuration

@msft-fluent-ui-bot
Copy link
Collaborator

Hello @khmakoto!

Because this pull request has the AutoMerge label, I will be glad to assist with helping to merge this pull request once all check-in policies pass.

p.s. you can customize the way I help with merging this pull request, such as holding this pull request until a specific person approves. Simply @mention me (@msft-fluent-ui-bot) and give me an instruction to get started! Learn more here.

@msft-fluent-ui-bot msft-fluent-ui-bot merged commit dadc7e0 into microsoft:master Jan 19, 2021
andrefcdias added a commit that referenced this pull request Jan 26, 2021
)

* fix(react-examples): Add title prop to icons in OverflowSet example
(microsoftdesign/fluentui#10284)

* Replace title prop for TooltipHost

* fix(react-examples): Change item names to match icon in OverflowSet example (#16494)

- [x] Addresses an existing issue: Fixes microsoftdesign/fluentui#10282
- [x] Include a change request file using `$ yarn change`: No change files are needed

Add descriptive names for the icons used in the OverflowSet Vertical example.
Removed unused `icon` props for the `overflowItems`

* Update snapshots

* revert snapshots

* Update just one snapshot

* Remove extraneous id on tooltips
Add label to overflow button

Co-authored-by: Elizabeth Craig <[email protected]>
msft-fluent-ui-bot pushed a commit that referenced this pull request Feb 2, 2021
#### Pull request checklist

- [x] Include a change request file using `$ yarn change`

#### Description of changes

Aggregate cherry-picking for all my contributions for the `react-examples` package

#### Focus areas to test

- [x] #16497
- [x] #16496
- [x] #16494
- [x] #16479
- [x] #16430
- [x] #16475
- [x] #16463
- [x] #16495
- [x] #16481
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.

5 participants