-
Notifications
You must be signed in to change notification settings - Fork 161
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #177 from webwhiz-ai/main
Integrations and invite members updates
- Loading branch information
Showing
13 changed files
with
280 additions
and
32 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
40 changes: 40 additions & 0 deletions
40
frontend/src/components/Icons/Integrations/SlackIntegrationIcon.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,40 @@ | ||
| import React, { HTMLAttributes } from "react"; | ||
|
|
||
| interface IconProps extends HTMLAttributes<SVGElement> { | ||
| width?: number; | ||
| height?: number; | ||
| } | ||
|
|
||
| export const SlackIntegrationIcon = ({ | ||
| width = 60, | ||
| height = 63, | ||
| ...restProps | ||
| }: IconProps) => { | ||
| return ( | ||
| <svg xmlns="http://www.w3.org/2000/svg" | ||
| viewBox="0 0 2447.6 2452.5" | ||
| width={width} | ||
| height={height} | ||
| {...restProps} | ||
| > | ||
| <g fillRule="evenodd" clipRule="evenodd"> | ||
| <path | ||
| fill="#36c5f0" | ||
| d="M897.4 0C762.1.1 652.6 109.9 652.7 245.2c-.1 135.3 109.5 245.1 244.8 245.2h244.8V245.3C1142.4 110 1032.8.2 897.4 0c.1 0 .1 0 0 0m0 654H244.8C109.5 654.1-.1 763.9 0 899.2c-.2 135.3 109.4 245.1 244.7 245.3h652.7c135.3-.1 244.9-109.9 244.8-245.2.1-135.4-109.5-245.2-244.8-245.3z" | ||
| ></path> | ||
| <path | ||
| fill="#2eb67d" | ||
| d="M2447.6 899.2c.1-135.3-109.5-245.1-244.8-245.2-135.3.1-244.9 109.9-244.8 245.2v245.3h244.8c135.3-.1 244.9-109.9 244.8-245.3zm-652.7 0v-654C1795 110 1685.5.2 1550.2 0c-135.3.1-244.9 109.9-244.8 245.2v654c-.2 135.3 109.4 245.1 244.7 245.3 135.3-.1 244.9-109.9 244.8-245.3z" | ||
| ></path> | ||
| <path | ||
| fill="#ecb22e" | ||
| d="M1550.1 2452.5c135.3-.1 244.9-109.9 244.8-245.2.1-135.3-109.5-245.1-244.8-245.2h-244.8v245.2c-.1 135.2 109.5 245 244.8 245.2zm0-654.1h652.7c135.3-.1 244.9-109.9 244.8-245.2.2-135.3-109.4-245.1-244.7-245.3h-652.7c-135.3.1-244.9 109.9-244.8 245.2-.1 135.4 109.4 245.2 244.7 245.3z" | ||
| ></path> | ||
| <path | ||
| fill="#e01e5a" | ||
| d="M0 1553.2c-.1 135.3 109.5 245.1 244.8 245.2 135.3-.1 244.9-109.9 244.8-245.2V1308H244.8C109.5 1308.1-.1 1417.9 0 1553.2zm652.7 0v654c-.2 135.3 109.4 245.1 244.7 245.3 135.3-.1 244.9-109.9 244.8-245.2v-653.9c.2-135.3-109.4-245.1-244.7-245.3-135.4 0-244.9 109.8-244.8 245.1 0 0 0 .1 0 0" | ||
| ></path> | ||
| </g> | ||
| </svg> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| import React from "react"; | ||
|
|
||
| interface IconProps extends HTMLAttributes<SVGElement> { | ||
| width?: number; | ||
| height?: number; | ||
| } | ||
| function ZapierIcon({ | ||
| width = 60, | ||
| height = 63, | ||
| ...restProps | ||
| }: IconProps) { | ||
| return ( | ||
| <svg | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| width={width} | ||
| height={height} | ||
| {...restProps} | ||
| viewBox="0 0 256 256" | ||
| > | ||
| <path | ||
| fill="#FF4A00" | ||
| d="M128.08 0c7.231.013 14.343.624 21.256 1.78V76.3l52.831-52.696a128.425 128.425 0 0116.34 13.789 128.468 128.468 0 0113.84 16.312L179.513 106.4h74.715A127.58 127.58 0 01256 127.587v.173c0 7.226-.613 14.306-1.772 21.2H179.5l52.847 52.682a129.615 129.615 0 01-13.824 16.312h-.015a128.254 128.254 0 01-16.326 13.789l-52.846-52.696v74.52a130.321 130.321 0 01-21.243 1.781h-.186a130.26 130.26 0 01-21.23-1.78v-74.52l-52.831 52.695a128.401 128.401 0 01-30.18-30.1L76.5 148.96H1.785A126.984 126.984 0 010 127.72v-.371c.012-1.875.135-4.166.311-6.536l.055-.713c.522-6.671 1.419-13.7 1.419-13.7H76.5L23.666 53.705a126.265 126.265 0 0113.81-16.286l.026-.026a127.746 127.746 0 0116.344-13.789L106.677 76.3V1.78A130.278 130.278 0 01127.933 0h.147zm-.013 95.76h-.122c-9.509 0-18.616 1.74-27.034 4.902a76.662 76.662 0 00-4.915 26.952v.12a76.383 76.383 0 004.927 26.951 76.608 76.608 0 0027.022 4.902h.122c9.51 0 18.617-1.74 27.022-4.902a76.146 76.146 0 004.915-26.952v-.12c0-9.484-1.747-18.57-4.915-26.951a76.614 76.614 0 00-27.022-4.902z" | ||
| ></path> | ||
| </svg> | ||
| ); | ||
| } | ||
|
|
||
| export default ZapierIcon; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,105 @@ | ||
| import { Box, Heading, HStack, SimpleGrid, Text, Button, Badge } from '@chakra-ui/react'; | ||
| import React from 'react'; | ||
| import { SlackIntegrationIcon } from '../../components/Icons/Integrations/SlackIntegrationIcon'; | ||
| import ZapierIcon from '../../components/Icons/Integrations/ZapierIcon'; | ||
| import { baseURL } from '../../config'; | ||
|
|
||
| interface IntegrationsProps { | ||
| chatbotId: string | ||
| } | ||
|
|
||
| const Integrations = ({ chatbotId }: IntegrationsProps) => { | ||
| return ( | ||
| <SimpleGrid columns={[1, 1, 1, 2]} spacing={6}> | ||
| <Box | ||
| bg="gray.50" | ||
| p={4} | ||
| borderRadius="lg" | ||
| boxShadow="md" | ||
| > | ||
| <HStack | ||
| spacing={4} | ||
| alignItems="start" | ||
| > | ||
| <Box | ||
| p={3} | ||
| > | ||
| <SlackIntegrationIcon /> | ||
| </Box> | ||
| <Box width="100%"> | ||
| <Heading fontSize="lg" mb={2}>Slack <Badge ml="8px" fontSize="12px" textTransform="capitalize" fontWeight="500" padding="2px 6px" variant='outline' colorScheme='yellow'> | ||
| Beta | ||
| </Badge></Heading> | ||
| <Text fontSize="sm" color="gray.600"> | ||
| Connect your WebWhiz chatbot to your Slack workspace, | ||
| enabling direct access right from within | ||
| Slack. | ||
| </Text> | ||
| <Button | ||
| variant="solid" | ||
| size="sm" | ||
| colorScheme="blue" | ||
| mt={4} | ||
| onClick={() => { | ||
| window.open(`${baseURL}/slack/install?webwhizKbId=${chatbotId}`, '_blank'); | ||
| }} | ||
| > | ||
| Add to Slack | ||
| </Button> | ||
| </Box> | ||
| </HStack> | ||
| </Box> | ||
| <Box | ||
| bg="gray.50" | ||
| p={4} | ||
| borderRadius="lg" | ||
| boxShadow="md" | ||
| > | ||
| <HStack | ||
| spacing={4} | ||
| alignItems="start" | ||
| > | ||
| <Box | ||
| p={3} | ||
| > | ||
| <ZapierIcon /> | ||
| </Box> | ||
| <Box width="100%"> | ||
| <Heading fontSize="lg" mb={2}>Zapier <Badge ml="8px" fontSize="12px" textTransform="capitalize" fontWeight="500" padding="2px 6px" variant='outline' colorScheme='yellow'> | ||
| Beta | ||
| </Badge></Heading> | ||
| <Text fontSize="sm" color="gray.600"> | ||
| Unlock the potential of AI chatbots in your workflow with the WebWhiz and Zapier integration. | ||
| </Text> | ||
| <HStack> | ||
| <a href="https://zapier.com/developer/public-invite/191149/ff8d8edc00c542b4c8c34aabac594b1e/"> | ||
| <Button | ||
| variant="solid" | ||
| size="sm" | ||
| colorScheme="blue" | ||
| mt={4} | ||
| > | ||
| Connect with Zapier | ||
| </Button> | ||
| </a> | ||
|
|
||
| <a href="https://www.webwhiz.ai/docs/integrations/zapier-integration/"> | ||
| <Button | ||
| variant="outline" | ||
| size="sm" | ||
| colorScheme="gray" | ||
| mt={4} | ||
| > | ||
| View docs | ||
| </Button> | ||
| </a> | ||
|
|
||
| </HStack> | ||
| </Box> | ||
| </HStack> | ||
| </Box> | ||
| </SimpleGrid> | ||
| ) | ||
| } | ||
|
|
||
| export default Integrations |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.