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

[FX-5652] Migrate Dropdown to TailwindCSS #4499

Merged
merged 23 commits into from
Aug 29, 2024
Merged

Conversation

AdrianContiu
Copy link
Contributor

@AdrianContiu AdrianContiu commented Aug 22, 2024

FX-5652

Description

This PR removes material-ui styles and replaces them with Tailwind CSS classes. It also adds the @mui/base package as a dependency to handle the import of the Click-Away Listener component. However, the @material-ui/core package will not be removed because Dropdown still uses the Grow component from mui@4 that will need to be migrated in this follow-up task.

How to test

Development checks

Breaking change

  • codemod is created and showcased in the changeset
  • test alpha package of Picasso in StaffPortal

All development checks should be done and set checked to pass the
GitHub Bot: TODOLess action

PR commands

List of available commands:

  • @toptal-bot run package:alpha-release - Release alpha version
  • @toptal-anvil ping reviewers - Ping FX team for review
PR Review Guidelines

When to approve? ✅

You are OK with merging this PR and

  1. You have no extra requests.
  2. You have optional requests.
    1. Add nit: to your comment. (ex. nit: I'd rename this variable from makeCircle to getCircle)

When to request changes? ❌

You are not OK with merging this PR because

  1. Something is broken after the changes.
  2. Acceptance criteria is not reached.
  3. Code is dirty.

When to comment (neither ✅ nor ❌)

You want your comments to be addressed before merging this PR in cases like:

  1. There are leftovers like unnecessary logs, comments, etc.
  2. You have an opinionated comment regarding the code that requires a discussion.
  3. You have questions.

How to handle the comments?

  1. An owner of a comment is the only one who can resolve it.
  2. An owner of a comment must resolve it when it's addressed.
  3. A PR owner must reply with ✅ when a comment is addressed.

@AdrianContiu AdrianContiu self-assigned this Aug 22, 2024
Copy link

changeset-bot bot commented Aug 22, 2024

🦋 Changeset detected

Latest commit: a91715c

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 36 packages
Name Type
@toptal/picasso-dropdown Minor
@toptal/picasso Patch
@toptal/picasso-button Patch
@toptal/picasso-page Patch
@toptal/picasso-forms Patch
@toptal/picasso-query-builder Patch
@toptal/picasso-rich-text-editor Patch
@toptal/picasso-accordion Patch
@toptal/picasso-alert Patch
@toptal/picasso-application-update-notification Patch
@toptal/picasso-calendar Patch
@toptal/picasso-carousel Patch
@toptal/picasso-drawer Patch
@toptal/picasso-file-input Patch
@toptal/picasso-helpbox Patch
@toptal/picasso-modal Patch
@toptal/picasso-notification Patch
@toptal/picasso-outlined-input Patch
@toptal/picasso-pagination Patch
@toptal/picasso-password-input Patch
@toptal/picasso-prompt-modal Patch
@toptal/picasso-section Patch
@toptal/picasso-show-more Patch
@toptal/picasso-skeleton-loader Patch
@toptal/picasso-table Patch
@toptal/picasso-tree-view Patch
@toptal/picasso-date-picker Patch
@toptal/picasso-dropzone Patch
@toptal/picasso-autocomplete Patch
@toptal/picasso-avatar-upload Patch
@toptal/picasso-input Patch
@toptal/picasso-number-input Patch
@toptal/picasso-select Patch
@toptal/picasso-tagselector Patch
@toptal/picasso-timepicker Patch
@toptal/picasso-date-select Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@AdrianContiu AdrianContiu marked this pull request as ready for review August 23, 2024 15:25
@AdrianContiu AdrianContiu requested a review from a team August 23, 2024 15:25
@AdrianContiu
Copy link
Contributor Author

@toptal-anvil ping reviewers

Copy link
Contributor

@sashuk sashuk left a comment

Choose a reason for hiding this comment

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

Seems like changeset is missing. Apart from that, code looks good and works as supposed! Tested in different screen sizes with long items lists in temploy

Screenshot 2024-08-24 at 12 25 33

@sashuk sashuk requested a review from a team August 24, 2024 11:29
@AdrianContiu
Copy link
Contributor Author

@toptal-anvil ping reviewers

packages/base/Dropdown/package.json Outdated Show resolved Hide resolved
packages/base/Dropdown/src/Dropdown/Dropdown.tsx Outdated Show resolved Hide resolved
packages/base/Dropdown/src/Dropdown/styles.ts Outdated Show resolved Hide resolved
packages/base/Dropdown/src/Dropdown/styles.ts Outdated Show resolved Hide resolved
Copy link
Contributor

@sashuk sashuk left a comment

Choose a reason for hiding this comment

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

Apart from unnecessary mui-base bump, looks good!

@AdrianContiu AdrianContiu merged commit 3a0125d into master Aug 29, 2024
18 checks passed
@AdrianContiu AdrianContiu deleted the fx-5652-dropdown branch August 29, 2024 13:22
@toptal-build toptal-build mentioned this pull request Aug 29, 2024
1 task
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.

3 participants