feat: [PROD-14973] eslint fix

Author: arianber7

src/stories/atoms/StatusBar/StatusBar.stories.js

@@ -1,24 +1,24 @@
-import React from "react";
-import { StatusBar } from "../../../components";
+import React from 'react';
+import { StatusBar } from '../../../components';
 
 export default {
-  title: "Atoms/StatusBar",
+  title: 'Atoms/StatusBar',
   component: StatusBar,
-  tags: ["autodocs"],
+  tags: ['autodocs'],
   parameters: {
-    layout: "centered",
+    layout: 'centered',
   },
   argTypes: {
     status: {
-      control: "select",
-      options: ["valid", "invalid", "edited", "prerun", "locked"],
+      control: 'select',
+      options: ['valid', 'invalid', 'edited', 'prerun', 'locked'],
     },
     size: {
-      control: "select",
-      options: ["small", "medium", "full"],
+      control: 'select',
+      options: ['small', 'medium', 'full'],
     },
-    message: { control: "text" },
-    tooltip: { control: "text" },
+    message: { control: 'text' },
+    tooltip: { control: 'text' },
   },
 };
 
@@ -29,17 +29,17 @@ const Template = (args) => <StatusBar {...args} />;
 
 export const Default = Template.bind({});
 Default.args = {
-  status: "prerun",
-  size: "medium",
-  message: "",
-  tooltip: "Additional information",
+  status: 'prerun',
+  size: 'medium',
+  message: '',
+  tooltip: 'Additional information',
 };
 
 // -------------------------------------------------------------
 // Status Variants (medium size)
 // -------------------------------------------------------------
 export const StatusVariants = () => (
-  <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
+  <div style={{ display: 'flex', flexDirection: 'column', gap: 16 }}>
     <StatusBar status="valid" size="medium" tooltip="Everything looks good" />
     <StatusBar status="invalid" size="medium" tooltip="Something is wrong" />
     <StatusBar status="edited" size="medium" tooltip="You modified this" />
@@ -52,23 +52,18 @@ export const StatusVariants = () => (
 // Size Variants (using 'prerun')
 // -------------------------------------------------------------
 export const SizeVariants = () => (
-  <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
+  <div style={{ display: 'flex', flexDirection: 'column', gap: 16 }}>
     <StatusBar status="prerun" size="small" tooltip="Small size" />
     <StatusBar status="prerun" size="medium" tooltip="Medium size" />
-    <StatusBar
-      status="prerun"
-      size="full"
-      tooltip="Full width"
-      message="This scenario has not been run yet."
-    />
+    <StatusBar status="prerun" size="full" tooltip="Full width" message="This scenario has not been run yet." />
   </div>
 );
 
 // -------------------------------------------------------------
 // Full-width Examples per Status
 // -------------------------------------------------------------
 export const FullWidthVariants = () => (
-  <div style={{ display: "flex", flexDirection: "column", gap: 16, width: 400 }}>
+  <div style={{ display: 'flex', flexDirection: 'column', gap: 16, width: 400 }}>
     <StatusBar status="valid" size="full" message="Everything is validated." />
     <StatusBar status="invalid" size="full" message="Scenario contains errors." />
     <StatusBar status="edited" size="full" message="Changes were made." />
@@ -83,33 +78,26 @@ export const FullWidthVariants = () => (
 export const StatusSizeMatrix = () => (
   <div
     style={{
-      display: "grid",
-      gridTemplateColumns: "repeat(4, auto)",
+      display: 'grid',
+      gridTemplateColumns: 'repeat(4, auto)',
       gap: 20,
-      alignItems: "center",
+      alignItems: 'center',
     }}
   >
     <strong>Status</strong>
     <strong>Small</strong>
     <strong>Medium</strong>
     <strong>Full</strong>
 
-    {["valid", "invalid", "edited", "prerun", "locked"].map((status) => (
+    {['valid', 'invalid', 'edited', 'prerun', 'locked'].map((status) => (
       <React.Fragment key={status}>
-        <div style={{ textTransform: "capitalize", fontWeight: 600 }}>
-          {status}
-        </div>
+        <div style={{ textTransform: 'capitalize', fontWeight: 600 }}>{status}</div>
 
         <StatusBar status={status} size="small" tooltip="Small" />
 
         <StatusBar status={status} size="medium" tooltip="Medium" />
 
-        <StatusBar
-          status={status}
-          size="full"
-          message={`${status} full-width example`}
-          tooltip="Full width"
-        />
+        <StatusBar status={status} size="full" message={`${status} full-width example`} tooltip="Full width" />
       </React.Fragment>
     ))}
   </div>
@@ -119,9 +107,5 @@ export const StatusSizeMatrix = () => (
 // Tooltip Example (Hover Demo)
 // -------------------------------------------------------------
 export const TooltipDemo = () => (
-  <StatusBar
-    status="edited"
-    size="medium"
-    tooltip="Hover the (?) icon to see the tooltip"
-  />
+  <StatusBar status="edited" size="medium" tooltip="Hover the (?) icon to see the tooltip" />
 );