Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Completely replace hotjar with smartlook (#447)

Browse Source 
* Replace hotjar with smartlook

* Remove duplicate event declaration
This commit is contained in:
Hetu Nandu 2020-08-27 18:24:03 +05:30 committed by GitHub
parent 7d9e0cbdc1
commit 0b430d0324
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 39 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
.env.example
View File

@ -4,9 +4,8 @@
# Sentry
APPSMITH_SENTRY_DSN=
# Hotjar
APPSMITH_HOTJAR_HJID=
APPSMITH_HOTJAR_HJSV=
# Smart look
APPSMITH_SMART_LOOK_ID=
# Google OAuth
APPSMITH_OAUTH2_GOOGLE_CLIENT_ID=

6
app/client/docker/templates/nginx-linux.conf.template
View File

@ -18,8 +18,7 @@ server {
location / {
proxy_pass http://localhost:3000;
sub_filter __APPSMITH_SENTRY_DSN__ '${APPSMITH_SENTRY_DSN}';
sub_filter __APPSMITH_APPSMITH_HOTJAR_HJID__ '${APPSMITH_HOTJAR_HJID}';
sub_filter __APPSMITH_HOTJAR_HJSV__ '${APPSMITH_HOTJAR_HJSV}';
sub_filter __APPSMITH_SMART_LOOK_ID__ '${APPSMITH_SMART_LOOK_ID}';
sub_filter __APPSMITH_OAUTH2_GOOGLE_CLIENT_ID__ '${APPSMITH_OAUTH2_GOOGLE_CLIENT_ID}';
sub_filter __APPSMITH_OAUTH2_GITHUB_CLIENT_ID__ '${APPSMITH_OAUTH2_GITHUB_CLIENT_ID}';
sub_filter __APPSMITH_MARKETPLACE_ENABLED__ '${APPSMITH_MARKETPLACE_ENABLED}';
@ -86,8 +85,7 @@ server {
location / {
proxy_pass http://localhost:3000;
sub_filter __APPSMITH_SENTRY_DSN__ '${APPSMITH_SENTRY_DSN}';
sub_filter __APPSMITH_HOTJAR_HJID__ '${APPSMITH_HOTJAR_HJID}';
sub_filter __APPSMITH_HOTJAR_HJSV__ '${APPSMITH_HOTJAR_HJSV}';
sub_filter __APPSMITH_SMART_LOOK_ID__ '${APPSMITH_SMART_LOOK_ID}';
sub_filter __APPSMITH_OAUTH2_GOOGLE_CLIENT_ID__ '${APPSMITH_OAUTH2_GOOGLE_CLIENT_ID}';
sub_filter __APPSMITH_OAUTH2_GITHUB_CLIENT_ID__ '${APPSMITH_OAUTH2_GITHUB_CLIENT_ID}';
sub_filter __APPSMITH_MARKETPLACE_ENABLED__ '${APPSMITH_MARKETPLACE_ENABLED}';

6
app/client/docker/templates/nginx-mac.conf.template
View File

@ -18,8 +18,7 @@ server {
location / {
proxy_pass http://host.docker.internal:3000;
sub_filter __APPSMITH_SENTRY_DSN__ '${APPSMITH_SENTRY_DSN}';
sub_filter __APPSMITH_HOTJAR_HJID__ '${APPSMITH_HOTJAR_HJID}';
sub_filter __APPSMITH_HOTJAR_HJSV__ '${APPSMITH_HOTJAR_HJSV}';
sub_filter __APPSMITH_SMART_LOOK_ID__ '${APPSMITH_SMART_LOOK_ID}';
sub_filter __APPSMITH_OAUTH2_GOOGLE_CLIENT_ID__ '${APPSMITH_OAUTH2_GOOGLE_CLIENT_ID}';
sub_filter __APPSMITH_OAUTH2_GITHUB_CLIENT_ID__ '${APPSMITH_OAUTH2_GITHUB_CLIENT_ID}';
sub_filter __APPSMITH_MARKETPLACE_ENABLED__ '${APPSMITH_MARKETPLACE_ENABLED}';
@ -87,8 +86,7 @@ server {
location / {
proxy_pass http://host.docker.internal:3000;
sub_filter __APPSMITH_SENTRY_DSN__ '${APPSMITH_SENTRY_DSN}';
sub_filter __APPSMITH_HOTJAR_HJID__ '${APPSMITH_HOTJAR_HJID}';
sub_filter __APPSMITH_HOTJAR_HJSV__ '${APPSMITH_HOTJAR_HJSV}';
sub_filter __APPSMITH_SMART_LOOK_ID__ '${APPSMITH_SMART_LOOK_ID};
sub_filter __APPSMITH_OAUTH2_GOOGLE_CLIENT_ID__ '${APPSMITH_OAUTH2_GOOGLE_CLIENT_ID}';
sub_filter __APPSMITH_OAUTH2_GITHUB_CLIENT_ID__ '${APPSMITH_OAUTH2_GITHUB_CLIENT_ID}';
sub_filter __APPSMITH_MARKETPLACE_ENABLED__ '${APPSMITH_MARKETPLACE_ENABLED}';

2
app/client/netlify.toml
View File

@ -3,8 +3,6 @@
# REACT_APP_SENTRY_DSN=
# REACT_APP_SENTRY_ENVIRONMENT=
# REACT_APP_SENTRY_RELEASE=
# REACT_APP_HOTJAR_HJID=
# REACT_APP_HOTJAR_HJSV=
# REACT_APP_OAUTH2_GOOGLE_CLIENT_ID=
# REACT_APP_OAUTH2_GITHUB_CLIENT_ID=
# REACT_APP_SEGMENT_KEY=

1
app/client/package.json
View File

@ -104,6 +104,7 @@
"redux-saga": "^1.1.3",
"reselect": "^4.0.0",
"shallowequal": "^1.1.0",
"smartlook-client": "^4.5.1",
"styled-components": "^4.1.3",
"styled-system": "^5.1.5",
"tern": "^0.21.0",

19
app/client/public/index.html
View File

@ -20,7 +20,7 @@
// INTERCOM SETUP
const APP_ID = "%REACT_APP_INTERCOM_APP_ID%"
const CLOUD_HOSTING = "%REACT_APP_CLOUD_HOSTING%"
if (APP_ID.length && CLOUD_HOSTING.length) {
if (APP_ID.length && APP_ID[0] !== "%" && CLOUD_HOSTING.length) {
(function () { var w = window; var ic = w.Intercom; if (typeof ic === "function") { ic('reattach_activator'); ic('update', w.intercomSettings); } else { var d = document; var i = function () { i.c(arguments); }; i.q = []; i.c = function (args) { i.q.push(args); }; w.Intercom = i; var l = function () { var s = d.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = 'https://widget.intercom.io/widget/' + APP_ID; var x = d.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x); }; if (document.readyState === 'complete') { l(); } else if (w.attachEvent) { w.attachEvent('onload', l); } else { w.addEventListener('load', l, false); } } })();
}
</script>
@ -33,18 +33,6 @@
gtag('config', "%REACT_APP_GOOGLE_ANALYTICS_ID%");
</script>
<script type='text/javascript'>
// SMART LOOK SETUP
const SMART_LOOK_ID = "%REACT_APP_SMART_LOOK_ID%";
if (SMART_LOOK_ID.length && CLOUD_HOSTING.length) {
window.smartlook||(function(d) {
var o=smartlook=function(){ o.api.push(arguments)},h=d.getElementsByTagName('head')[0];
var c=d.createElement('script');o.api=new Array();c.async=true;c.type='text/javascript';
c.charset='utf-8';c.src='https://rec.smartlook.com/recorder.js';h.appendChild(c);
})(document);
smartlook('init', SMART_LOOK_ID);
}
</script>
</head>
<body>
@ -87,9 +75,8 @@
release: parseConfig("__APPSMITH_SENTRY_RELEASE__"),
environment: parseConfig("__APPSMITH_SENTRY_ENVIRONMENT__"),
},
hotjar: {
id: parseConfig("__APPSMITH_HOTJAR_HJID__"),
sv: parseConfig("__APPSMITH_HOTJAR_HJSV__"),
smartLook: {
id: parseConfig("__APPSMITH_SMART_LOOK_ID__"),
},
enableGoogleOAuth: parseConfig("__APPSMITH_OAUTH2_GOOGLE_CLIENT_ID__").length > 0,
enableGithubOAuth: parseConfig("__APPSMITH_OAUTH2_GITHUB_CLIENT_ID__").length > 0,

27
app/client/src/configs/index.ts
View File

@ -5,9 +5,8 @@ type INJECTED_CONFIGS = {
release: string;
environment: string;
};
hotjar: {
smartLook: {
id: string;
sv: string;
};
enableGoogleOAuth: boolean;
enableGithubOAuth: boolean;
@ -30,7 +29,6 @@ type INJECTED_CONFIGS = {
};
intercomAppID: string;
mailEnabled: boolean;
smartLookKey: string;
};
declare global {
interface Window {
@ -52,9 +50,8 @@ const getConfigsFromEnvVars = (): INJECTED_CONFIGS => {
release: process.env.REACT_APP_SENTRY_RELEASE || "",
environment: capitalizeText(process.env.NODE_ENV),
},
hotjar: {
id: process.env.REACT_APP_HOTJAR_HJID || "",
sv: process.env.REACT_APP_HOTJAR_HJSV || "",
smartLook: {
id: process.env.REACT_APP_SMART_LOOK_ID || "",
},
enableGoogleOAuth: process.env.REACT_APP_OAUTH2_GOOGLE_CLIENT_ID
? process.env.REACT_APP_OAUTH2_GOOGLE_CLIENT_ID.length > 0
@ -95,7 +92,6 @@ const getConfigsFromEnvVars = (): INJECTED_CONFIGS => {
mailEnabled: process.env.REACT_APP_MAIL_ENABLED
? process.env.REACT_APP_MAIL_ENABLED.length > 0
: false,
smartLookKey: process.env.REACT_APP_SMART_LOOK_KEY || "",
};
};
@ -144,13 +140,9 @@ export const getAppsmithConfigs = (): AppsmithUIConfigs => {
// As the following shows, the config variables can be set using a combination
// of env variables and injected configs
const hotjarId = getConfig(
ENV_CONFIG.hotjar.id,
APPSMITH_FEATURE_CONFIGS.hotjar.id,
);
const hotjarSV = getConfig(
ENV_CONFIG.hotjar.sv,
APPSMITH_FEATURE_CONFIGS.hotjar.sv,
const smartLook = getConfig(
ENV_CONFIG.smartLook.id,
APPSMITH_FEATURE_CONFIGS.smartLook.id,
);
const algoliaAPIID = getConfig(
@ -173,10 +165,9 @@ export const getAppsmithConfigs = (): AppsmithUIConfigs => {
release: sentryRelease.value,
environment: sentryENV.value,
},
hotjar: {
enabled: hotjarId.enabled && hotjarSV.enabled,
id: hotjarId.value,
sv: hotjarSV.value, //parse as int?
smartLook: {
enabled: smartLook.enabled,
id: smartLook.value,
},
segment: {
enabled: segment.enabled,

8
app/client/src/configs/types.ts
View File

@ -5,11 +5,6 @@ export type SentryConfig = {
environment: string;
};
export type HotjarConfig = {
id: string;
sv: string;
};
type Milliseconds = number;
export enum FeatureFlagsEnum {}
@ -30,10 +25,9 @@ export type AppsmithUIConfigs = {
release: string;
environment: string;
};
hotjar: {
smartLook: {
enabled: boolean;
id: string;
sv: string;
};
segment: {
enabled: boolean;

33
app/client/src/utils/AnalyticsUtil.tsx
View File

@ -1,6 +1,8 @@
// Events
import * as log from "loglevel";
import FeatureFlag from "./featureFlags";
import smartlookClient from "smartlook-client";
import { getAppsmithConfigs } from "configs";
export type EventName =
| "LOGIN_CLICK"
@ -27,15 +29,12 @@ export type EventName =
| "PREVIEW_APP"
| "EDITOR_OPEN"
| "CREATE_API"
| "IMPORT_API"
| "IMPORT_API_CLICK"
| "SAVE_API"
| "SAVE_API_CLICK"
| "RUN_API"
| "RUN_API_CLICK"
| "DELETE_API"
| "DELETE_API_CLICK"
| "DUPLICATE_API_CLICK"
| "IMPORT_API"
| "EXPAND_API"
| "IMPORT_API_CLICK"
@ -85,20 +84,8 @@ function getApplicationId(location: Location) {
class AnalyticsUtil {
static user: any = undefined;
static initializeHotjar(id: string, sv: string) {
(function init(h: any, o: any, t: any, j: any, a?: any, r?: any) {
h.hj =
h.hj ||
function() {
(h.hj.q = h.hj.q || []).push(arguments); //eslint-disable-line prefer-rest-params
};
h._hjSettings = { hjid: id, hjsv: sv };
a = o.getElementsByTagName("head")[0];
r = o.createElement("script");
r.async = 1;
r.src = t + h._hjSettings.hjid + j + h._hjSettings.hjsv;
a.appendChild(r);
})(window, document, "//static.hotjar.com/c/hotjar-", ".js?sv=");
static initializeSmartLook(id: string) {
smartlookClient.init(id);
}
static initializeSegment(key: string) {
@ -199,15 +186,9 @@ class AnalyticsUtil {
userId: userId,
});
}
if (windowDoc.hj) {
windowDoc.hj("identify", userData.email, { email: userData.email });
}
if (windowDoc.smartLook) {
windowDoc.smartlook("identify", userId, {
email: userData.email,
name: userData.name,
userId: userId,
});
const { smartLook } = getAppsmithConfigs();
if (smartLook.enabled) {
smartlookClient.identify(userData.email, { email: userData.email });
}
}

6
app/client/src/utils/AppsmithUtils.tsx
View File

@ -32,9 +32,9 @@ export const appInitializer = () => {
if (appsmithConfigs.sentry.enabled) {
Sentry.init(appsmithConfigs.sentry);
}
if (appsmithConfigs.hotjar.enabled) {
const { id, sv } = appsmithConfigs.hotjar;
AnalyticsUtil.initializeHotjar(id, sv);
if (appsmithConfigs.smartLook.enabled) {
const { id } = appsmithConfigs.smartLook;
AnalyticsUtil.initializeSmartLook(id);
}
if (appsmithConfigs.segment.enabled) {
AnalyticsUtil.initializeSegment(appsmithConfigs.segment.apiKey);

5
app/client/yarn.lock
View File

@ -15385,6 +15385,11 @@ slice-ansi@^2.1.0:
astral-regex "^1.0.0"
is-fullwidth-code-point "^2.0.0"
smartlook-client@^4.5.1:
version "4.5.1"
resolved "https://registry.yarnpkg.com/smartlook-client/-/smartlook-client-4.5.1.tgz#86884e19107fbd1ec284d96fb4273e209deb7cea"
integrity sha512-Y8zBr6rD9aE9/KockRlxNtAF4B+66CJzfPt8y27nrrkXqgC58lEqsWpTmy8opP5U2OprZHYI0Yh5LNKT7r4kRA==
snapdragon-node@^2.0.1:
version "2.1.1"
resolved "https://registry.yarnpkg.com/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"

6
deploy/template/nginx_app.conf.sh
View File

@ -31,8 +31,7 @@ $NGINX_SSL_CMNT server_name $custom_domain ;
try_files $uri /index.html =404;
sub_filter __APPSMITH_SENTRY_DSN__ '\''${APPSMITH_SENTRY_DSN}'\'';
sub_filter __APPSMITH_APPSMITH_HOTJAR_HJID__ '\''${APPSMITH_HOTJAR_HJID}'\'';
sub_filter __APPSMITH_HOTJAR_HJSV__ '\''${APPSMITH_HOTJAR_HJSV}'\'';
sub_filter __APPSMITH_SMART_LOOK_ID__ '\''${APPSMITH_SMART_LOOK_ID}'\'';
sub_filter __APPSMITH_OAUTH2_GOOGLE_CLIENT_ID__ '\''${APPSMITH_OAUTH2_GOOGLE_CLIENT_ID}'\'';
sub_filter __APPSMITH_OAUTH2_GITHUB_CLIENT_ID__ '\''${APPSMITH_OAUTH2_GITHUB_CLIENT_ID}'\'';
sub_filter __APPSMITH_MARKETPLACE_ENABLED__ '\''${APPSMITH_MARKETPLACE_ENABLED}'\'';
@ -87,8 +86,7 @@ $NGINX_SSL_CMNT location / {
$NGINX_SSL_CMNT try_files $uri /index.html =404;
$NGINX_SSL_CMNT
$NGINX_SSL_CMNT sub_filter __APPSMITH_SENTRY_DSN__ '\''${APPSMITH_SENTRY_DSN}'\'';
$NGINX_SSL_CMNT sub_filter __APPSMITH_APPSMITH_HOTJAR_HJID__ '\''${APPSMITH_HOTJAR_HJID}'\'';
$NGINX_SSL_CMNT sub_filter __APPSMITH_HOTJAR_HJSV__ '\''${APPSMITH_HOTJAR_HJSV}'\'';
$NGINX_SSL_CMNT sub_filter __APPSMITH_SMART_LOOK_ID__ '\''${APPSMITH_SMART_LOOK_ID}'\'';
$NGINX_SSL_CMNT sub_filter __APPSMITH_OAUTH2_GOOGLE_CLIENT_ID__ '\''${APPSMITH_OAUTH2_GOOGLE_CLIENT_ID}'\'';
$NGINX_SSL_CMNT sub_filter __APPSMITH_OAUTH2_GITHUB_CLIENT_ID__ '\''${APPSMITH_OAUTH2_GITHUB_CLIENT_ID}'\'';
$NGINX_SSL_CMNT sub_filter __APPSMITH_MARKETPLACE_ENABLED__ '\''${APPSMITH_MARKETPLACE_ENABLED}'\'';