[pull] master from supabase:master

apps/docs/app/contributing/content.mdx

@@ -472,14 +472,6 @@ void main() async {
 </TabPanel>
 </Tabs>
 
-### Info Tooltip
-
-The <InfoTooltip tooltipContent="This is an info tooltip">InfoTooltip</InfoTooltip> component is used to add more context to a word or phrase via tooltip.
-
-```mdx
-<InfoTooltip tooltipContent="The Postgres Development Platform.">Supabase</InfoTooltip>
-```
-
 ## Partials
 
 We incorporate content reuse in the docs to avoid duplication. If you find yourself writing the same content over and over, you can put it in a partial instead. Here are some examples of commonly used partials:

apps/docs/components/ProjectConfigVariables/ProjectConfigVariables.ComboBox.tsx

@@ -86,6 +86,7 @@ export function ComboBox<Opt extends ComboBoxOption>({
           role="combobox"
           disabled={disabled}
           aria-expanded={open}
+          aria-label={`Select your ${name}`}
           className={cn(
             'overflow-hidden',
             'h-auto min-h-10',

apps/docs/components/RealtimeLimitsEstimator/RealtimeLimitsEstimator.tsx

@@ -2,7 +2,7 @@ import throughputTable from '~/data/realtime/throughput.json'
 import { ChevronDown } from 'lucide-react'
 import { useState } from 'react'
 import {
-  Button,
+  cn,
   Collapsible,
   CollapsibleContent,
   CollapsibleTrigger,
@@ -138,22 +138,17 @@ export default function RealtimeLimitsEstimater({}) {
       )}
 
       <Collapsible open={expandPreview} onOpenChange={setExpandPreview}>
-        <CollapsibleTrigger asChild>
-          <div className="py-1 flex items-center">
-            <p className="text-sm">View raw throughput table</p>
-            <Button
-              variant="text"
-              icon={
-                <ChevronDown
-                  size={18}
-                  strokeWidth={2}
-                  className={expandPreview ? 'rotate-180' : undefined}
-                />
-              }
-              className="px-1"
-              onClick={() => setExpandPreview(!expandPreview)}
-            />
-          </div>
+        <CollapsibleTrigger className="group text-base py-1 flex items-center gap-1 cursor-pointer select-none mb-10 text-foreground-light hover:text-foreground transition-colors">
+          View raw throughput table
+          <ChevronDown
+            size={14}
+            strokeWidth={2}
+            aria-hidden
+            className={cn(
+              'text-foreground-lighter group-hover:text-foreground transition-colors',
+              expandPreview && 'rotate-180'
+            )}
+          />
         </CollapsibleTrigger>
         <CollapsibleContent>
           <div>

apps/docs/content/guides/local-development/declarative-database-schemas.mdx

@@ -7,7 +7,7 @@ subtitle: 'Manage your database schemas in one place and generate versioned migr
 
 ## Overview
 
-Declarative schemas provide a developer-friendly way to maintain <InfoTooltip tooltipContent={<><p>Files of SQL statements that track the evolution of your database schema over time.<br />They allow you to version control your database schema alongside your application code.</p><p>See the <Link href="/guides/deployment/database-migrations" className="underline">database migrations</Link> guide to learn more.</p></>}>schema migrations</InfoTooltip>.
+Declarative schemas provide a developer-friendly way to maintain [schema migrations](#schema-migrations).
 
 [Migrations](/docs/guides/deployment/database-migrations) are traditionally managed imperatively (you provide the instructions on how exactly to change the database). This can lead to related information being scattered over multiple migration files. With declarative schemas, you instead declare the state you want your database to be in, and the instructions are generated for you.
 

apps/docs/features/docs/MdxBase.shared.tsx

@@ -27,7 +27,6 @@ import { NamedCodeBlock } from '~/features/directives/CodeTabs.components'
 import { MdxAnchor } from '~/features/docs/MdxAnchor'
 import { Accordion, AccordionItem } from '~/features/ui/Accordion'
 import { CodeBlock } from '~/features/ui/CodeBlock/CodeBlock'
-import InfoTooltip from '~/features/ui/InfoTooltip'
 import { ShowUntil } from '~/features/ui/ShowUntil'
 import { TabPanel, Tabs } from '~/features/ui/Tabs'
 import { ArrowDown, Check, X } from 'lucide-react'
@@ -114,7 +113,6 @@ const components = {
   TabPanel,
   TerraformProviderSchema,
   WrapperDashboardIntegration,
-  InfoTooltip,
   a: MdxAnchor,
   h2: (props: ComponentPropsWithoutRef<'h2'>) => (
     <Heading tag="h2" {...props}>

apps/docs/layouts/MainSkeleton.tsx

@@ -214,6 +214,8 @@ const MobileHeader = memo(function MobileHeader(props: MobileHeaderProps) {
           mobileMenuOpen && 'mt-0.5'
         )}
         onClick={() => menuState.setMenuMobileOpen(!mobileMenuOpen)}
+        aria-label={mobileMenuOpen ? 'Close menu' : 'Open menu'}
+        aria-expanded={mobileMenuOpen}
       >
         <div
           className={cn(

apps/kb/src/components/Footer.astro

@@ -0,0 +1,79 @@
+---
+import { CheckCircle, FlaskConical, LifeBuoy } from 'lucide-react'
+import { IconDiscord, IconGitHubSolid, IconTwitterX, IconYoutubeSolid } from 'ui'
+
+const primaryLinks = [
+	{
+		Icon: LifeBuoy,
+		text: 'Need some help?',
+		ctaLabel: 'Contact support',
+		url: 'https://supabase.com/support',
+	},
+	{
+		Icon: FlaskConical,
+		text: 'Latest product updates?',
+		ctaLabel: 'See Changelog',
+		url: 'https://supabase.com/changelog',
+	},
+	{
+		Icon: CheckCircle,
+		text: "Something's not right?",
+		ctaLabel: 'Check system status',
+		url: 'https://status.supabase.com/',
+	},
+]
+
+const secondaryLinks = [
+	{ title: 'Open Source', url: 'https://supabase.com/open-source' },
+	{ title: 'SupaSquad', url: 'https://supabase.com/supasquad' },
+	{ title: 'Privacy', url: 'https://supabase.com/privacy' },
+]
+---
+
+<footer role="contentinfo" aria-label="footer" class="max-w-6xl px-6 mx-auto pt-12 pb-6">
+	<ul class="flex flex-col gap-2">
+		{
+			primaryLinks.map(({ Icon, text, ctaLabel, url }) => (
+				<li class="flex items-center gap-1 text-xs text-foreground-lighter">
+					<Icon aria-hidden="true" size={16} strokeWidth={1} />
+					<p>{text}</p>
+					<a href={url} class="text-brand-link hover:underline" target="_blank" rel="noreferrer noopener">
+						{ctaLabel}
+					</a>
+				</li>
+			))
+		}
+	</ul>
+	<hr class="border-default my-6" />
+	<div class="flex gap-4 items-center justify-between flex-wrap">
+		<div class="flex flex-col lg:flex-row gap-3">
+			<a href="https://supabase.com/" class="text-xs text-foreground-lighter">&copy; Supabase Inc</a>
+			<span class="text-xs text-foreground-lighter">—</span>
+			{
+				secondaryLinks.map(({ title, url }) => (
+					<a href={url} class="text-xs text-foreground-lighter hover:underline">
+						{title}
+					</a>
+				))
+			}
+		</div>
+		<div class="flex items-center gap-4">
+			<a href="https://twitter.com/supabase" class="text-foreground-muted hover:text-foreground transition">
+				<span class="sr-only">Twitter</span>
+				<IconTwitterX size={14} />
+			</a>
+			<a href="https://github.com/supabase" class="text-foreground-muted hover:text-foreground transition">
+				<span class="sr-only">GitHub</span>
+				<IconGitHubSolid size={14} />
+			</a>
+			<a href="https://discord.supabase.com/" class="text-foreground-muted hover:text-foreground transition">
+				<span class="sr-only">Discord</span>
+				<IconDiscord size={14} />
+			</a>
+			<a href="https://youtube.com/c/supabase" class="text-foreground-muted hover:text-foreground transition">
+				<span class="sr-only">Youtube</span>
+				<IconYoutubeSolid size={14} />
+			</a>
+		</div>
+	</div>
+</footer>

apps/kb/src/layouts/Layout.astro

@@ -1,4 +1,5 @@
 ---
+import Footer from '../components/Footer.astro'
 import { Header } from '../components/Header'
 import '../styles/globals.css'
 
@@ -62,7 +63,10 @@ const { title, description } = Astro.props
 	</head>
 	<body>
 		<Header client:load />
-		<slot />
+		<main>
+			<slot />
+		</main>
+		<Footer />
 	</body>
 </html>
 

apps/studio/components/interfaces/Account/AccessTokens/Scoped/Form/NewScopedTokenSuccess.tsx

@@ -4,14 +4,40 @@ import { Button, Checkbox, ScrollArea, SheetFooter } from 'ui'
 import { Admonition } from 'ui-patterns/Admonition'
 import { Input } from 'ui-patterns/DataInputs/Input'
 
+import { useTrack } from '@/lib/telemetry/track'
+
 interface TokenSuccessProps {
   tokenName: string
   tokenValue: string
+  tokenType: 'classic' | 'scoped'
   onClose: () => void
 }
 
-export const NewScopedTokenSuccess = ({ tokenName, tokenValue, onClose }: TokenSuccessProps) => {
+export const NewScopedTokenSuccess = ({
+  tokenName,
+  tokenValue,
+  tokenType,
+  onClose,
+}: TokenSuccessProps) => {
+  const track = useTrack()
   const [keyCopied, setKeyCopied] = useState(false)
+  const [hasCopiedToken, setHasCopiedToken] = useState(false)
+
+  const handleCopy = () => {
+    setHasCopiedToken(true)
+    track('access_token_copied', { tokenType })
+    toast.success('Token copied to clipboard')
+  }
+
+  const handleAcknowledge = (isChecked: boolean) => {
+    setKeyCopied(isChecked)
+    track('access_token_stored_checkbox_clicked', { tokenType, isChecked })
+  }
+
+  const handleDone = () => {
+    track('access_token_done_button_clicked', { tokenType, hasCopiedToken })
+    onClose()
+  }
 
   return (
     <>
@@ -33,7 +59,7 @@ export const NewScopedTokenSuccess = ({ tokenName, tokenValue, onClose }: TokenS
             value={tokenValue}
             onChange={() => {}}
             aria-label={`${tokenName} token`}
-            onCopy={() => toast.success('Token copied to clipboard')}
+            onCopy={handleCopy}
           />
 
           <Admonition
@@ -46,7 +72,7 @@ export const NewScopedTokenSuccess = ({ tokenName, tokenValue, onClose }: TokenS
               <Checkbox
                 id="key-copied"
                 checked={keyCopied}
-                onCheckedChange={(v) => setKeyCopied(Boolean(v))}
+                onCheckedChange={(v) => handleAcknowledge(Boolean(v))}
               />
               <span className="text-sm text-warning cursor-pointer select-none">
                 I have copied the key and stored it securely
@@ -56,7 +82,7 @@ export const NewScopedTokenSuccess = ({ tokenName, tokenValue, onClose }: TokenS
         </div>
       </ScrollArea>
       <SheetFooter className="mt-auto flex w-full items-center justify-between! border-t py-4">
-        <Button className="ml-auto" disabled={!keyCopied} onClick={onClose}>
+        <Button className="ml-auto" disabled={!keyCopied} onClick={handleDone}>
           Done
         </Button>
       </SheetFooter>