refactor(studio): remove unnecessary buckets query (supabase#41211)

Remove unnecessary unpaginated buckets query from bucket delete modal.

Author: charislam

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

@@ -1,4 +1,3 @@
-import { get as _get, find } from 'lodash'
 import { useRouter } from 'next/router'
 import { toast } from 'sonner'
 
@@ -7,9 +6,9 @@ import { TextConfirmModal } from 'components/ui/TextConfirmModalWrapper'
 import { useDatabasePoliciesQuery } from 'data/database-policies/database-policies-query'
 import { useDatabasePolicyDeleteMutation } from 'data/database-policies/database-policy-delete-mutation'
 import { useBucketDeleteMutation } from 'data/storage/bucket-delete-mutation'
-import { Bucket, useBucketsQuery } from 'data/storage/buckets-query'
+import { Bucket } from 'data/storage/buckets-query'
 import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
-import { formatPoliciesForStorage } from './Storage.utils'
+import { extractBucketNameFromDefinition } from './Storage.utils'
 
 export interface DeleteBucketModalProps {
   visible: boolean
@@ -22,9 +21,6 @@ export const DeleteBucketModal = ({ visible, bucket, onClose }: DeleteBucketModa
   const { ref: projectRef, bucketId } = useParams()
   const { data: project } = useSelectedProjectQuery()
 
-  const { data } = useBucketsQuery({ projectRef })
-  const buckets = data ?? []
-
   const { data: policies } = useDatabasePoliciesQuery({
     projectRef: project?.ref,
     connectionString: project?.connectionString,
@@ -39,20 +35,16 @@ export const DeleteBucketModal = ({ visible, bucket, onClose }: DeleteBucketModa
       if (!project) return console.error('Project is required')
 
       // Clean up policies from the corresponding bucket that was deleted
-      const storageObjectsPolicies = (policies ?? []).filter((policy) => policy.table === 'objects')
-      const formattedStorageObjectPolicies = formatPoliciesForStorage(
-        buckets,
-        storageObjectsPolicies
-      )
-      const bucketPolicies = _get(
-        find(formattedStorageObjectPolicies, { name: bucket.id }),
-        ['policies'],
-        []
-      )
+      const bucketPolicies = (policies ?? []).filter((policy) => {
+        if (policy.table !== 'objects') return false
+
+        const policyBucket = extractBucketNameFromDefinition(policy.definition ?? policy.check)
+        return policyBucket === bucket.name
+      })
 
       try {
         await Promise.all(
-          bucketPolicies.map((policy: any) =>
+          bucketPolicies.map((policy) =>
             deletePolicy({
               projectRef: project?.ref,
               connectionString: project?.connectionString,

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

@@ -43,8 +43,7 @@ export const formatPoliciesForStorage = (buckets: Bucket[], policies: PostgresPo
   return policiesByBucket
 }
 
-/* Start: Internal methods to support formatPoliciesForStorage but exported for tests to cover */
-const formatStoragePolicies = (buckets: any[], policies: any[]) => {
+const formatStoragePolicies = (buckets: Bucket[], policies: PostgresPolicy[]) => {
   const availableBuckets = buckets.map((bucket) => bucket.name)
   const formattedPolicies = policies.map((policy) => {
     const { definition: policyDefinition, check: policyCheck } = policy
@@ -69,23 +68,23 @@ const formatStoragePolicies = (buckets: any[], policies: any[]) => {
   return formattedPolicies
 }
 
-const extractBucketNameFromDefinition = (definition: string) => {
+export const extractBucketNameFromDefinition = (definition: string | null) => {
+  if (!definition) return null
+
   const definitionSegments = definition?.split(' AND ') ?? []
   const [bucketDefinition] = definitionSegments.filter((segment: string) =>
     segment.includes('bucket_id')
   )
   return bucketDefinition ? bucketDefinition.split("'")[1] : null
 }
 
-const groupPoliciesByBucket = (policies: any[]) => {
+const groupPoliciesByBucket = (policies: (PostgresPolicy & { bucket: string })[]) => {
   const policiesByBucket = groupBy(policies, 'bucket')
   return Object.keys(policiesByBucket).map((bucketName) => {
     return { name: bucketName, policies: policiesByBucket[bucketName] }
   })
 }
 
-/* End: Internal methods to support formatPoliciesForStorage but exported for tests to cover */
-
 export const createPayloadsForAddPolicy = (
   bucketName = '',
   policyFormFields: StoragePolicyFormField,