diff --git a/.changeset/early-socks-beg.md b/.changeset/early-socks-beg.md new file mode 100644 index 0000000000..33265fe8f1 --- /dev/null +++ b/.changeset/early-socks-beg.md @@ -0,0 +1,6 @@ +--- +'@backstage/plugin-catalog': minor +'@backstage/plugin-catalog-react': minor +--- + +added retry callback to useEntity hook diff --git a/plugins/catalog-react/src/hooks/useEntity.ts b/plugins/catalog-react/src/hooks/useEntity.ts index 465cffcf9b..a83e573753 100644 --- a/plugins/catalog-react/src/hooks/useEntity.ts +++ b/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; + retry?: VoidFunction; }; export const EntityContext = createContext({ entity: undefined, loading: true, error: undefined, + retry: () => {}, }); 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 } = 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, retry }; }; /** * Grab the current entity from the context and its current loading state. */ export function useEntity() { - const { entity, loading, error } = useContext(EntityContext); - return { entity: entity as T, loading, error }; + const { entity, loading, error, retry } = useContext(EntityContext); + return { entity: entity as T, loading, error, retry }; } diff --git a/plugins/catalog/src/components/EntityLoaderProvider/EntityLoaderProvider.tsx b/plugins/catalog/src/components/EntityLoaderProvider/EntityLoaderProvider.tsx index 7f9f728161..20828b390b 100644 --- a/plugins/catalog/src/components/EntityLoaderProvider/EntityLoaderProvider.tsx +++ b/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, retry } = useEntityFromUrl(); return ( - + {children} );