Merge pull request #58 from AllenInstitute/feature/default-to-past-year-filter

Feature/default to past year filter

Author: aswallace

packages/core/components/FileMetadataSearchBar/test/FileMetadataSearchBar.test.tsx

@@ -7,14 +7,20 @@ import { Provider } from "react-redux";
 import FileMetadataSearchBar, { extractDateFromDateString } from "../";
 import FileFilter from "../../../entity/FileFilter";
 import { AnnotationName, TOP_LEVEL_FILE_ANNOTATIONS } from "../../../constants";
-import { initialState, selection } from "../../../state";
+import { initialState, reducer, reduxLogics, selection } from "../../../state";
 
 describe("<FileMetadataSearchBar />", () => {
     const ENTER_KEY = { keyCode: 13 };
 
-    it("submits default file attribute when input is typed and submitted", async () => {
+    it("submits default file attribute when input is typed and submitted with no filters applied", async () => {
         // Arrange
-        const { actions, logicMiddleware, store } = configureMockStore({ state: initialState });
+        const state = {
+            ...initialState,
+            selection: {
+                filters: [],
+            },
+        };
+        const { actions, logicMiddleware, store } = configureMockStore({ state });
         const { getByRole } = render(
             <Provider store={store}>
                 <FileMetadataSearchBar />
@@ -37,9 +43,34 @@ describe("<FileMetadataSearchBar />", () => {
         ).to.be.true;
     });
 
+    it("renders with past year date filter by default", async () => {
+        const { store } = configureMockStore({ state: initialState });
+        const dateUpper = new Date();
+        const dateLower = new Date();
+        const upperYear = dateUpper.getFullYear();
+        dateLower.setFullYear(upperYear - 1);
+        const upperDateString = dateUpper.toDateString();
+        const lowerDateString = dateLower.toDateString();
+        const { getByText } = render(
+            <Provider store={store}>
+                <FileMetadataSearchBar />
+            </Provider>
+        );
+        const uploadedDisplayName =
+            TOP_LEVEL_FILE_ANNOTATIONS.find((a) => a.name === AnnotationName.UPLOADED)
+                ?.displayName || "";
+        expect(getByText(uploadedDisplayName)).to.not.be.empty;
+        expect(getByText(upperDateString)).to.not.be.empty;
+        expect(getByText(lowerDateString)).to.not.be.empty;
+    });
+
     it("submits newly chosen file attribute when input is typed and submitted", async () => {
         // Arrange
-        const { actions, logicMiddleware, store } = configureMockStore({ state: initialState });
+        const { actions, logicMiddleware, store } = configureMockStore({
+            state: initialState,
+            reducer,
+            logics: reduxLogics,
+        });
         const { getByRole, getByText } = render(
             <Provider store={store}>
                 <FileMetadataSearchBar />
@@ -48,7 +79,7 @@ describe("<FileMetadataSearchBar />", () => {
         const searchQuery = "21304404.czi";
 
         // Act
-        fireEvent.click(getByText("File name"));
+        fireEvent.click(getByText("Uploaded"));
         fireEvent.click(getByText("File ID"));
         fireEvent.change(getByRole("searchbox"), { target: { value: searchQuery } });
         fireEvent.keyDown(getByRole("searchbox"), ENTER_KEY);
@@ -57,7 +88,9 @@ describe("<FileMetadataSearchBar />", () => {
         // Assert
         expect(
             actions.includesMatch(
-                selection.actions.addFileFilter(new FileFilter(AnnotationName.FILE_ID, searchQuery))
+                selection.actions.setFileFilters([
+                    new FileFilter(AnnotationName.FILE_ID, searchQuery),
+                ])
             )
         ).to.be.true;
     });
@@ -129,8 +162,12 @@ describe("<FileMetadataSearchBar />", () => {
 
     it("creates RANGE() file filter of RANGE(day,day+1) when only start date is selected", async () => {
         // Arrange
-        const { actions, logicMiddleware, store } = configureMockStore({ state: initialState });
-        const { getByText } = render(
+        const { actions, logicMiddleware, store } = configureMockStore({
+            state: initialState,
+            reducer,
+            logics: reduxLogics,
+        });
+        const { getByText, getAllByRole, getByRole } = render(
             <Provider store={store}>
                 <FileMetadataSearchBar />
             </Provider>
@@ -147,18 +184,19 @@ describe("<FileMetadataSearchBar />", () => {
         const expectedRange = `RANGE(${startDate.toISOString()},${endDate.toISOString()})`;
 
         // Act
-        fireEvent.click(getByText("File name"));
-        fireEvent.click(getByText("Uploaded"));
+        const dropdownComponent = getAllByRole("combobox").at(0) as HTMLElement;
+        fireEvent.click(dropdownComponent);
+        fireEvent.click(getByRole("option", { name: "Uploaded" }));
         fireEvent.click(getByText("Start of date range"));
         fireEvent.click(getByText(day));
         await logicMiddleware.whenComplete();
 
         // Assert
         expect(
             actions.includesMatch(
-                selection.actions.addFileFilter(
-                    new FileFilter(AnnotationName.UPLOADED, expectedRange)
-                )
+                selection.actions.setFileFilters([
+                    new FileFilter(AnnotationName.UPLOADED, expectedRange),
+                ])
             )
         ).to.be.true;
     });

packages/core/constants/index.ts

@@ -38,17 +38,16 @@ const DATE_LAST_MONTH = new Date(BEGINNING_OF_TODAY);
 DATE_LAST_MONTH.setMonth(BEGINNING_OF_TODAY.getMonth() - 1);
 const DATE_LAST_WEEK = new Date(BEGINNING_OF_TODAY);
 DATE_LAST_WEEK.setDate(BEGINNING_OF_TODAY.getDate() - 7);
+export const PAST_YEAR_FILTER = new FileFilter(
+    AnnotationName.UPLOADED,
+    `RANGE(${DATE_LAST_YEAR.toISOString()},${END_OF_TODAY.toISOString()})`
+);
 export const RELATIVE_DATE_RANGES = [
     {
         name: "Uploaded in last year",
         description:
             "This will automatically filter files down to those uploaded within the last year",
-        filters: [
-            new FileFilter(
-                AnnotationName.UPLOADED,
-                `RANGE(${DATE_LAST_YEAR.toISOString()},${END_OF_TODAY.toISOString()})`
-            ),
-        ],
+        filters: [PAST_YEAR_FILTER],
         hierarchy: undefined,
         sort: undefined,
     },

packages/core/state/selection/reducer.ts

@@ -2,7 +2,7 @@ import { makeReducer } from "@aics/redux-utils";
 import { castArray, difference, omit, without } from "lodash";
 
 import interaction from "../interaction";
-import { AnnotationName } from "../../constants";
+import { AnnotationName, PAST_YEAR_FILTER } from "../../constants";
 import Annotation from "../../entity/Annotation";
 import FileFilter from "../../entity/FileFilter";
 import FileFolder from "../../entity/FileFolder";
@@ -58,7 +58,7 @@ export const initialState = {
     },
     displayAnnotations: [],
     fileSelection: new FileSelection(),
-    filters: [],
+    filters: [PAST_YEAR_FILTER],
     openFileFolders: [],
     shouldDisplaySmallFont: false,
     sortColumn: new FileSort(AnnotationName.UPLOADED, SortOrder.DESC),

packages/core/state/selection/test/logics.test.ts

@@ -794,6 +794,7 @@ describe("Selection logics", () => {
                 logics: selectionLogics,
                 state: initialState,
             });
+            const currentFilters = initialState.selection.filters;
 
             // act
             const filter = new FileFilter("foo", 2);
@@ -804,7 +805,7 @@ describe("Selection logics", () => {
             expect(
                 actions.includes({
                     type: SET_FILE_FILTERS,
-                    payload: [filter],
+                    payload: [filter, ...currentFilters],
                 })
             ).to.equal(true);
         });