Uh oh!
There was an error while loading. Please reload this page.
feat: add chatlio widget - #186
Conversation
|
|
✅ Deploy Preview for stackblitz-docs ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
Naming the component ChatlioWidget is confusing and may lead to infinite recursion, because vue doesn't make difference between kebab-cased or CamelCased components. So I used just Chatlio as component name. I'm also not sure where I should put the configuration, so I put it the easiest way I found. We may enhance typings later.
7e7e378 to
7c3c54aCompare| '/platform/webcontainers/': sidebarLinks('main', ['webcontainers']), | ||
| '/enterprise/': sidebarLinks('enterprise', ['enterprise']), | ||
| }, | ||
| chatlio: { |
There was a problem hiding this comment.
Probably we need to patch the config type to incorporate this.
Maybe there is a better place for the config as well
There was a problem hiding this comment.
I’m fine with passing it as part of the theme config.
Typing seems doable with:
import{defineConfigWithTheme,typeDefaultTheme,typeHeadConfig}from'vitepress';interfaceThemeConfigextendsDefaultTheme.Config{chatlio: {id: string|undefined,allowedRoutes: (RegExp|string)[],}}exportdefaultdefineConfigWithTheme<ThemeConfig>(/* … */);Though it doesn't seem to translate to useData() getting a type for data.theme.value.chatlio, so not sure how useful that is.
| template: { | ||
| compilerOptions: { | ||
| isCustomElement: (tag) => { | ||
| return ["chatlio-widget"].includes(tag.toLowerCase()); |
There was a problem hiding this comment.
usually it's suggested to just check for -, but in our case, I'd opt for more granular control
| // We load the widget on allowed pages, but then persist it across all the pages in case you want | ||
| // to browse the docs and keep the chat. | ||
| if (chatlio.allowedRoutes.some((allowedRoute: string) => route.path.match(allowedRoute))) { | ||
| loadChatlio(); |
There was a problem hiding this comment.
I didn't add any timeouts here, I don't think we need it, but not a strong opinion
Naming the component ChatlioWidget is confusing and may lead to infinite recursion, because vue doesn't make difference between kebab-cased or CamelCased components. So I used just Chatlio as component name. I'm also not sure where I should put the configuration, so I put it the easiest way I found. We may enhance typings later.
…o-in-docs' into aleksandrsl/pro-1538-show-chatlio-in-docs * origin/aleksandrsl/pro-1538-show-chatlio-in-docs: feat: add chatlio widget feat: add maintenance banner (#185) # Conflicts: # .vitepress/config.ts
fvsch
left a comment
There was a problem hiding this comment.
Looks pretty good. Sorry for the delay in reviewing this!
I added a couple nits.
| '/platform/webcontainers/': sidebarLinks('main', ['webcontainers']), | ||
| '/enterprise/': sidebarLinks('enterprise', ['enterprise']), | ||
| }, | ||
| chatlio: { |
There was a problem hiding this comment.
I’m fine with passing it as part of the theme config.
Typing seems doable with:
import{defineConfigWithTheme,typeDefaultTheme,typeHeadConfig}from'vitepress';interfaceThemeConfigextendsDefaultTheme.Config{chatlio: {id: string|undefined,allowedRoutes: (RegExp|string)[],}}exportdefaultdefineConfigWithTheme<ThemeConfig>(/* … */);Though it doesn't seem to translate to useData() getting a type for data.theme.value.chatlio, so not sure how useful that is.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
…o-in-docs' into aleksandrsl/pro-1538-show-chatlio-in-docs * origin/aleksandrsl/pro-1538-show-chatlio-in-docs: web-publisher: Update docs/guides/integration/bug-reproductions.md (#179) Update docs/guides/integration/create-with-sdk.md (#178) web-publisher: Update docs/guides/user-guide/available-environments.md (#176) Update docs/guides/user-guide/general-faqs.md (#177) web-publisher: Update docs/codeflow/content-updates-with-web-publisher.md (#183) chore: remove maintenance banner (#187)
Naming the component ChatlioWidget is confusing and may lead to infinite recursion, because vue doesn't make difference between kebab-cased or CamelCased components. So I used just Chatlio as component name. I'm also not sure where I should put the configuration, so I put it the easiest way I found. We may enhance typings though.
PR Description
This PR fixes the issue number: PRO-1538
Summary of my changes and explanation of my decisions
Self-check
Please check all that apply:
Contributors list
⚡️ ⚡️ ⚡️ Thank you for contributing to StackBlitz ⚡️ ⚡️ ⚡️