Skip to content

Update squish buttons and colors #1569

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

Merged
merged 2 commits into from
May 19, 2025
Merged

Update squish buttons and colors #1569

merged 2 commits into from
May 19, 2025

Conversation

MagicalMeghan
Copy link
Contributor

  • Updated squish buttons
  • Updated color file that was overwritten during merge

Updated squish buttons, updated color file that was overwritten during merge
@MagicalMeghan MagicalMeghan requested a review from a team as a code owner May 19, 2025 21:58
Copy link

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

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

Hello @MagicalMeghan, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

Summary of Changes

Hello team, gemini-code-assist here to provide a summary of this pull request from @MagicalMeghan. The primary goal of this PR is to address two main areas: updating the 'squish' effect on certain buttons and fixing a color definition file that was seemingly overwritten during a previous merge. The changes involve modifying color values in the design system and refactoring button implementations in the player and podcast details screens to incorporate the desired button behavior and updated icons.

Highlights

  • Color Theme Updates: The Color.kt file has been updated significantly, modifying numerous color definitions across light, dark, and various contrast themes. This seems to be the fix for the 'overwritten during merge' issue mentioned in the description.
  • Player Button Refactor and Styling: The player controls in PlayerScreen.kt have been refactored to use ButtonGroup with customItem for better handling of the 'squish' effect. The icons for skip, rewind, and fast forward buttons have been changed from Filled or Outlined to Rounded variants. The play/pause button's checked state color has also been updated to use the tertiary color scheme.
  • Podcast Details Button Refactor and Styling: Similar to the player screen, the subscribe and notification buttons in the podcast details header (PodcastDetailsScreen.kt) have been refactored using ButtonGroup and customItem to apply the 'squish' effect. Interaction sources and animation modifiers were added to these buttons.

Changelog

Click here to see the changelog
  • Jetcaster/core/designsystem/src/main/java/com/example/jetcaster/designsystem/theme/Color.kt
    • Updated color values for various theme properties (primary, onPrimary, secondary, onSecondary, tertiary, onTertiary, error, inverseSurface, surfaceDim, surfaceBright, surfaceContainer variants) for the light theme (lines 21-32, 45-54).
    • Updated color values for various theme properties for the light medium contrast theme (lines 56-67, 84-90).
    • Updated color values for various theme properties for the dark theme (lines 128-139, 146-147).
    • Updated color values for various theme properties for the dark medium contrast theme (lines 164-175, 190-191).
  • Jetcaster/mobile/src/main/java/com/example/jetcaster/ui/player/PlayerScreen.kt
    • Added import for MutableInteractionSource (line 27).
    • Changed imports for player control icons from filled and outlined to rounded (lines 57-62).
    • Reordered imports for Duration and launch (lines 117-118).
    • Minor formatting adjustment in usingVerticalStrategy calculation (lines 278-282).
    • Minor formatting adjustment for clipInOverlayDuringTransition (lines 400).
    • Changed the checkedContainerColor and checkedContentColor for the play/pause toggle button to use tertiary colors (lines 745-746).
    • Changed the play/pause icon from Outlined to Rounded (line 758).
    • Added overflowIndicator = {} to the main ButtonGroup (line 764).
    • Refactored skip, rewind, and fast forward buttons to use customItem within ButtonGroup (lines 775-869).
    • Added MutableInteractionSource and animateWidth modifier to player control buttons (lines 779, 803, 827, 851).
    • Changed skip, rewind, and fast forward icons from Filled to Rounded (lines 791, 815, 839, 863).
  • Jetcaster/mobile/src/main/java/com/example/jetcaster/ui/podcast/PodcastDetailsScreen.kt
    • Added imports for MutableInteractionSource and Spacer (lines 24, 27).
    • Refactored the subscribe and notification toggle buttons to use customItem within ButtonGroup (lines 300-371).
    • Added overflowIndicator = {} to the ButtonGroup (line 297).
    • Added MutableInteractionSource and animateWidth modifier to the subscribe and notification buttons (lines 321, 358).
    • Added a Spacer as a customItem with a weight to push buttons to the start (lines 372-375).
Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in issue comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist is currently in preview and may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments to provide feedback.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.


Colors shift and change,
Buttons squish with happy bounce,
UI feels refreshed.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

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

Code Review

The pull request updates the color definitions in the design system and refactors the button implementations in the player and podcast details screens. The color updates seem to be a direct replacement of one set of color values with another, likely based on updated design specifications. The button changes introduce the use of ButtonGroup with customItem and an animateWidth modifier, which appears to be an implementation of the "squish buttons" mentioned in the description. The changes are well-contained within the specified files.

Summary of Findings

  • Incorrect content description for notification icon: The content description for the notification icon in the podcast details screen uses a generic "more" string, which is not descriptive for accessibility.
  • Missing content descriptions for player control icons: Several icons in the player screen's control buttons have contentDescription = null. While this might be acceptable if the button's purpose is clear from context or surrounding text, providing explicit content descriptions is generally better for accessibility. (Note: This issue is low severity and not included as a direct review comment per custom settings).

Merge Readiness

The changes address the stated objectives of updating colors and button behavior. The color changes are straightforward. The button refactoring introduces a new pattern using ButtonGroup and customItem, which seems correctly implemented based on the visible code. There is one medium severity issue regarding an incorrect accessibility label that should ideally be addressed before merging. I am unable to approve this pull request, and other reviewers should assess its readiness for merging after considering the feedback.

Comment on lines +366 to +367
contentDescription = stringResource(R.string.cd_more),
)

Choose a reason for hiding this comment

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

medium

The contentDescription for the notification icon currently uses a generic string resource for "more". For better accessibility, it should describe the specific action of toggling notifications for the podcast.

@MagicalMeghan MagicalMeghan merged commit 9c032e2 into main May 19, 2025
2 checks passed
@MagicalMeghan MagicalMeghan deleted the update-material-issues branch May 19, 2025 22:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants