diff --git a/ui/components/providers/no-providers-added.tsx b/ui/components/providers/no-providers-added.tsx index 5bfb8836ea..a9cc9d351c 100644 --- a/ui/components/providers/no-providers-added.tsx +++ b/ui/components/providers/no-providers-added.tsx @@ -11,10 +11,21 @@ const NO_PROVIDERS_ADDED_ACTION = { LINK: "link", } as const; +// "page" is the full-screen empty state (Providers page); "hint" is a compact +// horizontal banner that sits above other content (Scans page). +const NO_PROVIDERS_ADDED_VARIANT = { + PAGE: "page", + HINT: "hint", +} as const; + +type NoProvidersAddedVariant = + (typeof NO_PROVIDERS_ADDED_VARIANT)[keyof typeof NO_PROVIDERS_ADDED_VARIANT]; + interface NoProvidersAddedBaseProps { containerClassName?: string; // Tour anchor for the CTA; needed because this empty state replaces the table's AddProviderButton. ctaTourId?: string; + variant?: NoProvidersAddedVariant; } interface NoProvidersAddedButtonProps extends NoProvidersAddedBaseProps { @@ -33,14 +44,23 @@ type NoProvidersAddedProps = | NoProvidersAddedButtonProps | NoProvidersAddedLinkProps; -const renderCta = (props: NoProvidersAddedProps) => { +const renderCta = ( + props: NoProvidersAddedProps, + variant: NoProvidersAddedVariant, +) => { + const isHint = variant === NO_PROVIDERS_ADDED_VARIANT.HINT; + const className = isHint + ? "w-full justify-center md:w-fit" + : "w-full max-w-xs justify-center"; + const size = isHint ? undefined : "lg"; + if (props.action === NO_PROVIDERS_ADDED_ACTION.LINK) { return ( Add a Provider @@ -50,9 +70,9 @@ const renderCta = (props: NoProvidersAddedProps) => { return ( Add a Provider @@ -61,6 +81,33 @@ const renderCta = (props: NoProvidersAddedProps) => { }; export const NoProvidersAdded = (props: NoProvidersAddedProps) => { + const variant = props.variant ?? NO_PROVIDERS_ADDED_VARIANT.PAGE; + + // Compact horizontal hint, matching NoProvidersConnected so both provider + // hints on the Scans page share one composition. + if (variant === NO_PROVIDERS_ADDED_VARIANT.HINT) { + return ( + + + + + + + No Providers Configured + + + + No providers have been configured. Start by setting up a provider. + + + + {renderCta(props, variant)} + + + + ); + } + return ( { - {renderCta(props)} + {renderCta(props, variant)} diff --git a/ui/components/scans/scans-page-shell.tsx b/ui/components/scans/scans-page-shell.tsx index 739a96753f..cd491fbde9 100644 --- a/ui/components/scans/scans-page-shell.tsx +++ b/ui/components/scans/scans-page-shell.tsx @@ -119,10 +119,7 @@ export function ScansPageShell({ {/* Signals the navbar that this route's data has loaded (enables the replay icon). */} {showProvidersHint && ( - + )} + ) : ( );
+ No providers have been configured. Start by setting up a provider. +