Name, resource label, tolerations and Node selector fields - Unlimite…

…d size string
opendatahub-io · Jan 23, 2025 · 6d512dd · 6d512dd
1 parent 7765ce3
commit 6d512dd
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 9 deletions.
diff --git a/frontend/src/pages/hardwareProfiles/nodeResource/NodeResourceTableRow.tsx b/frontend/src/pages/hardwareProfiles/nodeResource/NodeResourceTableRow.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { Td, Tr } from '@patternfly/react-table';
-import { ActionList, ActionListItem, Button } from '@patternfly/react-core';
+import { ActionList, ActionListItem, Button, Truncate } from '@patternfly/react-core';
 import { MinusCircleIcon, PencilAltIcon } from '@patternfly/react-icons';
 import { Identifier } from '~/types';
 
@@ -18,8 +18,12 @@ const NodeResourceTableRow: React.FC<NodeResourceTableRowProps> = ({
   showActions,
 }) => (
   <Tr>
-    <Td dataLabel="Resource label">{identifier.displayName}</Td>
-    <Td dataLabel="Resource identifier">{identifier.identifier}</Td>
+    <Td dataLabel="Resource label">
+      <Truncate content={identifier.displayName} />
+    </Td>
+    <Td dataLabel="Resource identifier">
+      <Truncate content={identifier.identifier} />
+    </Td>
     <Td dataLabel="Resource type">{identifier.resourceType ?? 'Other'}</Td>
     <Td dataLabel="Default">{identifier.defaultCount}</Td>
     <Td dataLabel="Minimum allowed">{identifier.minCount}</Td>

diff --git a/frontend/src/pages/hardwareProfiles/nodeSelector/NodeSelectorTableRow.tsx b/frontend/src/pages/hardwareProfiles/nodeSelector/NodeSelectorTableRow.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { Td, Tr } from '@patternfly/react-table';
-import { ActionList, ActionListItem, Button } from '@patternfly/react-core';
+import { ActionList, ActionListItem, Button, Truncate } from '@patternfly/react-core';
 import { MinusCircleIcon, PencilAltIcon } from '@patternfly/react-icons';
 import { NodeSelector } from '~/types';
 
@@ -18,8 +18,12 @@ const NodeSelectorTableRow: React.FC<NodeSelectorTableRowProps> = ({
   onDelete,
 }) => (
   <Tr>
-    <Td dataLabel="Key">{nodeSelector.key}</Td>
-    <Td dataLabel="Value">{nodeSelector.value}</Td>
+    <Td dataLabel="Key">
+      <Truncate content={nodeSelector.key} />
+    </Td>
+    <Td dataLabel="Value">
+      <Truncate content={nodeSelector.value} />
+    </Td>
     {showActions && (
       <Td isActionCell modifier="nowrap" style={{ textAlign: 'right' }}>
         <ActionList isIconList>

diff --git a/frontend/src/pages/hardwareProfiles/toleration/TolerationTableRow.tsx b/frontend/src/pages/hardwareProfiles/toleration/TolerationTableRow.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { Td, Tr } from '@patternfly/react-table';
-import { ActionList, ActionListItem, Button } from '@patternfly/react-core';
+import { ActionList, ActionListItem, Button, Truncate } from '@patternfly/react-core';
 import { MinusCircleIcon, PencilAltIcon } from '@patternfly/react-icons';
 import { Toleration } from '~/types';
 
@@ -19,8 +19,12 @@ const TolerationTableRow: React.FC<TolerationTableRowProps> = ({
 }) => (
   <Tr>
     <Td dataLabel="Operator">{toleration.operator ?? '-'}</Td>
-    <Td dataLabel="Key">{toleration.key}</Td>
-    <Td dataLabel="Value">{toleration.value ?? '-'}</Td>
+    <Td dataLabel="Key">
+      <Truncate content={toleration.key} />
+    </Td>
+    <Td dataLabel="Value">
+      <Truncate content={toleration.value ?? '-'} />
+    </Td>
     <Td dataLabel="Effect">{toleration.effect ?? '-'}</Td>
     <Td dataLabel="Toleration seconds">
       {toleration.tolerationSeconds === undefined