(`/prompts?limit=1000&gateway_id=${gatewayId}`);
@@ -194,6 +200,16 @@ export function ExposeComponentsForm({
const promptCount = prompts.length;
const isLoading = toolsLoading || resourcesLoading || promptsLoading;
+ // Only the very first load (before any section has resolved) replaces the whole
+ // form with a spinner; a per-section retry must keep the healthy sections visible.
+ const isInitialLoad =
+ isLoading &&
+ toolsData === undefined &&
+ resourcesData === undefined &&
+ promptsData === undefined &&
+ !toolsError &&
+ !resourcesError &&
+ !promptsError;
const toggleSection = useCallback((section: string) => {
setExpandedSection((prev) => (prev === section ? null : section));
@@ -275,7 +291,7 @@ export function ExposeComponentsForm({
}
};
- if (isLoading) {
+ if (isInitialLoad) {
return (
@@ -352,8 +368,16 @@ export function ExposeComponentsForm({
aria-hidden="true"
/>
-
- {toolCount} {toolCount === 1 ? "tool" : "tools"}
+
+ {toolsLoading
+ ? intl.formatMessage({ id: "common.loading" })
+ : toolsError
+ ? intl.formatMessage({ id: "gateways.exposeComponents.error.tools" })
+ : intl.formatMessage({ id: "gateways.card.toolCount" }, { count: toolCount })}
{expandedSection === "tools" ? (
@@ -369,6 +393,27 @@ export function ExposeComponentsForm({
)}
+ {toolsError && (
+
+
+ refetchTools().catch((err) => console.error("Failed to refetch tools:", err)),
+ }}
+ />
+
+ )}
+
{expandedSection === "tools" && tools.length > 0 && (
-
- {resourceCount} {resourceCount === 1 ? "resource" : "resources"}
+
+ {resourcesLoading
+ ? intl.formatMessage({ id: "common.loading" })
+ : resourcesError
+ ? intl.formatMessage({ id: "gateways.exposeComponents.error.resources" })
+ : intl.formatMessage(
+ { id: "gateways.card.resourceCount" },
+ { count: resourceCount },
+ )}
{expandedSection === "resources" ? (
@@ -416,6 +474,29 @@ export function ExposeComponentsForm({
/>
)}
+
+ {resourcesError && (
+
+
+ refetchResources().catch((err) =>
+ console.error("Failed to refetch resources:", err),
+ ),
+ }}
+ />
+
+ )}
{expandedSection === "resources" && resources.length > 0 && (
-
- {promptCount} prompt {promptCount === 1 ? "template" : "templates"}
+
+ {promptsLoading
+ ? intl.formatMessage({ id: "common.loading" })
+ : promptsError
+ ? intl.formatMessage({ id: "gateways.exposeComponents.error.prompts" })
+ : intl.formatMessage(
+ { id: "gateways.exposeComponents.promptCount" },
+ { count: promptCount },
+ )}
{expandedSection === "prompts" ? (
@@ -463,6 +557,29 @@ export function ExposeComponentsForm({
/>
)}
+
+ {promptsError && (
+
+
+ refetchPrompts().catch((err) =>
+ console.error("Failed to refetch prompts:", err),
+ ),
+ }}
+ />
+
+ )}
{expandedSection === "prompts" && prompts.length > 0 && (