add reset filter button and changed behaviour of input for full-text search

src/assets/styles/components/_files.scss

@@ -60,6 +60,10 @@
   margin-left: 0px;
 }
 
+.reset-filters{
+  margin-left: 30px;
+}
+
 .filesPage {
   align-self: flex-start;
 }

src/i18n/resources/en.js

@@ -226,6 +226,7 @@ export default {
     category: "Category",
     creationDate: "Creation date",
     advancedTechnologies: "Advanced technologies",
+    resetFilters:"Reset filters"
   },
   candidates: {
     candidates: "Candidates",

src/i18n/resources/rs.js

@@ -263,6 +263,7 @@ export default {
     category: "Kategorija",
     creationDate: "Datum kreiranja",
     advancedTechnologies: "Napredne tehnologije",
+    resetFilters:"Resetuj filtere"
   },
   candidates: {
     candidates: "Kandidati",

src/pages/FilesPage/FileTable.js

@@ -11,6 +11,7 @@ import {
   getFilesReq,
   setContent,
   updateFileReq,
+  resetFilters
 } from "../../store/actions/files/fileActions";
 import { Fade, Pagination } from "@mui/material";
 import FilterButton from "../../components/Button/FilterButton";
@@ -156,11 +157,7 @@ const FileTable = ({ trigger }) => {
   };
 
   const handleKeyDown = (event) => {
-    if (
-      event.key === "Enter" &&
-      filters.content !== "" &&
-      filters.content !== undefined
-    ) {
+    if (event.key === "Enter") {
       var extFilters = [];
       filters.extensions
         ?.filter((n) => n.isChecked)
@@ -188,21 +185,6 @@ const FileTable = ({ trigger }) => {
     }
   };
 
-  const input = (
-    <div>
-      <input
-        placeholder="Pretrazi..."
-        value={filters.content}
-        onChange={(e) => handleChangeContent(e.target.value)}
-        onKeyDown={handleKeyDown}
-        className="candidate-search-field"
-        style={{ width: matches ? "160px" : "816px" }}
-        onClick={stopPropagation}
-        role="input"
-      />
-    </div>
-  );
-
   const onError = (e) => {
     console.log(e, "error in file-viewer");
   };
@@ -239,6 +221,37 @@ const FileTable = ({ trigger }) => {
     });
   };
 
+  const resFilters = () => {
+    dispatch(resetFilters())
+    dispatch(
+      getFilesReq({
+        payload: {
+          pageSize: PAGE_SIZE_FILES,
+          currentPage: page,
+          categoryId: id,
+          extensions: [],
+          tags: [],
+          content: "",
+        },
+      })
+    );
+  };
+
+  const input = (
+    <div>
+      <input
+        placeholder="Pretrazi..."
+        value={filters.content}
+        onChange={(e) => handleChangeContent(e.target.value)}
+        onKeyDown={handleKeyDown}
+        className="candidate-search-field"
+        style={{ width: matches ? "160px" : "816px" }}
+        onClick={stopPropagation}
+        role="input"
+      />
+    </div>
+  );
+
   return isLoading ? (
     <div>
       <div className="l-t-rectangle"></div>
@@ -374,6 +387,12 @@ const FileTable = ({ trigger }) => {
             </IconButton>
           )}
           <FilterButton onShowFilters={handleToggleFiltersDrawer} />
+          <IconButton
+            className="c-btn c-btn--primary-outlined candidate-btn reset-filters userPageBtn ml-20px no-padding custom-filter-button"
+            onClick={resFilters}
+          >
+            {!matches ? t("filters.resetFilters") : null}
+          </IconButton>
         </div>
       </div>
       <div

src/store/actions/files/fileActionConstants.js

@@ -12,8 +12,8 @@ export const FILE_FILTERS_SUCCESS = createSuccessType(FILE_FILTERS_SCOPE);
 export const FILE_FILTERS_LOADING = createLoadingType(FILE_FILTERS_SCOPE);
 export const UPDATE_FILTERS_EXTENSION = 'UPDATE_FILTERS_EXTENSION';
 export const UPDATE_FILTERS_TAG = 'UPDATE_FILTERS_TAG';
-export const UPDATE_FILTERS_CATEGORY = 'UPDATE_FILTERS_CATEGORY';
 export const SET_CONTENT = 'SET_CONTENT'
+export const RESET_FILTERS = 'RESET_FILTERS'
 
 const FETCH_FILES_SCOPE = "FETCH_FILES";
 export const FETCH_FILES_REQ = createFetchType(FETCH_FILES_SCOPE);

src/store/actions/files/fileActions.js

@@ -5,7 +5,6 @@ import {
   FILE_FILTERS_ERR,
   FILE_FILTERS_REQ,
   FILE_FILTERS_SUCCESS,
-  UPDATE_FILTERS_CATEGORY,
   UPDATE_FILTERS_EXTENSION,
   UPDATE_FILTERS_TAG,
   SET_CONTENT,
@@ -14,7 +13,8 @@ import {
   DELETE_FILE_SUCCESS,
   UPDATE_FILE_REQ,
   UPDATE_FILE_ERR,
-  UPDATE_FILE_SUCCESS
+  UPDATE_FILE_SUCCESS,
+  RESET_FILTERS,
 } from "./fileActionConstants";
 
 export const getFileFiltersReq = () => ({
@@ -39,14 +39,10 @@ export const updateFileFilterTag = (payload) => ({
   type: UPDATE_FILTERS_TAG,
   payload,
 });
-export const updateFileFilterCat = (payload) => ({
-  type: UPDATE_FILTERS_CATEGORY,
-  payload,
-});
 
 export const getFilesReq = (payload) => ({
   type: FETCH_FILES_REQ,
-  payload
+  payload,
 });
 
 export const getFileError = (payload) => ({
@@ -60,13 +56,13 @@ export const getFileSuccess = (payload) => ({
 });
 
 export const setContent = (payload) => ({
-  type:SET_CONTENT,
-  payload
-})
+  type: SET_CONTENT,
+  payload,
+});
 
 export const updateFileReq = (payload) => ({
   type: UPDATE_FILE_REQ,
-  payload
+  payload,
 });
 
 export const updateFileError = (payload) => ({
@@ -76,12 +72,12 @@ export const updateFileError = (payload) => ({
 
 export const updateFileAction = (payload) => ({
   type: UPDATE_FILE_SUCCESS,
-  payload
+  payload,
 });
 
 export const deleteFileReq = (payload) => ({
   type: DELETE_FILE_REQ,
-  payload
+  payload,
 });
 
 export const deleteFileError = (payload) => ({
@@ -91,5 +87,9 @@ export const deleteFileError = (payload) => ({
 
 export const deleteFileAction = (payload) => ({
   type: DELETE_FILE_SUCCESS,
-  payload
-});
+  payload,
+});
+
+export const resetFilters = () => ({
+  type: RESET_FILTERS,
+});

src/store/reducers/files/fileFiltersReducer.js

@@ -2,10 +2,10 @@ import createReducer from "../../utils/createReducer";
 import {
   FILE_FILTERS_ERR,
   FILE_FILTERS_SUCCESS,
-  UPDATE_FILTERS_CATEGORY,
   UPDATE_FILTERS_EXTENSION,
   UPDATE_FILTERS_TAG,
-  SET_CONTENT
+  SET_CONTENT,
+  RESET_FILTERS,
 } from "../../actions/files/fileActionConstants";
 
 const initialState = {
@@ -19,8 +19,8 @@ export default createReducer(
     [FILE_FILTERS_ERR]: setFileFiltersErrorMessage,
     [UPDATE_FILTERS_EXTENSION]: updateFileFilterExtension,
     [UPDATE_FILTERS_TAG]: updateFileFilterTag,
-    [UPDATE_FILTERS_CATEGORY]: updateFileFilterCategory,
-    [SET_CONTENT]:setContent
+    [SET_CONTENT]: setContent,
+    [RESET_FILTERS]: resetFilters,
   },
   initialState
 );
@@ -73,24 +73,25 @@ function updateFileFilterTag(state, action) {
   };
 }
 
-function updateFileFilterCategory(state, action) {
+function setContent(state, action) {
   return {
     ...state,
     filters: {
       ...state.filters,
-      categories: state.filters.categories?.map((n) =>
-        n.name === action.payload ? { ...n, isChecked: !n.isChecked } : n
-      ),
+      content: action.payload,
     },
   };
 }
 
-function setContent(state, action) {
+function resetFilters(state) {
   return {
     ...state,
     filters: {
-      ...state.filters,
-      content:action.payload
+      tags: state.filters.tags?.map((t) => ({ ...t, isChecked: false })),
+      extensions: state.filters.extensions?.map((c) => ({
+        ...c,
+        isChecked: false,
+      })),
     },
   };
 }