Skip to content

Add Badge to highlight new Extensions Page #18813

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

Conversation

carlos-zamora
Copy link
Member

@carlos-zamora carlos-zamora commented Apr 17, 2025

Summary of the Pull Request

Adds a badge to the Extensions Page in the SUI's navigation pane to highlight that it's new!

References and Relevant Issues

Targets #18633

Detailed Description of the Pull Request / Additional comments

  • Settings Model changes:
    • Leveraged the ApplicationState class to track which badges have been dismissed and prevent them from appearing again
    • Used a std::unordered_set, but exposed a get and append function via the IDL
  • Settings UI changes:
    • Added a NewInfoBadge style that is just an InfoBadge with "NEW" in it instead of a number or an icon. Based on Add "new" labels to navigation PowerToys#36939
    • The visibility is bound to a get call to the ApplicationState conducted via the ExtensionsPageViewModel. The VM is also responsible for updating the state.

Long-term, we can reuse this system and make the following minor changes:

  • SettingContainer: display the badge. and add logic to read/write ApplicationState appropriately (similarly to above)
  • XPageViewModel:
    • count all the badges that will be displayed and expose/bind that to InfoBadge.Value
    • If a whole page is new, we can just style the badge using the NewInfoBadge style

Validation Steps Performed

✅ Extensions page nav item displays a badge if page hasn't been visited
✅ The badge is dismissed when the user visits the page

@carlos-zamora
Copy link
Member Author

Demo

badge shown - expanded
badge shown - collapsed

@carlos-zamora carlos-zamora force-pushed the dev/cazamor/sui/ext-page/beautify branch from b963d60 to f25e6fe Compare April 22, 2025 22:13
@carlos-zamora carlos-zamora force-pushed the dev/cazamor/sui/ext-page/badge branch from 641b654 to 87946e9 Compare April 22, 2025 23:31
@carlos-zamora
Copy link
Member Author

Based on @cinnamon-msft's work over in microsoft/PowerToys#36939:

expanded view
collapsed view

@@ -2403,4 +2403,8 @@
<value>Disabled</value>
<comment>Text displayed when an extension is disabled</comment>
</data>
<data name="NewInfoBadgeTextBlock.Text" xml:space="preserve">
<value>NEW</value>
<comment>Text is used on an info badge for new navigation items. Must be all caps.</comment>
Copy link
Member

Choose a reason for hiding this comment

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

I do not believe the translators actually read these. or exist.

Copy link
Member

Choose a reason for hiding this comment

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

I think it may be beneficial for us long-term if we replaced the comments with ones like

"NEW" as in "New item!"

in this case. Even if there aren't always human translators, the potential LLM translators may be "thankful"? for it. 😅

Base automatically changed from dev/cazamor/sui/ext-page/beautify to dev/cazamor/sui/extensions-page April 24, 2025 22:24
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.

3 participants