fix(unused-variables): remove unused variables

ZeynalliZeynal · Jan 21, 2025 · b1ce808 · b1ce808
1 parent c63646f
commit b1ce808
Show file tree

Hide file tree

Showing 4 changed files with 68 additions and 28 deletions.
diff --git a/app/(geist)/geist/dropdown-menu/_sections/dropdown-menu-default.tsx b/app/(geist)/geist/dropdown-menu/_sections/dropdown-menu-default.tsx
@@ -8,29 +8,73 @@ import {
 } from '@/components/ui/primitives/popper';
 import { PopperSeparator } from '@/components/ui/primitives/popper/popper-separator';
 import { PopperGroup } from '@/components/ui/primitives/popper/popper-group';
+import { useState } from 'react';
+import Spinner from '@/components/ui/spinner';
+import { PiShootingStar } from 'react-icons/pi';
+import { TbMailCog } from 'react-icons/tb';
+import {
+  IoGridOutline,
+  IoPeopleOutline,
+  IoStatsChartOutline,
+} from 'react-icons/io5';
+import { LuLayoutDashboard } from 'react-icons/lu';
 
 export default function DropdownMenuDefault() {
+  const [isPending, setIsPending] = useState(false);
+
   return (
     <section className="p-12">
       <div className="flex items-center justify-between p-6 bg-background-100">
         <Popper>
           <PopperTrigger>Open</PopperTrigger>
-          <PopperContent className="mt-3">
+          <PopperContent className="mt-3" align="start">
             <PopperItem
+              disabled={isPending}
               onClick={async () => {
+                setIsPending(true);
                 await new Promise((resolve) => setTimeout(resolve, 2000));
-                console.log(true);
+                setIsPending(false);
               }}
+              className="justify-between"
             >
-              One
+              <span className="flex items-center gap-2">
+                <TbMailCog />
+                Update Email
+              </span>
+              {isPending && <Spinner />}
+            </PopperItem>
+            <PopperItem disabled>
+              <span className="flex items-center gap-2">
+                <IoGridOutline />
+                Grid View
+              </span>
+            </PopperItem>
+            <PopperItem>
+              <span className="flex items-center gap-2">
+                <IoPeopleOutline />
+                New Organization
+              </span>
+            </PopperItem>
+            <PopperItem>
+              <span className="flex items-center gap-2">
+                <IoStatsChartOutline />
+                Stats
+              </span>
+            </PopperItem>
+            <PopperItem>
+              <span className="flex items-center gap-2">
+                <LuLayoutDashboard />
+                Dashboard
+              </span>
             </PopperItem>
-            <PopperItem disabled>Two</PopperItem>
-            <PopperItem>One</PopperItem>
-            <PopperItem>Two</PopperItem>
-            <PopperItem>One</PopperItem>
             <PopperSeparator />
             <PopperGroup>
-              <PopperItem>Two</PopperItem>
+              <PopperItem className="focus:bg-amber-100/75 focus:ring-1 ring-amber-500">
+                <span className="flex items-center gap-2">
+                  <PiShootingStar className="text-amber-900" />
+                  Upgrade
+                </span>
+              </PopperItem>
             </PopperGroup>
           </PopperContent>
         </Popper>

diff --git a/components/ui/primitives/popper/popper-group.tsx b/components/ui/primitives/popper/popper-group.tsx
@@ -2,19 +2,19 @@
 
 import React from 'react';
 import { cn } from '@/utils/lib';
-import { PopperGroupProps } from '@/components/ui/primitives/popper/popper.types';
 
-export const PopperGroup = React.forwardRef<HTMLDivElement, PopperGroupProps>(
-  (props, ref) => {
-    return (
-      <div
-        ref={ref}
-        role="group"
-        aria-orientation="horizontal"
-        className={cn(props.className)}
-        {...props}
-      />
-    );
-  },
-);
+export const PopperGroup = React.forwardRef<
+  HTMLDivElement,
+  ComponentProps<'div'>
+>((props, ref) => {
+  return (
+    <div
+      ref={ref}
+      role="group"
+      aria-orientation="horizontal"
+      className={cn(props.className)}
+      {...props}
+    />
+  );
+});
 PopperGroup.displayName = 'PopperGroup';
diff --git a/components/ui/primitives/popper/popper-separator.tsx b/components/ui/primitives/popper/popper-separator.tsx
@@ -1,12 +1,11 @@
 'use client';
 
-import React from 'react';
-import { PopperSeparatorProps } from '@/components/ui/primitives/popper/popper.types';
+import React, { ComponentProps } from 'react';
 import { cn } from '@/utils/lib';
 
 export const PopperSeparator = React.forwardRef<
   HTMLDivElement,
-  PopperSeparatorProps
+  ComponentProps<'div'>
 >((props, ref) => {
   return (
     <div

diff --git a/components/ui/primitives/popper/popper.types.ts b/components/ui/primitives/popper/popper.types.ts
@@ -36,6 +36,3 @@ export interface PopperItemProps extends ComponentProps<'div'> {
   disabled?: boolean;
   asChild?: boolean;
 }
-
-export interface PopperSeparatorProps extends ComponentProps<'div'> {}
-export interface PopperGroupProps extends ComponentProps<'div'> {}