Before Milestone Meeting Final Changes (#40)

some final fixes before the demo

Co-authored-by: Luis-Hebendanz <consulting@qube.email>
Reviewed-on: #40
Co-authored-by: sara-pervana <saramakishti@gmail.com>
Co-committed-by: sara-pervana <saramakishti@gmail.com>

pkgs/ui/src/components/hooks/useAppContext.tsx

@@ -1,3 +1,5 @@
+import { useGetEntities } from "@/api/entities/entities";
+import { Entity } from "@/api/model";
 import { AxiosError } from "axios";
 import React, {
   createContext,
@@ -5,6 +7,7 @@ import React, {
   ReactNode,
   SetStateAction,
   useState,
+  useEffect,
 } from "react";
 
 type AppContextType = {
@@ -18,7 +21,11 @@ type AppContextType = {
 
 export const AppContext = createContext<AppContextType>({} as AppContextType);
 
-type AppState = NonNullable<unknown>;
+type AppState = {
+  allEntities: Entity[] | undefined;
+  loadingEntities: boolean;
+  entitiesKeyFunc: any;
+};
 
 interface AppContextProviderProps {
   children: ReactNode;
@@ -26,10 +33,28 @@ interface AppContextProviderProps {
 export const WithAppState = (props: AppContextProviderProps) => {
   const { children } = props;
 
+  const { data: entityData, swrKey: entitiesKeyFunc } = useGetEntities();
+
   const isLoading = false;
   const error = undefined;
 
-  const [data, setAppState] = useState<AppState>({});
+  const [data, setAppState] = useState<AppState>({
+    allEntities: [],
+    loadingEntities: true,
+    entitiesKeyFunc,
+  });
+
+  useEffect(() => {
+    if (entityData) {
+      setAppState((prevState) => ({
+        ...prevState,
+        allEntities: entityData.data,
+        entitiesKeyFunc,
+        loadingEntities: false,
+      }));
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [entityData]);
 
   return (
     <AppContext.Provider

pkgs/ui/src/components/hooks/useFetch.tsx

@@ -0,0 +1,33 @@
+import { useState, useEffect } from "react";
+import axios from "axios";
+import { BASE_URL } from "@/constants";
+
+const useFetch = (url: string) => {
+  const [data, setData] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+
+  const fetch = () => {
+    setLoading(true);
+    axios
+      .get(BASE_URL + url)
+      .then((response) => {
+        setData(response.data);
+      })
+      .catch((error) => {
+        setError(error);
+      })
+      .finally(() => {
+        setLoading(false);
+      });
+  };
+
+  useEffect(() => {
+    fetch();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [url]);
+
+  return { data, loading, error, fetch };
+};
+
+export default useFetch;

pkgs/ui/src/components/hooks/useGetEntityById.tsx

@@ -0,0 +1,19 @@
+import { useContext } from "react";
+import { AppContext } from "./useAppContext";
+
+const useGetEntityByName = (nameOrDid: string) => {
+  const { data } = useContext(AppContext);
+  const allEntities = data.allEntities;
+
+  if (!allEntities) {
+    return { entity: undefined, isLoading: true };
+  }
+
+  const entity = allEntities.find(
+    (entity) => entity.name === nameOrDid || entity.did === nameOrDid,
+  );
+
+  return { entity, isLoading: false };
+};
+
+export default useGetEntityByName;