Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Trigger to open the support widget #1331

Open
wants to merge 48 commits into
base: main
Choose a base branch
from

Conversation

dallasread
Copy link
Member

@dallasread dallasread commented Dec 19, 2024

This PR makes the support widget fill more of the screen, as well:

  • Adds data-dnsimple-open-support-widget: can be added to any DOM element to trigger the opening of the widget.
  • Adds data-dnsimple-current-site-url="https://NOTHING.dnsimple.com": used to determine if the article is for the site the customer is already on. For example, if the customer is @ dnsimple.com and they search for alias, we want the result to show in the support widget browser. If they are on support.dnsimple.com, then we want to do a full page load to the result.

image

QA

Test using yarn widget:

  • Search for alias.
  • The search result links should open in the widget (because data-dnsimple-current-site-url="https://NOTHING.dnsimple.com" doesn't match the current site).

Test the preview:

  • Search for alias.
  • Click on a result should change the page like a normal page click (not use the support widget browser OR be in a new tab).

Test on DNSimple.com:

[...document.querySelectorAll('#dnsimple-support-wrapper, #dnsimple-support-widget')].forEach((el) => el && document.body.removeChild(el))

const $script = document.createElement('script');
$script.type = 'text/javascript';
$script.src = `https://deploy-preview-1331--dnsimple-support.netlify.app/widget.js`;

document.getElementsByTagName('head')[0].appendChild($script);
  • The search result links should open in the widget.

@dallasread dallasread added the javascript Pull requests that update Javascript code label Dec 19, 2024
@dallasread dallasread self-assigned this Dec 19, 2024
@dallasread dallasread changed the base branch from main to spike/support-widget December 19, 2024 19:30
@dallasread dallasread changed the base branch from spike/support-widget to main December 19, 2024 20:04
@dallasread dallasread changed the base branch from main to spike/support-widget December 19, 2024 20:05
@dallasread dallasread force-pushed the spike/support-widget-full-width branch from ba3ccc1 to f5123a0 Compare December 19, 2024 20:09
@dallasread dallasread force-pushed the spike/support-widget-full-width branch from 1d424de to 8f6c52b Compare February 7, 2025 16:03
@@ -101,27 +114,33 @@ export default {
},
focus () {
const $header = this.$refs.header;
nextTick(() => {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Need to wait a tick before the input is rendered.

const script = document.createElement('script');
this.isLoading = true;
script.type = 'text/javascript';
script.src = `${this.rootURL}/search.js`;
script.src = `https://support.dnsimple.com/search.js`;
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This'll be cleaned up when we add multiple sources (eg. dev site articles).

@@ -32,8 +32,8 @@
"scripts": {
"live": "concurrently 'bundle exec nanoc live' 'bundle exec rake compile'",
"build": "./node_modules/.bin/webpack && vite build ./_widget",
"lint": "eslint _widget content spec",
"lint:fix": "eslint _widget content spec --fix",
"lint": "eslint _widget src spec",
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🤖 was complaining.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can't wait to not make this an erb file. 😄

Base automatically changed from spike/support-widget to main February 10, 2025 15:48
@dallasread dallasread requested a review from kojdm February 10, 2025 16:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
javascript Pull requests that update Javascript code
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants