♻️ refactor(components): nuke more dead components

src/__tests__/_/forCodeCoverage.spec.ts

@@ -37,6 +37,7 @@ import { FOR_CODE_COV as $37 } from "frontend/views/Dashboard/Widget/_manage/typ
 import { FOR_CODE_COV as $38 } from "shared/types/dashboard/types";
 import { FOR_CODE_COV as $39 } from "shared/types/dashboard/base";
 import { FOR_CODE_COV as $40 } from "frontend/design-system/layouts/types";
+import { FOR_CODE_COV as $41 } from "frontend/design-system/components/Form/_types";
 import { noop } from "shared/lib/noop";
 
 noop(
@@ -78,7 +79,8 @@ noop(
   $37,
   $38,
   $39,
-  $40
+  $40,
+  $41
 );
 
 describe("Code coverage ignores plain types file", () => {

src/frontend/components/FEPaginationTable/useFEPagination.ts

@@ -1,5 +1,4 @@
 import { useQuery, UseQueryResult } from "react-query";
-import get from "lodash/get";
 import {
   FieldQueryFilter,
   FilterOperators,
@@ -32,7 +31,7 @@ export function useFEPagination<T>(
             return dataState.filters.every(($filter) => {
               const filter = $filter as unknown as FieldQueryFilter;
               const filterValue = filter.value.value;
-              const currentValue = get(datum, filter.id);
+              const currentValue = datum[filter.id];
               if (!filterValue) {
                 return true;
               }
@@ -61,9 +60,10 @@ export function useFEPagination<T>(
 
         if (dataState.sortBy && dataState.sortBy.length > 0) {
           const { id, desc } = dataState.sortBy[0];
+
           returnData = returnData.sort((a, b) => {
-            const value1 = get(desc ? b : a, id);
-            const value2 = get(desc ? a : b, id);
+            const value1 = (desc ? b : a)[id];
+            const value2 = (desc ? a : b)[id];
             if (typeof value1 === "number") {
               return compareNumbers(value1, value2);
             }

src/frontend/design-system/components/ComponentIsLoading/index.tsx

@@ -2,8 +2,6 @@ import * as React from "react";
 import styled, { keyframes } from "styled-components";
 import { USE_ROOT_COLOR } from "frontend/design-system/theme/root";
 
-const DELAY_MS = 500;
-
 const ldsRippleAnimation = keyframes`
 0% {
   top: 36px;
@@ -50,17 +48,3 @@ export function ComponentIsLoading() {
     </div>
   );
 }
-
-export function DelayedComponentIsLoading() {
-  const [show, setShow] = React.useState(false);
-  React.useEffect(() => {
-    const timeout = setTimeout(() => setShow(true), DELAY_MS);
-    return () => {
-      clearTimeout(timeout);
-    };
-  }, []);
-  if (!show) {
-    return null;
-  }
-  return <ComponentIsLoading />;
-}

src/frontend/design-system/components/Form/FormSelect/Async/index.tsx

@@ -26,6 +26,7 @@ export const StyledSelect = styled(AsyncSelect)`
   ${SelectStyles}
 `;
 
+// TODO move to useDebounce
 const debouncedSearch = debounce(
   async (
     inputValue: string,

src/frontend/design-system/components/Form/_types.ts

@@ -13,3 +13,5 @@ export interface ISharedFormInput {
     action: () => void;
   }[];
 }
+
+export const FOR_CODE_COV = 1;