Skip to content

Commit

Permalink
[PD-627] fix: add utm params to webapp and app uri (#184)
Browse files Browse the repository at this point in the history
  • Loading branch information
eren-zeplin authored Mar 7, 2023
1 parent 791aeae commit db09cee
Show file tree
Hide file tree
Showing 8 changed files with 112 additions and 24 deletions.
65 changes: 65 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ exports[`projectNoteHandler getTeamsMessage should match snapshot 1`] = `
"targets": [
{
"os": "default",
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fdot%3Fpid%3DprojectId%26sid%3DscreenId%26did%3DnoteId%26cmids%3DcommentId%26ref%3Dmicrosoft-teams"
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fdot%3Fpid%3DprojectId%26sid%3DscreenId%26did%3DnoteId%26cmids%3DcommentId%26ref%3Dmicrosoft-teams%26utm_source%3Dzeplin%26utm_medium%3Dteams_integration%26utm_campaign%3Dcomment_reply"
}
]
},
Expand All @@ -28,7 +28,7 @@ exports[`projectNoteHandler getTeamsMessage should match snapshot 1`] = `
"targets": [
{
"os": "default",
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?did=noteId&cmid=commentId&ref=microsoft-teams"
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?did=noteId&cmid=commentId&ref=microsoft-teams&utm_source=zeplin&utm_medium=teams_integration&utm_campaign=comment_reply"
}
]
}
Expand All @@ -54,7 +54,7 @@ exports[`projectNoteHandler getTeamsMessage should match snapshot with screen va
"targets": [
{
"os": "default",
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fdot%3Fpid%3DprojectId%26sid%3DscreenId%26did%3DnoteId%26cmids%3DcommentId%26ref%3Dmicrosoft-teams"
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fdot%3Fpid%3DprojectId%26sid%3DscreenId%26did%3DnoteId%26cmids%3DcommentId%26ref%3Dmicrosoft-teams%26utm_source%3Dzeplin%26utm_medium%3Dteams_integration%26utm_campaign%3Dcomment_reply"
}
]
},
Expand All @@ -64,7 +64,7 @@ exports[`projectNoteHandler getTeamsMessage should match snapshot with screen va
"targets": [
{
"os": "default",
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?did=noteId&cmid=commentId&ref=microsoft-teams"
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?did=noteId&cmid=commentId&ref=microsoft-teams&utm_source=zeplin&utm_medium=teams_integration&utm_campaign=comment_reply"
}
]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -70,8 +70,9 @@ class ProjectNoteCommentHandler extends NotificationHandler<ProjectNoteCommentCr
did: noteId,
cmid: commentId
};
const utmParams = { utmCampaign: "comment_reply" };

return getWebAppURL(pathname, searchParams);
return getWebAppURL(pathname, searchParams, utmParams);
}

private getZeplinAppURI(event: ProjectNoteCommentCreatedEvent): string {
Expand All @@ -97,8 +98,9 @@ class ProjectNoteCommentHandler extends NotificationHandler<ProjectNoteCommentCr
did: noteId,
cmids: commentId
};
const utmParams = { utmCampaign: "comment_reply" };

return getRedirectURLForZeplinApp("dot", searchParams);
return getRedirectURLForZeplinApp("dot", searchParams, utmParams);
}

shouldHandleEvent(event: WebhookEvent): event is ProjectNoteCommentCreatedEvent {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ exports[`projectNoteHandler getTeamsMessage should match snapshot 1`] = `
"targets": [
{
"os": "default",
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fdot%3Fpid%3DprojectId%26sid%3DscreenId%26did%3DnoteId%26ref%3Dmicrosoft-teams"
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fdot%3Fpid%3DprojectId%26sid%3DscreenId%26did%3DnoteId%26ref%3Dmicrosoft-teams%26utm_source%3Dzeplin%26utm_medium%3Dteams_integration%26utm_campaign%3Dcomment_reply"
}
]
},
Expand All @@ -28,7 +28,7 @@ exports[`projectNoteHandler getTeamsMessage should match snapshot 1`] = `
"targets": [
{
"os": "default",
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?did=noteId&ref=microsoft-teams"
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?did=noteId&ref=microsoft-teams&utm_source=zeplin&utm_medium=teams_integration&utm_campaign=comment_reply"
}
]
}
Expand All @@ -54,7 +54,7 @@ exports[`projectNoteHandler getTeamsMessage should match snapshot with screen va
"targets": [
{
"os": "default",
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fdot%3Fpid%3DprojectId%26sid%3DscreenId%26did%3DnoteId%26ref%3Dmicrosoft-teams"
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fdot%3Fpid%3DprojectId%26sid%3DscreenId%26did%3DnoteId%26ref%3Dmicrosoft-teams%26utm_source%3Dzeplin%26utm_medium%3Dteams_integration%26utm_campaign%3Dcomment_reply"
}
]
},
Expand All @@ -64,7 +64,7 @@ exports[`projectNoteHandler getTeamsMessage should match snapshot with screen va
"targets": [
{
"os": "default",
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?did=noteId&ref=microsoft-teams"
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?did=noteId&ref=microsoft-teams&utm_source=zeplin&utm_medium=teams_integration&utm_campaign=comment_reply"
}
]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -62,8 +62,9 @@ class ProjectNoteHandler extends NotificationHandler<ProjectNoteCreatedEvent> {
const searchParams = {
did: noteId
};
const utmParams = { utmCampaign: "comment_reply" };

return getWebAppURL(pathname, searchParams);
return getWebAppURL(pathname, searchParams, utmParams);
}

private getZeplinAppURI(event: ProjectNoteCreatedEvent): string {
Expand All @@ -85,8 +86,9 @@ class ProjectNoteHandler extends NotificationHandler<ProjectNoteCreatedEvent> {
sid: screenId,
did: noteId
};
const utmParams = { utmCampaign: "comment_reply" };

return getRedirectURLForZeplinApp("dot", searchParams);
return getRedirectURLForZeplinApp("dot", searchParams, utmParams);
}

shouldHandleEvent(event: WebhookEvent): event is ProjectNoteCreatedEvent {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ exports[`projectScreenHandler getTeamsMessage should match snapshot when there a
"targets": [
{
"os": "default",
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fproject%3Fpid%3DprojectId%26sids%3DscreenId%2CscreenId2%26ref%3Dmicrosoft-teams"
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fproject%3Fpid%3DprojectId%26sids%3DscreenId%2CscreenId2%26ref%3Dmicrosoft-teams%26utm_source%3Dzeplin%26utm_medium%3Dteams_integration%26utm_campaign%3Dcomment_reply"
}
]
},
Expand All @@ -36,7 +36,7 @@ exports[`projectScreenHandler getTeamsMessage should match snapshot when there a
"targets": [
{
"os": "default",
"uri": "https://app.zeplin.io/project/projectId?sid=screenId&sid=screenId2&ref=microsoft-teams"
"uri": "https://app.zeplin.io/project/projectId?sid=screenId&sid=screenId2&ref=microsoft-teams&utm_source=zeplin&utm_medium=teams_integration&utm_campaign=comment_reply"
}
]
}
Expand Down Expand Up @@ -66,7 +66,7 @@ exports[`projectScreenHandler getTeamsMessage should match snapshot when there i
"targets": [
{
"os": "default",
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fscreen%3Fpid%3DprojectId%26sid%3DscreenId%26ref%3Dmicrosoft-teams"
"uri": "https://msteams-app.zeplin.io/zeplin/app-redirect?uri=zpl%3A%2F%2Fscreen%3Fpid%3DprojectId%26sid%3DscreenId%26ref%3Dmicrosoft-teams%26utm_source%3Dzeplin%26utm_medium%3Dteams_integration%26utm_campaign%3Dcomment_reply"
}
]
},
Expand All @@ -76,7 +76,7 @@ exports[`projectScreenHandler getTeamsMessage should match snapshot when there i
"targets": [
{
"os": "default",
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?ref=microsoft-teams"
"uri": "https://app.zeplin.io/project/projectId/screen/screenId?ref=microsoft-teams&utm_source=zeplin&utm_medium=teams_integration&utm_campaign=comment_reply"
}
]
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -63,11 +63,12 @@ class ProjectScreenHandler extends NotificationHandler<ProjectScreenCreatedEvent
sid: events.map(({ resource: { id } }) => id)
};
}
const utmParams = { utmCampaign: "comment_reply" };

return getWebAppURL(pathname, searchParams);
return getWebAppURL(pathname, searchParams, utmParams);
}

private getZeplinAppURIURI(events: ProjectScreenCreatedEvent[]): string {
private getZeplinAppURI(events: ProjectScreenCreatedEvent[]): string {
const [{
context: {
project: {
Expand All @@ -92,8 +93,9 @@ class ProjectScreenHandler extends NotificationHandler<ProjectScreenCreatedEvent
sids: events.map(({ resource: { id } }) => id)
};
}
const utmParams = { utmCampaign: "comment_reply" };

return getRedirectURLForZeplinApp(resource, searchParams);
return getRedirectURLForZeplinApp(resource, searchParams, utmParams);
}

getGroupingKey({
Expand All @@ -120,7 +122,7 @@ class ProjectScreenHandler extends NotificationHandler<ProjectScreenCreatedEvent
images: this.getImages(events),
links: [{
title: "Open in App",
url: this.getZeplinAppURIURI(events)
url: this.getZeplinAppURI(events)
}, {
title: "Open in Web",
url: this.getWebappURL(events)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,16 @@ import { BASE_URL, ZEPLIN_APP_URI_SCHEME, ZEPLIN_WEB_APP_BASE_URL } from "../../

const REFERER_PARAM_NAME = "ref";
const REFERER_PARAM_VALUE = "microsoft-teams";
const UTM_SOURCE = "utm_source";
const UTM_SOURCE_VALUE = "zeplin";
const UTM_MEDIUM = "utm_medium";
const UTM_MEDIUM_VALUE = "teams_integration";
const UTM_CAMPAIGN = "utm_campaign";

export function getWebAppURL(
pathname: string,
searchParams: { [key: string]: string | string[] } = {}
searchParams: { [key: string]: string | string[] } = {},
utmParams: { [key: string]: string } = {}
): string {
const webappURL = new URL(ZEPLIN_WEB_APP_BASE_URL);

Expand All @@ -21,12 +27,19 @@ export function getWebAppURL(

webappURL.searchParams.set(REFERER_PARAM_NAME, REFERER_PARAM_VALUE);

if (utmParams && utmParams.utmCampaign) {
webappURL.searchParams.append(UTM_SOURCE, UTM_SOURCE_VALUE);
webappURL.searchParams.append(UTM_MEDIUM, UTM_MEDIUM_VALUE);
webappURL.searchParams.append(UTM_CAMPAIGN, utmParams.utmCampaign);
}

return webappURL.toString();
}

export function getRedirectURLForZeplinApp(
resource: string,
searchParams: { [key: string]: string | string[] } = {}
searchParams: { [key: string]: string | string[] } = {},
utmParams: { [key: string]: string | string[] } = {}
): string {
let appURI = `${ZEPLIN_APP_URI_SCHEME}://${resource}`;
appURI += `?${Object.entries(searchParams).map(
Expand All @@ -40,11 +53,15 @@ export function getRedirectURLForZeplinApp(
).join("&")}`;

appURI += `&${REFERER_PARAM_NAME}=${REFERER_PARAM_VALUE}`;
if (utmParams && utmParams.utmCampaign) {
appURI += `&${UTM_SOURCE}=${UTM_SOURCE_VALUE}`;
appURI += `&${UTM_MEDIUM}=${UTM_MEDIUM_VALUE}`;
appURI += `&${UTM_CAMPAIGN}=${utmParams.utmCampaign}`;
}

const redirectURL = new URL(BASE_URL);
redirectURL.pathname = "zeplin/app-redirect";
redirectURL.searchParams.set("uri", appURI);

return redirectURL.toString();
}

}

0 comments on commit db09cee

Please sign in to comment.