#21

src/Pages/Categories/View/Add/AttributeTab/TabsContainer.tsx

@@ -2,19 +2,17 @@
 import React, { useEffect, useState } from 'react';
 import { Tabs, Space } from 'antd';
 import { CopyOutlined } from '@ant-design/icons';
-import { toast } from 'react-toastify';
 import {  FormikValues, useFormikContext } from 'formik';
 import { useTranslation } from 'react-i18next';
-import { AttributeTabs } from './AttributeTabs';
 import { AttributeTabs  as AddAttributeTabs} from '../../Add/AttributeTab/AttributeTabs';
+import { MdOutlineDeleteOutline } from 'react-icons/md';
 
-const { TabPane } = Tabs;
 
 export const TabsContainer: React.FC = () => {
   const [activeKey, setActiveKey] = useState('1');
   const { setFieldValue } = useFormikContext();
   const formikContext = useFormikContext<FormikValues>();
-  const { values, handleChange } = formikContext;
+  const { values } = formikContext;
   const [width, setWidth] = useState(window.innerWidth);  
   const [t] = useTranslation()
 
@@ -127,9 +125,11 @@ const tabPosition = width > 1000 ? 'left' : 'top';
      activeKey={activeKey}
      onEdit={(targetKey: any, action) => (action === 'add' ? handleAdd() : handleRemove(targetKey))}
      tabPosition={tabPosition}
+     removeIcon={<MdOutlineDeleteOutline size={20}/>}
+
      items={items.map((item: any) => ({
       label:   <Space>{t(`${item.label}`)} <CopyOutlined onClick={() => handleDuplicate(item.key)} /></Space>,
-      //  children: item?.Add  ?  <AddAttributeTabs  tabKey={item.key} /> : <AttributeTabs  tabKey={item.key} />,
+      
       children:  <AddAttributeTabs  tabKey={item.key}/>,
 
        key: item.key,

src/Pages/Categories/View/Add/AttributeValueTab/TabsContainer.tsx

@@ -6,6 +6,7 @@ import { toast } from 'react-toastify';
 import {  FormikValues, useFormikContext } from 'formik';
 import { useTranslation } from 'react-i18next';
 import { AttributeValueTabs } from './AttributeTabs';
+import { MdOutlineDeleteOutline } from 'react-icons/md';
 
 const { TabPane } = Tabs;
 
@@ -105,6 +106,8 @@ const tabPosition ='top';
       activeKey={activeKey}
       onEdit={(targetKey:any, action) => (action === 'add' ? handleAdd() : handleRemove(targetKey))}
       tabPosition={tabPosition}
+      removeIcon={<MdOutlineDeleteOutline size={20}/>}
+
 
     >
       {items.map((item :any) =>{

src/Pages/Categories/View/Edit/AttributeTab/TabsContainer.tsx

@@ -1,10 +1,11 @@
 // TabsContainer.tsx
 import React, { useEffect, useState } from 'react';
 import { Tabs, Space } from 'antd';
-import { CopyOutlined } from '@ant-design/icons';
+import { CopyOutlined, DeleteFilled } from '@ant-design/icons';
 import {  FormikValues, useFormikContext } from 'formik';
 import { useTranslation } from 'react-i18next';
 import { AttributeTabs  as AddAttributeTabs} from '../../Add/AttributeTab/AttributeTabs';
+import { MdOutlineDeleteOutline } from 'react-icons/md';
 
 
 
@@ -131,6 +132,7 @@ const tabPosition = width > 1000 ? 'left' : 'top';
      activeKey={activeKey}
      onEdit={(targetKey: any, action) => (action === 'add' ? handleAdd() : handleRemove(targetKey))}
      tabPosition={tabPosition}
+     removeIcon={<MdOutlineDeleteOutline size={20}/>}
      items={items.map((item: any) => ({
       label:   <Space>{t(`${item.label}`)} <CopyOutlined onClick={() => handleDuplicate(item.key)} /></Space>,
       //  children: item?.Add  ?  <AddAttributeTabs  tabKey={item.key} /> : <AttributeTabs  tabKey={item.key} />,

src/Pages/Categories/View/Edit/AttributeValueTab/TabsContainer.tsx

@@ -8,6 +8,7 @@ import { useTranslation } from 'react-i18next';
 import { AttributeValueTabs } from './AttributeTabs';
 
 import { AttributeValueTabs as AddAttributeValueTabs } from '../../Add/AttributeValueTab/AttributeTabs';
+import { MdOutlineDeleteOutline } from 'react-icons/md';
 
 export const TabsContainer = ({ parentKey }: any) => {
   const [activeKey, setActiveKey] = useState('1');
@@ -123,6 +124,8 @@ const initialItemShape: any = {
       activeKey={activeKey}
       onEdit={(targetKey: any, action) => (action === 'add' ? handleAdd() : handleRemove(targetKey))}
       tabPosition={tabPosition}
+      removeIcon={<MdOutlineDeleteOutline size={20}/>}
+
       items={
       items.map((item: any) => ({
         label: <Space>{t(`${item.label}`)} <CopyOutlined onClick={() => handleDuplicate(item.key)} /></Space>,

src/Pages/Products/View/FormikTab/TabsContainer.tsx

@@ -8,6 +8,7 @@ import { useTranslation } from 'react-i18next';
 import { useProductVarianState } from '../../../../lib/state mangment/Pages/Products';
 import { VariableTabs } from './VariableTabs';
 import { log } from 'console';
+import { MdOutlineDeleteOutline } from 'react-icons/md';
 
 const { TabPane } = Tabs;
 
@@ -137,6 +138,8 @@ export const TabsContainer: React.FC = () => {
         activeKey={activeKey}
         onEdit={(targetKey: any, action) => (action === 'add' ? handleAdd() : handleRemove(targetKey))}
         tabPosition={tabPosition}
+        removeIcon={<MdOutlineDeleteOutline size={20}/>}
+
         items={
           items.map((item: any) => ({
             label: <Space>{t(`${item.label}`)} <CopyOutlined onClick={() => handleDuplicate(item.key)} /></Space>,