ProjectUpgradeFailedBanner.tsx77 lines · main
1import { SupportCategories } from '@supabase/shared-types/out/constants'
2import { DatabaseUpgradeStatus } from '@supabase/shared-types/out/events'
3import { useParams } from 'common'
4import dayjs from 'dayjs'
5import { Button } from 'ui'
6import { Admonition } from 'ui-patterns'
7
8import { InlineLink } from './InlineLink'
9import { SupportLink } from '@/components/interfaces/Support/SupportLink'
10import { useProjectUpgradingStatusQuery } from '@/data/config/project-upgrade-status-query'
11import { IS_PLATFORM } from '@/lib/constants'
12import { guessLocalTimezone } from '@/lib/dayjs'
13
14// [Joshen] Think twice about the category though - it doesn't correspond
15
16export const ProjectUpgradeFailedBanner = () => {
17 const { ref } = useParams()
18 const { data } = useProjectUpgradingStatusQuery({ projectRef: ref }, { enabled: IS_PLATFORM })
19 const { status, initiated_at, latest_status_at, error } = data?.databaseUpgradeStatus ?? {}
20
21 const isFailed = status === DatabaseUpgradeStatus.Failed
22 const initiatedAt = dayjs
23 .utc(initiated_at ?? 0)
24 .tz(guessLocalTimezone())
25 .format('DD MMM YYYY HH:mm:ss')
26
27 const subject = 'Upgrade failed for project'
28 const message = `Upgrade information:\n• Initiated at: ${initiated_at}\n• Error: ${error}`
29
30 const initiatedAtEncoded = encodeURIComponent(
31 dayjs.utc(initiated_at ?? 0).format('YYYY-MM-DDTHH:mm:ss')
32 )
33 const latestStatusAtEncoded = encodeURIComponent(
34 dayjs
35 .utc(latest_status_at ?? 0)
36 .utcOffset(0)
37 .format('YYYY-MM-DDTHH:mm:ss')
38 )
39 const timestampFilter = `its=${initiatedAtEncoded}&ite=${latestStatusAtEncoded}`
40
41 if (!isFailed) return null
42
43 return (
44 <div className="max-w-7xl">
45 <Admonition
46 type="warning"
47 title={`Postgres version upgrade was not successful (Initiated at ${initiatedAt})`}
48 actions={
49 <Button asChild type="default">
50 <SupportLink
51 queryParams={{
52 category: SupportCategories.DATABASE_UNRESPONSIVE,
53 projectRef: ref,
54 subject,
55 message,
56 }}
57 >
58 Contact support
59 </SupportLink>
60 </Button>
61 }
62 >
63 <div>
64 Your project and its data are not affected. Please reach out to us via our support form
65 for assistance with the upgrade.
66 </div>
67 <div>
68 You may also view logs related to the failed upgrade in your{' '}
69 <InlineLink href={`/project/${ref}/logs/pg-upgrade-logs?${timestampFilter}`}>
70 project's logs
71 </InlineLink>
72 .
73 </div>
74 </Admonition>
75 </div>
76 )
77}