Remove: <a> tags

components/Categories/Categories.tsx

@@ -1,67 +1,76 @@
-import LinkTag from 'next/link';
+import LinkTag from "next/link";
 
-import styles from '../../styles/home/categories.module.scss';
-import { Category } from '../../types';
+import styles from "../../styles/home/categories.module.scss";
+import { Category } from "../../types";
 
-import EditSVG from '../../public/icons/edit.svg';
-import RemoveSVG from '../../public/icons/remove.svg';
+import EditSVG from "../../public/icons/edit.svg";
+import RemoveSVG from "../../public/icons/remove.svg";
 
 interface CategoriesProps {
-    categories: Category[];
-    categoryActive: Category;
-    handleSelectCategory: (category: Category) => void;
+  categories: Category[];
+  categoryActive: Category;
+  handleSelectCategory: (category: Category) => void;
 }
-export default function Categories({ categories, categoryActive, handleSelectCategory }: CategoriesProps) {
-    return (
-        <div className={`${styles['block-wrapper']} ${styles['categories']}`}>
-            <h4>Catégories</h4>
-            <ul className={styles['items']}>
-                {categories.map((category, key) => (
-                    <CategoryItem
-                        category={category}
-                        categoryActive={categoryActive}
-                        handleSelectCategory={handleSelectCategory}
-                        key={key}
-                    />
-                ))}
-            </ul>
-        </div>
-    )
+export default function Categories({
+  categories,
+  categoryActive,
+  handleSelectCategory,
+}: CategoriesProps) {
+  return (
+    <div className={`${styles["block-wrapper"]} ${styles["categories"]}`}>
+      <h4>Catégories</h4>
+      <ul className={styles["items"]}>
+        {categories.map((category, key) => (
+          <CategoryItem
+            category={category}
+            categoryActive={categoryActive}
+            handleSelectCategory={handleSelectCategory}
+            key={key}
+          />
+        ))}
+      </ul>
+    </div>
+  );
 }
 
 interface CategoryItemProps {
-    category: Category;
-    categoryActive: Category;
-    handleSelectCategory: (category: Category) => void;
+  category: Category;
+  categoryActive: Category;
+  handleSelectCategory: (category: Category) => void;
 }
-function CategoryItem({ category, categoryActive, handleSelectCategory }: CategoryItemProps): JSX.Element {
-    const className = `${styles['item']} ${category.id === categoryActive.id ? styles['active'] : ''}`;
-    const onClick = () => handleSelectCategory(category);
+function CategoryItem({
+  category,
+  categoryActive,
+  handleSelectCategory,
+}: CategoryItemProps): JSX.Element {
+  const className = `${styles["item"]} ${
+    category.id === categoryActive.id ? styles["active"] : ""
+  }`;
+  const onClick = () => handleSelectCategory(category);
 
-    return (
-        <li className={className} onClick={onClick}>
-            <div className={styles['content']}>
-                <span className={styles['name']}>{category.name}</span>
-                <span className={styles['links-count']}>— {category.links.length}</span>
-            </div>
-            <MenuOptions id={category.id} />
-        </li>
-    )
+  return (
+    <li className={className} onClick={onClick}>
+      <div className={styles["content"]}>
+        <span className={styles["name"]}>{category.name}</span>
+        <span className={styles["links-count"]}>— {category.links.length}</span>
+      </div>
+      <MenuOptions id={category.id} />
+    </li>
+  );
 }
 
-function MenuOptions({ id }: { id: number; }): JSX.Element {
-    return (
-        <div className={styles['menu-item']}>
-            <LinkTag href={`/category/edit/${id}`}>
-                <a className={styles['option-edit']}>
-                    <EditSVG />
-                </a>
-            </LinkTag>
-            <LinkTag href={`/category/remove/${id}`}>
-                <a className={styles['option-remove']}>
-                    <RemoveSVG />
-                </a>
-            </LinkTag>
-        </div>
-    )
-}
+function MenuOptions({ id }: { id: number }): JSX.Element {
+  return (
+    <div className={styles["menu-item"]}>
+      <LinkTag href={`/category/edit/${id}`} className={styles["option-edit"]}>
+        <EditSVG />
+      </LinkTag>
+      <LinkTag
+        href={`/category/remove/${id}`}
+        className={styles["option-remove"]}
+      >
+        <RemoveSVG />
+      </LinkTag>
+    </div>
+  );
+}