Web: remove ability to click on session icon in audit log (#36842)

No one probably knows it was a button.
gravitational · Jan 18, 2024 · b37d06a · b37d06a
1 parent 70d5814
commit b37d06a
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 121 deletions.
diff --git a/web/packages/teleport/src/Audit/Audit.story.tsx b/web/packages/teleport/src/Audit/Audit.story.tsx
@@ -61,7 +61,6 @@ export const Failed = () => {
 
 export const AllPossibleEvents = () => (
   <EventList
-    clusterId="im-a-cluster"
     events={events}
     fetchMore={() => null}
     fetchStatus={''}

diff --git a/web/packages/teleport/src/Audit/Audit.tsx b/web/packages/teleport/src/Audit/Audit.tsx
@@ -89,7 +89,6 @@ export function Audit(props: State) {
       {attempt.status === 'success' && (
         <EventList
           events={events}
-          clusterId={clusterId}
           fetchMore={fetchMore}
           fetchStatus={fetchStatus}
         />

diff --git a/web/packages/teleport/src/Audit/EventList/EventList.tsx b/web/packages/teleport/src/Audit/EventList/EventList.tsx
@@ -29,13 +29,7 @@ import EventDialog from '../EventDialog';
 import renderTypeCell from './EventTypeCell';
 
 export default function EventList(props: Props) {
-  const {
-    clusterId,
-    events = [],
-    fetchMore,
-    fetchStatus,
-    pageSize = 50,
-  } = props;
+  const { events = [], fetchMore, fetchStatus, pageSize = 50 } = props;
   const [detailsToShow, setDetailsToShow] = useState<Event>();
   return (
     <>
@@ -46,7 +40,7 @@ export default function EventList(props: Props) {
             key: 'codeDesc',
             headerText: 'Type',
             isSortable: true,
-            render: event => renderTypeCell(event, clusterId),
+            render: event => renderTypeCell(event),
           },
           {
             key: 'message',
@@ -109,7 +103,6 @@ export function renderDescCell({ message }: Event) {
 }
 
 type Props = {
-  clusterId: State['clusterId'];
   events: State['events'];
   fetchMore: State['fetchMore'];
   fetchStatus: State['fetchStatus'];

diff --git a/web/packages/teleport/src/Audit/EventList/EventTypeCell.tsx b/web/packages/teleport/src/Audit/EventList/EventTypeCell.tsx
@@ -22,7 +22,6 @@ import { Cell } from 'design/DataTable';
 import * as Icons from 'design/Icon';
 
 import { eventCodes, Event, EventCode } from 'teleport/services/audit';
-import cfg from 'teleport/config';
 
 const EventIconMap: Record<EventCode, any> = {
   [eventCodes.AUTH_ATTEMPT_FAILURE]: Icons.Info,
@@ -257,45 +256,14 @@ const EventIconMap: Record<EventCode, any> = {
   [eventCodes.UNKNOWN]: Icons.Question,
 };
 
-export default function renderTypeCell(event: Event, clusterId: string) {
+export default function renderTypeCell(event: Event) {
   const Icon = EventIconMap[event.code] || Icons.ListThin;
 
   const iconProps = {
     p: 1,
     mr: 3,
   };
 
-  // use button for interactive ssh sessions
-  if (
-    event.code === eventCodes.SESSION_END &&
-    event.raw.interactive &&
-    event.raw.session_recording !== 'off'
-  ) {
-    return (
-      <Cell style={{ verticalAlign: 'inherit' }}>
-        <StyledEventType>
-          <a
-            title="Open Session Player"
-            href={cfg.getPlayerRoute(
-              {
-                clusterId,
-                sid: event.raw.sid,
-              },
-              {
-                recordingType: 'ssh',
-              }
-            )}
-            target="_blank"
-            style={{ textDecoration: 'none' }}
-          >
-            <StyledCliIcon {...iconProps} />
-          </a>
-          {event.codeDesc}
-        </StyledEventType>
-      </Cell>
-    );
-  }
-
   return (
     <Cell style={{ verticalAlign: 'inherit' }}>
       <StyledEventType>
@@ -306,35 +274,6 @@ export default function renderTypeCell(event: Event, clusterId: string) {
   );
 }
 
-const StyledCliIcon = styled(Icons.Cli)(
-  props => `
-  background: ${props.theme.colors.levels.deep};
-  border: 2px solid ${props.theme.colors.brand};
-  color: ${props.theme.colors.text.slightlyMuted};
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  padding: 0;
-  border-radius: 100px;
-  transition: all 0.3s;
-
-  &:hover,
-  &:active,
-  &:focus {
-    background: ${props.theme.colors.levels.sunken};
-    color: ${props.theme.colors.text.main};
-  }
-
-  &:active {
-    box-shadow: none;
-    opacity: 0.56;
-  }
-`
-);
-
 const StyledEventType = styled.div`
   display: flex;
   align-items: center;

diff --git a/web/packages/teleport/src/Audit/__snapshots__/Audit.story.test.tsx.snap b/web/packages/teleport/src/Audit/__snapshots__/Audit.story.test.tsx.snap
@@ -364,33 +364,6 @@ exports[`list of all events 1`] = `
   font-size: 12px;
 }
 
-.c23 {
-  background: #000000;
-  border: 2px solid #9F85FF;
-  color: rgba(255,255,255,0.72);
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 20px;
-  height: 20px;
-  padding: 0;
-  border-radius: 100px;
-  transition: all 0.3s;
-}
-
-.c23:hover,
-.c23:active,
-.c23:focus {
-  background: #0C143D;
-  color: #FFFFFF;
-}
-
-.c23:active {
-  box-shadow: none;
-  opacity: 0.56;
-}
-
 .c20 {
   display: flex;
   align-items: center;
@@ -7885,29 +7858,22 @@ exports[`list of all events 1`] = `
             <div
               class="c20"
             >
-              <a
-                href="/web/cluster/im-a-cluster/session/941a4c65-c6cd-11ea-9bef-482ae3513733?recordingType=ssh"
-                style="text-decoration: none;"
-                target="_blank"
-                title="Open Session Player"
+              <span
+                class="c21 icon icon-cli"
               >
-                <span
-                  class="c21 c23"
+                <svg
+                  fill="currentColor"
+                  height="20"
+                  viewBox="0 0 24 24"
+                  width="20"
                 >
-                  <svg
-                    fill="currentColor"
-                    height="24"
-                    viewBox="0 0 24 24"
-                    width="24"
-                  >
-                    <path
-                      clip-rule="evenodd"
-                      d="M4.24828 5.43945C3.93869 5.16426 3.46464 5.19215 3.18945 5.50174C2.91426 5.81132 2.94215 6.28538 3.25174 6.56056L9.37111 12L3.25174 17.4395C2.94215 17.7146 2.91426 18.1887 3.18945 18.4983C3.46464 18.8079 3.93869 18.8358 4.24828 18.5606L10.9983 12.5606C11.1584 12.4182 11.25 12.2142 11.25 12C11.25 11.7858 11.1584 11.5818 10.9983 11.4395L4.24828 5.43945ZM11.25 17.25C10.8358 17.25 10.5 17.5858 10.5 18C10.5 18.4142 10.8358 18.75 11.25 18.75H20.25C20.6642 18.75 21 18.4142 21 18C21 17.5858 20.6642 17.25 20.25 17.25H11.25Z"
-                      fill-rule="evenodd"
-                    />
-                  </svg>
-                </span>
-              </a>
+                  <path
+                    clip-rule="evenodd"
+                    d="M4.24828 5.43945C3.93869 5.16426 3.46464 5.19215 3.18945 5.50174C2.91426 5.81132 2.94215 6.28538 3.25174 6.56056L9.37111 12L3.25174 17.4395C2.94215 17.7146 2.91426 18.1887 3.18945 18.4983C3.46464 18.8079 3.93869 18.8358 4.24828 18.5606L10.9983 12.5606C11.1584 12.4182 11.25 12.2142 11.25 12C11.25 11.7858 11.1584 11.5818 10.9983 11.4395L4.24828 5.43945ZM11.25 17.25C10.8358 17.25 10.5 17.5858 10.5 18C10.5 18.4142 10.8358 18.75 11.25 18.75H20.25C20.6642 18.75 21 18.4142 21 18C21 17.5858 20.6642 17.25 20.25 17.25H11.25Z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </span>
               Session Ended
             </div>
           </td>