Add object actions - presigned URL

red-hat-storage · Oct 2, 2024 · 050d868 · 050d868
1 parent eb8baf6
commit 050d868
Show file tree

Hide file tree

Showing 12 changed files with 336 additions and 51 deletions.
diff --git a/locales/en/plugin__odf-console.json b/locales/en/plugin__odf-console.json
@@ -1104,7 +1104,6 @@
   "Edit bucket": "Edit bucket",
   "Objects": "Objects",
   "Refresh": "Refresh",
-  "Created on: ": "Created on: ",
   "Created via OBC": "Created via OBC",
   "Created via S3": "Created via S3",
   "MCG": "MCG",
@@ -1125,7 +1124,6 @@
   "Size": "Size",
   "Last modified": "Last modified",
   "Download": "Download",
-  "Copy Object URL": "Copy Object URL",
   "Preview": "Preview",
   "Share with presigned URL": "Share with presigned URL",
   "No objects found": "No objects found",
@@ -1292,6 +1290,21 @@
   "and": "and",
   "GiB RAM": "GiB RAM",
   "Configure Performance": "Configure Performance",
+  "Expires after": "Expires after",
+  "minus": "minus",
+  "plus": "plus",
+  "Validity period of the presigned URL.": "Validity period of the presigned URL.",
+  "Share link": "Share link",
+  "Valid until: ": "Valid until: ",
+  "Copy": "Copy",
+  "Copied": "Copied",
+  "This URL will automatically expire based on your configured time or when your current session expires.": "This URL will automatically expire based on your configured time or when your current session expires.",
+  "Share object with a presigned URL": "Share object with a presigned URL",
+  "Grant third-party access to an object for a limited time.": "Grant third-party access to an object for a limited time.",
+  "Copy presigned URL to clipboard": "Copy presigned URL to clipboard",
+  "Create presigned URL": "Create presigned URL",
+  "Object: ": "Object: ",
+  "A third-party entity can access the object using this presigned URL, which allows sharing without requiring a login, until the URL expires.": "A third-party entity can access the object using this presigned URL, which allows sharing without requiring a login, until the URL expires.",
   "hr": "hr",
   "min": "min",
   "Select at least 2 Backing Store resources": "Select at least 2 Backing Store resources",
@@ -1444,7 +1457,6 @@
   "Reason": "Reason",
   "Message": "Message",
   "No conditions found": "No conditions found",
-  "Copied": "Copied",
   "View documentation": "View documentation",
   "Oh no! Something went wrong.": "Oh no! Something went wrong.",
   "Copied to clipboard": "Copied to clipboard",

diff --git a/package.json b/package.json
@@ -60,6 +60,7 @@
   },
   "dependencies": {
     "@aws-sdk/client-s3": "3.614.0",
+    "@aws-sdk/s3-request-presigner": "3.614.0",
     "@openshift-console/dynamic-plugin-sdk": "1.3.0",
     "@openshift-console/dynamic-plugin-sdk-internal": "1.0.0",
     "@openshift-console/dynamic-plugin-sdk-webpack": "1.1.1",
@@ -91,6 +92,7 @@
     "js-base64": "^2.1.9",
     "js-yaml": "^3.13.1",
     "lodash-es": "^4.17.21",
+    "luxon": "^3.3.0",
     "murmurhash-js": "^1.0.0",
     "react": "^17.0.1",
     "react-copy-to-clipboard": "5.x",
@@ -134,6 +136,7 @@
     "@testing-library/react-hooks": "^8.0.1",
     "@testing-library/user-event": "^14.5.1",
     "@types/jest": "29.2.2",
+    "@types/luxon": "^3.3.1",
     "@types/node": "^14.14.34",
     "@types/react": "16.8.13",
     "@types/react-helmet": "^6.1.1",

diff --git a/packages/odf/components/s3-browser/bucket-overview/BucketOverview.tsx b/packages/odf/components/s3-browser/bucket-overview/BucketOverview.tsx
@@ -180,7 +180,6 @@ const BucketOverview: React.FC<{}> = () => {
             bucketName={bucketName}
             foldersPath={foldersPath}
             currentFolder={currentFolder}
-            fresh={fresh}
             isCreatedByOBC={isCreatedByOBC}
             noobaaObjectBucket={noobaaObjectBucket}
           />

diff --git a/packages/odf/components/s3-browser/bucket-overview/PageTitle.tsx b/packages/odf/components/s3-browser/bucket-overview/PageTitle.tsx
@@ -4,50 +4,19 @@ import { K8sResourceKind } from '@odf/shared/types';
 import { useCustomTranslation } from '@odf/shared/useCustomTranslationHook';
 import { ResourceStatus } from '@openshift-console/dynamic-plugin-sdk';
 import Status from '@openshift-console/dynamic-plugin-sdk/lib/app/components/status/Status';
-import useSWR from 'swr';
-import { Skeleton, Label, Button, ButtonVariant } from '@patternfly/react-core';
+import { Label, Button, ButtonVariant } from '@patternfly/react-core';
 import { CopyIcon } from '@patternfly/react-icons';
-import { LIST_BUCKET } from '../../../constants';
 import { getPath } from '../../../utils';
-import { NoobaaS3Context } from '../noobaa-context';
 import './bucket-overview.scss';
 
 type TitleProps = {
   bucketName: string;
   foldersPath: string;
   currentFolder: string;
-  fresh: boolean;
   isCreatedByOBC: boolean;
   noobaaObjectBucket: K8sResourceKind;
 };
 
-const CreatedOnSkeleton: React.FC<{}> = () => (
-  <Skeleton width="25%" height="15%" />
-);
-
-const CreatedOn: React.FC<{ bucketName: string }> = ({ bucketName }) => {
-  const { t } = useCustomTranslation();
-
-  const { noobaaS3 } = React.useContext(NoobaaS3Context);
-  const { data, error, isLoading } = useSWR(LIST_BUCKET, () =>
-    noobaaS3.listBuckets()
-  );
-
-  const bucketCreatedOn =
-    !isLoading && !error
-      ? data?.Buckets?.find((bucket) => bucket?.Name === bucketName)
-          ?.CreationDate
-      : null;
-
-  return isLoading ? (
-    <CreatedOnSkeleton />
-  ) : (
-    <h4 className="text-muted">
-      {t('Created on: ') + bucketCreatedOn?.toString()}
-    </h4>
-  );
-};
-
 const BucketResourceStatus: React.FC<{ resourceStatus: string }> = ({
   resourceStatus,
 }) => (
@@ -60,7 +29,6 @@ export const PageTitle: React.FC<TitleProps> = ({
   bucketName,
   foldersPath,
   currentFolder,
-  fresh,
   isCreatedByOBC,
   noobaaObjectBucket,
 }) => {
@@ -99,8 +67,6 @@ export const PageTitle: React.FC<TitleProps> = ({
           </>
         )}
       </div>
-      {!foldersPath &&
-        (fresh ? <CreatedOn bucketName={bucketName} /> : <CreatedOnSkeleton />)}
       <h4>
         {t('Object path: ')}
         <span className="text-muted">{objectPath}</span>

diff --git a/packages/odf/components/s3-browser/objects-list/ObjectsList.tsx b/packages/odf/components/s3-browser/objects-list/ObjectsList.tsx
@@ -319,7 +319,7 @@ export const ObjectsList: React.FC<{}> = () => {
         loaded={!isMutating}
         loadError={error}
         isRowSelectable={isRowSelectable}
-        extraProps={{ launcher, bucketName, foldersPath }}
+        extraProps={{ launcher, bucketName, foldersPath, noobaaS3 }}
         emptyRowMessage={EmptyPage}
       />
     </div>

diff --git a/packages/odf/components/s3-browser/objects-list/table-components.tsx b/packages/odf/components/s3-browser/objects-list/table-components.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { S3Commands } from '@odf/shared/s3';
 import { getName } from '@odf/shared/selectors';
 import { RowComponentType } from '@odf/shared/table';
 import { useCustomTranslation } from '@odf/shared/useCustomTranslationHook';
@@ -19,6 +20,10 @@ import { ActionsColumn, Td, IAction } from '@patternfly/react-table';
 import { BUCKETS_BASE_ROUTE, PREFIX } from '../../../constants';
 import { ObjectCrFormat } from '../../../types';
 
+const LazyPresignedURLModal = React.lazy(
+  () => import('../../../modals/s3-browser/presigned-url/PresignedURLModal')
+);
+
 const getColumnNames = (t: TFunction): string[] => [
   t('Name'),
   t('Size'),
@@ -29,25 +34,27 @@ const getColumnNames = (t: TFunction): string[] => [
 
 const getInlineActionsItems = (
   t: TFunction,
-  _launcher: LaunchModal,
-  _object: ObjectCrFormat
+  launcher: LaunchModal,
+  bucketName: string,
+  object: ObjectCrFormat,
+  noobaaS3: S3Commands
 ): IAction[] => [
-  // ToDo: add inline download, copy, preview, share & delete options
+  // ToDo: add inline download, preview & delete options
   {
     title: t('Download'),
     onClick: () => undefined,
   },
-  {
-    title: t('Copy Object URL'),
-    onClick: () => undefined,
-  },
   {
     title: t('Preview'),
     onClick: () => undefined,
   },
   {
     title: t('Share with presigned URL'),
-    onClick: () => undefined,
+    onClick: () =>
+      launcher(LazyPresignedURLModal, {
+        isOpen: true,
+        extraProps: { bucketName, object, noobaaS3 },
+      }),
   },
   {
     title: t('Delete'),
@@ -87,7 +94,7 @@ export const TableRow: React.FC<RowComponentType<ObjectCrFormat>> = ({
 }) => {
   const { t } = useCustomTranslation();
 
-  const { launcher, bucketName, foldersPath } = extraProps;
+  const { launcher, bucketName, foldersPath, noobaaS3 } = extraProps;
   const isFolder = object.isFolder;
   const name = getName(object).replace(foldersPath, '');
   const prefix = !!foldersPath
@@ -120,7 +127,13 @@ export const TableRow: React.FC<RowComponentType<ObjectCrFormat>> = ({
         {isFolder ? null : (
           <ActionsColumn
             translate={null}
-            items={getInlineActionsItems(t, launcher, object)}
+            items={getInlineActionsItems(
+              t,
+              launcher,
+              bucketName,
+              object,
+              noobaaS3
+            )}
           />
         )}
       </Td>