lanegoolsby Github contribution chart
lanegoolsby Github Stats
lanegoolsby Most Used Languages

Activity

19 Oct 2022

Lanegoolsby

Removing a somewhat useless comment in order to kick the build

Pushed On 19 Oct 2022 at 02:55:03
Issue Comment

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 19 Oct 2022 at 01:15:28

Lanegoolsby

@slorber I removed the hook for now. I left the modernization of the gtag event process in place since its still relevant.

I still see value for something like this. There are 3 or 4 Community plugins, in addition to the GA and GTag plugins, that are just for adding analytics to a DS site. It would be super nice to have a codified way to send custom events to [insert analytics plugin here] via an official DS API.

Commented On 19 Oct 2022 at 01:15:28

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 19 Oct 2022 at 01:07:25

Lanegoolsby

I removed it
On 19 Oct 2022 at 01:07:25

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Merged On 19 Oct 2022 at 01:07:28

Lanegoolsby

Commented On 19 Oct 2022 at 01:07:28

Lanegoolsby

Derp

Pushed On 19 Oct 2022 at 01:06:55

Lanegoolsby

Backing out abstraction

Pushed On 19 Oct 2022 at 01:01:53

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 05 Oct 2022 at 07:39:36

Lanegoolsby

I'm not sure but probably not. I don't understand the intricacies of typedefs and the original purpose of this file
On 05 Oct 2022 at 07:39:36

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Merged On 05 Oct 2022 at 07:39:37

Lanegoolsby

Commented On 05 Oct 2022 at 07:39:37

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 05 Oct 2022 at 07:33:03

Lanegoolsby

Yes, in addition to still behaving as it was earlier it now follows the best practice from Google regarding SPA and page navigation. https://developers.google.com/analytics/devguides/collection/gtagjs/single-page-applications
On 05 Oct 2022 at 07:33:03

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Merged On 05 Oct 2022 at 07:33:04

Lanegoolsby

Commented On 05 Oct 2022 at 07:33:04
Issue Comment

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 05 Oct 2022 at 07:29:30

Lanegoolsby

However I'm willing to add proper TS support through the @types/gtag.js package (which seems not currently setup properly). Do you need help?

That would be greatly appreciated, I'm not sure what you're asking for. I'm still a neophyte when it comes to OOP with Typescript, Node, Webpack, etc. 😬 There's a bunch of secret knowledge I don't fully grok yet.

Commented On 05 Oct 2022 at 07:29:30

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 05 Oct 2022 at 07:23:35

Lanegoolsby

This allows developers to send custom events to GA without having to go through the `gtag.configure` call all over again. We have added some functionality to our DS sites that does not result in a navigation event (basically it displays or hides some content on the page based off a click event). We need to be able to track those clicks. To do this, we need to send [custom events](https://developers.google.com/analytics/devguides/collection/gtagjs/events) to GA. With this hook the code needed to send the custom events is much cleaner and easier, we don't have to copy/paste the `configure` boilerplate in individual React components, its type-safe and does not require `ts-ignore` statements for the `window.gtag()` call, nor do we need to create an internal service to reduce the boilerplate. Or, more specifically, I decided instead of writing that service for only our internal use I figured I'd give back to the community. Also, its best to avoid re-calling `configure` because every time the `configure` call is made a new pageview event is generated unless its disabled as documented [here](https://developers.google.com/analytics/devguides/collection/gtagjs/pages#manual_pageviews). Without disabling the default behavior pageview events will be doubled in count. While easy to disable, its also very easy to forget to disable it (ask me how I know that 😅).
On 05 Oct 2022 at 07:23:35

Lanegoolsby

feat(plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Merged On 05 Oct 2022 at 07:23:36

Lanegoolsby

Commented On 05 Oct 2022 at 07:23:36

Lanegoolsby

Auto-format to kick a new build

Pushed On 04 Oct 2022 at 01:29:01
Issue Comment

Lanegoolsby

feat (plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 03 Oct 2022 at 08:37:42

Lanegoolsby

@lanegoolsby apparently your dependency installation touched a lot more dependencies than it should. Could you try reverting the lockfile changes and re-installing?

That helped. I think the error that is happening now is a transient error. 'It works on my machine'. :)

Is there a way to re-run that one step?

Commented On 03 Oct 2022 at 08:37:42

Lanegoolsby

Reverting yarn.lock to fix tests

Pushed On 03 Oct 2022 at 08:10:33

Lanegoolsby

Adding if case for when in develop mode

Pushed On 03 Oct 2022 at 07:34:00
Issue Comment

Lanegoolsby

feat (plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 03 Oct 2022 at 07:30:12

Lanegoolsby

@slorber I'm very confused on why the tests are failing. I didn't touch anything in that package tree. Any ideas what might cause this?

Here's the failing test and line: https://github.com/facebook/docusaurus/blob/53dbbe36f2b5b1dafb76a1600118028e18b47a67/packages/stylelint-copyright/src/tests/index.test.ts#L100

I was able to narrow down that there are missing carriage returns when feeding the formatted text into the stylelint package. But I didn't touch anything that would have made an impact to how the strings are concatenated?

Some examples of the failing strings:

Test case 1

Expected:

 /**
     * Copyright
     */  
    .foo {} 

Result:

 /**
     * Copyright
     */.foo {} <-- no carriage return 

Test case 2

Expected:

 /**
     * Copyright
     */
    
    /**
    * Copyright
    */
    
    .foo {} 

Result:

 /**
     * Copyright
     *//**  <-- no carriage return
    * Copyright
    */
    
    .foo {} 

Commented On 03 Oct 2022 at 07:30:12

Lanegoolsby

Getting rid of local registry

Pushed On 03 Oct 2022 at 05:25:23

Lanegoolsby

PR Feedback

Pushed On 03 Oct 2022 at 05:14:15

Lanegoolsby

feat (plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 30 Sep 2022 at 02:19:44

Lanegoolsby

PS - there is an unofficial [React gtag](https://github.com/idmadj/ga-gtag) package available. Its basically a port of the popular [ReactGA](https://github.com/react-ga/react-ga) plugin (that only works with old GA3 sites). I thought about going that route instead but it seemed like a much bigger lift that this approach.
On 30 Sep 2022 at 02:19:44

Lanegoolsby

feat (plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Merged On 30 Sep 2022 at 02:19:45

Lanegoolsby

Commented On 30 Sep 2022 at 02:19:45

Lanegoolsby

feat (plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 30 Sep 2022 at 02:10:30

Lanegoolsby

> I can agree with that, but the types should rather be provided by ambient definitions from official gtag TS bindings preferably. > > If they don't provide those, I'd rather create our own types only, and not add an extra runtime api/hook There are gtag types published to [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/gtag.js). Are you suggesting I get rid of the `Event` interface and replace it with something exported from there? > For example: > > ```ts > interface Window { > gtag: ... > } > ``` > > Isn't this good enough to provide strong types for our users? Do we really need the extra client api/hook? I couldn't get that approach to work with my code. Its possible I was doing something wrong, but I always got a syntax error that gtag does not exist on the Window object. In fact, the reason that I don't reference the Event interface in `src/types.d.ts` is because if I try to use an import statement in that file I get the same syntax error. The `onClick` approach you suggested above does indeed work, but it requires using a `ts-ignore` statement because gtag is not global. Our internal code analyzers get very angry when we do stuff like that.
On 30 Sep 2022 at 02:10:30

Lanegoolsby

feat (plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Merged On 30 Sep 2022 at 02:10:31

Lanegoolsby

Commented On 30 Sep 2022 at 02:10:31

Lanegoolsby

feat (plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Forked On 29 Sep 2022 at 06:25:09

Lanegoolsby

They can, I'm just an old school OOO programmer and will always provide strong types. :)
On 29 Sep 2022 at 06:25:09

Lanegoolsby

feat (plugin-gtag): Adding useGoogleAnalytics hook

Pre-flight checklist

  • [x] I have read the Contributing Guidelines on pull requests.
  • [ ] If this is a code change: I have written unit tests and/or added dogfooding pages to fully verify the new behavior.
  • [ ] If this is a new API or substantial change: the PR has an accompanying issue (closes #0000) and the maintainers have approved on my working plan.

Motivation

This exposes a React hook that allows for programmatically sending custom events to Google Analytics.

Test Plan

Temporarily added a button to the home page with a onClick that called the hook.

//snip
import { useGoogleAnalytics, type Event } from '@docusaurus/plugin-google-gtag';
//snip

function HeroBanner() {
  const { sendEvent } = useGoogleAnalytics();

  function onClick() {
    const event: Event = {
      action: 'some action',
      event_category: 'come category',
      event_label: 'some label',
      value:'some value'
    }
    sendEvent(event)
  }

  return (
    <div className={styles.hero} data-theme="dark">
      <div className={styles.heroInner}>
        <button type='button' onClick={onClick}><Translate>Click me</Translate></button> 

Test links

Deploy preview: https://deploy-preview-_____--docusaurus-2.netlify.app/

Related issues/PRs

Merged On 29 Sep 2022 at 06:25:10

Lanegoolsby

Commented On 29 Sep 2022 at 06:25:10

Lanegoolsby

feat (plugin-gtag): Adding useGoogleAnalytics hook

Created On 28 Sep 2022 at 08:48:35

Lanegoolsby

Derp

Pushed On 28 Sep 2022 at 08:47:59

Lanegoolsby

feat(core): prefetch on mobile touchstart (#8109)

Pushed On 28 Sep 2022 at 08:29:25

Lanegoolsby

docs(showcase): add SeaQL sites to showcase (#8107)

Pushed On 28 Sep 2022 at 08:29:25

Lanegoolsby

docs: update showcase/ossinsight screenshot (#8100)

Pushed On 28 Sep 2022 at 08:29:25

Lanegoolsby

fix(theme-translations): complete turkish theme default translations (#8105)

Pushed On 28 Sep 2022 at 08:29:25

Lanegoolsby

Merge branch 'facebook:main' into main

Pushed On 28 Sep 2022 at 08:29:25

Lanegoolsby

Fixed and working

Pushed On 28 Sep 2022 at 08:29:02