@griddo/ax 1.72.0 → 1.72.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@griddo/ax",
   "description": "Griddo Author Experience",
-  "version": "1.72.0",
+  "version": "1.72.1",
   "authors": [
     "Álvaro Sánchez' <alvaro.sanches@secuoyas.com>",
     "Carlos Torres <carlos.torres@secuoyas.com>",
@@ -226,5 +226,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "ef3ebfb004be74e3879ed3ca27bc661cfc562433"
+  "gitHead": "29a2e695f2b1a46ee994dcc93bf7dae93c470c06"
 }

package/src/__tests__/components/SubNav/SubNav.test.tsx

@@ -0,0 +1,37 @@
+import * as React from "react";
+
+import { ThemeProvider } from "styled-components";
+import { mock } from "jest-mock-extended";
+import { render, screen, cleanup } from "@testing-library/react";
+import { parseTheme } from "@ax/helpers";
+
+import SubNav, { ISubNavProps } from "@ax/components/SubNav";
+import globalTheme from "@ax/themes/theme.json";
+
+afterEach(cleanup);
+
+const defaultProps = mock<ISubNavProps>();
+
+describe("SubNav component rendering", () => {
+  it("should render the component's wrapper", () => {
+    render(
+      <ThemeProvider theme={parseTheme(globalTheme)}>
+        <SubNav {...defaultProps} />
+      </ThemeProvider>
+    );
+
+    const subNavWrapper = screen.getByTestId("sub-nav-wrapper");
+    expect(subNavWrapper).toBeTruthy();
+  });
+
+  it("should render the component", () => {
+    render(
+      <ThemeProvider theme={parseTheme(globalTheme)}>
+        <SubNav {...defaultProps} />
+      </ThemeProvider>
+    );
+
+    const subNav = screen.getByTestId("sub-nav");
+    expect(subNav).toBeTruthy();
+  });
+});

package/src/__tests__/components/TableCounter/TableCounter.test.tsx

@@ -0,0 +1,51 @@
+import React from "react";
+
+import { ThemeProvider } from "styled-components";
+import { render, screen, cleanup } from "@testing-library/react";
+
+import { parseTheme } from "@ax/helpers";
+import globalTheme from "@ax/themes/theme.json";
+import TableCounter, { ITableCounter } from "@ax/components/TableCounter";
+
+afterEach(cleanup);
+
+const props: ITableCounter = {
+  totalItems: 0,
+};
+
+describe("TableCounter component", () => {
+  test("should render the component", () => {
+    render(
+      <ThemeProvider theme={parseTheme(globalTheme)}>
+        <TableCounter {...props} />
+      </ThemeProvider>
+    );
+
+    const tableCounter = screen.getAllByTestId("table-counter");
+    expect(tableCounter).toBeTruthy();
+  });
+
+  test("should render the total items value", () => {
+    const defaultProps = { totalItems: 0 };
+
+    render(
+      <ThemeProvider theme={parseTheme(globalTheme)}>
+        <TableCounter {...defaultProps} />
+      </ThemeProvider>
+    );
+    const tableCounter = screen.getByTestId("table-counter");
+    expect(tableCounter.textContent).toEqual("0 results");
+  });
+
+  test("should render results label in singular when totalItems equal 1", () => {
+    const defaultProps = { totalItems: 1 };
+
+    render(
+      <ThemeProvider theme={parseTheme(globalTheme)}>
+        <TableCounter {...defaultProps} />
+      </ThemeProvider>
+    );
+    const tableCounter = screen.getByTestId("table-counter");
+    expect(tableCounter.textContent).toEqual("1 result");
+  });
+});

package/src/__tests__/components/TableFilters/LiveFilter/LiveFilter.test.tsx

@@ -1,12 +1,13 @@
 import * as React from "react";
+
 import axios from "axios";
 import { ThemeProvider } from "styled-components";
 import { CalledWithMock, mock } from "jest-mock-extended";
 import { render, screen, cleanup, act, fireEvent } from "@testing-library/react";
-import { parseTheme } from "@ax/helpers";
 
-import LiveFilter, { ILiveFilterProps } from "@ax/components/TableFilters/LiveFilter";
+import { parseTheme } from "@ax/helpers";
 import globalTheme from "@ax/themes/theme.json";
+import LiveFilter, { ILiveFilterProps } from "@ax/components/TableFilters/LiveFilter";
 
 afterEach(cleanup);
 jest.mock("axios");

package/src/__tests__/components/TableFilters/NameFilter/NameFilter.test.tsx

@@ -6,7 +6,6 @@ import { CalledWithMock, mock } from "jest-mock-extended";
 import { render, screen, cleanup, fireEvent } from "@testing-library/react";
 
 import { parseTheme } from "@ax/helpers";
-
 import globalTheme from "@ax/themes/theme.json";
 import NameFilter, { INameFilterProps } from "@ax/components/TableFilters/NameFilter";
 

package/src/__tests__/components/TableFilters/SiteFilter/SiteFilter.test.tsx

@@ -1,10 +1,11 @@
 import * as React from "react";
 import axios from "axios";
+
 import { ThemeProvider } from "styled-components";
 import { CalledWithMock, mock } from "jest-mock-extended";
 import { render, screen, cleanup, act, fireEvent } from "@testing-library/react";
-import { parseTheme } from "@ax/helpers";
 
+import { parseTheme } from "@ax/helpers";
 import SiteFilter, { ISiteFilterProps } from "@ax/components/TableFilters/SiteFilter";
 import globalTheme from "@ax/themes/theme.json";
 

package/src/__tests__/components/TableFilters/StatusFilter/StatusFilter.test.tsx

@@ -2,11 +2,9 @@ import * as React from "react";
 
 import { ThemeProvider } from "styled-components";
 import { CalledWithMock, mock } from "jest-mock-extended";
-
 import { render, screen, cleanup, fireEvent } from "@testing-library/react";
 
 import { parseTheme } from "@ax/helpers";
-
 import globalTheme from "@ax/themes/theme.json";
 import StatusFilter, { IStatusFilterProps } from "@ax/components/TableFilters/StatusFilter";
 

package/src/__tests__/components/TableFilters/TypeFilter/TypeFilter.test.tsx

@@ -1,8 +1,9 @@
 import * as React from "react";
+
 import { ThemeProvider } from "styled-components";
 import { CalledWithMock, mock } from "jest-mock-extended";
-
 import { render, screen, cleanup, fireEvent } from "@testing-library/react";
+
 import TypeFilter, { ITypeFilterProps } from "@ax/components/TableFilters/TypeFilter";
 import globalTheme from "@ax/themes/theme.json";
 import { parseTheme } from "@ax/helpers";

package/src/components/SubNav/index.tsx

@@ -4,13 +4,13 @@ import * as S from "./style";
 
 const SubNav = ({ children }: ISubNavProps): JSX.Element => {
   return (
-    <S.Wrapper>
-      <S.SubNav>{children}</S.SubNav>
+    <S.Wrapper data-testid="sub-nav-wrapper">
+      <S.SubNav data-testid="sub-nav">{children}</S.SubNav>
     </S.Wrapper>
   );
 };
 
-interface ISubNavProps {
+export interface ISubNavProps {
   children: any;
 }
 

package/src/components/SubNav/style.tsx

@@ -25,6 +25,4 @@ const SubNav = styled.div`
   }
 `;
 
-const Item = styled.article``;
-
-export { Wrapper, SubNav, Item };
+export { Wrapper, SubNav };

package/src/components/TableCounter/index.tsx

@@ -2,9 +2,14 @@ import React from "react";
 
 import * as S from "./style";
 
-const TableCounter = (props: any) => {
+const TableCounter = (props: ITableCounter) => {
   const { totalItems } = props;
-  return (<S.ResultsCount>{`${totalItems} results`}</S.ResultsCount>)
+  const resultsLabel = totalItems === 1 ? "result" : "results";
+  return <S.ResultsCount data-testid="table-counter">{`${totalItems} ${resultsLabel}`}</S.ResultsCount>;
 };
 
+export interface ITableCounter {
+  totalItems: number;
+}
+
 export default TableCounter;