FWF-4550:[Feature] -updated pr comments.

  - Removed axios and used request service instead
  - added submission type and a seperate file

Author: Josephalexantony-aot

forms-flow-submissions/package-lock.json

@@ -60,7 +60,6 @@
     "@tanstack/react-query": "^4.29.15",
     "@types/systemjs": "^6.1.1",
     "@types/webpack-env": "^1.16.2",
-    "axios": "^1.9.0",
     "connected-react-router": "^6.9.2",
     "history": "^4.10.1",
     "i18next": "^25.2.1",

forms-flow-submissions/package.json

@@ -3,12 +3,13 @@ import { useDispatch, useSelector } from "react-redux";
 import { useQuery } from "@tanstack/react-query";
 import { useTranslation } from "react-i18next";
 import { push } from "connected-react-router";
-
+import { Submission } from "../types/submissions";
 import { getSubmissionList } from "../api/queryServices/analyzeSubmissionServices";
 import { formatDate } from "../helper/helper";
 import {
   setAnalyzeSubmissionSort,
   setAnalyzeSubmissionPage,
+  setAnalyzeSubmissionLimit,
 } from "../actions/analyzeSubmissionActions";
 import {
   ReusableResizableTable,
@@ -18,16 +19,6 @@ import {
 } from "@formsflow/components";
 import { MULTITENANCY_ENABLED } from "../constants";
 
-type Submission = {
-  applicationStatus: string;
-  createdBy: string;
-  data: any;
-  formName: string;
-  id: string;
-  submissionId: string;
-  created?: string;
-};
-
 interface Column {
   name: string;
   width: number;
@@ -39,11 +30,12 @@ const TaskSubmissionList: React.FC = () => {
   const { t } = useTranslation();
   const dispatch = useDispatch();
   const scrollWrapperRef = useRef<HTMLDivElement>(null);
-  const [limit, setLimit] = useState(10);
-
   const sortParams = useSelector(
     (state: any) => state?.analyzeSubmission.analyzeSubmissionSortParams ?? {}
   );
+  const limit = useSelector(
+    (state: any) => state?.analyzeSubmission.limit ?? 10
+  );
   const { page } = useSelector(
     (state: any) => state?.analyzeSubmission.page ?? 1
   );
@@ -193,7 +185,7 @@ const TaskSubmissionList: React.FC = () => {
   );
 
   const handleLimitChange = (newLimit: number) => {
-    setLimit(newLimit);
+    setAnalyzeSubmissionLimit(newLimit);
     setAnalyzeSubmissionPage(1);
   };
 
@@ -214,6 +206,7 @@ const TaskSubmissionList: React.FC = () => {
                 "No submissions have been found. Try a different filter combination or contact your admin."
               )}
               onColumnResize={(newWidths) =>
+                //TBD
                 console.log("Column resized:", newWidths)
               }
               tableClassName="resizable-table"

forms-flow-submissions/src/Routes/SubmissionListing.tsx

@@ -1,4 +1,5 @@
 export default {
     UPDATE_SUBMISSION_SORT_PARAMS:"UPDATE_SUBMISSION_SORT_PARAMS",
     UPDATE_SUBMISSION_PAGE: "UPDATE_SUBMISSION_PAGE",
+    UPDATE_SUBMISSION_LIMIT: "UPDATE_SUBMISSION_LIMIT"
 };

forms-flow-submissions/src/actions/actionConstants.ts

@@ -1,17 +1,23 @@
 import ACTION_CONSTANTS from "../constants/actionConstants";
 
 export const setAnalyzeSubmissionSort = (data) => (dispatch) => {
-    dispatch({
-      type: ACTION_CONSTANTS.UPDATE_SUBMISSION_SORT_PARAMS,
-      payload: data,
-    });
-  };
-  
-  export const setAnalyzeSubmissionPage = (data) => (dispatch) => {
-    dispatch({
-      type: ACTION_CONSTANTS.UPDATE_SUBMISSION_PAGE,
-      payload: data,
-    });
-  };
+  dispatch({
+    type: ACTION_CONSTANTS.UPDATE_SUBMISSION_SORT_PARAMS,
+    payload: data,
+  });
+};
+
+export const setAnalyzeSubmissionPage = (data) => (dispatch) => {
+  dispatch({
+    type: ACTION_CONSTANTS.UPDATE_SUBMISSION_PAGE,
+    payload: data,
+  });
+};
+export const setAnalyzeSubmissionLimit = (data) => (dispatch) => {
+  dispatch({
+    type: ACTION_CONSTANTS.UPDATE_SUBMISSION_LIMIT,
+    payload: data,
+  });
+};
+
 
-  

forms-flow-submissions/src/actions/analyzeSubmissionActions.ts

@@ -1,62 +1,46 @@
 import API from "../endpoints";
-import {  StorageService } from "@formsflow/service";
-import axios from "axios";
+import { StorageService, RequestService } from "@formsflow/service";
+import { SubmissionListResponse } from "../../types/submissions";
 
 
-type Submission = {
-    applicationStatus: string;
-    createdBy: string;
-    data: any;
-    formName: string;
-    id: string;
-    submissionId: string;
-  };
-  
-  type SubmissionListResponse = {
-    submissions: Submission[];
-    totalCount: number;
-    pageNo: number;
-    limit: number;
-  };
-  
-  export const getSubmissionList = (
-    limit = 10,
-    pageNo = 1,
-    sortOrder = "asc",
-    sortBy = "formName"
-  ): Promise<SubmissionListResponse> => {
-    const query = `
-      query MyQuery {
-        getSubmission(limit: ${limit}, pageNo: ${pageNo}, sortOrder: "${sortOrder}", sortBy: "${sortBy}") {
-          submissions {
-            applicationStatus
-            createdBy
-            data
-            formName
-            id
-            submissionId
-            created
-          }
-          totalCount
-          pageNo     
-          limit
+export const getSubmissionList = (
+  limit = 10,
+  pageNo = 1,
+  sortOrder = "asc",
+  sortBy = "formName"
+): Promise<SubmissionListResponse> => {
+  const query = `
+    query MyQuery {
+      getSubmission(limit: ${limit}, pageNo: ${pageNo}, sortOrder: "${sortOrder}", sortBy: "${sortBy}") {
+        submissions {
+          applicationStatus
+          createdBy
+          data
+          formName
+          id
+          submissionId
+          created
         }
+        totalCount
+        pageNo     
+        limit
       }
-    `;
-  
-    const payload = { query };
-    const token = StorageService.get("AUTH_TOKEN");
-  
-    return axios
-      .post(API.GRAPHQL_API, payload, {
-        headers: {
-          "Content-Type": "application/json",
-          Authorization: token ? `Bearer ${token}` : "",
-        },
-      })
-      .then((response) => {
-        const result = response.data?.data?.getSubmission;
-        return result;
-      });
-  };
-  
+    }
+  `;
+
+  const payload = { query };
+  const token = StorageService.get("AUTH_TOKEN");
+
+  return RequestService.httpPOSTRequest(
+    API.GRAPHQL_API,
+    payload,
+    token,
+    true,
+    {
+      "Content-Type": "application/json"
+    }
+  ).then((response) => {
+    const result = response.data?.data?.getSubmission;
+    return result;
+  });
+};

forms-flow-submissions/src/api/queryServices/analyzeSubmissionServices.ts

@@ -2,4 +2,5 @@
 export default {
 UPDATE_SUBMISSION_SORT_PARAMS:"UPDATE_SUBMISSION_SORT_PARAMS",
 UPDATE_SUBMISSION_PAGE: "UPDATE_SUBMISSION_PAGE",
+UPDATE_SUBMISSION_LIMIT: "UPDATE_SUBMISSION_LIMIT",
 }

forms-flow-submissions/src/constants/actionConstants.ts

@@ -9,6 +9,8 @@ const initialState = {
         submissionDate: { sortOrder: "asc" },
         applicationStatus: { sortOrder: "asc" },
     },
+    page: 1,
+    limit: 10,
 };
 
 
@@ -19,6 +21,8 @@ const analyzeSubmission = (state = initialState, action: any) => {
             return { ...state, analyzeSubmissionSortParams: action.payload };
         case ACTION_CONSTANTS.UPDATE_SUBMISSION_PAGE:
             return { ...state, page: action.payload };
+        case ACTION_CONSTANTS.UPDATE_SUBMISSION_LIMIT:
+            return { ...state, limit: action.payload };
         default:
             return state;
     }

forms-flow-submissions/src/reducers/analizeSubmissionReducer.ts

@@ -0,0 +1,16 @@
+export type Submission = {
+  applicationStatus: string;
+  createdBy: string;
+  data: any;
+  formName: string;
+  id: string;
+  submissionId: string;
+  created?: string;
+};
+
+export type SubmissionListResponse = {
+  submissions: Submission[];
+  totalCount: number;
+  pageNo: number;
+  limit: number;
+};