[WEB-4688] Add UI basis for redesigned footer component

.env.example

@@ -18,6 +18,7 @@ INSIGHTS_ENABLED=false
 INSIGHTS_DEBUG=true
 POSTHOG_API_KEY=''
 POSTHOG_API_HOST=''
+POSTHOG_FEEDBACK_SURVEY_NAME=''
 MIXPANEL_API_KEY=''
 MIXPANEL_AUTO_CAPTURE=''
 

gatsby-browser.tsx

@@ -9,6 +9,8 @@ import {
   reducerBlogPosts,
   reducerSessionData,
 } from '@ably/ui/core/scripts';
+import { PostHogProvider } from 'posthog-js/react';
+import posthog from 'posthog-js';
 
 import { reducerApiKeyData } from './src/redux/api-key/api-key-reducer';
 import UserContextWrapper from './src/contexts/user-context/wrap-with-provider';
@@ -66,7 +68,7 @@ const InsightsWrapper = ({ children }) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  return children;
+  return <PostHogProvider client={posthog}>{children}</PostHogProvider>;
 };
 
 export const wrapRootElement = ({ element }) => {

gatsby-config.ts

@@ -38,6 +38,7 @@ export const siteMetadata = {
     mixpanelAutoCapture: !!process.env.MIXPANEL_AUTO_CAPTURE,
     posthogApiKey: process.env.POSTHOG_API_KEY,
     posthogHost: process.env.POSTHOG_API_HOST || 'https://insights.ably.com',
+    posthogFeedbackSurveyName: process.env.POSTHOG_FEEDBACK_SURVEY_NAME || 'Docs Feedback',
     conversationsUrl: process.env.CONVERSATIONS_API_URL,
   },
 };