Files
supabase/apps/studio/components/layouts/IntegrationsLayout/VercelIntegrationWindowLayout.tsx
Ivan Vasilov 56de26fe22 chore: Migrate the monorepo to use Tailwind v4 (#45318)
This PR migrates the whole monorepo to use Tailwind v4:
- Removed `@tailwindcss/container-queries` plugin since it's included by
default in v4,
- Bump all instances of Tailwind to v4. Made minimal changes to the
shared config to remove non-supported features (`alpha` mentions),
- Migrate all apps to be compatible with v4 configs,
- Fix the `typography.css` import in 3 apps,
- Add missing rules which were included by default in v3,
- Run `pnpm dlx @tailwindcss/upgrade` on all apps, which renames a lot
of classes
- Rename all misnamed classes according to
https://tailwindcss.com/docs/upgrade-guide#renamed-utilities in all
apps.

---------

Co-authored-by: Jordi Enric <jordi.err@gmail.com>
2026-04-30 10:53:24 +00:00

37 lines
1.1 KiB
TypeScript

import { useParams } from 'common'
import { PropsWithChildren } from 'react'
import InlineSVG from 'react-inlinesvg'
import IntegrationWindowLayout from './IntegrationWindowLayout'
import { BASE_PATH } from '@/lib/constants'
import { useIntegrationInstallationSnapshot } from '@/state/integration-installation'
const VERCEL_ICON = (
<div className="bg-black shadow-sm rounded-sm p-1 w-8 h-8 flex justify-center items-center text-white">
<InlineSVG src={`${BASE_PATH}/img/icons/vercel-icon.svg`} title="Vercel Icon" className="w-4" />
</div>
)
const VercelIntegrationWindowLayout = ({ children }: PropsWithChildren<{}>) => {
const { externalId } = useParams()
const snapshot = useIntegrationInstallationSnapshot()
const title = externalId
? 'Supabase + Vercel Deploy Button'
: 'Supabase + Vercel Integration Marketplace Connector'
return (
<IntegrationWindowLayout
title={title}
integrationIcon={VERCEL_ICON}
loading={snapshot.loading}
docsHref="https://supabase.com/partners/integrations/vercel"
>
{children}
</IntegrationWindowLayout>
)
}
export default VercelIntegrationWindowLayout