hotfix: Fix Object Storage Object URLs (#10603)

* use cluster id in object urls insted of region id * clean up slightly * add comments * improve * add changeset and version bump * revert `isFeatureEnabled` change * feedback * fix last bug --------- Co-authored-by: Banks Nussman <[email protected]>
linode · Jun 21, 2024 · d1263e7 · d1263e7
1 parent 2561918
commit d1263e7
Show file tree

Hide file tree

Showing 4 changed files with 52 additions and 16 deletions.
diff --git a/packages/manager/CHANGELOG.md b/packages/manager/CHANGELOG.md
@@ -4,6 +4,12 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](http://keepachangelog.com/) and this project adheres to [Semantic Versioning](http://semver.org/).
 
+## [2024-06-21] - v1.121.2
+
+### Fixed:
+
+- Object Storage showing incorrect object URLs ([#10603](https://github.com/linode/manager/pull/10603))
+
 ## [2024-06-11] - v1.121.1
 
 ### Fixed:

diff --git a/packages/manager/package.json b/packages/manager/package.json
@@ -2,7 +2,7 @@
   "name": "linode-manager",
   "author": "Linode",
   "description": "The Linode Manager website",
-  "version": "1.121.1",
+  "version": "1.121.2",
   "private": true,
   "type": "module",
   "bugs": {

diff --git a/packages/manager/src/features/ObjectStorage/BucketDetail/BucketDetail.tsx b/packages/manager/src/features/ObjectStorage/BucketDetail/BucketDetail.tsx
@@ -29,6 +29,8 @@ import {
   queryKey,
   updateBucket,
   useObjectBucketDetailsInfiniteQuery,
+  useObjectStorageBuckets,
+  useObjectStorageClusters,
 } from 'src/queries/objectStorage';
 import { sendDownloadObjectEvent } from 'src/utilities/analytics/customEventAnalytics';
 import { getQueryParamFromQueryString } from 'src/utilities/queryParams';
@@ -53,13 +55,21 @@ import {
 import { CreateFolderDrawer } from './CreateFolderDrawer';
 import { ObjectDetailsDrawer } from './ObjectDetailsDrawer';
 import ObjectTableContent from './ObjectTableContent';
+import { isFeatureEnabled } from 'src/utilities/accountCapabilities';
+import { useFlags } from 'src/hooks/useFlags';
+import { useAccount } from 'src/queries/account/account';
+import { useRegionsQuery } from 'src/queries/regions/regions';
 
 interface MatchParams {
   bucketName: string;
   clusterId: ObjectStorageClusterID;
 }
 
 export const BucketDetail = () => {
+  /**
+   * @note If `Object Storage Access Key Regions` is enabled, clusterId will actually contain
+   * the bucket's region id
+   */
   const match = useRouteMatch<MatchParams>(
     '/object-storage/buckets/:clusterId/:bucketName'
   );
@@ -70,6 +80,36 @@ export const BucketDetail = () => {
   const clusterId = match?.params.clusterId || '';
   const prefix = getQueryParamFromQueryString(location.search, 'prefix');
   const queryClient = useQueryClient();
+
+  const flags = useFlags();
+  const { data: account } = useAccount();
+
+  const isObjMultiClusterEnabled = isFeatureEnabled(
+    'Object Storage Access Key Regions',
+    Boolean(flags.objMultiCluster),
+    account?.capabilities ?? []
+  );
+
+  const { data: regions } = useRegionsQuery();
+
+  const regionsSupportingObjectStorage = regions?.filter((region) =>
+    region.capabilities.includes('Object Storage')
+  );
+
+  const { data: clusters } = useObjectStorageClusters();
+  const { data: buckets } = useObjectStorageBuckets({
+    clusters,
+    isObjMultiClusterEnabled,
+    regions: regionsSupportingObjectStorage,
+  });
+
+  const bucket = buckets?.buckets.find((bucket) => {
+    if (isObjMultiClusterEnabled) {
+      return bucket.label === bucketName && bucket.region === clusterId;
+    }
+    return bucket.label === bucketName && bucket.cluster === clusterId;
+  });
+
   const {
     data,
     error,
@@ -428,9 +468,8 @@ export const BucketDetail = () => {
       </ConfirmationDialog>
       <ObjectDetailsDrawer
         url={
-          selectedObject
-            ? generateObjectUrl(clusterId, bucketName, selectedObject.name)
-                .absolute
+          selectedObject && bucket
+            ? generateObjectUrl(bucket.hostname, selectedObject.name)
             : undefined
         }
         bucketName={bucketName}

diff --git a/packages/manager/src/features/ObjectStorage/utilities.ts b/packages/manager/src/features/ObjectStorage/utilities.ts
@@ -1,24 +1,15 @@
 import { AccountSettings } from '@linode/api-v4/lib/account';
 import {
   ACLType,
-  ObjectStorageClusterID,
   ObjectStorageObject,
 } from '@linode/api-v4/lib/object-storage';
 import { FormikProps } from 'formik';
 
 import { Item } from 'src/components/EnhancedSelect/Select';
-import { OBJECT_STORAGE_DELIMITER, OBJECT_STORAGE_ROOT } from 'src/constants';
+import { OBJECT_STORAGE_DELIMITER } from 'src/constants';
 
-export const generateObjectUrl = (
-  clusterId: ObjectStorageClusterID,
-  bucketName: string,
-  objectName: string
-) => {
-  const path = `${bucketName}.${clusterId}.${OBJECT_STORAGE_ROOT}/${objectName}`;
-  return {
-    absolute: 'https://' + path,
-    path,
-  };
+export const generateObjectUrl = (hostname: string, objectName: string) => {
+  return `https://${hostname}/${objectName}`;
 };
 
 // Objects ending with a / and having a size of 0 are often used to represent