fix missing border in container el

icgc-argo · Jan 16, 2024 · 7a2dcb6 · 7a2dcb6
1 parent beec11d
commit 7a2dcb6
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/src/Table/index.tsx b/src/Table/index.tsx
@@ -122,7 +122,11 @@ export const Table = <TData extends object>({
 
   return (
     <TableContainer className={className}>
-      <TableContainerInner withFilters={withFilters} withTabs={withTabs}>
+      <TableContainerInner
+        withFilters={withFilters}
+        withTabs={withTabs}
+        withSideBorders={withSideBorders}
+      >
         <TableStyled withSideBorders={withSideBorders}>
           {withHeaders && (
             <TableHead>

diff --git a/src/Table/styled.tsx b/src/Table/styled.tsx
@@ -90,14 +90,20 @@ export const TableContainer = styled(TableContainerComp, {
 `;
 
 const TableContainerInnerComp = (
-  props: React.PropsWithChildren<{ className?: string; withFilters?: boolean; withTabs?: boolean }>,
+  props: React.PropsWithChildren<{
+    className?: string;
+    withFilters?: boolean;
+    withTabs?: boolean;
+    withSideBorders?: boolean;
+  }>,
 ) => <div {...props} className={clsx(TABLE_CLASSES.TABLE_CONTAINER_INNER, props.className)} />;
 export const TableContainerInner = styled(TableContainerInnerComp, {
   shouldForwardProp: (prop) => isPropValid(prop),
 })`
   width: 100%;
   max-width: 100%;
   overflow-x: auto;
+  ${(props) => props.withSideBorders && `border-right: 1px solid ${colors.grey_2}`};
   ${(props) =>
     props.withFilters &&
     `