mirror of
https://github.com/supabase/supabase.git
synced 2026-10-16 14:49:10 +03:00
Ivan VasilovandJoshen Lim
05a542ccea
* Add lucide-react to docs (to make the autocomplete work). * Migrate the docs app icons. * Migrate the ui-patterns. * Remove the old icons from ui package. * Migrate the www app from react-feather icons. * Migrate all of studio icons. * Migrate the only component in design-system. * Fix an old import in ui package. Revert an import in docs app. * Fix some pages in www. * Remove unneeded files used in generation of icons. * Fix a prettier error. * Fix more issues in www. * Fix an issue in Log Date picker. * Replace all string sizes with number sizes because the icons grew in some cases. * Fix more imports in security page. * Fix an extra import. * Remove the size prop from all icons if they're in a button and they match the button size. * Minor fixes for docs and www. --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
74 lines
2.4 KiB
TypeScript
74 lines
2.4 KiB
TypeScript
import { DatabaseUpgradeStatus } from '@supabase/shared-types/out/events'
|
|
import { useParams } from 'common'
|
|
import dayjs from 'dayjs'
|
|
import Link from 'next/link'
|
|
import { useState } from 'react'
|
|
import { Alert, Button } from 'ui'
|
|
|
|
import { useProjectUpgradingStatusQuery } from 'data/config/project-upgrade-status-query'
|
|
import { IS_PLATFORM } from 'lib/constants'
|
|
import { X } from 'lucide-react'
|
|
|
|
// [Joshen] Think twice about the category though - it doesn't correspond
|
|
|
|
const ProjectUpgradeFailedBanner = () => {
|
|
const { ref } = useParams()
|
|
const { data } = useProjectUpgradingStatusQuery({ projectRef: ref }, { enabled: IS_PLATFORM })
|
|
const { status, initiated_at, error } = data?.databaseUpgradeStatus ?? {}
|
|
|
|
const key = `supabase-upgrade-${ref}-${initiated_at}`
|
|
const isAcknowledged =
|
|
typeof window !== 'undefined' ? localStorage?.getItem(key) === 'true' ?? false : false
|
|
const [showMessage, setShowMessage] = useState(!isAcknowledged)
|
|
|
|
const isFailed = status === DatabaseUpgradeStatus.Failed
|
|
const initiatedAtUTC = dayjs
|
|
.utc(initiated_at ?? 0)
|
|
.utc()
|
|
.format('DD MMM YYYY HH:mm:ss')
|
|
|
|
const subject = 'Upgrade%20failed%20for%20project'
|
|
const message = `Upgrade information:%0A• Initiated at: ${initiated_at}%0A• Error: ${error}`
|
|
|
|
const acknowledgeMessage = () => {
|
|
setShowMessage(false)
|
|
localStorage.setItem(key, 'true')
|
|
}
|
|
|
|
if (!isFailed || !showMessage) return null
|
|
|
|
return (
|
|
<div className="max-w-7xl">
|
|
<Alert
|
|
withIcon
|
|
variant={'warning'}
|
|
title={`Postgres version upgrade was not successful (Initiated at ${initiatedAtUTC} UTC)`}
|
|
actions={
|
|
<div className="flex items-center h-full space-x-4">
|
|
<Button asChild type="default">
|
|
<Link
|
|
href={`/support/new?category=Database_unresponsive&ref=${ref}&subject=${subject}&message=${message}`}
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
>
|
|
Contact support
|
|
</Link>
|
|
</Button>
|
|
<Button
|
|
type="text"
|
|
className="px-1"
|
|
icon={<X size={16} strokeWidth={1.5} />}
|
|
onClick={() => acknowledgeMessage()}
|
|
/>
|
|
</div>
|
|
}
|
|
>
|
|
Your project and its data are not affected. Please reach out to us via our support form for
|
|
assistance with the upgrade.
|
|
</Alert>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default ProjectUpgradeFailedBanner
|