[PR #24776] refactor: replace clsx with classnames #30786

Closed
opened 2026-02-21 20:48:13 -05:00 by yindo · 0 comments
Owner

Original Pull Request: https://github.com/langgenius/dify/pull/24776

State: closed
Merged: Yes


Summary

This PR removes the clsx dependency and replaces all usages with the existing classnames library to consolidate CSS class name handling utilities.

Changes Made

  • Removed dependency: Eliminated clsx package from package.json dependencies
  • Updated imports: Changed import clsx from 'clsx' to import cn from 'classnames' in pagination component
  • Function calls: Replaced all clsx() calls with cn() (classnames) calls

Files Modified

  • pagination.tsx - Updated all clsx usages to use classnames
  • package.json - Removed clsx dependency
  • pnpm-lock.yaml - Updated lockfile to reflect dependency changes

Benefits

  • Reduced bundle size: Eliminates duplicate functionality by removing an unnecessary dependency
  • Consistency: Uses a single utility library (classnames) for CSS class name concatenation throughout the project
  • Maintainability: Simplifies dependency management by reducing the number of similar utilities

Testing

  • All existing functionality preserved
  • No breaking changes to component APIs
  • Dependencies install successfully without clsx

This refactoring maintains the same functionality while reducing dependency bloat and improving code consistency across the project.

Screenshots

Before After
... ...

Checklist

  • This change requires a documentation update, included: Dify Document
  • I understand that this PR may be closed in case there was no previous discussion or issues. (This doesn't apply to typos!)
  • I've added a test for each change that was introduced, and I tried as much as possible to make a single atomic change.
  • I've updated the documentation accordingly.
  • I ran dev/reformat(backend) and cd web && npx lint-staged(frontend) to appease the lint gods
**Original Pull Request:** https://github.com/langgenius/dify/pull/24776 **State:** closed **Merged:** Yes --- ## Summary This PR removes the `clsx` dependency and replaces all usages with the existing `classnames` library to consolidate CSS class name handling utilities. ### Changes Made - **Removed dependency**: Eliminated `clsx` package from package.json dependencies - **Updated imports**: Changed `import clsx from 'clsx'` to `import cn from 'classnames'` in pagination component - **Function calls**: Replaced all `clsx()` calls with `cn()` (classnames) calls ### Files Modified - pagination.tsx - Updated all clsx usages to use classnames - package.json - Removed clsx dependency - pnpm-lock.yaml - Updated lockfile to reflect dependency changes ### Benefits - **Reduced bundle size**: Eliminates duplicate functionality by removing an unnecessary dependency - **Consistency**: Uses a single utility library (`classnames`) for CSS class name concatenation throughout the project - **Maintainability**: Simplifies dependency management by reducing the number of similar utilities ### Testing - ✅ All existing functionality preserved - ✅ No breaking changes to component APIs - ✅ Dependencies install successfully without clsx This refactoring maintains the same functionality while reducing dependency bloat and improving code consistency across the project. ## Screenshots | Before | After | |--------|-------| | ... | ... | ## Checklist - [ ] This change requires a documentation update, included: [Dify Document](https://github.com/langgenius/dify-docs) - [x] I understand that this PR may be closed in case there was no previous discussion or issues. (This doesn't apply to typos!) - [x] I've added a test for each change that was introduced, and I tried as much as possible to make a single atomic change. - [x] I've updated the documentation accordingly. - [x] I ran `dev/reformat`(backend) and `cd web && npx lint-staged`(frontend) to appease the lint gods
yindo added the pull-request label 2026-02-21 20:48:13 -05:00
yindo closed this issue 2026-02-21 20:48:13 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: langgenius/dify#30786