feat: integrate dnd-kit for sidebar customization and reordering functionality

- Added dnd-kit dependencies to package.json and pnpm-lock.yaml.
- Implemented SidebarCustomization component using dnd-kit for drag-and-drop reordering of sidebar items.
- Created SortableItem component for individual sidebar items with visibility toggle.
- Enhanced SidebarCustomizer component with drag-and-drop support using react-beautiful-dnd.
- Updated sidebar-new component to include dynamic shortcuts for recently played albums and playlists.
- Improved user experience with import/export settings functionality and toast notifications.

app/components/ihateserverside.tsx

@@ -79,11 +79,9 @@ const Ihateserverside: React.FC<IhateserversideProps> = ({ children }) => {
               <Sidebar
                 playlists={playlists}
                 className="h-full overflow-y-auto"
-                collapsed={true}
                 visible={isSidebarVisible}
                 favoriteAlbums={favoriteAlbums}
-                onToggle={toggleSidebarCollapse}
-                onTransitionEnd={handleTransitionEnd}
+                onRemoveFavoriteAlbum={removeFavoriteAlbum}
               />
             </div>
           )}
@@ -123,11 +121,8 @@ const Ihateserverside: React.FC<IhateserversideProps> = ({ children }) => {
               <Sidebar
                 playlists={playlists}
                 className="h-full overflow-y-auto"
-                collapsed={true}
                 visible={isSidebarVisible}
                 favoriteAlbums={favoriteAlbums}
-                onToggle={toggleSidebarCollapse}
-                onTransitionEnd={handleTransitionEnd}
                 onRemoveFavoriteAlbum={removeFavoriteAlbum}
               />
             </div>