cleanup: remove obsolete commented-out code (Cleanup 9)

- AuthView: Removed commented imports and JSX for non-existent EmailVerification/ResetPasswordForm components (functionality handled by separate pages)
- SettingsView: Removed commented useTheme hook
- CheckoutView: Removed commented total calculation
- LazyComponent: Removed commented ErrorBoundary import
- ImageCropper: Removed commented alternative import (already using correct import)
- EditPlaylistModal: Removed commented isCollaborative state
- ExploreView: Removed commented GENRES array
- Preserved: Documentation comments, explanatory comments, TODO comments
- Cleanup 9: Complete (7 files cleaned)

apps/web/src/components/library/playlists/EditPlaylistModal.tsx

@@ -22,7 +22,6 @@ export const EditPlaylistModal: React.FC<EditPlaylistModalProps> = ({
   const [name, setName] = useState(playlist.title);
   const [description, setDescription] = useState(playlist.description || '');
   const [isPublic, setIsPublic] = useState(playlist.is_public ?? true);
-  // const [isCollaborative, setIsCollaborative] = useState(playlist.isCollaborative ?? false);
   const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
 
   const handleSubmit = () => {

apps/web/src/components/social/ExploreView.tsx

@@ -27,15 +27,6 @@ interface ExploreItem {
   author: string;
 }
 
-// const GENRES = [
-//     { name: 'Synthwave', color: 'from-pink-500 to-purple-600' },
-//     { name: 'Techno', color: 'from-kodo-steel to-black' },
-//     { name: 'Ambient', color: 'from-blue-400 to-teal-500' },
-//     { name: 'Lo-Fi', color: 'from-orange-300 to-red-400' },
-//     { name: 'Drum & Bass', color: 'from-yellow-400 to-orange-600' },
-//     { name: 'House', color: 'from-indigo-500 to-kodo-cyan' },
-// ];
-
 export const ExploreView: React.FC = () => {
   const { addToast } = useToast();
   const [activeTab, setActiveTab] = useState<

apps/web/src/components/ui/LazyComponent.tsx

@@ -6,7 +6,6 @@ import {
   type ErrorInfo,
 } from 'react';
 import { LoadingSpinner } from './loading-spinner';
-// import { ErrorBoundary } from '@/components/ErrorBoundary';
 import { logger } from '@/utils/logger';
 import { Button } from './button';
 import { AlertTriangle, RefreshCw } from 'lucide-react';

apps/web/src/components/views/AuthView.tsx

@@ -1,9 +1,7 @@
 import React, { useState } from 'react';
 import { LoginForm } from '@/features/auth/components/LoginForm';
 import { RegisterForm } from '@/features/auth/components/RegisterForm';
-// import { EmailVerification } from '@/features/auth/components/EmailVerification';
 import { ForgotPasswordForm } from '@/features/auth/components/ForgotPasswordForm';
-// import { ResetPasswordForm } from '@/features/auth/components/ResetPasswordForm';
 import { TwoFactorVerify } from '@/features/auth/components/TwoFactorVerify';
 import { useAuth } from '@/context/AuthContext';
 
@@ -16,7 +14,6 @@ type AuthStep =
 
 export const AuthView: React.FC = () => {
   useAuth();
-  // const { login, register } = useAuth();
   const [currentStep, setCurrentStep] = useState<AuthStep>('LOGIN');
   const [show2FA, setShow2FA] = useState(false);
   const [_pendingCredentials, _setPendingCredentials] = useState<any>(null);
@@ -48,9 +45,6 @@ export const AuthView: React.FC = () => {
       )}
 
       {currentStep === 'VERIFY_EMAIL' && (
-        // <EmailVerification
-        //   onSuccess={() => setCurrentStep('LOGIN')}
-        // />
         <div className="text-center p-4">
           Email Verification Component Placeholder
         </div>
@@ -65,9 +59,6 @@ export const AuthView: React.FC = () => {
       )}
 
       {currentStep === 'RESET_PASSWORD' && (
-        // <ResetPasswordForm
-        //   onSuccess={() => setCurrentStep('LOGIN')}
-        // />
         <div className="text-center p-4">
           Reset Password Component Placeholder
         </div>

apps/web/src/components/views/CheckoutView.tsx

@@ -22,7 +22,6 @@ export const CheckoutView: React.FC<CheckoutViewProps> = ({
   const [loading, setLoading] = useState(false);
 
   const tax = cartTotal * 0.08;
-  // const total = cartTotal + tax; // Calculated but not strictly needed for the API call in this mock
 
   const [form, setForm] = useState({
     fullName: '',

apps/web/src/components/views/SettingsView.tsx

@@ -33,7 +33,6 @@ interface SettingsViewProps {
 export const SettingsView: React.FC<SettingsViewProps> = ({
   initialTab = 'profile',
 }) => {
-  // const { theme, setTheme } = useTheme();
   const { addToast: _addToast } = useToast();
   const [activeTab, setActiveTab] = useState(initialTab);