fix: improve error handling for upload cases in storage explorer (#43054)

This pull request refactors and improves error handling in the
`createStorageExplorerState` function within
`apps/studio/state/storage-explorer.tsx`. The changes make the switch
statement more robust and readable by introducing block scoping for each
case and handling additional error scenarios with more specific
messages.

* Refactored the switch statement to use block scoping (`{}`) for each
case, improving readability and preventing variable leakage between
cases.
* Enhanced the handling of HTTP 400 errors by checking the response body
for specific error messages, and displaying more precise error toasts
for "Invalid key" and "Invalid Compact JWS" cases.
* Added a default case to the switch statement to catch and display any
other error messages not explicitly handled, ensuring users receive
feedback for unexpected errors.

apps/studio/state/storage-explorer.tsx

@@ -1215,7 +1215,7 @@ function createStorageExplorerState({
                   const status = error.originalResponse?.getStatus()
 
                   switch (status) {
-                    case 415:
+                    case 415: {
                       // Unsupported mime type
                       toast.error(
                         capitalize(
@@ -1227,20 +1227,38 @@ function createStorageExplorerState({
                         }
                       )
                       break
-                    case 413:
+                    }
+                    case 413: {
                       // Payload too large
                       toast.error(
                         `Failed to upload ${file.name}: File size exceeds the bucket file size limit.`
                       )
                       break
-                    case 409:
+                    }
+                    case 409: {
                       // Resource already exists
                       toast.error(`Failed to upload ${file.name}: File name already exists.`)
                       break
-                    case 400:
-                      // Invalid key
-                      toast.error(`Failed to upload ${file.name}: File name is invalid`)
+                    }
+                    case 400: {
+                      const responseBody = error.originalResponse?.getBody()
+                      if (typeof responseBody === 'string') {
+                        if (responseBody.includes('Invalid key:')) {
+                          toast.error(`Failed to upload ${file.name}: File name is invalid.`)
+                          break
+                        }
+
+                        if (responseBody.includes('Invalid Compact JWS')) {
+                          toast.error(`Failed to upload ${file.name}: Invalid Compact JWS.`)
+                          break
+                        }
+                      }
+                      // if it's not handled by the two ifs, fallthrough to the default case which shows the generic error message
+                    }
+                    default: {
+                      toast.error(`Failed to upload ${file.name}: ${error.message}`)
                       break
+                    }
                   }
                 } else {
                   toast.error(`Failed to upload ${file.name}: ${error.message}`)