Ver Fonte

fixed banners

Justin Rhee há 3 anos atrás
pai
commit
2e3f183920

+ 12 - 3
dashboard/src/components/Banner.tsx

@@ -7,9 +7,14 @@ import warning from "assets/warning.png";
 interface Props {
   type?: string;
   children: React.ReactNode;
+  noMargin?: boolean;
 }
 
-const Banner: React.FC<Props> = ({ type, children }) => {
+const Banner: React.FC<Props> = ({ 
+  type, 
+  children,
+  noMargin,
+}) => {
   const renderIcon = () => {
     if (type === "error" || type === "warning") {
       return <i className="material-icons-round">warning</i>;
@@ -20,6 +25,7 @@ const Banner: React.FC<Props> = ({ type, children }) => {
   return (
     <StyledBanner
       color={type === "error" ? "#ff385d" : type === "warning" && "#f5cb42"}
+      noMargin={noMargin}
     >
       {renderIcon()}
       {children}
@@ -29,10 +35,13 @@ const Banner: React.FC<Props> = ({ type, children }) => {
 
 export default Banner;
 
-const StyledBanner = styled.div<{ color?: string }>`
+const StyledBanner = styled.div<{ 
+  color?: string;
+  noMargin?: boolean;
+}>`
   height: 40px;
   width: 100%;
-  margin: 5px 0 10px;
+  margin: ${props => props.noMargin ? "5px 0 10px" : ""};
   font-size: 13px;
   font-family: "Work Sans", sans-serif;
   display: flex;

+ 10 - 9
dashboard/src/main/home/cluster-dashboard/NamespaceSelector.tsx

@@ -30,11 +30,12 @@ export const NamespaceSelector: React.FunctionComponent<Props> = ({
       value: string;
     }[]
   >([]);
-  const [defaultNamespace, setDefaultNamespace] = useState<string>(
-    localStorage.getItem(
+  const getDefaultNamespace = () => {
+    return localStorage.getItem(
       `${context.currentProject.id}-${context.currentCluster.id}-namespace`
-    )
-  );
+    ) || "default";
+  }
+  const [defaultNamespace, setDefaultNamespace] = useState<string>(getDefaultNamespace());
 
   const updateOptions = () => {
     let { currentCluster, currentProject } = context;
@@ -70,11 +71,10 @@ export const NamespaceSelector: React.FunctionComponent<Props> = ({
               `${context.currentProject.id}-${context.currentCluster.id}-namespace`
             )
           ) {
-            setDefaultNamespace(
-              localStorage.getItem(
-                `${context.currentProject.id}-${context.currentCluster.id}-namespace`
-              )
-            );
+            console.log("aye there was laddy", localStorage.getItem(
+              `${context.currentProject.id}-${context.currentCluster.id}-namespace`
+            ))
+            setDefaultNamespace(getDefaultNamespace());
           } else {
             setDefaultNamespace("default");
           }
@@ -85,6 +85,7 @@ export const NamespaceSelector: React.FunctionComponent<Props> = ({
             });
             if (x.name === urlNamespace) {
               setDefaultNamespace(urlNamespace);
+              console.log("hit this mofo")
             }
           });
           setNamespaceOptions(namespaceOptions);

+ 5 - 13
dashboard/src/main/home/dashboard/Dashboard.tsx

@@ -116,23 +116,18 @@ class Dashboard extends Component<PropsType, StateType> {
       );
     } else if (this.currentTab() === "create-cluster") {
       let helperText = "Create a cluster to link to this project";
-      let helperIcon = "info";
-      let helperColor = "white";
+      let helperType = "info";
       if (
-        this.context.hasBillingEnabled &&
-        this.context.usage.current.clusters !== 0 &&
-        this.context.usage.current.clusters >= this.context.usage.limit.clusters
+        true
       ) {
         helperText =
           "You need to update your billing to provision or connect a new cluster";
-        helperIcon = "warning";
-        helperColor = "#f5cb42";
+        helperType = "warning";
       }
       return (
         <>
-          <Banner type="warning">
-            <i className="material-icons">warning</i>
-            Project is in trouble
+          <Banner type={helperType} noMargin>
+            {helperText}
           </Banner>
           <ProvisionerSettings infras={this.state.infras} provisioner={true} />
         </>
@@ -199,9 +194,6 @@ class Dashboard extends Component<PropsType, StateType> {
                       <i className="material-icons">info</i> Info
                     </InfoLabel>
                   </TopRow>
-                  <Banner type="error">
-                    GitHub has an ongoing incident: https://www.githubstatus.com/incidents/w0q17vf0dzjr
-                  </Banner>
                   <Description>
                     Project overview for {currentProject && currentProject.name}
                     .

+ 22 - 22
dashboard/src/main/home/sidebar/ClusterSection.tsx

@@ -170,48 +170,48 @@ export const ClusterSection: React.FC<Props> = ({
               <path
                 d="M15.207 12.4403C16.8094 12.4403 18.1092 11.1414 18.1092 9.53907C18.1092 7.93673 16.8094 6.63782 15.207 6.63782"
                 stroke="white"
-                stroke-width="1.5"
-                stroke-linecap="round"
-                stroke-linejoin="round"
+                strokeWidth="1.5"
+                strokeLinecap="round"
+                strokeLinejoin="round"
               />
               <path
                 d="M3.90217 12.4403C2.29983 12.4403 1 11.1414 1 9.53907C1 7.93673 2.29983 6.63782 3.90217 6.63782"
                 stroke="white"
-                stroke-width="1.5"
-                stroke-linecap="round"
-                stroke-linejoin="round"
+                strokeWidth="1.5"
+                strokeLinecap="round"
+                strokeLinejoin="round"
               />
               <path
-                fill-rule="evenodd"
-                clip-rule="evenodd"
+                fillRule="evenodd"
+                clipRule="evenodd"
                 d="M9.54993 13.4133C7.4086 13.4133 5.69168 11.6964 5.69168 9.55417C5.69168 7.41284 7.4086 5.69592 9.54993 5.69592C11.6913 5.69592 13.4082 7.41284 13.4082 9.55417C13.4082 11.6964 11.6913 13.4133 9.54993 13.4133Z"
                 stroke="white"
-                stroke-width="1.5"
-                stroke-linecap="round"
-                stroke-linejoin="round"
+                strokeWidth="1.5"
+                strokeLinecap="round"
+                strokeLinejoin="round"
               />
               <path
                 d="M6.66895 15.207C6.66895 16.8094 7.96787 18.1092 9.5702 18.1092C11.1725 18.1092 12.4715 16.8094 12.4715 15.207"
                 stroke="white"
-                stroke-width="1.5"
-                stroke-linecap="round"
-                stroke-linejoin="round"
+                strokeWidth="1.5"
+                strokeLinecap="round"
+                strokeLinejoin="round"
               />
               <path
                 d="M6.66895 3.90217C6.66895 2.29983 7.96787 1 9.5702 1C11.1725 1 12.4715 2.29983 12.4715 3.90217"
                 stroke="white"
-                stroke-width="1.5"
-                stroke-linecap="round"
-                stroke-linejoin="round"
+                strokeWidth="1.5"
+                strokeLinecap="round"
+                strokeLinejoin="round"
               />
               <path
-                fill-rule="evenodd"
-                clip-rule="evenodd"
+                fillRule="evenodd"
+                clipRule="evenodd"
                 d="M5.69591 9.54996C5.69591 7.40863 7.41283 5.69171 9.55508 5.69171C11.6964 5.69171 13.4133 7.40863 13.4133 9.54996C13.4133 11.6913 11.6964 13.4082 9.55508 13.4082C7.41283 13.4082 5.69591 11.6913 5.69591 9.54996Z"
                 stroke="white"
-                stroke-width="1.5"
-                stroke-linecap="round"
-                stroke-linejoin="round"
+                strokeWidth="1.5"
+                strokeLinecap="round"
+                strokeLinejoin="round"
               />
             </svg>
           </ClusterIcon>