Hotfix infra tab for support (#2824)

* install github app button

* general error component

* auto-generate cluster name

* fix button text color

* infra tab for porter user

* keep usage modal hidden

dashboard/src/components/ProvisionerForm.tsx

@@ -28,7 +28,7 @@ const ProvisionerForm: React.FC<Props> = ({
         Configure settings
       </Heading>
       <Helper>
-        Configure settings for your new cluster.
+        Configure settings for your AWS environment.
       </Helper>
       <ProvisionerSettings credentialId={credentialId} />
     </>

dashboard/src/components/ProvisionerSettings.tsx

@@ -179,6 +179,7 @@ const ProvisionerSettings: React.FC<Props> = props => {
         currentCluster.status === "UPDATING_UNAVAILABLE"
       )
     );
+    setClusterName(`${currentProject.name}-cluster`);
   }, []);
 
   useEffect(() => {
@@ -205,20 +206,10 @@ const ProvisionerSettings: React.FC<Props> = props => {
     if (!props.clusterId) {
       return (
         <>
-          <Heading isAtTop>Cluster configuration</Heading>
+          <Heading isAtTop>Select an AWS region</Heading>
           <Helper>
-            Porter will create a new cluster for your applications in the specified region.
+            Porter will automatically provision your infrastructure in the specified region.
           </Helper>
-          <InputRow
-            width="350px"
-            isRequired
-            disabled={isReadOnly}
-            type="string"
-            value={clusterName}
-            setValue={(x: string) => setClusterName(x)}
-            label="🏷️ Cluster name"
-            placeholder="ex: total-perspective-vortex"
-          />
           <SelectRow
             options={regionOptions}
             width="350px"
@@ -227,7 +218,7 @@ const ProvisionerSettings: React.FC<Props> = props => {
             scrollBuffer={true}
             dropdownMaxHeight="240px"
             setActiveValue={setAwsRegion}
-            label="📍 Select an AWS region"
+            label="📍 AWS region"
           />
         </>
       )
@@ -237,16 +228,6 @@ const ProvisionerSettings: React.FC<Props> = props => {
     return (
       <>
         <Heading isAtTop>EKS configuration</Heading>
-        <InputRow
-          width="350px"
-          isRequired
-          disabled={isReadOnly || true}
-          type="string"
-          value={clusterName}
-          setValue={(x: string) => setClusterName(x)}
-          label="🏷️ Cluster name"
-          placeholder="ex: total-perspective-vortex"
-        />
         <SelectRow
           options={regionOptions}
           width="350px"

dashboard/src/components/SaveButton.tsx

@@ -6,7 +6,7 @@ type Props = {
   text?: string;
   onClick: () => void;
   disabled?: boolean;
-  status?: React.ReactNode | null;
+  status?: string | null;
   color?: string;
   rounded?: boolean;
   helper?: string | null;

dashboard/src/main/home/Home.tsx

@@ -404,9 +404,9 @@ const Home: React.FC<Props> = props => {
               return <Onboarding />;
             }}
           />
-          {user?.isPorterUser || overrideInfraTabEnabled({
+          {(user?.isPorterUser || overrideInfraTabEnabled({
             projectID: currentProject?.id,
-          }) && (
+          })) && (
             <Route
               path="/infrastructure"
               render={() => {

dashboard/src/main/home/sidebar/Sidebar.tsx

@@ -262,9 +262,9 @@ const NavButton = styled(SidebarLink)`
   }
 
   > i {
-    font-size: 20px;
-    padding-top: 4px;
+    font-size: 18px;
     border-radius: 3px;
+    margin-left: 2px;
     margin-right: 10px;
   }
 `;