🧪 test(table-filters): add more tests

src/__tests__/_/api-handlers/config.ts

@@ -76,6 +76,7 @@ const CONFIG_VALUES = {
     primaryDark: `#111111`,
   },
   disabled_entities: ["disabled-entity-1", "disabled-entity-2"],
+  menu_entities_order: [],
   disabled_menu_entities: ["entity-3"],
 };
 

src/__tests__/_/forCodeCoverage.spec.ts

@@ -36,9 +36,11 @@ import { FOR_CODE_COV as $36 } from "shared/types/storage";
 import { FOR_CODE_COV as $37 } from "frontend/views/Dashboard/Widget/_manage/types";
 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 $40 } from "frontend/lib/data/useMutate/types";
 import { FOR_CODE_COV as $41 } from "frontend/design-system/components/Form/_types";
 import { FOR_CODE_COV as $42 } from "backend/menu/types";
+import { FOR_CODE_COV as $43 } from "frontend/lib/form/types";
+import { FOR_CODE_COV as $44 } from "frontend/design-system/components/Table/filters/types";
 
 import { noop } from "shared/lib/noop";
 
@@ -83,7 +85,9 @@ noop(
   $39,
   $40,
   $41,
-  $42
+  $42,
+  $43,
+  $44
 );
 
 describe("Code coverage ignores plain types file", () => {

src/__tests__/admin/index.spec.tsx

@@ -69,7 +69,7 @@ describe("pages/admin", () => {
 
     expect(await getTableRows(widget)).toMatchInlineSnapshot(`
       [
-        "nameage",
+        "NameAge",
         "John6",
         "Jane5",
       ]

src/__tests__/admin/settings/menu.spec.tsx

@@ -8,7 +8,7 @@ import { setupApiHandlers } from "__tests__/_/setupApihandlers";
 
 setupApiHandlers();
 
-describe.skip("pages/admin/settings/menu", () => {
+describe("pages/admin/settings/menu", () => {
   beforeAll(() => {
     const useRouter = jest.spyOn(require("next/router"), "useRouter");
     useRouter.mockImplementation(() => ({
@@ -68,12 +68,12 @@ describe.skip("pages/admin/settings/menu", () => {
     );
 
     await userEvent.click(
-      screen.getByRole("button", { name: "Save Menu Entities Settings" })
+      screen.getByRole("button", { name: "Save Menu Settings" })
     );
 
     expect(
       await screen.findByRole("status", {}, { timeout: 20000 })
-    ).toHaveTextContent("Menu Entities Settings Saved Successfully");
+    ).toHaveTextContent("Menu Settings Saved Successfully");
   });
 
   it("should display updated entities state", async () => {

src/__tests__/admin/settings/theme.spec.tsx

@@ -124,7 +124,7 @@ describe("pages/admin/settings/theme", () => {
     );
   });
 
-  it("should display not update the other scheme color", async () => {
+  it("should not display the other scheme color", async () => {
     render(
       <ApplicationRoot>
         <ThemeSettings />

src/bin/index.ts

@@ -1,7 +1,7 @@
 /* eslint-disable no-console */
 import * as randomstring from "randomstring";
 import { checkNodeVersion } from "./checkNodeVersion";
-// TODO test this compiles well
+
 (async () => {
   const path = require("path");
   const fs = require("fs-extra");

src/frontend/design-system/components/EmptyWrapper/Stories.tsx

@@ -21,11 +21,6 @@ const Template: Story<IProps> = (args) => (
 export const Default = Template.bind({});
 Default.args = {};
 
-export const NoIcon = Template.bind({});
-NoIcon.args = {
-  hideIcon: true,
-};
-
 export const WithChildren = Template.bind({});
 WithChildren.args = {
   children: (

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

@@ -6,7 +6,6 @@ import { Typo } from "frontend/design-system/primitives/Typo";
 
 export interface IProps {
   text: string;
-  hideIcon?: true;
   children?: ReactNode;
 }
 
@@ -18,12 +17,10 @@ const Root = styled.div`
   background: ${USE_ROOT_COLOR("base-color")};
 `;
 
-export function EmptyWrapper({ text, hideIcon, children }: IProps) {
+export function EmptyWrapper({ text, children }: IProps) {
   return (
     <Root>
-      {hideIcon ? null : (
-        <Droplet size={50} color={USE_ROOT_COLOR("muted-text")} />
-      )}
+      <Droplet size={50} color={USE_ROOT_COLOR("muted-text")} />
       <br />
       <br />
       <Typo.MD color="muted"> {text} </Typo.MD>

src/frontend/design-system/components/Form/FormSelect/Simple.tsx

@@ -10,6 +10,7 @@ interface ISimpleSelect {
   value: number | string;
   fullWidth?: boolean;
   sm?: true;
+  ariaLabel?: string;
 }
 
 const SimpleSelectStyled = styled(Input)<{ fullWidth?: boolean }>`
@@ -33,10 +34,12 @@ export function SimpleSelect({
   value,
   fullWidth,
   sm,
+  ariaLabel,
 }: ISimpleSelect) {
   return (
     <SimpleSelectStyled
       as="select"
+      aria-label={ariaLabel}
       value={value}
       sm={sm}
       fullWidth={fullWidth}

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

@@ -22,12 +22,14 @@ interface IFormMultiSelect {
   selectData: ISelectData[];
   values: string[];
   onChange: (values: string[]) => void;
+  ariaLabel?: string;
 }
 
 export function FormMultiSelect({
   selectData,
   values = [],
   onChange,
+  ariaLabel,
 }: IFormMultiSelect) {
   return (
     <SelectStyled
@@ -41,6 +43,7 @@ export function FormMultiSelect({
       onChange={(newValues: any) => {
         onChange(newValues.map(({ value }: ISelectData) => value));
       }}
+      aria-label={ariaLabel}
       options={selectData}
     />
   );

src/frontend/design-system/components/SortList/SortList.spec.tsx

@@ -29,7 +29,7 @@ jest.mock("react-easy-sort", () => ({
   ),
 }));
 
-describe.skip("SortList", () => {
+describe("SortList", () => {
   it("should render labels if present else value", () => {
     render(
       <SortList

src/frontend/design-system/components/Table/filters/Boolean.tsx

@@ -17,6 +17,7 @@ export function FilterTableByBooleans({
           value: value === "" ? undefined : value === "true",
         });
       }}
+      ariaLabel="Select Boolean"
       fullWidth
       value={
         // eslint-disable-next-line no-nested-ternary

src/frontend/design-system/components/Table/filters/IdField.tsx

@@ -12,7 +12,7 @@ export function FilterTableByIdField({
       onChange={(e: React.BaseSyntheticEvent) => {
         setFilter({
           ...filterValue,
-          value: e.target.value || undefined,
+          value: e.target.value,
         });
       }}
       placeholder="Enter value"

src/frontend/design-system/components/Table/filters/Number.tsx

@@ -16,9 +16,10 @@ export function FilterTableByNumbers({
         onChange={(e) =>
           setFilter({
             ...filterValue,
-            value: +e.target.value || undefined,
+            value: +e.target.value,
           })
         }
+        aria-label="Value 1"
       />
       {filterValue?.operator === FilterOperators.BETWEEN && (
         <>
@@ -30,9 +31,10 @@ export function FilterTableByNumbers({
             onChange={(e) =>
               setFilter({
                 ...filterValue,
-                value2: +e.target.value || undefined,
+                value2: +e.target.value,
               })
             }
+            aria-label="Value 2"
           />
         </>
       )}

src/frontend/design-system/components/Table/filters/Status.tsx

@@ -13,6 +13,7 @@ export function FilterTableByStatus({
       <FormMultiSelect
         selectData={bag}
         values={filterValue?.value || []}
+        ariaLabel="Select Status"
         onChange={(value) => {
           setFilter({
             ...filterValue,

src/frontend/design-system/components/Table/filters/Text.tsx

@@ -12,7 +12,7 @@ export function FilterTableByText({
       onChange={(e: React.BaseSyntheticEvent) => {
         setFilter({
           ...filterValue,
-          value: e.target.value || undefined,
+          value: e.target.value,
         });
       }}
       placeholder="Search"

src/frontend/design-system/components/Table/filters/_FilterOperator.tsx

@@ -44,11 +44,12 @@ export function RenderFilterOperator<T>({
             label: FILTER_OPERATOR_LABELS[operator],
           })),
         ]}
+        ariaLabel="Select Filter Operator"
         fullWidth
         onChange={(value) => {
           setFilter({
             ...filterValue,
-            operator: (value as FilterOperators) || undefined,
+            operator: value as FilterOperators,
           });
         }}
         value={filterValue?.operator || ""}