Merge pull request #6563 from yousifalraheem/feat/retry-in-useentity

added refresh to useEntity hook

.changeset/early-socks-beg.md

@@ -0,0 +1,6 @@
+---
+'@backstage/plugin-catalog': patch
+'@backstage/plugin-catalog-react': patch
+---
+
+added retry callback to useEntity hook

plugins/catalog-react/api-report.md

@@ -697,6 +697,7 @@ export function useEntity<T extends Entity = Entity>(): {
   entity: T;
   loading: boolean;
   error: Error | undefined;
+  refresh: VoidFunction | undefined;
 };
 
 // Warning: (ae-missing-release-tag) "useEntityCompoundName" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)

plugins/catalog-react/src/hooks/useEntity.ts

@@ -17,7 +17,7 @@ import { Entity } from '@backstage/catalog-model';
 import { errorApiRef, useApi } from '@backstage/core-plugin-api';
 import { createContext, useContext, useEffect } from 'react';
 import { useNavigate } from 'react-router';
-import { useAsync } from 'react-use';
+import { useAsyncRetry } from 'react-use';
 import { catalogApiRef } from '../api';
 import { useEntityCompoundName } from './useEntityCompoundName';
 
@@ -25,12 +25,14 @@ type EntityLoadingStatus = {
   entity?: Entity;
   loading: boolean;
   error?: Error;
+  refresh?: VoidFunction;
 };
 
 export const EntityContext = createContext<EntityLoadingStatus>({
   entity: undefined,
   loading: true,
   error: undefined,
+  refresh: () => {},
 });
 
 export const useEntityFromUrl = (): EntityLoadingStatus => {
@@ -39,7 +41,7 @@ export const useEntityFromUrl = (): EntityLoadingStatus => {
   const errorApi = useApi(errorApiRef);
   const catalogApi = useApi(catalogApiRef);
 
-  const { value: entity, error, loading } = useAsync(
+  const { value: entity, error, loading, retry: refresh } = useAsyncRetry(
     () => catalogApi.getEntityByName({ kind, namespace, name }),
     [catalogApi, kind, namespace, name],
   );
@@ -51,13 +53,13 @@ export const useEntityFromUrl = (): EntityLoadingStatus => {
     }
   }, [errorApi, navigate, error, loading, entity, name]);
 
-  return { entity, loading, error };
+  return { entity, loading, error, refresh };
 };
 
 /**
  * Grab the current entity from the context and its current loading state.
  */
 export function useEntity<T extends Entity = Entity>() {
-  const { entity, loading, error } = useContext(EntityContext);
-  return { entity: entity as T, loading, error };
+  const { entity, loading, error, refresh } = useContext(EntityContext);
+  return { entity: entity as T, loading, error, refresh };
 }

plugins/catalog/src/components/EntityLoaderProvider/EntityLoaderProvider.tsx

@@ -20,10 +20,10 @@ import {
 import React, { ReactNode } from 'react';
 
 export const EntityLoaderProvider = ({ children }: { children: ReactNode }) => {
-  const { entity, loading, error } = useEntityFromUrl();
+  const { entity, loading, error, refresh } = useEntityFromUrl();
 
   return (
-    <EntityContext.Provider value={{ entity, loading, error }}>
+    <EntityContext.Provider value={{ entity, loading, error, refresh }}>
       {children}
     </EntityContext.Provider>
   );