Mask user in Managed and Longview

linode · Jan 7, 2025 · 878e9fb · 878e9fb
1 parent 02e9ae9
commit 878e9fb
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 7 deletions.
diff --git a/...nager/src/features/Longview/LongviewDetail/DetailTabs/ActiveConnections/ConnectionRow.tsx b/...nager/src/features/Longview/LongviewDetail/DetailTabs/ActiveConnections/ConnectionRow.tsx
@@ -1,8 +1,10 @@
 import * as React from 'react';
 
+import { MaskableText } from 'src/components/MaskableText/MaskableText';
 import { TableCell } from 'src/components/TableCell';
 import { TableRow } from 'src/components/TableRow';
-import { LongviewPort } from 'src/features/Longview/request.types';
+
+import type { LongviewPort } from 'src/features/Longview/request.types';
 
 interface Props {
   connection: LongviewPort;
@@ -17,7 +19,7 @@ export const ConnectionRow = (props: Props) => {
         {connection.name}
       </TableCell>
       <TableCell data-qa-active-connection-user parentColumn="User">
-        {connection.user}
+        <MaskableText isToggleable text={connection.user} />
       </TableCell>
       <TableCell data-qa-active-connection-count parentColumn="Count">
         {connection.count}

diff --git a/.../src/features/Longview/LongviewDetail/DetailTabs/ListeningServices/LongviewServiceRow.tsx b/.../src/features/Longview/LongviewDetail/DetailTabs/ListeningServices/LongviewServiceRow.tsx
@@ -19,7 +19,7 @@ export const LongviewServiceRow = (props: Props) => {
         {service.name}
       </TableCell>
       <TableCell data-qa-service-user parentColumn="User">
-        {service.user}
+        <MaskableText isToggleable text={service.user} />
       </TableCell>
       <TableCell data-qa-service-protocol parentColumn="Protocol">
         {service.type}

diff --git a/...ages/manager/src/features/Longview/LongviewDetail/DetailTabs/Processes/ProcessesTable.tsx b/...ages/manager/src/features/Longview/LongviewDetail/DetailTabs/Processes/ProcessesTable.tsx
@@ -1,6 +1,6 @@
-import { APIError } from '@linode/api-v4/lib/types';
 import * as React from 'react';
 
+import { MaskableText } from 'src/components/MaskableText/MaskableText';
 import OrderBy from 'src/components/OrderBy';
 import { TableBody } from 'src/components/TableBody';
 import { TableCell } from 'src/components/TableCell';
@@ -15,7 +15,9 @@ import { useWindowDimensions } from 'src/hooks/useWindowDimensions';
 import { readableBytes } from 'src/utilities/unitConversions';
 
 import { StyledDiv, StyledTable } from './ProcessesTable.styles';
-import { Process } from './types';
+
+import type { Process } from './types';
+import type { APIError } from '@linode/api-v4/lib/types';
 
 export interface ProcessesTableProps {
   error?: string;
@@ -184,7 +186,9 @@ export const ProcessesTableRow = React.memo((props: ProcessTableRowProps) => {
       <TableCell data-testid={`name-${name}`}>
         <StyledDiv>{name}</StyledDiv>
       </TableCell>
-      <TableCell data-testid={`user-${user}`}>{user}</TableCell>
+      <TableCell data-testid={`user-${user}`}>
+        <MaskableText isToggleable text={user} />
+      </TableCell>
       <TableCell data-testid={`max-count-${Math.round(maxCount)}`}>
         {Math.round(maxCount)}
       </TableCell>

diff --git a/packages/manager/src/features/Managed/SSHAccess/SSHAccessRow.tsx b/packages/manager/src/features/Managed/SSHAccess/SSHAccessRow.tsx
@@ -30,7 +30,9 @@ export const SSHAccessRow = (props: SSHAccessRowProps) => {
         {isAccessEnabled ? 'Enabled' : 'Disabled'}
       </TableCell>
       <Hidden smDown>
-        <TableCell data-qa-managed-user>{linodeSetting.ssh.user}</TableCell>
+        <TableCell data-qa-managed-user>
+          <MaskableText isToggleable text={linodeSetting.ssh.user} />
+        </TableCell>
         <TableCell data-qa-managed-ip>
           {linodeSetting.ssh.ip === 'any' ? (
             'Any'