Issue #40 Port over useQuery custom hook

implement useQuery custom react hook

Author: brandongregoryscott

package-lock.json

@@ -11,7 +11,7 @@
         "@types/react": "16.9.26",
         "@types/react-dom": "16.9.6",
         "@types/react-router-dom": "5.1.5",
-        "andculturecode-javascript-core": "0.1.2",
+        "andculturecode-javascript-core": "0.3.3",
         "axios": "0.19.2",
         "i18next": "19.4.5",
         "immutable": "4.0.0-rc.12",

package.json

@@ -0,0 +1,3 @@
+describe("useQuery", () => {
+    test.skip("TODO - https://github.com/AndcultureCode/AndcultureCode.JavaScript.React/issues/41", () => {});
+});

src/hooks/use-query.test.tsx

@@ -0,0 +1,88 @@
+import {
+    Do,
+    EnvironmentUtils,
+    ResultRecord,
+} from "andculturecode-javascript-core";
+import { useCallback, useEffect, useState } from "react";
+import { UseQueryOptions } from "../interfaces/use-query-options";
+import { ListService } from "../types/list-service-type";
+import { NestedListService } from "../types/nested-list-service-type";
+
+export function useQuery<TRecord, TQueryParams, TPathParams = undefined>(
+    options: UseQueryOptions<TRecord, TQueryParams, TPathParams>
+) {
+    const {
+        initialPathParams,
+        initialQuery,
+        onError,
+        onSuccess,
+        serviceHook,
+    } = options;
+
+    const { list: listApi } = serviceHook();
+
+    const handleSuccess = useCallback(
+        (records: Array<TRecord>) => {
+            if (onSuccess != null) {
+                onSuccess(records);
+                return;
+            }
+        },
+        [onSuccess]
+    );
+
+    const handleError = useCallback(
+        (result?: ResultRecord<TRecord>, error?: any) => {
+            if (onError != null) {
+                onError(result, error);
+                return;
+            }
+
+            EnvironmentUtils.runIfDevelopment(() => {
+                console.error("No error handler defined.");
+                console.error(result, error);
+            });
+        },
+        [onError]
+    );
+
+    const [loading, setLoading] = useState(false);
+    const [query, setQuery] = useState(initialQuery);
+    const [pathParams, setPathParams] = useState(initialPathParams);
+    const [values, setValues] = useState<Array<TRecord>>([]);
+
+    useEffect(() => {
+        Do.try(async () => {
+            // if regular list, not nested list
+            if (pathParams == null) {
+                const api = listApi as ListService<TRecord, TQueryParams>;
+                const result = await api(query);
+                setValues(result.resultObjects!);
+                handleSuccess(result.resultObjects!);
+                return;
+            }
+
+            // otherwise, nested list
+            const api = listApi as NestedListService<
+                TRecord,
+                TPathParams,
+                TQueryParams
+            >;
+            const result = await api(pathParams, query);
+            setValues(result.resultObjects!);
+            handleSuccess(result.resultObjects!);
+        })
+            .catch(handleError)
+            .finally(() => setLoading(false));
+    });
+
+    return {
+        loading,
+        query,
+        setQuery,
+        pathParams,
+        setPathParams,
+        values,
+        setValues,
+    };
+}

src/hooks/use-query.ts

@@ -0,0 +1,17 @@
+import { CatchResultHandler } from "andculturecode-javascript-core";
+import { ListServiceHook } from "../types/list-service-hook-type";
+import { NestedListServiceHook } from "../types/nested-list-service-hook-type";
+
+export interface UseQueryOptions<
+    TRecord,
+    TQueryParams,
+    TPathParams = undefined
+> {
+    serviceHook:
+        | ListServiceHook<TRecord, TQueryParams>
+        | NestedListServiceHook<TRecord, TPathParams, TQueryParams>;
+    initialQuery: TQueryParams;
+    initialPathParams?: TPathParams;
+    onSuccess?: (records: Array<TRecord>) => void;
+    onError?: CatchResultHandler<TRecord>;
+}