feat(storeContext.tsx): modify getStoreComponents function to accept an object with optional parameters for better readability and maintainability

fix(API/index.ts): remove unused import and modify getStoreComponents function to accept an object with optional parameters for better readability and maintainability

fix(from-store/index.tsx): modify handleGetComponents function to pass an object with optional parameters to getStoreComponents for better readability and maintainability

fix(StorePage/index.tsx): modify handleGetComponents function to pass an object with optional parameters to getStoreComponents for better readability and maintainability

src/frontend/src/contexts/storeContext.tsx

@@ -48,7 +48,10 @@ export function StoreProvider({ children }) {
 
   function getSavedComponents() {
     setLoadingSaved(true);
-    getStoreComponents(null, null, null, null, null, true)
+    getStoreComponents({
+      sort: "-count(liked_by)",
+      liked: true,
+    })
       .then((data) => {
         if (data?.authorized === false) {
           setErrorApiKey(true);

src/frontend/src/controllers/API/index.ts

@@ -4,7 +4,6 @@ import { BASE_URL_API } from "../../constants/constants";
 import { api } from "../../controllers/API/api";
 import {
   APIObjectType,
-  Component,
   LoginType,
   Users,
   changeUser,
@@ -590,17 +589,27 @@ export async function getFlowsStore(): Promise<AxiosResponse<FlowType[]>> {
   return await api.get(`${BASE_URL_API}store/`);
 }
 
-export async function getStoreComponents(
+export async function getStoreComponents({
-  page?: number | null,
+  page = 1,
-  limit?: number | null,
+  limit = 9999999,
-  is_component?: boolean | null,
+  is_component = null,
-  sort?: string | null,
+  sort = "-count(liked_by)",
-  tags?: string[] | null,
+  tags = [] || null,
-  liked?: boolean | null,
+  liked = null,
-  status?: string | null,
+  status = null,
-  search?: string | null,
+  search = null,
-  filterByUser?: boolean | null
+  filterByUser = null,
-): Promise<StoreComponentResponse | undefined> {
+}: {
+  page?: number;
+  limit?: number;
+  is_component?: boolean | null;
+  sort?: string;
+  tags?: string[] | null;
+  liked?: boolean | null;
+  status?: string | null;
+  search?: string | null;
+  filterByUser?: boolean | null;
+}): Promise<StoreComponentResponse | undefined> {
   try {
     let url = `${BASE_URL_API}store/components/`;
     const queryParams: any = [];
@@ -652,18 +661,6 @@ export async function getStoreComponents(
   }
 }
 
-export async function postStoreComponents(component: Component) {
-  try {
-    const res = await api.post(`${BASE_URL_API}store/components/`, component);
-    if (res.status === 200) {
-      return res.data;
-    }
-  } catch (error) {
-    console.log("Error:", error);
-    throw error;
-  }
-}
-
 export async function getComponent(component_id: string) {
   try {
     const res = await api.get(

src/frontend/src/pages/MainPage/components/from-store/index.tsx

@@ -16,8 +16,10 @@ export default function FromStore(): JSX.Element {
 
   const handleGetComponents = () => {
     setLoading(true);
-    console.log("get store components");
+    getStoreComponents({
-    getStoreComponents(null, null, null, "name", null, true)
+      liked: true,
+      sort: "name",
+    })
       .then((res) => {
         setLoading(false);
         setData(res?.results ?? []);

src/frontend/src/pages/StorePage/index.tsx

@@ -65,17 +65,18 @@ export default function StorePage(): JSX.Element {
 
   function handleGetComponents() {
     setLoading(true);
-    getStoreComponents(
+    getStoreComponents({
-      pageIndex,
+      page: pageIndex,
-      pageSize,
+      limit: pageSize,
+      is_component:
         tabActive === "All" ? null : tabActive === "Flows" ? false : true,
-      pageOrder === "Popular" ? "-count(downloads)" : "name",
+      sort: pageOrder === "Popular" ? "-count(downloads)" : "name",
-      filteredCategories,
+      tags: filteredCategories,
-      selectFilter === "likedbyme" && hasApiKey ? true : null,
+      liked: selectFilter === "likedbyme" && hasApiKey ? true : null,
-      null,
+      status: null,
-      searchText === "" ? null : searchText,
+      search: searchText === "" ? null : searchText,
-      selectFilter === "createdbyme" && hasApiKey ? true : null
+      filterByUser: selectFilter === "createdbyme" && hasApiKey ? true : null,
-    )
+    })
       .then((res) => {
         setHasApiKey(res?.authorized ?? false);
         setLoading(false);