[pull] master from supabase:master

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

@@ -27,9 +27,9 @@ import { getGeneralPolicyTemplates } from './PolicyEditorModal.constants'
 import PolicyEditorModalTitle from './PolicyEditorModalTitle'
 
 interface PolicyEditorModalProps {
-  visible: boolean
-  schema: string
-  table: string
+  visible?: boolean
+  schema?: string
+  table?: string
   selectedPolicyToEdit: any
   showAssistantPreview?: boolean
   onSelectCancel: () => void

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

@@ -4,10 +4,10 @@ import { useState } from 'react'
 import { Badge, HoverCard, HoverCardContent, HoverCardTrigger, Input, cn } from 'ui'
 
 import { Markdown } from 'components/interfaces/Markdown'
-import { SimpleCodeBlock } from 'ui'
 import CardButton from 'components/ui/CardButton'
 import CopyButton from 'components/ui/CopyButton'
-import NoSearchResults from 'components/ui/NoSearchResults'
+import { NoSearchResults } from 'components/ui/NoSearchResults'
+import { SimpleCodeBlock } from 'ui'
 import {
   getGeneralPolicyTemplates,
   getQueuePolicyTemplates,

apps/studio/components/interfaces/Database/Extensions/Extensions.tsx

@@ -6,7 +6,7 @@ import { useEffect, useState } from 'react'
 import { useParams } from 'common'
 import { DocsButton } from 'components/ui/DocsButton'
 import InformationBox from 'components/ui/InformationBox'
-import NoSearchResults from 'components/ui/NoSearchResults'
+import { NoSearchResults } from 'components/ui/NoSearchResults'
 import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader'
 import { useDatabaseExtensionsQuery } from 'data/database-extensions/database-extensions-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'

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

@@ -7,7 +7,7 @@ import { useState } from 'react'
 import AlertError from 'components/ui/AlertError'
 import { ButtonTooltip } from 'components/ui/ButtonTooltip'
 import { DocsButton } from 'components/ui/DocsButton'
-import NoSearchResults from 'components/ui/NoSearchResults'
+import { NoSearchResults } from 'components/ui/NoSearchResults'
 import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader'
 import { useDatabaseHooksQuery } from 'data/database-triggers/database-triggers-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'

apps/studio/components/interfaces/Database/Publications/PublicationsList.tsx

@@ -7,7 +7,7 @@ import { toast } from 'sonner'
 import { useParams } from 'common'
 import AlertError from 'components/ui/AlertError'
 import InformationBox from 'components/ui/InformationBox'
-import NoSearchResults from 'components/ui/NoSearchResults'
+import { NoSearchResults } from 'components/ui/NoSearchResults'
 import { useDatabasePublicationsQuery } from 'data/database-publications/database-publications-query'
 import { useDatabasePublicationUpdateMutation } from 'data/database-publications/database-publications-update-mutation'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'

apps/studio/components/interfaces/Database/Publications/PublicationsTables.tsx

@@ -4,9 +4,9 @@ import Link from 'next/link'
 import { useMemo, useState } from 'react'
 
 import { useParams } from 'common'
-import NoSearchResults from 'components/to-be-cleaned/NoSearchResults'
 import AlertError from 'components/ui/AlertError'
 import { ButtonTooltip } from 'components/ui/ButtonTooltip'
+import { NoSearchResults } from 'components/ui/NoSearchResults'
 import { useDatabasePublicationsQuery } from 'data/database-publications/database-publications-query'
 import { useTablesQuery } from 'data/tables/tables-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
@@ -94,7 +94,7 @@ export const PublicationsTables = () => {
 
       {isSuccess &&
         (tables.length === 0 ? (
-          <NoSearchResults />
+          <NoSearchResults searchString={filterString} onResetFilter={() => setFilterString('')} />
         ) : (
           <Card>
             <Table>

apps/studio/components/interfaces/Database/Roles/RolesList.tsx

@@ -4,21 +4,21 @@ import { Plus, Search, X } from 'lucide-react'
 import { parseAsBoolean, useQueryState } from 'nuqs'
 import { useRef, useState } from 'react'
 
+import type { PostgresRole } from '@supabase/postgres-meta'
 import { ButtonTooltip } from 'components/ui/ButtonTooltip'
-import NoSearchResults from 'components/ui/NoSearchResults'
+import { NoSearchResults } from 'components/ui/NoSearchResults'
 import SparkBar from 'components/ui/SparkBar'
 import { useDatabaseRolesQuery } from 'data/database-roles/database-roles-query'
 import { useMaxConnectionsQuery } from 'data/database/max-connections-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
-import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
 import { handleErrorOnDelete, useQueryStateWithSelect } from 'hooks/misc/useQueryStateWithSelect'
+import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
 import { Badge, Button, Input, Tooltip, TooltipContent, TooltipTrigger } from 'ui'
 import { CreateRolePanel } from './CreateRolePanel'
 import { DeleteRoleModal } from './DeleteRoleModal'
 import { RoleRow } from './RoleRow'
 import { RoleRowSkeleton } from './RoleRowSkeleton'
 import { SUPABASE_ROLES } from './Roles.constants'
-import type { PostgresRole } from '@supabase/postgres-meta'
 
 type SUPABASE_ROLE = (typeof SUPABASE_ROLES)[number]
 

apps/studio/components/interfaces/Database/Tables/ColumnList.tsx

@@ -6,10 +6,10 @@ import { useState } from 'react'
 
 import { PostgresColumn } from '@supabase/postgres-meta'
 import { useParams } from 'common'
-import NoSearchResults from 'components/to-be-cleaned/NoSearchResults'
 import Table from 'components/to-be-cleaned/Table'
 import AlertError from 'components/ui/AlertError'
 import { ButtonTooltip } from 'components/ui/ButtonTooltip'
+import { NoSearchResults } from 'components/ui/NoSearchResults'
 import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader'
 import { useTableEditorQuery } from 'data/table-editor/table-editor-query'
 import { isTableLike } from 'data/table-editor/table-editor-types'
@@ -120,7 +120,10 @@ export const ColumnList = ({
       {isSuccess && (
         <>
           {columns.length === 0 ? (
-            <NoSearchResults />
+            <NoSearchResults
+              searchString={filterString}
+              onResetFilter={() => setFilterString('')}
+            />
           ) : (
             <div>
               <Table

apps/studio/components/interfaces/Home/ProjectList/ProjectList.tsx

@@ -3,7 +3,7 @@ import { UIEvent, useMemo } from 'react'
 import { useDebounce } from '@uidotdev/usehooks'
 import { LOCAL_STORAGE_KEYS, useParams } from 'common'
 import AlertError from 'components/ui/AlertError'
-import NoSearchResults from 'components/ui/NoSearchResults'
+import { NoSearchResults } from 'components/ui/NoSearchResults'
 import { useGitHubConnectionsQuery } from 'data/integrations/github-connections-query'
 import { useOrgIntegrationsQuery } from 'data/integrations/integrations-query-org-only'
 import { usePermissionsQuery } from 'data/permissions/permissions-query'

apps/studio/components/interfaces/Integrations/Landing/AvailableIntegrations.tsx

@@ -2,7 +2,7 @@ import { Search } from 'lucide-react'
 import { parseAsString, useQueryState } from 'nuqs'
 
 import AlertError from 'components/ui/AlertError'
-import NoSearchResults from 'components/ui/NoSearchResults'
+import { NoSearchResults } from 'components/ui/NoSearchResults'
 import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled'
 import { buttonVariants, cn, Tabs_Shadcn_, TabsList_Shadcn_, TabsTrigger_Shadcn_ } from 'ui'
 import { Admonition } from 'ui-patterns/admonition'

apps/studio/components/interfaces/Organization/BillingSettings/Subscription/SubscriptionPlanUpdateDialog.tsx

@@ -672,19 +672,6 @@ export const SubscriptionPlanUpdateDialog = ({
                         </div>
                       ))}
                     </div>
-
-                    {currentPlanMeta.id === 'free' && selectedTier !== 'tier_free' && (
-                      <div className="mb-4">
-                        <Admonition type="note">
-                          <p>
-                            Please note: Existing support cases will remain in the Free support
-                            queue after your subscription is upgraded. For faster assistance under
-                            your new plan, please open a new support case once the upgrade is
-                            complete.
-                          </p>
-                        </Admonition>
-                      </div>
-                    )}
                   </div>
                 )}
           </div>

apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/index.tsx

@@ -11,7 +11,6 @@ import {
   convertKVStringArrayToJson,
   formatWrapperTables,
 } from 'components/interfaces/Integrations/Wrappers/Wrappers.utils'
-import { useSelectedBucket } from 'components/interfaces/Storage/StorageExplorer/useSelectedBucket'
 import {
   ScaffoldContainer,
   ScaffoldSection,
@@ -25,7 +24,6 @@ import {
 } from 'data/database-extensions/database-extensions-query'
 import { useReplicationPipelineStatusQuery } from 'data/etl/pipeline-status-query'
 import { useStartPipelineMutation } from 'data/etl/start-pipeline-mutation'
-import { AnalyticsBucket } from 'data/storage/analytics-buckets-query'
 import { useIcebergNamespacesQuery } from 'data/storage/iceberg-namespaces-query'
 import { useIcebergWrapperCreateMutation } from 'data/storage/iceberg-wrapper-create-mutation'
 import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
@@ -34,6 +32,7 @@ import { Button, Card, CardContent } from 'ui'
 import { Admonition } from 'ui-patterns/admonition'
 import { GenericTableLoader } from 'ui-patterns/ShimmeringLoader'
 import { DeleteAnalyticsBucketModal } from '../DeleteAnalyticsBucketModal'
+import { useSelectedAnalyticsBucket } from '../useSelectedAnalyticsBucket'
 import { BucketHeader } from './BucketHeader'
 import { ConnectTablesDialog } from './ConnectTablesDialog'
 import { NamespaceWithTables } from './NamespaceWithTables'
@@ -48,12 +47,11 @@ export const AnalyticBucketDetails = () => {
   const { data: project } = useSelectedProjectQuery()
   const { state: extensionState } = useIcebergWrapperExtension()
   const {
-    bucket: _bucket,
+    data: bucket,
     error: bucketError,
     isSuccess: isSuccessBucket,
     isError: isErrorBucket,
-  } = useSelectedBucket()
-  const bucket = _bucket as undefined | AnalyticsBucket
+  } = useSelectedAnalyticsBucket()
 
   const [modal, setModal] = useState<'delete' | null>(null)
   // [Joshen] Namespaces are now created asynchronously when the pipeline is started, so long poll after
@@ -332,7 +330,7 @@ export const AnalyticBucketDetails = () => {
                 </div>
                 <Button
                   type="danger"
-                  disabled={!isSuccessBucket}
+                  disabled={!bucket?.id || !isSuccessBucket}
                   onClick={() => setModal('delete')}
                 >
                   Delete bucket

apps/studio/components/interfaces/Storage/AnalyticsBuckets/CreateAnalyticsBucketModal.tsx

@@ -125,6 +125,8 @@ export const CreateAnalyticsBucketModal = ({
 
   const config = BUCKET_TYPES['analytics']
   const isCreating = isEnablingExtension || isCreatingIcebergWrapper || isCreatingAnalyticsBucket
+  const isDisabled =
+    !canCreateBuckets || !icebergCatalogEnabled || isLoading || buckets.length >= 2 || disabled
 
   const form = useForm<CreateAnalyticsBucketForm>({
     resolver: zodResolver(FormSchema),
@@ -192,13 +194,8 @@ export const CreateAnalyticsBucketModal = ({
           type={buttonType}
           className={buttonClassName}
           icon={<Plus size={14} />}
-          disabled={
-            !canCreateBuckets ||
-            !icebergCatalogEnabled ||
-            isLoading ||
-            buckets.length >= 2 ||
-            disabled
-          }
+          disabled={isDisabled}
+          tabIndex={isDisabled ? -1 : 0}
           style={{ justifyContent: 'start' }}
           onClick={() => setVisible(true)}
           tooltip={{

apps/studio/components/interfaces/Storage/AnalyticsBuckets/index.tsx

@@ -13,7 +13,6 @@ import {
   Badge,
   Button,
   Card,
-  cn,
   Table,
   TableBody,
   TableCell,
@@ -163,18 +162,23 @@ export const AnalyticsBuckets = () => {
                     </TableRow>
                   )}
                   {analyticsBuckets.map((bucket) => (
-                    <TableRow key={bucket.id} className="relative cursor-pointer h-16">
+                    <TableRow
+                      key={bucket.id}
+                      className="relative cursor-pointer h-16 inset-focus"
+                      onClick={(event) => handleBucketNavigation(bucket.id, event)}
+                      onKeyDown={(event) => {
+                        if (event.key === 'Enter' || event.key === ' ') {
+                          event.preventDefault()
+                          handleBucketNavigation(bucket.id, event)
+                        }
+                      }}
+                      tabIndex={0}
+                    >
                       <TableCell className="w-2 pr-1">
                         <BucketIcon size={16} className="text-foreground-muted" />
                       </TableCell>
                       <TableCell>
                         <p className="whitespace-nowrap max-w-[512px] truncate">{bucket.id}</p>
-                        <button
-                          className={cn('absolute inset-0', 'inset-focus')}
-                          onClick={(event) => handleBucketNavigation(bucket.id, event)}
-                        >
-                          <span className="sr-only">Go to table details</span>
-                        </button>
                       </TableCell>
 
                       <TableCell>

apps/studio/components/interfaces/Storage/AnalyticsBuckets/useSelectedAnalyticsBucket.ts

@@ -0,0 +1,18 @@
+import { useParams } from 'common'
+import { useIsAnalyticsBucketsEnabled } from 'data/config/project-storage-config-query'
+import { useAnalyticsBucketsQuery } from 'data/storage/analytics-buckets-query'
+
+export const useSelectedAnalyticsBucket = () => {
+  const { ref, bucketId } = useParams()
+  const hasIcebergEnabled = useIsAnalyticsBucketsEnabled({ projectRef: ref })
+
+  return useAnalyticsBucketsQuery(
+    { projectRef: ref },
+    {
+      enabled: hasIcebergEnabled,
+      select(data) {
+        return data.find((x) => x.id === bucketId)
+      },
+    }
+  )
+}

apps/studio/components/interfaces/Storage/CreateBucketModal.tsx

@@ -214,6 +214,7 @@ export const CreateBucketModal = ({
           disabled={!canCreateBuckets}
           style={{ justifyContent: 'start' }}
           onClick={() => setVisible(true)}
+          tabIndex={!canCreateBuckets ? -1 : 0}
           tooltip={{
             content: {
               side: 'bottom',

apps/studio/components/interfaces/Storage/FilesBuckets/BucketTable.tsx

@@ -10,7 +10,7 @@ import { formatBytes } from 'lib/helpers'
 import { ChevronRight } from 'lucide-react'
 import { useRouter } from 'next/navigation'
 import type React from 'react'
-import { Badge, cn, TableCell, TableHead, TableHeader, TableRow } from 'ui'
+import { Badge, TableCell, TableHead, TableHeader, TableRow } from 'ui'
 
 type BucketTableMode = 'standard' | 'virtualized'
 
@@ -100,7 +100,18 @@ export const BucketTableRow = ({
   }
 
   return (
-    <BucketTableRow key={bucket.id} className="relative cursor-pointer h-16">
+    <BucketTableRow
+      key={bucket.id}
+      className="relative cursor-pointer h-16 group inset-focus"
+      onClick={(event) => handleBucketNavigation(bucket.id, event)}
+      onKeyDown={(event) => {
+        if (event.key === 'Enter' || event.key === ' ') {
+          event.preventDefault()
+          handleBucketNavigation(bucket.id, event)
+        }
+      }}
+      tabIndex={0}
+    >
       <BucketTableCell className="w-2 pr-1">
         <BucketIcon size={16} className="text-foreground-muted" />
       </BucketTableCell>
@@ -109,12 +120,6 @@ export const BucketTableRow = ({
           <p className="whitespace-nowrap max-w-[512px] truncate">{bucket.id}</p>
           {bucket.public && <Badge variant="warning">Public</Badge>}
         </div>
-        <button
-          className={cn('absolute inset-0', 'inset-focus')}
-          onClick={(event) => handleBucketNavigation(bucket.id, event)}
-        >
-          <span className="sr-only">Go to bucket details</span>
-        </button>
       </BucketTableCell>
 
       <BucketTableCell>

apps/studio/components/interfaces/Storage/FilesBuckets/index.tsx

@@ -80,7 +80,7 @@ export const FilesBuckets = () => {
               />
               <DropdownMenu>
                 <DropdownMenuTrigger asChild>
-                  <Button type="default" icon={<ArrowDownNarrowWide />}>
+                  <Button tabIndex={0} type="default" icon={<ArrowDownNarrowWide />}>
                     Sorted by {snap.sortBucket === 'alphabetical' ? 'name' : 'created at'}
                   </Button>
                 </DropdownMenuTrigger>

apps/studio/components/interfaces/Storage/FilesBuckets/useSelectedBucket.ts

@@ -0,0 +1,15 @@
+import { useParams } from 'common'
+import { useBucketsQuery } from 'data/storage/buckets-query'
+
+export const useSelectedBucket = () => {
+  const { ref, bucketId } = useParams()
+
+  return useBucketsQuery(
+    { projectRef: ref },
+    {
+      select(data) {
+        return data.find((b) => b.id === bucketId)
+      },
+    }
+  )
+}

apps/studio/components/interfaces/Storage/Storage.utils.ts

@@ -1,6 +1,8 @@
+import { PostgresPolicy } from '@supabase/postgres-meta'
 import { difference, groupBy } from 'lodash'
 import { useRouter } from 'next/router'
 
+import { Bucket } from 'data/storage/buckets-query'
 import { STORAGE_CLIENT_LIBRARY_MAPPINGS } from './Storage.constants'
 import type { StoragePolicyFormField } from './Storage.types'
 
@@ -20,8 +22,8 @@ const shortHash = (str: string) => {
  * Output: [{ bucket: <string>, policies: <Policy[]> }]
  * @param {Array} policies: All policies from a table in a schema
  */
-export const formatPoliciesForStorage = (buckets: any[], policies: any[]) => {
-  if (policies.length === 0) return policies
+export const formatPoliciesForStorage = (buckets: Bucket[], policies: PostgresPolicy[]) => {
+  if (policies.length === 0) return []
 
   /**
    * Format policies from storage objects to: