fixed few lint errors

src/app/MainProvider.tsx

@@ -1,10 +1,10 @@
-'use client'
-import React, { ReactNode } from 'react'
-import { Appbar } from '@/components/Appbar'
-import MainSidebar from '@/components/MainSidebar'
-import { mainSideBarToggle } from '@/store/atoms/mainSidebar'
-import { useRecoilState, useRecoilValue } from 'recoil'
-import { useSession } from 'next-auth/react'
+'use client';
+import React, { ReactNode } from 'react';
+import { Appbar } from '@/components/Appbar';
+import MainSidebar from '@/components/MainSidebar';
+import { mainSideBarToggle } from '@/store/atoms/mainSidebar';
+import { useRecoilState, useRecoilValue } from 'recoil';
+import { useSession } from 'next-auth/react';
 // import Topbar from '@/components/Topbar'
 
 
@@ -28,7 +28,7 @@ export default function MainProvider({ children }: { children: ReactNode }) {
                     )}
                     {(session && session?.user && !isLoading) && <MainSidebar />}
 
-                    <div className={`flex flex-col w-full ${isMainSideBarCompressed ? ` ${(session && session?.user && !isLoading) ? 'md:w-[calc(100vw-4rem)]':'w-full'}` : 'md:w-[calc(100vw-15rem)]'} `}>
+                    <div className={`flex flex-col w-full ${isMainSideBarCompressed ? ` ${(session && session?.user && !isLoading) ? 'md:w-[calc(100vw-4rem)]' : 'w-full'}` : 'md:w-[calc(100vw-15rem)]'} `}>
                         {/* <Topbar /> */}
                         <Appbar />
                         <div className='!h-[calc(100vh-4rem)] w-full overflow-y-auto'>

src/app/payout-methods/page.tsx

@@ -2,23 +2,23 @@
 import { useEffect, useState } from "react";
 import { Button } from "@/components/ui/button";
 import NewPayoutDialog from "@/components/NewPayoutDialog";
-import { Trash } from "lucide-react"
+import { Trash } from "lucide-react";
 import { deleteSolanaAddress, deleteUpiId, getPayoutMethods } from "@/actions/payoutMethods";
 import { SolanaAddress, UpiId } from "@prisma/client";
 import { useAction } from "@/hooks/useAction";
 import { toast } from "sonner";
 
 export default function Page() {
 
-    const [isDialogBoxOpen, setIsDialogBoxOpen] = useState<boolean>(false)
-    const [btnClicked, setBtnClicked] = useState<string>("")
+    const [isDialogBoxOpen, setIsDialogBoxOpen] = useState<boolean>(false);
+    const [btnClicked, setBtnClicked] = useState<string>("");
 
     const openDialog = (e: any) => {
-        setIsDialogBoxOpen(true)
-        setBtnClicked(e.target.id)
+        setIsDialogBoxOpen(true);
+        setBtnClicked(e.target.id);
     }
 
-    const closeDialog = () => setIsDialogBoxOpen(false)
+    const closeDialog = () => setIsDialogBoxOpen(false);
 
     const [upiAddresses, setUpiAddresses] = useState<UpiId[] | undefined>([])
     const [solanaAddresses, setSolanaAddresses] = useState<SolanaAddress[] | undefined>([])

src/components/CircularProgressBar.tsx

@@ -35,7 +35,7 @@ export function CircularProgressBar({ percentage = 91 }) {
         <RadialBarChart
           data={chartData}
           startAngle={90}
-          endAngle={endAngle == 0 ? 450 : endAngle}
+          endAngle={endAngle === 0 ? 450 : endAngle}
           innerRadius={28}
           outerRadius={40}
         >

src/components/ContentCard.tsx

@@ -1,10 +1,10 @@
-import { CheckCircle2 } from 'lucide-react';
-import PercentageComplete from './PercentageComplete';
+// import { CheckCircle2 } from 'lucide-react';
+// import PercentageComplete from './PercentageComplete';
 import { Bookmark } from '@prisma/client';
 import BookmarkButton from './bookmark/BookmarkButton';
 import { formatTime } from '@/lib/utils';
 import VideoThumbnail from './videothumbnail';
-import CardComponent from './CardComponent';
+// import CardComponent from './CardComponent';
 import CardThumbnail from './CardThumbnail';
 import { CircularProgressBar } from './CircularProgressBar';
 

src/components/FolderView.tsx

@@ -2,7 +2,7 @@
 import { useRouter } from 'next/navigation';
 import { ContentCard } from './ContentCard';
 import { Bookmark } from '@prisma/client';
-import { useRecoilState } from 'recoil';
+import { useRecoilValue } from 'recoil';
 import { sidebarOpen as sidebarOpenAtom } from '@/store/atoms/sidebar';
 import { mainSideBarToggle } from '@/store/atoms/mainSidebar';
 
@@ -41,8 +41,8 @@ export const FolderView = ({
   }
   // why? because we have to reset the segments or they will be visible always after a video
 
-  const [sidebarOpen, setSidebarOpen] = useRecoilState(sidebarOpenAtom);
-  const [isMainSideBarCompressed, setIsMainSideBarCompressed] = useRecoilState(mainSideBarToggle);
+  const sidebarOpen = useRecoilValue(sidebarOpenAtom);
+  const isMainSideBarCompressed = useRecoilValue(mainSideBarToggle);
 
 
   return (

src/components/MainSidebar.tsx

@@ -1,22 +1,21 @@
-'use client'
-import React, { useEffect, useState } from 'react'
-import Logo from './landing/logo/logo'
-import { Bookmark, Files, FileStack, HelpCircle, History, LogOut, MessageSquare, PanelLeftOpen, PanelRightOpen } from 'lucide-react'
-import Link from 'next/link'
-import Image from 'next/image'
-import { usePathname, useRouter } from 'next/navigation'
-import { signOut, useSession } from 'next-auth/react'
-import { useRecoilState } from 'recoil'
-import { mainSideBarToggle } from '@/store/atoms/mainSidebar'
-import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './ui/tooltip'
+'use client';
+import React, { useEffect, useState } from 'react';
+import Logo from './landing/logo/logo';
+import { Bookmark, Files, FileStack, HelpCircle, History, LogOut, MessageSquare, PanelLeftOpen, PanelRightOpen } from 'lucide-react';
+import Link from 'next/link';
+// import Image from 'next/image';
+import { usePathname, useRouter } from 'next/navigation';
+import { signOut, useSession } from 'next-auth/react';
+import { useRecoilState } from 'recoil';
+import { mainSideBarToggle } from '@/store/atoms/mainSidebar';
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './ui/tooltip';
 
 interface ActiveItem {
     general: number | null;
     others: number | null;
 }
 
 export default function MainSidebar() {
-
     const pathName = usePathname();
     const [activeItems, setActiveItems] = useState<ActiveItem>({
         general: null,

src/components/Sidebar.tsx

@@ -246,34 +246,34 @@ export function ToggleButton({
   );
 }
 
-function GoBackButton() {
-  const router = useRouter();
+// function GoBackButton() {
+//   const router = useRouter();
 
-  const goBack = () => {
-    const pathSegments = window.location.pathname.split('/');
+//   const goBack = () => {
+//     const pathSegments = window.location.pathname.split('/');
 
-    // Remove the last segment of the path
-    pathSegments.pop();
+//     // Remove the last segment of the path
+//     pathSegments.pop();
 
-    // Check if it's the last page in the course, then go to root
-    if (pathSegments.length <= 2) {
-      router.push('/');
-    } else {
-      const newPath = pathSegments.join('/');
-      router.push(newPath);
-    }
-  };
+//     // Check if it's the last page in the course, then go to root
+//     if (pathSegments.length <= 2) {
+//       router.push('/');
+//     } else {
+//       const newPath = pathSegments.join('/');
+//       router.push(newPath);
+//     }
+//   };
 
-  return (
-    <div className="w-full p-2">
-      {/* Your component content */}
-      <Button size={'full'} onClick={goBack} className="group rounded-full">
-        <BackArrow className="h-5 w-5 transition-all duration-200 ease-in-out group-hover:-translate-x-1 rtl:rotate-180" />{' '}
-        <div className="pl-4">Go Back</div>
-      </Button>
-    </div>
-  );
-}
+//   return (
+//     <div className="w-full p-2">
+//       {/* Your component content */}
+//       <Button size={'full'} onClick={goBack} className="group rounded-full">
+//         <BackArrow className="h-5 w-5 transition-all duration-200 ease-in-out group-hover:-translate-x-1 rtl:rotate-180" />{' '}
+//         <div className="pl-4">Go Back</div>
+//       </Button>
+//     </div>
+//   );
+// }
 
 function VideoIcon() {
   return (

src/components/SidebarToggle.tsx

@@ -1,6 +1,6 @@
-'use client'
-import React from 'react'
-import { ToggleButton } from './Sidebar';
+'use client';
+import React from 'react';
+// import { ToggleButton } from './Sidebar';
 import { usePathname } from 'next/navigation';
 import { useRecoilState } from 'recoil';
 import { sidebarOpen as sidebarOpenAtom } from '../store/atoms/sidebar';

src/components/ThemeToggler.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { Moon, SunDimIcon, SunMoonIcon } from 'lucide-react';
+import { Moon, SunDimIcon } from 'lucide-react';
 import { useTheme } from 'next-themes';
 import { Button } from './ui/button';
 

src/components/admin/ContentRendererClient.tsx

@@ -5,7 +5,7 @@ import { VideoPlayerSegment } from '@/components/VideoPlayerSegment';
 import VideoContentChapters from '../VideoContentChapters';
 import { useMemo, useState } from 'react';
 import { handleMarkAsCompleted } from '@/lib/utils';
-import { Check, ChevronLast, Milestone, Presentation, X } from "lucide-react"
+import { Check, ChevronLast, Milestone, Presentation, X } from "lucide-react";
 
 export const ContentRendererClient = ({
   metadata,
@@ -89,7 +89,7 @@ export const ContentRendererClient = ({
     setLoadingMarkAs(false);
   };
 
-  const neitherChapterNorNext = !(metadata.segments?.length > 0) && !nextContent
+  const neitherChapterNorNext = !(metadata.segments?.length > 0) && !nextContent;
 
   return (
     <div className="flex flex-col items-start gap-2 semi:flex-row">

src/components/profile-menu/ProfileDropdown.tsx

@@ -23,21 +23,21 @@ import { SelectTheme } from './SelectTheme';
 
 const ProfileDropdown = () => {
   const menuItemLinks = [
-    {
-      href: '/history',
-      icon: <HistoryIcon className="mr-2 h-4 w-4" />,
-      label: 'Watch History',
-    },
-    {
-      href: '/bookmarks',
-      icon: <BookmarkIcon className="mr-2 h-4 w-4" />,
-      label: 'Bookmarks',
-    },
-    {
-      href: '/questions',
-      icon: <Bird className="mr-2 h-4 w-4" />,
-      label: 'Questions',
-    },
+    // {
+    //   href: '/history',
+    //   icon: <HistoryIcon className="mr-2 h-4 w-4" />,
+    //   label: 'Watch History',
+    // },
+    // {
+    //   href: '/bookmarks',
+    //   icon: <BookmarkIcon className="mr-2 h-4 w-4" />,
+    //   label: 'Bookmarks',
+    // },
+    // {
+    //   href: '/questions',
+    //   icon: <Bird className="mr-2 h-4 w-4" />,
+    //   label: 'Questions',
+    // },
     {
       href: '/payout-methods',
       icon: <CreditCard className="mr-2 h-4 w-4" />,
@@ -53,7 +53,7 @@ const ProfileDropdown = () => {
         </div>
       </DropdownMenuTrigger>
       <DropdownMenuContent className="mr-3 mt-2 w-56 shadow-2xl">
-        {/* <DropdownMenuGroup>
+        <DropdownMenuGroup>
           {menuItemLinks.map(({ href, label, icon }) => (
             <Link href={href} key={href}>
               <DropdownMenuItem>
@@ -64,7 +64,7 @@ const ProfileDropdown = () => {
           ))}
         </DropdownMenuGroup>
 
-        <DropdownMenuSeparator /> */}
+        <DropdownMenuSeparator />
 
         {/* <DropdownMenuGroup>
           <SelectTheme />

src/components/videothumbnail.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import VideoPreview from '@/actions/videopreview/videoPreview';
 import { useEffect } from 'react';
-import CardComponent from './CardComponent';
+// import CardComponent from './CardComponent';
 import CardThumbnail from './CardThumbnail';
 
 const VideoThumbnail = ({