Преглед изворни кода

fix close button styling and resource link

Alexander Belanger пре 4 година
родитељ
комит
0ad85b68f5

+ 15 - 5
dashboard/src/main/home/cluster-dashboard/dashboard/incidents/EventDrawer.tsx

@@ -10,7 +10,7 @@ import { capitalize, readableDate } from "shared/string_utils";
 import styled from "styled-components";
 import ExpandedContainer from "./ExpandedContainer";
 import { IncidentContainerEvent, IncidentEvent } from "./IncidentPage";
-import backArrow from "assets/back_arrow.png";
+import close from "assets/close.png";
 
 const EventDrawer: React.FC<{
   event: IncidentEvent;
@@ -102,10 +102,13 @@ const EventDrawer: React.FC<{
 
   return (
     <EventDrawerContainer>
-      <BackButton onClick={closeDrawer}>
-        <BackButtonImg src={backArrow} />
-      </BackButton>
-      <EventDrawerTitle>Pod: {event?.pod_name}</EventDrawerTitle>
+      <EventDrawerTitleContainer>
+        <EventDrawerTitle>Pod: {event?.pod_name}</EventDrawerTitle>
+        <BackButton onClick={closeDrawer}>
+          <i className="material-icons">close</i>
+        </BackButton>
+      </EventDrawerTitleContainer>
+
       <StyledHelper>
         {hasPodStatusErrored ? (
           "We couldn't retrieve last pod status, please try again later"
@@ -364,6 +367,7 @@ const BackButton = styled.div`
   border: 1px solid #ffffff55;
   border-radius: 100px;
   background: #ffffff11;
+  color: #ffffffaa;
 
   > i {
     font-size: 20px;
@@ -403,3 +407,9 @@ const BackButtonImg = styled.img`
   width: 16px;
   opacity: 0.75;
 `;
+
+const EventDrawerTitleContainer = styled.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+`;

+ 12 - 1
dashboard/src/main/home/cluster-dashboard/dashboard/incidents/IncidentPage.tsx

@@ -83,6 +83,17 @@ const IncidentPage = () => {
     pushFiltered(redirect_url, []);
   };
 
+  const getResourceLink = () => {
+    let chartName = incident?.chart_name.split("-")[0] || "web";
+    let namespace = incident?.incident_id.split(":")[2] || "default";
+
+    if (chartName == "job") {
+      return `/jobs/${currentCluster.name}/${namespace}/${incident?.release_name}`;
+    }
+
+    return `/applications/${currentCluster.name}/${namespace}/${incident?.release_name}`;
+  };
+
   return (
     <StyledExpandedNodeView>
       <HeaderWrapper>
@@ -98,7 +109,7 @@ const IncidentPage = () => {
           inline_title_items={[
             <ResourceLink
               key="resource_link"
-              to={"/"}
+              to={getResourceLink()}
               target="_blank"
               onClick={(e) => e.stopPropagation()}
             >