mirror of
https://github.com/supabase/supabase.git
synced 2026-10-10 20:05:06 +03:00
Ivan Vasilov
308cd791a2
This PR preps the monorepo for a migration to Tailwind v4: - Bump all Tailwind dependencies and libraries to the latest possible version, while still compatible with Tailwind 3. - Cleans up obsolete Tailwind 3 specific options and configs. - Cleans up unused CSS files and fixes the CSS imports. - Migrates all `important` uses in `@apply` lines to using the `!` prefix. - Move `typography.css` to the `config` package and import it from the apps. - Migrated all occurrences of `flex-grow`, `flex-shrink`, `overflow-clip` and `overflow-ellipsis` since they're deprecated and will be removed in Tailwind 4. - Make the default theme object typesafe in the `ui` package. - Migrate all `bg-opacity`, `border-opacity`, `ring-opacity` and `divider-opacity` to the new format where they're declared as part of the property color. - Bump and unify all imports of `postcss` dependency.
81 lines
2.6 KiB
TypeScript
81 lines
2.6 KiB
TypeScript
import { LOCAL_STORAGE_KEYS } from 'common'
|
|
import { NextPage } from 'next'
|
|
import { useTheme } from 'next-themes'
|
|
import Image from 'next/legacy/image'
|
|
import Link from 'next/link'
|
|
import { useRouter } from 'next/router'
|
|
import { Button } from 'ui'
|
|
|
|
import { SupportLink } from '@/components/interfaces/Support/SupportLink'
|
|
import { useLocalStorageQuery } from '@/hooks/misc/useLocalStorage'
|
|
import { useSignOut } from '@/lib/auth'
|
|
|
|
const Error500: NextPage = () => {
|
|
const router = useRouter()
|
|
const signOut = useSignOut()
|
|
const { resolvedTheme } = useTheme()
|
|
|
|
const [lastVisitedOrganization] = useLocalStorageQuery(
|
|
LOCAL_STORAGE_KEYS.LAST_VISITED_ORGANIZATION,
|
|
''
|
|
)
|
|
|
|
const onClickLogout = async () => {
|
|
await signOut()
|
|
await router.push('/sign-in')
|
|
router.reload()
|
|
}
|
|
|
|
return (
|
|
<div className="relative mx-auto flex flex-1 w-full flex-col items-center justify-center space-y-6">
|
|
<div className="absolute top-0 mx-auto w-full max-w-7xl px-8 pt-6 sm:px-6 lg:px-8">
|
|
<nav className="relative flex items-center justify-between sm:h-10">
|
|
<div className="flex shrink-0 grow items-center lg:grow-0">
|
|
<div className="flex w-full items-center justify-between md:w-auto">
|
|
<Link href="/projects">
|
|
<Image
|
|
src={
|
|
resolvedTheme?.includes('dark')
|
|
? `${router.basePath}/img/supabase-dark.svg`
|
|
: `${router.basePath}/img/supabase-light.svg`
|
|
}
|
|
alt=""
|
|
height={24}
|
|
width={120}
|
|
/>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
<div className="flex w-[320px] flex-col items-center justify-center space-y-3">
|
|
<h4 className="text-lg">Something went wrong 🤕</h4>
|
|
<p className="text-center">
|
|
Sorry about that, please try again later or feel free to reach out to us if the problem
|
|
persists.
|
|
</p>
|
|
</div>
|
|
<div className="flex items-center space-x-4">
|
|
{router.pathname !== '/organizations' ? (
|
|
<Button asChild>
|
|
<Link
|
|
href={
|
|
!!lastVisitedOrganization ? `/org/${lastVisitedOrganization}` : '/organizations'
|
|
}
|
|
>
|
|
Head back
|
|
</Link>
|
|
</Button>
|
|
) : (
|
|
<Button onClick={onClickLogout}>Head back</Button>
|
|
)}
|
|
<Button type="secondary" asChild>
|
|
<SupportLink>Submit a support request</SupportLink>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Error500
|