add slack integration to integrations list

dashboard/src/main/home/integrations/IntegrationCategories.tsx

@@ -108,6 +108,9 @@ class IntegrationCategories extends Component<PropsType, StateType> {
           })
           .catch(console.log);
         break;
+      case "slack":
+        // to be implemented
+        break;
       default:
         console.log("Unknown integration category.");
     }
@@ -140,17 +143,21 @@ class IntegrationCategories extends Component<PropsType, StateType> {
               <Title>{label}</Title>
             </Flex>
             <Button
-              onClick={() =>
-                this.context.setCurrentModal("IntegrationsModal", {
-                  category: currentCategory,
-                  setCurrentIntegration: (x: string) =>
-                    pushFiltered(
-                      this.props,
-                      `/integrations/${this.props.category}/create/${x}`,
-                      ["project_id"]
-                    ),
-                })
-              }
+              onClick={() => {
+                if (this.props.category != "slack") {
+                  this.context.setCurrentModal("IntegrationsModal", {
+                    category: currentCategory,
+                    setCurrentIntegration: (x: string) =>
+                      pushFiltered(
+                        this.props,
+                        `/integrations/${this.props.category}/create/${x}`,
+                        ["project_id"]
+                      ),
+                  });
+                } else {
+                  alert("redirect to install link...");
+                }
+              }}
             >
               <i className="material-icons">add</i>
               {buttonText}

dashboard/src/main/home/integrations/Integrations.tsx

@@ -15,7 +15,7 @@ type StateType = {
   currentIntegrationData: any[];
 };
 
-const IntegrationCategoryStrings = ["registry", "repo"]; /*"kubernetes",*/
+const IntegrationCategoryStrings = ["registry", "slack"]; /*"kubernetes",*/
 
 class Integrations extends Component<PropsType, StateType> {
   state = {
@@ -83,7 +83,7 @@ class Integrations extends Component<PropsType, StateType> {
 
             <IntegrationList
               currentCategory={""}
-              integrations={["kubernetes", "registry"]}
+              integrations={["kubernetes", "registry", "slack"]}
               setCurrent={(x) =>
                 pushFiltered(this.props, `/integrations/${x}`, ["project_id"])
               }

dashboard/src/shared/common.tsx

@@ -26,6 +26,11 @@ export const integrationList: any = {
     label: "Git Repository",
     buttonText: "Link a Github Account",
   },
+  slack: {
+    icon: "https://image.flaticon.com/icons/png/512/2111/2111615.png",
+    label: "Slack",
+    buttonText: "Install Application",
+  },
   registry: {
     icon:
       "https://cdn4.iconfinder.com/data/icons/logos-and-brands/512/97_Docker_logo_logos-512.png",