From f519f0eb0ec6b8b27639df07f6c0749b0e4e9aa5 Mon Sep 17 00:00:00 2001
From: "akash.dutta" <akash.dutta@glosity.club>
Date: Sun, 8 May 2022 09:35:50 +0530
Subject: [PATCH] tooltiip added to Invite member button

---
 dashboard/src/App.tsx                          |  1 -
 .../src/components/InviteMembersModal.tsx      | 18 +++++++++++++++++-
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/dashboard/src/App.tsx b/dashboard/src/App.tsx
index 2046232..1c71c94 100644
--- a/dashboard/src/App.tsx
+++ b/dashboard/src/App.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { Fragment } from "react"
-import { Global, css } from '@emotion/core'
 import { ChakraProvider, extendTheme } from '@chakra-ui/react';
 import { BrowserRouter } from 'react-router-dom';
 import { createClient, Provider } from 'urql';
diff --git a/dashboard/src/components/InviteMembersModal.tsx b/dashboard/src/components/InviteMembersModal.tsx
index 8107669..2878722 100644
--- a/dashboard/src/components/InviteMembersModal.tsx
+++ b/dashboard/src/components/InviteMembersModal.tsx
@@ -22,6 +22,7 @@ import {
 	InputRightElement,
 	Text,
 	Link,
+	Tooltip
 } from '@chakra-ui/react';
 import { useClient } from 'urql';
 import { FaUserPlus, FaMinusCircle, FaPlus, FaUpload } from 'react-icons/fa';
@@ -186,7 +187,22 @@ const InviteMembersModal = ({
 				isDisabled={disabled}
 				size="sm"
 			>
-				<Center h="100%">Invite Members</Center>
+				 <Center h="100%">
+                   {disabled ? (
+                      <Tooltip
+                        mr={8}
+                        mt={1}
+                        hasArrow
+                        bg="gray.300"
+                        color="black"
+                        label="Email verification is disabled, refer to 'UI Customization' tab within 'Environment' to enable it."
+                      >
+                      Invite Members
+                      </Tooltip>
+                    ) : (
+                    "Invite Members"
+                    )}
+                  </Center>{" "}
 			</Button>
 			<Modal isOpen={isOpen} onClose={closeModalHandler} size="xl">
 				<ModalOverlay />