componenets standardization 1

frontend/src/components/ecommerce/MonthlySalesChart.tsx

@@ -4,6 +4,7 @@ import { Dropdown } from "../ui/dropdown/Dropdown";
 import { DropdownItem } from "../ui/dropdown/DropdownItem";
 import { MoreDotIcon } from "../../icons";
 import { useState } from "react";
+import IconButton from "../ui/button/IconButton";
 
 export default function MonthlySalesChart() {
   const options: ApexOptions = {
@@ -107,9 +108,9 @@ export default function MonthlySalesChart() {
           Monthly Sales
         </h3>
         <div className="relative inline-block">
-          <button className="dropdown-toggle" onClick={toggleDropdown}>
+          <IconButton variant="ghost" size="sm" onClick={toggleDropdown} aria-label="More options">
             <MoreDotIcon className="text-gray-400 hover:text-gray-700 dark:hover:text-gray-300 size-6" />
-          </button>
+          </IconButton>
           <Dropdown
             isOpen={isOpen}
             onClose={closeDropdown}