[WEB-5785]fix: favorites icon size #8449

Author: vamsikrishnamathala

apps/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine";
 import type {
   DragLocationHistory,
@@ -18,8 +18,6 @@ import { ChevronRightIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@plane/propel/tooltip";
 import type { IFavorite } from "@plane/types";
-// constants
-
 // helpers
 import { cn } from "@plane/utils";
 // hooks
@@ -31,6 +29,7 @@ import { FavoriteRoot } from "./favorite-items";
 import type { TargetData } from "./favorites.helpers";
 import { getInstructionFromPayload } from "./favorites.helpers";
 import { NewFavoriteFolder } from "./new-fav-folder";
+import { IconButton } from "@plane/propel/icon-button";
 
 export const SidebarFavoritesMenu = observer(function SidebarFavoritesMenu() {
   // states
@@ -111,6 +110,7 @@ export const SidebarFavoritesMenu = observer(function SidebarFavoritesMenu() {
           title: t("success"),
           message: t("favorite_removed_successfully"),
         });
+        return;
       })
       .catch(() => {
         setToast({
@@ -201,17 +201,16 @@ export const SidebarFavoritesMenu = observer(function SidebarFavoritesMenu() {
           </Disclosure.Button>
           <div className="flex items-center opacity-0 pointer-events-none group-hover/favorites-button:opacity-100 group-hover/favorites-button:pointer-events-auto">
             <Tooltip tooltipHeading={t("create_folder")} tooltipContent="">
-              <button
-                type="button"
-                className="p-0.5 rounded-sm hover:bg-layer-transparent-hover flex-shrink-0 grid place-items-center"
+              <IconButton
+                variant="ghost"
+                size="sm"
                 onClick={() => {
                   setCreateNewFolder(true);
                   if (!isFavoriteMenuOpen) toggleFavoriteMenu(!isFavoriteMenuOpen);
                 }}
                 aria-label={t("aria_labels.projects_sidebar.create_favorites_folder")}
-              >
-                <FolderPlus className="size-3" />
-              </button>
+                icon={FolderPlus}
+              />
             </Tooltip>
             <Disclosure.Button
               as="button"

apps/web/core/components/workspace/sidebar/favorites/new-fav-folder.tsx

@@ -72,6 +72,7 @@ export const NewFavoriteFolder = observer(function NewFavoriteFolder(props: TPro
           title: t("success"),
           message: t("favorite_created_successfully"),
         });
+        return;
       })
       .catch(() => {
         setToast({
@@ -110,6 +111,7 @@ export const NewFavoriteFolder = observer(function NewFavoriteFolder(props: TPro
           title: t("success"),
           message: t("favorite_updated_successfully"),
         });
+        return;
       })
       .catch(() => {
         setToast({
@@ -131,7 +133,7 @@ export const NewFavoriteFolder = observer(function NewFavoriteFolder(props: TPro
   });
   return (
     <div className="flex items-center gap-1.5 py-[1px] px-2" ref={ref}>
-      <FavoriteFolderIcon className="w-[16px]" />
+      <FavoriteFolderIcon className="size-4" />
       <form onSubmit={handleSubmit(actionType === "create" ? handleAddNewFolder : handleRenameFolder)}>
         <Controller
           name="name"