[pull] master from supabase:master

apps/design-system/package.json

@@ -45,7 +45,7 @@
     "ui": "workspace:*",
     "ui-patterns": "workspace:*",
     "unist-util-visit": "^5.0.0",
-    "zod": "^3.25.76"
+    "zod": "catalog:"
   },
   "devDependencies": {
     "@shikijs/compat": "^1.1.7",

apps/design-system/registry/default/example/logs-bar-chart.tsx

@@ -14,7 +14,7 @@ export default function LogsBarChartDemo() {
   }).reverse()
 
   return (
-    <div className="w-full">
+    <div className="w-full h-64">
       <LogsBarChart data={data} />
     </div>
   )

apps/docs/content/guides/platform/upgrading.mdx

@@ -166,6 +166,8 @@ In projects using Postgres 17, the following extensions are deprecated:
 - `timescaledb`
 - `pgjwt`
 
-Existing projects on lower versions of Postgres are not impacted, and the extensions will continue to be supported on projects using Postgres 15, until the end of life of Postgres 15 on the Supabase platform.
+Projects planning to upgrade from Postgres 15 to Postgres 17 need to first disable these extensions in the [Supabase Dashboard](/dashboard/project/_/database/extensions).
+
+`pgjwt` was enabled by default on every Supabase project up until Postgres 17. If you weren’t explicitly using `pgjwt` in your project, it’s most likely safe to disable.
 
-Projects planning to upgrade from Postgres 15 to Postgres 17 need to drop the extensions by [disabling them in the Supabase Dashboard](/dashboard/project/_/database/extensions).
+Existing projects on lower versions of Postgres are not impacted, and the extensions will continue to be supported on projects using Postgres 15, until the end of life of Postgres 15 on the Supabase platform.

apps/docs/content/troubleshooting/change-email-associated-with-supabase-account-T5eHNT.mdx

@@ -7,12 +7,13 @@ keywords = [ "email", "account", "authentication" ]
 database_id = "6de3c3a9-8614-48d7-827e-cf41d6a1ce23"
 ---
 
-Currently, there isn't a direct way to change the email address of an existing Supabase account.
-
 If you are using Email Authentication to login into your Supabase account:
 
-- Invite a new email address to your Supabase Organization(s) as an Organization owner.
-- After signing up for a new account with your new email address and confirming you have access to the Organization(s) with your new account, you can leave the Organization(s) from your previous account.
+Go to [**Account Settings > Preferences**](/dashboard/account/me)
+
+- Find your email under **Account Identities** and click the edit icon
+- After saving the new address, an email is sent to _both the old and new email addresses_
+- Your account email is updated after clicking the link _in both emails_
 
 If you are using GitHub Authentication to login into your Supabase account:
 

apps/docs/package.json

@@ -120,7 +120,7 @@
     "uuid": "^9.0.1",
     "valtio": "catalog:",
     "yaml": "^2.4.5",
-    "zod": "^3.25.76"
+    "zod": "catalog:"
   },
   "devDependencies": {
     "@graphiql/toolkit": "^0.9.1",

apps/studio/components/interfaces/Auth/Policies/PolicyEditorPanel/index.tsx

@@ -374,6 +374,9 @@ export const PolicyEditorPanel = memo(function ({
                         <p className="font-mono tracking-tighter">
                           {showCheckBlock ? (
                             <>
+                              {supportWithCheck && showCheckBlock && (
+                                <span className="text-[#ffd700]">) </span>
+                              )}
                               <span className="text-[#569cd6]">with check</span>{' '}
                               <span className="text-[#ffd700]">(</span>
                             </>

apps/studio/components/interfaces/Database/Hooks/EditHookPanel.tsx

@@ -44,6 +44,7 @@ export const EditHookPanel = ({ visible, selectedHook, onClose }: EditHookPanelP
   // hence why this external state as a temporary workaround
   const [events, setEvents] = useState<string[]>(selectedHook?.events ?? [])
   const [eventsError, setEventsError] = useState<string>()
+  const [isSubmitting, setIsSubmitting] = useState(false)
 
   // For HTTP request
   const [httpHeaders, setHttpHeaders] = useState<HTTPArgument[]>(() => {
@@ -65,6 +66,7 @@ export const EditHookPanel = ({ visible, selectedHook, onClose }: EditHookPanelP
       value,
     }))
   })
+
   const [httpParameters, setHttpParameters] = useState<HTTPArgument[]>(() => {
     if (typeof selectedHook === `undefined`) {
       return [{ id: uuidv4(), name: '', value: '' }]
@@ -90,7 +92,7 @@ export const EditHookPanel = ({ visible, selectedHook, onClose }: EditHookPanelP
     projectRef: project?.ref,
     connectionString: project?.connectionString,
   })
-  const [isSubmitting, setIsSubmitting] = useState(false)
+
   const { mutate: createDatabaseTrigger } = useDatabaseTriggerCreateMutation({
     onSuccess: (res) => {
       toast.success(`Successfully created new webhook "${res.name}"`)
@@ -102,6 +104,7 @@ export const EditHookPanel = ({ visible, selectedHook, onClose }: EditHookPanelP
       toast.error(`Failed to create webhook: ${error.message}`)
     },
   })
+
   const { mutate: updateDatabaseTrigger } = useDatabaseTriggerUpdateMutation({
     onSuccess: (res) => {
       setIsSubmitting(false)
@@ -132,13 +135,6 @@ export const EditHookPanel = ({ visible, selectedHook, onClose }: EditHookPanelP
     timeout_ms: Number(selectedHook?.function_args?.[4] ?? 5000),
   }
 
-  useEffect(() => {
-    if (visible) {
-      setIsEdited(false)
-      setIsClosingPanel(false)
-    }
-  }, [visible])
-
   const onClosePanel = () => {
     if (isEdited) setIsClosingPanel(true)
     else onClose()
@@ -262,6 +258,13 @@ export const EditHookPanel = ({ visible, selectedHook, onClose }: EditHookPanelP
     }
   }
 
+  useEffect(() => {
+    if (visible) {
+      setIsEdited(false)
+      setIsClosingPanel(false)
+    }
+  }, [visible])
+
   return (
     <>
       <SidePanel

apps/studio/components/interfaces/Database/Hooks/FormContents.tsx

@@ -51,7 +51,9 @@ export const FormContents = ({
   const restUrlTld = restUrl ? new URL(restUrl).hostname.split('.').pop() : 'co'
 
   const { data: keys = [] } = useAPIKeysQuery({ projectRef: ref, reveal: true })
-  const { data: functions = [] } = useEdgeFunctionsQuery({ projectRef: ref })
+  const { data: functions = [], isSuccess: isSucessEdgeFunctions } = useEdgeFunctionsQuery({
+    projectRef: ref,
+  })
 
   const legacyServiceRole = keys.find((x) => x.name === 'service_role')?.api_key ?? '[YOUR API KEY]'
 
@@ -81,6 +83,8 @@ export const FormContents = ({
   }, [values.function_type])
 
   useEffect(() => {
+    if (!isSucessEdgeFunctions) return
+
     const isEdgeFunctionSelected = isEdgeFunction({ ref, restUrlTld, url: values.http_url })
 
     if (values.http_url && isEdgeFunctionSelected) {
@@ -105,7 +109,7 @@ export const FormContents = ({
       setHttpHeaders(updatedHttpHeaders)
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [values.http_url])
+  }, [values.http_url, isSucessEdgeFunctions])
 
   return (
     <div>

apps/studio/components/interfaces/HomeNew/ActivityStats.tsx

@@ -89,6 +89,7 @@ export const ActivityStats = () => {
             ) : latestBackup ? (
               <TimestampInfo
                 className="text-base"
+                displayAs="utc"
                 label={dayjs(latestBackup.inserted_at).fromNow()}
                 utcTimestamp={latestBackup.inserted_at}
               />

apps/studio/components/interfaces/HomeNew/AdvisorSection.tsx

@@ -85,7 +85,7 @@ export const AdvisorSection = () => {
               return (
                 <Card
                   key={lint.cache_key}
-                  className="h-full flex flex-col items-stretch cursor-pointer"
+                  className="min-h-full flex flex-col items-stretch cursor-pointer h-64"
                   onClick={() => {
                     handleCardClick(lint)
                   }}

apps/studio/components/interfaces/HomeNew/GettingStarted/GettingStarted.tsx

@@ -132,7 +132,7 @@ export function GettingStarted({ steps }: GettingStartedProps) {
           <div className="relative w-full flex-1 min-h-[100px] shrink-0 overflow-hidden">
             {activeStep.image ? (
               <Image
-                className="w-full select-none"
+                className="w-full select-none invert dark:invert-0"
                 src={activeStep.image}
                 fill
                 objectFit="cover"

apps/studio/components/interfaces/HomeNew/ProjectUsageSection.tsx

@@ -344,7 +344,7 @@ export const ProjectUsageSection = () => {
       </div>
       <Row columns={[3, 2, 1]}>
         {enabledServices.map((s) => (
-          <Card key={s.key} className="mb-0 md:mb-0 h-full flex flex-col">
+          <Card key={s.key} className="mb-0 md:mb-0 h-full flex flex-col h-64">
             <CardHeader className="flex flex-row items-end justify-between gap-2 space-y-0 pb-0 border-b-0">
               <div className="flex items-center gap-2">
                 <div className="flex flex-col">
@@ -373,15 +373,19 @@ export const ProjectUsageSection = () => {
                 </div>
               </div>
             </CardHeader>
-            <CardContent className="p-6 pt-4 flex-1">
-              <Loading active={isLoading}>
+            <CardContent className="p-6 pt-4 flex-1 h-full overflow-hidden">
+              <Loading isFullHeight active={isLoading}>
                 <LogsBarChart
                   data={s.data}
-                  height="120px"
                   DateTimeFormat={datetimeFormat}
                   onBarClick={handleBarClick(s.route)}
+                  isFullHeight
                   EmptyState={
-                    <NoDataPlaceholder size="small" message="No data for selected period" />
+                    <NoDataPlaceholder
+                      size="small"
+                      message="No data for selected period"
+                      isFullHeight
+                    />
                   }
                 />
               </Loading>

apps/studio/components/interfaces/OrganizationInvite/OrganizationInvite.tsx

@@ -63,7 +63,24 @@ export const OrganizationInvite = () => {
         'md:w-[400px]'
       )}
     >
-      {isLoadingInvitation ? (
+      {!profile ? (
+        <>
+          <Admonition
+            showIcon={false}
+            type="default"
+            title="Sign in or create an account first to view this invitation"
+            className="mb-0 border-0 rounded-none text-left"
+          />
+          <div className="p-4 border-muted border-t flex gap-x-3 justify-center">
+            <Button asChild type="default">
+              <Link href={loginRedirectLink}>Sign in</Link>
+            </Button>
+            <Button asChild type="default">
+              <Link href={loginRedirectLink}>Create an account</Link>
+            </Button>
+          </div>
+        </>
+      ) : isLoadingInvitation ? (
         <div className="p-5">
           <GenericSkeletonLoader />
         </div>
@@ -85,38 +102,21 @@ export const OrganizationInvite = () => {
         <>
           <div className="flex flex-col gap-y-1 px-6 py-6">
             <p className="text-sm text-foreground-light">You have been invited to join </p>
-            <p className={cn('text-foreground', !!profile ? 'text-2xl' : 'text-3xl')}>
-              {organizationName}
-            </p>
+            <p className="text-foreground text-2xl">{organizationName}</p>
             {isSuccessInvitation && (
               <p className="text-xs text-foreground-lighter">{`Organization slug: ${slug}`}</p>
             )}
           </div>
           <div
             className={cn('border-t border-muted', hasError ? 'bg-alternative' : 'bg-transparent')}
           >
-            {profile === undefined && (
-              <div className="flex flex-col gap-y-4 p-4">
-                <p className="text-sm text-foreground">
-                  Sign in or create an account first to view this invitation
-                </p>
-                <div className="flex justify-center gap-3">
-                  <Button asChild type="default">
-                    <Link href={loginRedirectLink}>Sign in</Link>
-                  </Button>
-                  <Button asChild type="default">
-                    <Link href={loginRedirectLink}>Create an account</Link>
-                  </Button>
-                </div>
-              </div>
-            )}
             <div
               className={cn(
                 'flex flex-col gap-4',
                 !isLoadingInvitation && !hasError && 'px-6 py-4'
               )}
             >
-              {!!profile && hasError && (
+              {hasError && (
                 <OrganizationInviteError data={data} error={error} isError={isErrorInvitation} />
               )}
               {isSuccessInvitation && !hasError && (

apps/studio/components/interfaces/Settings/General/DeleteProjectPanel/DeleteProjectPanel.tsx

@@ -25,7 +25,7 @@ export const DeleteProjectPanel = () => {
 
       <Alert_Shadcn_ variant="destructive">
         <CriticalIcon />
-        <AlertTitle_Shadcn_ className="mt-2">{title}</AlertTitle_Shadcn_>
+        <AlertTitle_Shadcn_>{title}</AlertTitle_Shadcn_>
         <AlertDescription_Shadcn_>{description}</AlertDescription_Shadcn_>
         <div className="mt-2">
           <DeleteProjectButton />

apps/studio/components/interfaces/Settings/Infrastructure/Infrastructure.constants.ts

@@ -37,7 +37,7 @@ export const INFRA_ACTIVITY_METRICS: CategoryMeta[] = [
         attributes: [{ key: 'max_cpu_usage', color: 'white' }],
         name: 'CPU',
         unit: 'percentage',
-        description: 'Max CPU usage of your server',
+        description: 'Max CPU usage of your server.',
         chartDescription: '',
         links: [
           {

apps/studio/components/interfaces/Settings/Infrastructure/InfrastructureInfo.tsx

@@ -92,9 +92,9 @@ const InfrastructureInfo = () => {
       <ScaffoldContainer>
         <ScaffoldSection>
           <ScaffoldSectionDetail>
-            <p>Service Versions</p>
-            <p className="text-foreground-light text-sm">
-              Information on your provisioned instance
+            <h4 className="text-base capitalize m-0">Service Versions</h4>
+            <p className="text-foreground-light text-sm pr-8 mt-1">
+              Information on your provisioned instance.
             </p>
           </ScaffoldSectionDetail>
           <ScaffoldSectionContent>

apps/studio/components/interfaces/Settings/Infrastructure/UpgradeWarnings.tsx

@@ -1,6 +1,7 @@
 import { useParams } from 'common'
 import Link from 'next/link'
-import { Alert_Shadcn_, AlertDescription_Shadcn_, AlertTitle_Shadcn_, Button } from 'ui'
+import { InlineLink } from 'components/ui/InlineLink'
+import { Alert_Shadcn_, AlertDescription_Shadcn_, AlertTitle_Shadcn_, Badge, Button } from 'ui'
 
 export const ReadReplicasWarning = ({ latestPgVersion }: { latestPgVersion: string }) => {
   return (
@@ -64,43 +65,39 @@ export const UnsupportedExtensionsWarning = ({
   const { ref } = useParams()
 
   return (
-    <Alert_Shadcn_
-      variant="warning"
-      title="A new version of Postgres is available for your project"
-    >
-      <AlertTitle_Shadcn_>A new version of Postgres is available</AlertTitle_Shadcn_>
+    <Alert_Shadcn_ title="A newer version of Postgres is available">
+      <AlertTitle_Shadcn_>A newer version of Postgres is available</AlertTitle_Shadcn_>
       <AlertDescription_Shadcn_ className="flex flex-col gap-3">
-        <div>
-          <p className="mb-1">The following extensions have to be removed before upgrading:</p>
+        <>
+          <p className="mb-1">
+            The following extensions are not supported in newer versions of Postgres and must be
+            removed before you can upgrade.{' '}
+            <InlineLink
+              href="https://supabase.com/docs/guides/platform/upgrading#upgrading-to-postgres-17"
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              Learn more
+            </InlineLink>
+            .
+          </p>
 
-          <ul className="pl-4">
+          <ul className="border-t border-border-muted flex flex-col divide-y divide-border-muted">
             {unsupportedExtensions.map((obj: string) => (
-              <li className="list-disc" key={obj}>
-                <Link
-                  href={`/project/${ref}/database/extensions?filter=${obj}`}
-                  className="hover:text-foreground transition"
-                >
-                  {obj}
-                </Link>
+              <li className="py-3 last:pb-0 flex flex-row justify-between gap-2" key={obj}>
+                <div className="flex flex-row gap-2 items-center flex-1 min-w-0">
+                  <p className="overflow-hidden text-ellipsis whitespace-nowrap min-w-0">{obj}</p>
+                  <Badge variant="warning" size="small" className="flex-shrink-0">
+                    Deprecated
+                  </Badge>
+                </div>
+                <Button size="tiny" type="default" asChild>
+                  <Link href={`/project/${ref}/database/extensions?filter=${obj}`}>Manage</Link>
+                </Button>
               </li>
             ))}
           </ul>
-        </div>
-        <p>
-          These extensions are not supported in newer versions of Supabase Postgres. If you are not
-          using them, it is safe to remove them.
-        </p>
-        <div>
-          <Button size="tiny" type="default" asChild>
-            <a
-              href="https://supabase.com/docs/guides/platform/upgrading#extensions"
-              target="_blank"
-              rel="noreferrer"
-            >
-              View docs
-            </a>
-          </Button>
-        </div>
+        </>
       </AlertDescription_Shadcn_>
     </Alert_Shadcn_>
   )