ApiKeysFeedbackBanner() — supabase Function Reference

Source Code

apps/studio/components/interfaces/APIKeys/ApiKeysIllustrations.tsx lines 126–164

export const ApiKeysFeedbackBanner = () => {
  return (
    <FeatureBanner
      storageKey={LOCAL_STORAGE_KEYS.API_KEYS_FEEDBACK_DISMISSED}
      className="!p-0 flex flex-col gap-0"
      dismissable
    >
      <div className="p-5">
        <p className="text-sm text-foreground">Your new API keys are here</p>
        <p className="text-sm text-foreground-lighter">
          We've updated our API keys to better support your application needs.{' '}
          <InlineLink
            href="https://github.com/orgs/supabase/discussions/29260"
            className="inline-flex items-center gap-1"
          >
            Join the discussion on GitHub <ExternalLink aria-hidden size={14} strokeWidth={1.5} />
          </InlineLink>
        </p>
      </div>

      <Separator className="w-full" />

      <div className="px-5 py-2 bg-surface-200/30">
        <p className="text-sm text-foreground-lighter">
          Having trouble with the new API keys?{' '}
          <SupportLink
            className={InlineLinkClassName}
            queryParams={{
              category: SupportCategories.PROBLEM,
              subject: 'Help with API keys',
            }}
          >
            Contact support
          </SupportLink>
        </p>
      </div>
    </FeatureBanner>
  )
}