Merge pull request #2541 from abilpraju-aot/bugfix/4225

Add Refresh and Sort options to all designer listing page

forms-flow-web/src/actions/actionConstants.js

@@ -109,6 +109,8 @@ const ACTION_CONSTANTS = {
   IS_APPLICATION_LOADING:"IS_APPLICATION_LOADING",
   APPLICATION_LIST_SEARCH_PARAMS:"APPLICATION_LIST_SEARCH_PARAMS",
   //BPM TASKS
+  BPM_SORT: "BPM_SORT",
+  DMN_SORT: "DMN_SORT",
   BPM_LIST_TASKS: "BPM_LIST_TASKS",
   BPM_PROCESS_LIST: "BPM_PROCESS_LIST",
   BPM_USER_LIST: "BPM_USER_LIST",

forms-flow-web/src/actions/processActions.js

@@ -202,3 +202,16 @@ export const setTotalDmnCount = (data) => (dispatch) => {
     payload: data,
     }); 
 };
+
+export const setBpmSort = (data) => (dispatch) => {
+  dispatch({
+    type: ACTION_CONSTANTS.BPM_SORT,
+    payload: data,
+    });
+};
+export const setDmnSort = (data) => (dispatch) => {
+  dispatch({
+    type: ACTION_CONSTANTS.DMN_SORT,
+    payload: data,
+    });
+};

forms-flow-web/src/components/CustomComponents/FilterSortActions.js

@@ -0,0 +1,61 @@
+import React from "react";
+import { FilterIcon, RefreshIcon, SortModal } from "@formsflow/components";
+import PropTypes from "prop-types";
+import { useTranslation  } from "react-i18next";
+
+const FilterSortActions = ({
+  showSortModal,
+  handleFilterIconClick,
+  handleRefresh,
+  handleSortModalClose,
+  handleSortApply,
+  defaultSortOption,
+  defaultSortOrder,
+  optionSortBy,  // Accept optionSortBy as a prop
+}) => {
+  const { t } = useTranslation();
+  return (
+    <>
+      <FilterIcon onClick={handleFilterIconClick} />
+      <RefreshIcon onClick={handleRefresh} />
+      {showSortModal && (
+        <SortModal
+          firstItemLabel={t("Sort By")}
+          secondItemLabel={t("In a")}
+          showSortModal={showSortModal}
+          onClose={handleSortModalClose}
+          primaryBtnAction={handleSortApply}
+          modalHeader={t("Sort")}
+          primaryBtnLabel={t("Sort Results")}
+          secondaryBtnLabel={t("Cancel")}
+          optionSortBy={optionSortBy}
+          optionSortOrder={[
+            { value: "asc", label: t("Ascending") },
+            { value: "desc", label: t("Descending") },
+          ]}
+          defaultSortOption={defaultSortOption}
+          defaultSortOrder={defaultSortOrder}
+        />
+      )}
+    </>
+  );
+};
+
+// Add propTypes to validate props
+FilterSortActions.propTypes = {
+  showSortModal: PropTypes.bool.isRequired,
+  handleFilterIconClick: PropTypes.func.isRequired,
+  handleRefresh: PropTypes.func.isRequired,
+  handleSortModalClose: PropTypes.func.isRequired,
+  handleSortApply: PropTypes.func.isRequired,
+  defaultSortOption: PropTypes.string.isRequired,
+  defaultSortOrder: PropTypes.string.isRequired,
+  optionSortBy: PropTypes.arrayOf(
+    PropTypes.shape({
+      value: PropTypes.string.isRequired,
+      label: PropTypes.string.isRequired,
+    })
+  ).isRequired,
+};
+
+export default FilterSortActions;