From 6cadd618c2bc743168b9b33b449f4ac584ec3084 Mon Sep 17 00:00:00 2001 From: Michael Masson <10071388+michaelmass@users.noreply.github.com> Date: Mon, 29 Apr 2024 17:06:42 -0400 Subject: [PATCH] feat(webchat-v2): added documentation for webchat v2 (#293) --- .gitignore | 3 +- assets/close-down.svg | 5 + assets/community.icon.svg | 10 +- assets/construction.svg | 20 + assets/execution.svg | 27 + assets/javascript.svg | 1 + assets/open-in-window.svg | 6 + assets/react.svg | 1 + components/ComingSoon.tsx | 15 + components/Demo.tsx | 77 +++ components/DocumentationIcon.tsx | 25 + components/Feedback.tsx | 3 +- components/LinkCard.tsx | 4 +- components/LoadGTM.tsx | 2 +- index.html | 15 + package.json | 4 +- pages/developers/_meta.json | 3 +- pages/developers/webchat-v2/_meta.json | 9 + pages/developers/webchat-v2/api.mdx | 5 + pages/developers/webchat-v2/embedded.mdx | 47 ++ .../webchat-v2/embedded/using-javascript.mdx | 7 + pages/developers/webchat-v2/examples.mdx | 12 + .../webchat-v2/javascript-client.mdx | 23 + pages/developers/webchat-v2/quick-start.mdx | 33 ++ pages/developers/webchat-v2/react.mdx | 63 +++ pages/developers/webchat-v2/react/_meta.json | 7 + .../developers/webchat-v2/react/composer.mdx | 30 ++ .../webchat-v2/react/custom-message.mdx | 5 + pages/developers/webchat-v2/react/fab.mdx | 26 + pages/developers/webchat-v2/react/header.mdx | 26 + .../webchat-v2/react/message-list.mdx | 29 ++ pages/developers/webchat-v2/theming.mdx | 13 + .../developers/webchat-v2/theming/_meta.json | 6 + .../webchat-v2/theming/botpress-styler.mdx | 5 + .../webchat-v2/theming/botpress-themes.mdx | 34 ++ .../webchat-v2/theming/custom-css.mdx | 5 + .../theming/extending-botpress-themes.mdx | 5 + pnpm-lock.yaml | 475 ++++++++++++------ public/content/webchat/component-composer.png | Bin 0 -> 16514 bytes public/content/webchat/component-fab.png | Bin 0 -> 9592 bytes public/content/webchat/component-header.png | Bin 0 -> 48004 bytes .../webchat/component-message-list.png | Bin 0 -> 144914 bytes public/content/webchat/demo.png | Bin 0 -> 102781 bytes public/content/webchat/embed-config.png | Bin 0 -> 314594 bytes public/content/webchat/themes.png | Bin 0 -> 337430 bytes public/content/webchat/themes/dawn.png | Bin 0 -> 88615 bytes public/content/webchat/themes/dusk.png | Bin 0 -> 91601 bytes public/content/webchat/themes/eggplant.png | Bin 0 -> 93602 bytes public/content/webchat/themes/galaxy.png | Bin 0 -> 95038 bytes public/content/webchat/themes/midnight.png | Bin 0 -> 87764 bytes public/content/webchat/themes/prism.png | Bin 0 -> 99880 bytes tailwind.config.js | 6 +- test.html | 15 + 53 files changed, 949 insertions(+), 158 deletions(-) create mode 100644 assets/close-down.svg create mode 100644 assets/construction.svg create mode 100644 assets/execution.svg create mode 100644 assets/javascript.svg create mode 100644 assets/open-in-window.svg create mode 100644 assets/react.svg create mode 100644 components/ComingSoon.tsx create mode 100644 components/Demo.tsx create mode 100644 index.html create mode 100644 pages/developers/webchat-v2/_meta.json create mode 100644 pages/developers/webchat-v2/api.mdx create mode 100644 pages/developers/webchat-v2/embedded.mdx create mode 100644 pages/developers/webchat-v2/embedded/using-javascript.mdx create mode 100644 pages/developers/webchat-v2/examples.mdx create mode 100644 pages/developers/webchat-v2/javascript-client.mdx create mode 100644 pages/developers/webchat-v2/quick-start.mdx create mode 100644 pages/developers/webchat-v2/react.mdx create mode 100644 pages/developers/webchat-v2/react/_meta.json create mode 100644 pages/developers/webchat-v2/react/composer.mdx create mode 100644 pages/developers/webchat-v2/react/custom-message.mdx create mode 100644 pages/developers/webchat-v2/react/fab.mdx create mode 100644 pages/developers/webchat-v2/react/header.mdx create mode 100644 pages/developers/webchat-v2/react/message-list.mdx create mode 100644 pages/developers/webchat-v2/theming.mdx create mode 100644 pages/developers/webchat-v2/theming/_meta.json create mode 100644 pages/developers/webchat-v2/theming/botpress-styler.mdx create mode 100644 pages/developers/webchat-v2/theming/botpress-themes.mdx create mode 100644 pages/developers/webchat-v2/theming/custom-css.mdx create mode 100644 pages/developers/webchat-v2/theming/extending-botpress-themes.mdx create mode 100644 public/content/webchat/component-composer.png create mode 100644 public/content/webchat/component-fab.png create mode 100644 public/content/webchat/component-header.png create mode 100644 public/content/webchat/component-message-list.png create mode 100644 public/content/webchat/demo.png create mode 100644 public/content/webchat/embed-config.png create mode 100644 public/content/webchat/themes.png create mode 100644 public/content/webchat/themes/dawn.png create mode 100644 public/content/webchat/themes/dusk.png create mode 100644 public/content/webchat/themes/eggplant.png create mode 100644 public/content/webchat/themes/galaxy.png create mode 100644 public/content/webchat/themes/midnight.png create mode 100644 public/content/webchat/themes/prism.png create mode 100644 test.html diff --git a/.gitignore b/.gitignore index 699280ec..d261c091 100644 --- a/.gitignore +++ b/.gitignore @@ -10,4 +10,5 @@ out pages/api-documentation/index.mdx .vercel .env*.local -.ignore.me.* \ No newline at end of file +.ignore.me.* +lefthook.yml diff --git a/assets/close-down.svg b/assets/close-down.svg new file mode 100644 index 00000000..fcba34b2 --- /dev/null +++ b/assets/close-down.svg @@ -0,0 +1,5 @@ + + + diff --git a/assets/community.icon.svg b/assets/community.icon.svg index 1a386617..0aa8b93c 100644 --- a/assets/community.icon.svg +++ b/assets/community.icon.svg @@ -1,4 +1,8 @@ - - - + + + diff --git a/assets/construction.svg b/assets/construction.svg new file mode 100644 index 00000000..2e108b83 --- /dev/null +++ b/assets/construction.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + diff --git a/assets/execution.svg b/assets/execution.svg new file mode 100644 index 00000000..df7a1184 --- /dev/null +++ b/assets/execution.svg @@ -0,0 +1,27 @@ + + + + + + + + + + + + + + + + + diff --git a/assets/javascript.svg b/assets/javascript.svg new file mode 100644 index 00000000..1f203d35 --- /dev/null +++ b/assets/javascript.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/assets/open-in-window.svg b/assets/open-in-window.svg new file mode 100644 index 00000000..8b663935 --- /dev/null +++ b/assets/open-in-window.svg @@ -0,0 +1,6 @@ + + + + diff --git a/assets/react.svg b/assets/react.svg new file mode 100644 index 00000000..3a27f7ce --- /dev/null +++ b/assets/react.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/components/ComingSoon.tsx b/components/ComingSoon.tsx new file mode 100644 index 00000000..bea61d9d --- /dev/null +++ b/components/ComingSoon.tsx @@ -0,0 +1,15 @@ +import Construction from '@assets/construction.svg' + +type Props = {} + +export const ComingSoon = ({}: Props) => { + return ( +
+

Coming Soon

+

This section is under construction.

+
+ +
+
+ ) +} diff --git a/components/Demo.tsx b/components/Demo.tsx new file mode 100644 index 00000000..87f9feaf --- /dev/null +++ b/components/Demo.tsx @@ -0,0 +1,77 @@ +import Execution from "@assets/execution.svg"; +import CloseDown from "@assets/close-down.svg"; +import OpenInWindow from "@assets/open-in-window.svg"; +import { useState } from "react"; + +type Props = { + title?: string; + message?: string; + example: string; + preload?: boolean; + file?: string +}; + +export const Demo = ({ example, message, title, file = 'src/App.tsx', preload = true }: Props) => { + const [showDemo, setShowDemo] = useState(false); + + const src = `https://stackblitz.com/github/botpress/documentation-examples/tree/master/examples/${example}?embed=1&hideNavigation=1&view=both&file=${encodeURIComponent(file)}`; + + return ( + <> + {showDemo && ( +
+ )} +
setShowDemo(true)} + > +
+
+ +
+ {(preload || showDemo) && ( +