Change token secret to have middle truncation

opendatahub-io · Nov 22, 2024 · c82491d · c82491d
1 parent 01165de
commit c82491d
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 4 deletions.
diff --git a/frontend/src/components/InlineTruncatedClipboardCopy.tsx b/frontend/src/components/InlineTruncatedClipboardCopy.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 
 type Props = {
   textToCopy: string;
+  truncatePosition?: 'start' | 'middle' | 'end';
   testId?: string;
   maxWidth?: number;
 };
@@ -12,7 +13,12 @@ type Props = {
  * https://github.com/patternfly/patternfly-react/issues/10890
  **/
 
-const InlineTruncatedClipboardCopy: React.FC<Props> = ({ textToCopy, testId, maxWidth }) => (
+const InlineTruncatedClipboardCopy: React.FC<Props> = ({
+  textToCopy,
+  testId,
+  maxWidth,
+  truncatePosition,
+}) => (
   <ClipboardCopy
     variant="inline-compact"
     style={{ display: 'inline-flex', maxWidth }}
@@ -23,7 +29,7 @@ const InlineTruncatedClipboardCopy: React.FC<Props> = ({ textToCopy, testId, max
     }}
     data-testid={testId}
   >
-    <Truncate content={textToCopy} />
+    <Truncate content={textToCopy} position={truncatePosition} />
   </ClipboardCopy>
 );
 

diff --git a/...d/src/pages/modelServing/screens/projects/ModelMeshSection/ServingRuntimeTokenDisplay.tsx b/...d/src/pages/modelServing/screens/projects/ModelMeshSection/ServingRuntimeTokenDisplay.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
-import { ClipboardCopy, HelperText, HelperTextItem, Skeleton } from '@patternfly/react-core';
+import { HelperText, HelperTextItem, Skeleton } from '@patternfly/react-core';
 import { SecretKind } from '~/k8sTypes';
+import InlineTruncatedClipboardCopy from '~/components/InlineTruncatedClipboardCopy';
 
 type ServingRuntimeTokenDisplayProps = {
   token: SecretKind;
@@ -27,7 +28,13 @@ const ServingRuntimeTokenDisplay: React.FC<ServingRuntimeTokenDisplayProps> = ({
     );
   }
 
-  return <ClipboardCopy isReadOnly>{atob(token.data.token)}</ClipboardCopy>;
+  return (
+    <InlineTruncatedClipboardCopy
+      testId="token-secret"
+      textToCopy={atob(token.data.token)}
+      truncatePosition="middle"
+    />
+  );
 };
 
 export default ServingRuntimeTokenDisplay;