Merge pull request #9490 from supabase/chore/fix-storage-policies-not-showing-policy-with-bucket-id-as-variable

Fix storage policies not showing policies with bucket id as variable

studio/components/layouts/StorageLayout/StorageLayout.tsx

@@ -36,6 +36,7 @@ const StorageLayout: FC<Props> = ({ title, children }) => {
     createBucket,
     deleteBucket,
     toggleBucketPublic,
+    buckets,
   } = storageExplorerStore || {}
 
   const { services, isLoading } = useProjectSettings(ref as string | undefined)
@@ -76,7 +77,10 @@ const StorageLayout: FC<Props> = ({ title, children }) => {
     if (res) {
       const policies = meta.policies.list()
       const storageObjectsPolicies = filter(policies, { table: 'objects' })
-      const formattedStorageObjectPolicies = formatPoliciesForStorage(storageObjectsPolicies)
+      const formattedStorageObjectPolicies = formatPoliciesForStorage(
+        buckets,
+        storageObjectsPolicies
+      )
       const bucketPolicies = _get(
         find(formattedStorageObjectPolicies, { name: bucket.name }),
         ['policies'],

studio/components/to-be-cleaned/Storage/Storage.utils.ts

@@ -18,7 +18,7 @@ export const shortHash = (str: string) => {
  * Output: [{ bucket: <string>, policies: <Policy[]> }]
  * @param {Array} policies: All policies from a table in a schema
  */
-export const formatPoliciesForStorage = (policies: any[]) => {
+export const formatPoliciesForStorage = (buckets: any[], policies: any[]) => {
   if (policies.length === 0) return policies
 
   /**
@@ -28,7 +28,7 @@ export const formatPoliciesForStorage = (policies: any[]) => {
    *  - Strip away bucket_id from definitions
    *  Note, if the policy definition has no bucket_id, we skip the formatting
    */
-  const formattedPolicies = formatStoragePolicies(policies)
+  const formattedPolicies = formatStoragePolicies(buckets, policies)
 
   /**
    * Package policies by grouping them by bucket:
@@ -40,7 +40,8 @@ export const formatPoliciesForStorage = (policies: any[]) => {
 }
 
 /* Start: Internal methods to support formatPoliciesForStorage but exported for tests to cover */
-export const formatStoragePolicies = (policies: any[]) => {
+export const formatStoragePolicies = (buckets: any[], policies: any[]) => {
+  const availableBuckets = buckets.map((bucket) => bucket.name)
   const formattedPolicies = policies.map((policy) => {
     const { definition: policyDefinition, check: policyCheck } = policy
 
@@ -49,7 +50,7 @@ export const formatStoragePolicies = (policies: any[]) => {
         ? extractBucketNameFromDefinition(policyDefinition)
         : extractBucketNameFromDefinition(policyCheck)
 
-    if (bucketName) {
+    if (bucketName && availableBuckets.includes(bucketName)) {
       // [JOSHEN TODO] We cannot override definition here anymore cause we're gonna be using the auth editor
       // const definition = policyDefinition !== null ? policyDefinition : policyCheck
       return {

studio/components/to-be-cleaned/Storage/StoragePolicies/StoragePolicies.js

@@ -35,7 +35,7 @@ const StoragePolicies = () => {
 
   // Policies under storage.objects
   const storageObjectsPolicies = filter(policies, { table: 'objects' })
-  const formattedStorageObjectPolicies = formatPoliciesForStorage(storageObjectsPolicies)
+  const formattedStorageObjectPolicies = formatPoliciesForStorage(buckets, storageObjectsPolicies)
   const ungroupedPolicies = get(
     find(formattedStorageObjectPolicies, { name: 'Ungrouped' }),
     ['policies'],