From 65b30bfc489fdfebc8e8a047383840cf9ff6ea7f Mon Sep 17 00:00:00 2001 From: Baptiste Arnaud Date: Wed, 9 Feb 2022 17:41:45 +0100 Subject: [PATCH] =?UTF-8?q?docs(share):=20=F0=9F=93=9D=20Add=20embed=20ins?= =?UTF-8?q?tructions?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 2 + apps/builder/assets/icons.tsx | 24 +++ apps/builder/assets/logos/GiphyLogo.tsx | 23 +++ .../assets/logos/GoogleAnalyticsLogo.tsx | 101 ++++++++++ .../{logos.tsx => logos/GoogleSheetsLogo.tsx} | 190 ------------------ apps/builder/assets/logos/GtmLogo.tsx | 29 +++ apps/builder/assets/logos/IframeLogo.tsx | 50 +++++ apps/builder/assets/logos/JavascriptLogo.tsx | 16 ++ apps/builder/assets/logos/NotionLogo.tsx | 19 ++ apps/builder/assets/logos/OtherLogo.tsx | 31 +++ apps/builder/assets/logos/ReactLogo.tsx | 21 ++ apps/builder/assets/logos/ShopifyLogo.tsx | 25 +++ apps/builder/assets/logos/TypebotLogo.tsx | 45 +++++ apps/builder/assets/logos/WebflowLogo.tsx | 21 ++ apps/builder/assets/logos/WixLogo.tsx | 29 +++ apps/builder/assets/logos/WordpressLogo.tsx | 33 +++ apps/builder/assets/logos/index.tsx | 14 ++ .../components/auth/SocialLoginButtons.tsx | 8 +- .../builder/components/share/ShareContent.tsx | 53 +++-- .../share/integrations/EmbedButton.tsx | 145 +++++++++++++ .../modals/ChooseEmbedTypeList.tsx | 155 ++++++++++++++ .../modals/GtmModal/GtmInstructions.tsx | 131 ++++++++++++ .../integrations/modals/GtmModal/index.tsx | 63 ++++++ .../share/integrations/modals/IframeModal.tsx | 41 ++++ .../Javascript/JavascriptInstructions.tsx | 95 +++++++++ .../modals/Javascript/JavascriptModal.tsx | 67 ++++++ .../share/integrations/modals/NotionModal.tsx | 62 ++++++ .../modals/React/ReactInstructions.tsx | 86 ++++++++ .../integrations/modals/React/ReactModal.tsx | 63 ++++++ .../ShopifyModal/ShopifyInstructions.tsx | 130 ++++++++++++ .../modals/ShopifyModal/index.tsx | 63 ++++++ .../WebflowModal/WebflowInstructions.tsx | 107 ++++++++++ .../modals/WebflowModal/index.tsx | 63 ++++++ .../modals/WixModal/WixInstructions.tsx | 96 +++++++++ .../integrations/modals/WixModal/index.tsx | 63 ++++++ .../integrations/modals/WordpressModal.tsx | 66 ++++++ .../share/integrations/modals/index.tsx | 9 + apps/builder/components/shared/CodeEditor.tsx | 5 +- apps/builder/components/shared/Info.tsx | 4 + .../pages/typebots/[typebotId]/share.tsx | 2 +- packages/utils/src/utils.ts | 2 + 41 files changed, 2038 insertions(+), 214 deletions(-) create mode 100644 apps/builder/assets/logos/GiphyLogo.tsx create mode 100644 apps/builder/assets/logos/GoogleAnalyticsLogo.tsx rename apps/builder/assets/{logos.tsx => logos/GoogleSheetsLogo.tsx} (51%) create mode 100644 apps/builder/assets/logos/GtmLogo.tsx create mode 100644 apps/builder/assets/logos/IframeLogo.tsx create mode 100644 apps/builder/assets/logos/JavascriptLogo.tsx create mode 100644 apps/builder/assets/logos/NotionLogo.tsx create mode 100644 apps/builder/assets/logos/OtherLogo.tsx create mode 100644 apps/builder/assets/logos/ReactLogo.tsx create mode 100644 apps/builder/assets/logos/ShopifyLogo.tsx create mode 100644 apps/builder/assets/logos/TypebotLogo.tsx create mode 100644 apps/builder/assets/logos/WebflowLogo.tsx create mode 100644 apps/builder/assets/logos/WixLogo.tsx create mode 100644 apps/builder/assets/logos/WordpressLogo.tsx create mode 100644 apps/builder/assets/logos/index.tsx create mode 100644 apps/builder/components/share/integrations/EmbedButton.tsx create mode 100644 apps/builder/components/share/integrations/modals/ChooseEmbedTypeList.tsx create mode 100644 apps/builder/components/share/integrations/modals/GtmModal/GtmInstructions.tsx create mode 100644 apps/builder/components/share/integrations/modals/GtmModal/index.tsx create mode 100644 apps/builder/components/share/integrations/modals/IframeModal.tsx create mode 100644 apps/builder/components/share/integrations/modals/Javascript/JavascriptInstructions.tsx create mode 100644 apps/builder/components/share/integrations/modals/Javascript/JavascriptModal.tsx create mode 100644 apps/builder/components/share/integrations/modals/NotionModal.tsx create mode 100644 apps/builder/components/share/integrations/modals/React/ReactInstructions.tsx create mode 100644 apps/builder/components/share/integrations/modals/React/ReactModal.tsx create mode 100644 apps/builder/components/share/integrations/modals/ShopifyModal/ShopifyInstructions.tsx create mode 100644 apps/builder/components/share/integrations/modals/ShopifyModal/index.tsx create mode 100644 apps/builder/components/share/integrations/modals/WebflowModal/WebflowInstructions.tsx create mode 100644 apps/builder/components/share/integrations/modals/WebflowModal/index.tsx create mode 100644 apps/builder/components/share/integrations/modals/WixModal/WixInstructions.tsx create mode 100644 apps/builder/components/share/integrations/modals/WixModal/index.tsx create mode 100644 apps/builder/components/share/integrations/modals/WordpressModal.tsx create mode 100644 apps/builder/components/share/integrations/modals/index.tsx diff --git a/.gitignore b/.gitignore index 0317e5179..212545374 100644 --- a/.gitignore +++ b/.gitignore @@ -35,3 +35,5 @@ workspace.code-workspace .turbo apps/builder/tsconfig.tsbuildinfo + +yarn-error.log diff --git a/apps/builder/assets/icons.tsx b/apps/builder/assets/icons.tsx index 8adbf9577..9fd591967 100644 --- a/apps/builder/assets/icons.tsx +++ b/apps/builder/assets/icons.tsx @@ -346,3 +346,27 @@ export const SendEmailIcon = (props: IconProps) => ( ) + +export const FacebookIcon = (props: IconProps) => ( + + Logo Facebook + + +) + +export const GoogleIcon = (props: IconProps) => ( + + {'Logo Google'} + + +) + +export const GithubIcon = (props: IconProps) => ( + + {'Logo Github'} + + +) diff --git a/apps/builder/assets/logos/GiphyLogo.tsx b/apps/builder/assets/logos/GiphyLogo.tsx new file mode 100644 index 000000000..8e41c57f4 --- /dev/null +++ b/apps/builder/assets/logos/GiphyLogo.tsx @@ -0,0 +1,23 @@ +import { IconProps, Icon } from '@chakra-ui/react' + +export const GiphyLogo = (props: IconProps) => ( + + + + + + + + + + + + + + + +) diff --git a/apps/builder/assets/logos/GoogleAnalyticsLogo.tsx b/apps/builder/assets/logos/GoogleAnalyticsLogo.tsx new file mode 100644 index 000000000..74444291a --- /dev/null +++ b/apps/builder/assets/logos/GoogleAnalyticsLogo.tsx @@ -0,0 +1,101 @@ +import { IconProps, Icon } from '@chakra-ui/react' + +export const GoogleAnalyticsLogo = (props: IconProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +) diff --git a/apps/builder/assets/logos.tsx b/apps/builder/assets/logos/GoogleSheetsLogo.tsx similarity index 51% rename from apps/builder/assets/logos.tsx rename to apps/builder/assets/logos/GoogleSheetsLogo.tsx index bdc7e10b9..65eda1a21 100644 --- a/apps/builder/assets/logos.tsx +++ b/apps/builder/assets/logos/GoogleSheetsLogo.tsx @@ -1,73 +1,5 @@ import { IconProps, Icon } from '@chakra-ui/react' -export const TypebotLogo = ({ - isDark, - ...props -}: { isDark?: boolean } & IconProps) => ( - - - - - - - -) - -export const GithubLogo = (props: IconProps) => ( - - {'Logo Github'} - - -) - -export const GoogleLogo = (props: IconProps) => ( - - {'Logo Google'} - - -) - -export const FacebookLogo = (props: IconProps) => ( - - Logo Facebook - - -) - export const GoogleSheetsLogo = (props: IconProps) => ( Sheets-icon @@ -244,125 +176,3 @@ export const GoogleSheetsLogo = (props: IconProps) => ( ) - -export const GoogleAnalyticsLogo = (props: IconProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -) - -export const GiphyLogo = (props: IconProps) => ( - - - - - - - - - - - - - - - -) diff --git a/apps/builder/assets/logos/GtmLogo.tsx b/apps/builder/assets/logos/GtmLogo.tsx new file mode 100644 index 000000000..d09d10734 --- /dev/null +++ b/apps/builder/assets/logos/GtmLogo.tsx @@ -0,0 +1,29 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const GtmLogo = (props: IconProps) => ( + + + + + + +) diff --git a/apps/builder/assets/logos/IframeLogo.tsx b/apps/builder/assets/logos/IframeLogo.tsx new file mode 100644 index 000000000..8076e4e09 --- /dev/null +++ b/apps/builder/assets/logos/IframeLogo.tsx @@ -0,0 +1,50 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const IframeLogo = (props: IconProps) => { + return ( + + + + + + + + + + + + + + + + + + + ) +} diff --git a/apps/builder/assets/logos/JavascriptLogo.tsx b/apps/builder/assets/logos/JavascriptLogo.tsx new file mode 100644 index 000000000..1d912d8f7 --- /dev/null +++ b/apps/builder/assets/logos/JavascriptLogo.tsx @@ -0,0 +1,16 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const JavascriptLogo = (props: IconProps) => ( + + + + +) diff --git a/apps/builder/assets/logos/NotionLogo.tsx b/apps/builder/assets/logos/NotionLogo.tsx new file mode 100644 index 000000000..ee4f313e9 --- /dev/null +++ b/apps/builder/assets/logos/NotionLogo.tsx @@ -0,0 +1,19 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const NotionLogo = (props: IconProps) => ( + + + +) diff --git a/apps/builder/assets/logos/OtherLogo.tsx b/apps/builder/assets/logos/OtherLogo.tsx new file mode 100644 index 000000000..3ce5d1cc1 --- /dev/null +++ b/apps/builder/assets/logos/OtherLogo.tsx @@ -0,0 +1,31 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const OtherLogo = (props: IconProps) => ( + + + + + + +) diff --git a/apps/builder/assets/logos/ReactLogo.tsx b/apps/builder/assets/logos/ReactLogo.tsx new file mode 100644 index 000000000..532ac3057 --- /dev/null +++ b/apps/builder/assets/logos/ReactLogo.tsx @@ -0,0 +1,21 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const ReactLogo = (props: IconProps) => ( + + + + +) diff --git a/apps/builder/assets/logos/ShopifyLogo.tsx b/apps/builder/assets/logos/ShopifyLogo.tsx new file mode 100644 index 000000000..1cf76b3d1 --- /dev/null +++ b/apps/builder/assets/logos/ShopifyLogo.tsx @@ -0,0 +1,25 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const ShopifyLogo = (props: IconProps) => ( + + + + + +) diff --git a/apps/builder/assets/logos/TypebotLogo.tsx b/apps/builder/assets/logos/TypebotLogo.tsx new file mode 100644 index 000000000..61698cb15 --- /dev/null +++ b/apps/builder/assets/logos/TypebotLogo.tsx @@ -0,0 +1,45 @@ +import { IconProps, Icon } from '@chakra-ui/react' + +export const TypebotLogo = ({ + isDark, + ...props +}: { isDark?: boolean } & IconProps) => ( + + + + + + + +) diff --git a/apps/builder/assets/logos/WebflowLogo.tsx b/apps/builder/assets/logos/WebflowLogo.tsx new file mode 100644 index 000000000..b7da51d96 --- /dev/null +++ b/apps/builder/assets/logos/WebflowLogo.tsx @@ -0,0 +1,21 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const WebflowLogo = (props: IconProps) => ( + + + + +) diff --git a/apps/builder/assets/logos/WixLogo.tsx b/apps/builder/assets/logos/WixLogo.tsx new file mode 100644 index 000000000..67bcfb1ac --- /dev/null +++ b/apps/builder/assets/logos/WixLogo.tsx @@ -0,0 +1,29 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const WixLogo = (props: IconProps) => ( + + + + + + +) diff --git a/apps/builder/assets/logos/WordpressLogo.tsx b/apps/builder/assets/logos/WordpressLogo.tsx new file mode 100644 index 000000000..d70846dc8 --- /dev/null +++ b/apps/builder/assets/logos/WordpressLogo.tsx @@ -0,0 +1,33 @@ +import { Icon, IconProps } from '@chakra-ui/react' + +export const WordpressLogo = (props: IconProps) => ( + + + + + + + +) diff --git a/apps/builder/assets/logos/index.tsx b/apps/builder/assets/logos/index.tsx new file mode 100644 index 000000000..14a8d7567 --- /dev/null +++ b/apps/builder/assets/logos/index.tsx @@ -0,0 +1,14 @@ +export * from './GiphyLogo' +export * from './GoogleAnalyticsLogo' +export * from './GoogleSheetsLogo' +export * from './GtmLogo' +export * from './IframeLogo' +export * from './JavascriptLogo' +export * from './NotionLogo' +export * from './OtherLogo' +export * from './ReactLogo' +export * from './ShopifyLogo' +export * from './TypebotLogo' +export * from './WebflowLogo' +export * from './WordpressLogo' +export * from './WixLogo' diff --git a/apps/builder/components/auth/SocialLoginButtons.tsx b/apps/builder/components/auth/SocialLoginButtons.tsx index 387303ca4..760619d57 100644 --- a/apps/builder/components/auth/SocialLoginButtons.tsx +++ b/apps/builder/components/auth/SocialLoginButtons.tsx @@ -1,5 +1,5 @@ -import { FacebookLogo, GithubLogo, GoogleLogo } from 'assets/logos' import { Stack, Button } from '@chakra-ui/react' +import { FacebookIcon, GithubIcon, GoogleIcon } from 'assets/icons' import { signIn, useSession } from 'next-auth/react' import React from 'react' @@ -15,7 +15,7 @@ export const SocialLoginButtons = () => { return (