Update TaskQueueTable styling to use styled

evergreen-ci · Feb 28, 2024 · cc054bb · cc054bb
1 parent c94e4af
commit cc054bb
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/src/pages/taskQueue/TaskQueueTable/__snapshots__/TaskQueueTable.stories.storyshot b/src/pages/taskQueue/TaskQueueTable/__snapshots__/TaskQueueTable.stories.storyshot
@@ -6,7 +6,7 @@ exports[`Snapshot Tests TaskQueueTable.stories Default 1`] = `
     class="leafygreen-ui-1a574ai"
   >
     <div
-      class="css-1wf6e6y-StyledTable e1bwwd861 leafygreen-ui-12875ma"
+      class="leafygreen-ui-1xn4uvd e1hj893t1 css-kcblj1-StyledTable-StyledBaseTable e1bwwd861"
       tabindex="0"
     >
       <table

diff --git a/src/pages/taskQueue/TaskQueueTable/index.tsx b/src/pages/taskQueue/TaskQueueTable/index.tsx
@@ -1,7 +1,6 @@
 import { useEffect, useMemo, useRef, useState } from "react";
 import styled from "@emotion/styled";
 import Badge from "@leafygreen-ui/badge";
-import { css } from "@leafygreen-ui/emotion";
 import { LGColumnDef, useLeafyGreenTable } from "@leafygreen-ui/table";
 import { Body, Disclaimer } from "@leafygreen-ui/typography";
 import { useTaskQueueAnalytics } from "analytics";
@@ -62,20 +61,21 @@ const TaskQueueTable: React.FC<TaskQueueTableProps> = ({
   }, [taskId, taskQueue]);
 
   return (
-    <BaseTable
+    <StyledBaseTable
       data-cy="task-queue-table"
       table={table}
       shouldAlternateRowColor
       emptyComponent={<TablePlaceholder message="No tasks found in queue." />}
       ref={tableContainerRef}
       selectedRowIndexes={selectedRowIndexes}
-      className={css`
-        flex-grow: 1;
-      `}
     />
   );
 };
 
+const StyledBaseTable = styled(BaseTable)`
+  flex-grow: 1;
+`;
+
 const TaskCell = styled.div`
   display: flex;
   flex-direction: column;