Fix testing errors

app/components/Alert/Alert.container.tsx

@@ -50,9 +50,11 @@ const AlertContainer = memo<AlertProps>(
                 ? "var(--color-border-invert-negative-primary)"
                 : undefined,
             titleColor: "text-[var(--color-content-invert-negative-primary)]",
-            descriptionColor: "text-[var(--color-content-invert-negative-primary)]",
+            descriptionColor:
+              "text-[var(--color-content-invert-negative-primary)]",
             iconColor: "var(--color-red-red500)",
-            closeButtonColor: "text-[var(--color-content-invert-negative-primary)]",
+            closeButtonColor:
+              "text-[var(--color-content-invert-negative-primary)]",
             closeButtonIconColor: "var(--color-content-invert-primary)",
           };
         default:

app/components/Alert/Alert.types.ts

@@ -1,5 +1,3 @@
-import type { ReactNode } from "react";
-
 export interface AlertProps {
   title: string;
   description?: string;

app/components/Alert/Alert.view.tsx

@@ -1,11 +1,10 @@
-import { getAssetPath, ASSETS } from "../../lib/assetUtils";
 import type { AlertViewProps } from "./Alert.types";
 
 export function AlertView({
   title,
   description,
-  status,
+  status: _status,
-  type,
+  type: _type,
   className,
   containerClasses,
   containerStyle,
@@ -55,32 +54,32 @@ export function AlertView({
         className={closeButtonClasses}
         aria-label="Close alert"
       >
-          <svg
+        <svg
+          width="20"
+          height="20"
+          viewBox="0 0 20 20"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <mask
+            id="mask0_21296_8285"
+            style={{ maskType: "alpha" }}
+            maskUnits="userSpaceOnUse"
+            x="0"
+            y="0"
             width="20"
             height="20"
-            viewBox="0 0 20 20"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
           >
-            <mask
+            <rect width="20" height="20" fill="#D9D9D9" />
-              id="mask0_21296_8285"
+          </mask>
-              style={{ maskType: "alpha" }}
+          <g mask="url(#mask0_21296_8285)">
-              maskUnits="userSpaceOnUse"
+            <path
-              x="0"
+              d="M5.33327 15.5448L4.45508 14.6666L9.12174 9.99993L4.45508 5.33327L5.33327 4.45508L9.99993 9.12174L14.6666 4.45508L15.5448 5.33327L10.8781 9.99993L15.5448 14.6666L14.6666 15.5448L9.99993 10.8781L5.33327 15.5448Z"
-              y="0"
+              fill={closeButtonIconColor}
-              width="20"
+            />
-              height="20"
+          </g>
-            >
+        </svg>
-              <rect width="20" height="20" fill="#D9D9D9" />
+      </button>
-            </mask>
-            <g mask="url(#mask0_21296_8285)">
-              <path
-                d="M5.33327 15.5448L4.45508 14.6666L9.12174 9.99993L4.45508 5.33327L5.33327 4.45508L9.99993 9.12174L14.6666 4.45508L15.5448 5.33327L10.8781 9.99993L15.5448 14.6666L14.6666 15.5448L9.99993 10.8781L5.33327 15.5448Z"
-                fill={closeButtonIconColor}
-              />
-            </g>
-          </svg>
-        </button>
     </div>
   );
 }

app/components/Tooltip/Tooltip.container.tsx

@@ -5,13 +5,7 @@ import { TooltipView } from "./Tooltip.view";
 import type { TooltipProps } from "./Tooltip.types";
 
 const TooltipContainer = memo<TooltipProps>(
-  ({
+  ({ children, text, position = "top", className = "", disabled = false }) => {
-    children,
-    text,
-    position = "top",
-    className = "",
-    disabled = false,
-  }) => {
     const [isVisible, setIsVisible] = useState(false);
 
     if (disabled) {
@@ -29,8 +23,6 @@ const TooltipContainer = memo<TooltipProps>(
       position === "top" ? "bottom-[-7px]" : "top-[-7px]"
     } left-1/2 -translate-x-1/2`;
 
-    const tooltipId = `tooltip-${text.replace(/\s+/g, "-").toLowerCase()}`;
-
     return (
       <div
         className={`relative inline-block ${className}`}

app/components/Tooltip/Tooltip.view.tsx

@@ -3,7 +3,7 @@ import type { TooltipViewProps } from "./Tooltip.types";
 export function TooltipView({
   text,
   position,
-  className,
+  className: _className,
   tooltipClasses,
   pointerClasses,
 }: TooltipViewProps) {

lib/assetUtils.ts

@@ -59,7 +59,7 @@ export const ASSETS = {
   // Alert icons
   ICON_ALERT: "assets/Icon_Alert.svg",
   ICON_CLOSE: "assets/Icon_Close.svg",
-  
+
   // Tooltip icons
   ICON_POINTER: "assets/Icon_Pointer.svg",
 } as const;

stories/Alert.stories.js

@@ -35,7 +35,8 @@ const Template = (args) => {
 export const Default = Template.bind({});
 Default.args = {
   title: "Short alert banner message goes here",
-  description: "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
+  description:
+    "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
   status: "default",
   type: "toast",
 };
@@ -43,7 +44,8 @@ Default.args = {
 export const Positive = Template.bind({});
 Positive.args = {
   title: "Short alert banner message goes here",
-  description: "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
+  description:
+    "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
   status: "positive",
   type: "toast",
 };
@@ -51,7 +53,8 @@ Positive.args = {
 export const Warning = Template.bind({});
 Warning.args = {
   title: "Short alert banner message goes here",
-  description: "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
+  description:
+    "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
   status: "warning",
   type: "toast",
 };
@@ -59,7 +62,8 @@ Warning.args = {
 export const Danger = Template.bind({});
 Danger.args = {
   title: "Short alert banner message goes here",
-  description: "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
+  description:
+    "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
   status: "danger",
   type: "toast",
 };
@@ -67,7 +71,8 @@ Danger.args = {
 export const Banner = Template.bind({});
 Banner.args = {
   title: "Short alert banner message goes here",
-  description: "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
+  description:
+    "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
   status: "default",
   type: "banner",
 };
@@ -75,7 +80,8 @@ Banner.args = {
 export const BannerPositive = Template.bind({});
 BannerPositive.args = {
   title: "Short alert banner message goes here",
-  description: "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
+  description:
+    "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
   status: "positive",
   type: "banner",
 };
@@ -83,7 +89,8 @@ BannerPositive.args = {
 export const BannerWarning = Template.bind({});
 BannerWarning.args = {
   title: "Short alert banner message goes here",
-  description: "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
+  description:
+    "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
   status: "warning",
   type: "banner",
 };
@@ -91,7 +98,8 @@ BannerWarning.args = {
 export const BannerDanger = Template.bind({});
 BannerDanger.args = {
   title: "Short alert banner message goes here",
-  description: "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
+  description:
+    "Nascetur ipsum a nisi tempor cras nam neque volutpat. Aliquam id est faucibus nunc quis. Eleifend suspendisse.",
   status: "danger",
   type: "banner",
 };