Files
supabase/apps/studio/components/interfaces/Storage/StorageBucketsError.tsx
Charis d8f7cc0d57 feat(support form): attach dashboard logs (#39539)
* o11y: mirror and sanitize breadcrumbs

Mirror Sentry breadcrumbs as the basis for our own support logging. Also
adds more sanitization to breadcrumbs.

* feat(support form): toggle for attaching dashboard  logs

Add a toggle to the support form when the category is "Dashboard bug",
to attach recent dashboard logs. Users can preview the attached logs and
opt out.

* feat(support links): dedicated support link component

Add a new component for support links, which:
- Uses the serializer for support link params to ensure
serialization/deserialization pairs correctly
- Snapshots breadcrumbs so the attached log on the support form will be
cut off at the support link click (otherwise we will get support form
actions cluttering up the log)

* tests(support form): extend timeout on flaky test

* Minor clean up

* fix(support form): allow url to specifically indicate no specified project

* minor nits

* Fix tests

* Fix tests

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2025-10-22 08:57:49 -04:00

46 lines
1.3 KiB
TypeScript

import { SupportCategories } from '@supabase/shared-types/out/constants'
import { useParams } from 'common'
import type { ResponseError } from 'types'
import { Alert, Button } from 'ui'
import { SupportLink } from '../Support/SupportLink'
export interface StorageBucketsErrorProps {
error: ResponseError
}
const StorageBucketsError = ({ error }: StorageBucketsErrorProps) => {
const { ref } = useParams()
return (
<div className="storage-container flex items-center justify-center flex-grow">
<div>
<Alert
withIcon
variant="warning"
title="Failed to fetch buckets"
actions={[
<Button key="contact-support" asChild type="default" className="ml-4">
<SupportLink
queryParams={{
projectRef: ref,
category: SupportCategories.DASHBOARD_BUG,
subject: 'Unable to fetch storage buckets',
}}
>
Contact support
</SupportLink>
</Button>,
]}
>
<p className="mb-1">
Please try refreshing your browser, or contact support if the issue persists
</p>
<p>Error: {(error as any)?.message ?? 'Unknown'}</p>
</Alert>
</div>
</div>
)
}
export default StorageBucketsError