Update showDivider to to remmove style components warning

future-standard · Dec 21, 2024 · 1dd767d · 1dd767d
1 parent 286d5ad
commit 1dd767d
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/packages/ui-lib/src/Layouts/atoms/UtilityHeaderBack.tsx b/packages/ui-lib/src/Layouts/atoms/UtilityHeaderBack.tsx
@@ -10,15 +10,15 @@ const BackLinkIcon = styled.div`
   height: 16px;
   justify-content: center;
   align-items: center;
-  flex: 1;  
+  flex: 1;
   > div {
     display: flex;
     justify-content: center;
     align-items: center;
   }
 `;
 
-const BackLink = styled(Link)<{$iconInGutter: boolean, showDivider: boolean}>`
+const BackLink = styled(Link)<{$iconInGutter: boolean, $showDivider: boolean}>`
   position: relative;
   display: flex;
   padding: 0;
@@ -42,7 +42,7 @@ const BackLink = styled(Link)<{$iconInGutter: boolean, showDivider: boolean}>`
       transition: stroke 0.25s ease;
     }
   }
-  
+
   &:hover {
     color: var(--grey-12);
     ${BackLinkIcon}{
@@ -52,7 +52,7 @@ const BackLink = styled(Link)<{$iconInGutter: boolean, showDivider: boolean}>`
     }
   }
 
-  ${({showDivider}) => showDivider && css`
+  ${({$showDivider}) => $showDivider && css`
     &::after {
       content: '';
       display: inline-block;
@@ -66,14 +66,14 @@ const BackLink = styled(Link)<{$iconInGutter: boolean, showDivider: boolean}>`
 
 interface IUtilityHeaderLinkBackInstance extends IUtilityHeaderLinkBack {
   $iconInGutter: boolean;
-  showDivider: boolean;
+  $showDivider: boolean;
 }
 
-const UtilityHeaderBack : React.FC<IUtilityHeaderLinkBackInstance> = ({show = true, link, label = 'Back', showDivider, $iconInGutter}) => {
+const UtilityHeaderBack : React.FC<IUtilityHeaderLinkBackInstance> = ({show = true, link, label = 'Back', $showDivider, $iconInGutter}) => {
   if(!show){ return null; }
 
   return (
-    <BackLink to={link} {...{showDivider, $iconInGutter}}>
+    <BackLink to={link} {...{$showDivider, $iconInGutter}}>
       <BackLinkIcon>
         <Icon icon="Back" size={16} color="grey-10" />
       </BackLinkIcon>

diff --git a/packages/ui-lib/src/Layouts/molecules/UtilityHeader.tsx b/packages/ui-lib/src/Layouts/molecules/UtilityHeader.tsx
@@ -93,7 +93,7 @@ const UtilityHeader : React.FC<IUtilityHeader> = ({ showBreadcrumbs = true, brea
   return (
     <Container>
     <LeftArea>
-      {back && <UtilityHeaderBack showDivider={hasBreadcrumbs} {...{$iconInGutter}} {...back} />}
+      {back && <UtilityHeaderBack $showDivider={hasBreadcrumbs} {...{$iconInGutter}} {...back} />}
       {hasBreadcrumbs ?
         <Breadcrumbs>
           { breadcrumbs.map((breadcrumb, index) => {