Feat - Add PostHog support for GoDAM

inc/classes/class-pages.php

@@ -507,6 +507,12 @@ public function admin_enqueue_scripts() {
 				)
 			);
 
+			wp_localize_script(
+				'transcoder-page-script-video-editor',
+				'posthogConfig',
+				$this->get_posthog_config()
+			);
+
 			// Enqueue Gravity Forms styles if the plugin is active.
 			if ( $is_gf_active ) {
 				$this->enqueue_gravity_forms_styles();
@@ -601,6 +607,12 @@ public function admin_enqueue_scripts() {
 				$rtgodam_user_data
 			);
 
+			wp_localize_script(
+				'godam-page-script-dashboard',
+				'posthogConfig',
+				$this->get_posthog_config()
+			);
+
 			wp_localize_script(
 				'godam-page-script-dashboard',
 				'videoData',
@@ -657,6 +669,12 @@ public function admin_enqueue_scripts() {
 				)
 			);
 
+			wp_localize_script(
+				'transcoder-page-script-analytics',
+				'posthogConfig',
+				$this->get_posthog_config()
+			);
+
 			$rtgodam_user_data = rtgodam_get_user_data( true );
 
 			wp_localize_script(
@@ -692,6 +710,12 @@ public function admin_enqueue_scripts() {
 				$rtgodam_user_data
 			);
 
+			wp_localize_script(
+				'godam-page-script-help',
+				'posthogConfig',
+				$this->get_posthog_config()
+			);
+
 			// Footer URL data for internal redirection.
 			wp_localize_script(
 				'godam-page-script-help',
@@ -722,6 +746,12 @@ public function admin_enqueue_scripts() {
 				);
 			}
 
+			wp_localize_script(
+				'transcoder-page-script-godam',
+				'posthogConfig',
+				$this->get_posthog_config()
+			);
+
 			// Footer URL data for internal redirection.
 			wp_localize_script(
 				'transcoder-page-script-godam',
@@ -753,6 +783,12 @@ public function admin_enqueue_scripts() {
 				$rtgodam_user_data
 			);
 
+			wp_localize_script(
+				'godam-page-script-tools',
+				'posthogConfig',
+				$this->get_posthog_config()
+			);
+
 			// Footer URL data for internal redirection.
 			wp_localize_script(
 				'godam-page-script-tools',
@@ -783,6 +819,12 @@ public function admin_enqueue_scripts() {
 				)
 			);
 
+			wp_localize_script(
+				'godam-page-script-whats-new',
+				'posthogConfig',
+				$this->get_posthog_config()
+			);
+
 			wp_enqueue_script( 'godam-page-script-whats-new' );
 		}
 
@@ -815,6 +857,29 @@ public function admin_enqueue_scripts() {
 				'roles'    => $roles,
 			)
 		);
+
+		wp_localize_script(
+			'media-library-react',
+			'posthogConfig',
+			$this->get_posthog_config()
+		);
+	}
+
+	/**
+	 * Get PostHog configuration for internal GoDAM analytics tracking.
+	 * These are hardcoded public keys - clients don't need to configure anything.
+	 *
+	 * @return array PostHog configuration array with 'key', 'host', and 'enabled' settings.
+	 */
+	private function get_posthog_config() {
+		$settings        = get_option( 'rtgodam-settings', array() );
+		$enable_tracking = isset( $settings['general']['enable_posthog_tracking'] ) ? $settings['general']['enable_posthog_tracking'] : true;
+
+		return array(
+			'key'     => 'phc_9P3X3py1SfwrF78SXXkIyL2cHjkRTpvWzqf8RZJDaSk',
+			'host'    => 'https://us.i.posthog.com',
+			'enabled' => (int) $enable_tracking, // Convert boolean to int (0/1) for proper JS encoding.
+		);
 	}
 
 	/**

inc/classes/rest-api/class-settings.php

@@ -47,6 +47,7 @@ private function get_default_settings() {
 			'general'      => array(
 				'enable_folder_organization' => true,
 				'enable_gtm_tracking'        => false,
+				'enable_posthog_tracking'    => true,
 			),
 			'video_player' => array(
 				'brand_image'    => '',
@@ -304,6 +305,7 @@ public function sanitize_settings( $settings ) {
 			'general'      => array(
 				'enable_folder_organization' => rest_sanitize_boolean( $settings['general']['enable_folder_organization'] ?? $default['general']['enable_folder_organization'] ),
 				'enable_gtm_tracking'        => rest_sanitize_boolean( $settings['general']['enable_gtm_tracking'] ?? $default['general']['enable_gtm_tracking'] ),
+				'enable_posthog_tracking'    => rest_sanitize_boolean( $settings['general']['enable_posthog_tracking'] ?? $default['general']['enable_posthog_tracking'] ),
 			),
 			'video_player' => array(
 				'brand_image'    => sanitize_text_field( $settings['video_player']['brand_image'] ?? $default['video_player']['brand_image'] ),

package.json

@@ -30,6 +30,7 @@
 		"@fortawesome/free-solid-svg-icons": "^7.0.0",
 		"@fortawesome/react-fontawesome": "^0.2.3",
 		"@monaco-editor/react": "^4.7.0",
+		"@posthog/react": "1.3.0",
 		"@reduxjs/toolkit": "2.8.2",
 		"@uppy/audio": "3.0.0",
 		"@uppy/core": "5.0.1",
@@ -42,6 +43,7 @@
 		"clsx": "^2.1.1",
 		"flv.js": "^1.6.2",
 		"isomorphic-dompurify": "^2.26.0",
+		"posthog-js": "^1.282.0",
 		"quill": "^2.0.3",
 		"react": "^18.0.0",
 		"react-bootstrap-icons": "^1.11.6",

pages/analytics/index.js

@@ -9,12 +9,14 @@ import { edit, media } from '@wordpress/icons';
 import { useEffect, useState } from 'react';
 import { __ } from '@wordpress/i18n';
 import { Provider } from 'react-redux';
+import { PostHogProvider } from '@posthog/react';
 import ReactDOM from 'react-dom/client';
 /**
  * Internal dependencies
  */
 import store from './redux/store';
 import Analytics from './Analytics';
+import posthog from '../utils/posthog';
 import './index.scss';
 
 const Frontpage = () => {
@@ -94,9 +96,11 @@ const Frontpage = () => {
 
 	return (
 		<>
-			<Provider store={ store }>
-				<Analytics attachmentID={ attachmentID } />
-			</Provider>
+			<PostHogProvider client={ posthog }>
+				<Provider store={ store }>
+					<Analytics attachmentID={ attachmentID } />
+				</Provider>
+			</PostHogProvider>
 		</>
 	);
 };

pages/dashboard/index.js

@@ -4,6 +4,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
+import { PostHogProvider } from '@posthog/react';
 /**
  * Internal dependencies
  */
@@ -12,12 +13,15 @@ import './index.scss';
 import '../analytics/index.scss';
 import './components/ChartsDashboard.js';
 import App from './App.js';
+import posthog from '../utils/posthog';
 
 const Index = () => {
 	return (
-		<Provider store={ store }>
-			<App />
-		</Provider>
+		<PostHogProvider client={ posthog }>
+			<Provider store={ store }>
+				<App />
+			</Provider>
+		</PostHogProvider>
 	);
 };
 

pages/godam/components/tabs/GeneralSettings/GeneralSettings.jsx

@@ -109,6 +109,15 @@ const GeneralSettings = () => {
 						onChange={ ( value ) => handleSettingChange( 'enable_gtm_tracking', value ) }
 					/>
 
+					<ToggleControl
+						__nextHasNoMarginBottom
+						className="godam-toggle godam-margin-bottom"
+						label={ __( 'Enable PostHog Analytics', 'godam' ) }
+						help={ __( 'Allow GoDAM plugin to track events for analytics purposes. This helps us improve the product experience.', 'godam' ) }
+						checked={ mediaSettings?.general?.enable_posthog_tracking }
+						onChange={ ( value ) => handleSettingChange( 'enable_posthog_tracking', value ) }
+					/>
+
 				</PanelBody>
 			</Panel>
 

pages/godam/index.js

@@ -4,20 +4,24 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
+import { PostHogProvider } from '@posthog/react';
 
 /**
  * Internal dependencies
  */
 import store from './redux/store';
 import App from './App';
+import posthog from '../utils/posthog';
 
 import './index.scss';
 
 const Index = () => {
 	return (
-		<Provider store={ store }>
-			<App />
-		</Provider>
+		<PostHogProvider client={ posthog }>
+			<Provider store={ store }>
+				<App />
+			</Provider>
+		</PostHogProvider>
 	);
 };
 

pages/godam/redux/slice/media-settings.js

@@ -28,6 +28,7 @@ const initialState = {
 	general: {
 		enable_folder_organization: true,
 		enable_gtm_tracking: false,
+		enable_posthog_tracking: true,
 	},
 	video_player: {
 		brand_image: '',

pages/help/index.js

@@ -3,14 +3,20 @@
  */
 import React from 'react';
 import ReactDOM from 'react-dom';
+import { PostHogProvider } from '@posthog/react';
 /**
  * Internal dependencies
  */
 import './index.scss';
 import App from './App';
+import posthog from '../utils/posthog';
 
 const Index = () => {
-	return <App />;
+	return (
+		<PostHogProvider client={ posthog }>
+			<App />
+		</PostHogProvider>
+	);
 };
 
 const rootElement = document.getElementById( 'root-video-help' );