fix(post): post creation interactions [MOSOWEB-46]

components/publish/PublishWidget.vue

@@ -2,6 +2,8 @@
 import { EditorContent } from '@tiptap/vue-3'
 import stringLength from 'string-length'
 import type { mastodon } from 'masto'
+import { engagement } from '~~/telemetry/generated/ui'
+import { engagementDetails } from '~~/telemetry/engagementDetails'
 import type { Draft } from '~/types'
 
 const {
@@ -10,6 +12,7 @@ const {
   expanded = false,
   placeholder,
   dialogLabelledBy,
+  feedName,
 } = defineProps<{
   draftKey?: string
   initial?: () => Draft
@@ -18,6 +21,7 @@ const {
   inReplyToVisibility?: mastodon.v1.StatusVisibility
   expanded?: boolean
   dialogLabelledBy?: string
+  feedName?: string
 }>()
 
 const emit = defineEmits<{
@@ -170,9 +174,21 @@ async function toggleSensitive() {
 }
 
 async function publish() {
+  const isEditing = draft.editingStatus // need to save this before publishDraft
   const status = await publishDraft()
-  if (status)
+  if (status) {
+    const analyticsId = isEditing
+      ? 'post.edit'
+      : draft.params.inReplyToId
+        ? 'post.reply'
+        : feedName ? `${feedName}.post.create` : 'post.create'
+    engagement.record({
+      ui_identifier: analyticsId,
+      mastodon_status_id: status.id,
+      ...engagementDetails[analyticsId],
+    })
     emit('published', status)
+  }
 }
 
 useWebShareTarget(async ({ data: { data, action } }: any) => {

components/publish/PublishWidgetFull.client.vue

@@ -64,7 +64,7 @@ onDeactivated(() => {
       </VDropdown>
     </div>
     <div>
-      <PublishWidget :key="draftKey" expanded class="min-h-100!" :draft-key="draftKey" @published="onPublish" />
+      <PublishWidget :key="draftKey" expanded class="min-h-100!" :draft-key="draftKey" feed-name="" @published="onPublish" />
     </div>
   </div>
 </template>

components/timeline/TimelineHome.vue

@@ -17,7 +17,7 @@ function onPublish(status) {
 
 <template>
   <div>
-    <PublishWidget draft-key="home" border="b base" @published="onPublish" />
+    <PublishWidget draft-key="home" border="b base" feed-name="home" @published="onPublish" />
     <TimelinePaginator ref="homePaginator" v-bind="{ paginator, stream }" :preprocess="reorderAndFilter" context="home" />
   </div>
 </template>

telemetry/engagementDetails.ts

@@ -36,6 +36,18 @@ export const engagementDetails: EngagementDetails = {
   'nav.login': {
     engagement_type: 'general',
   },
+  'home.post.create': {
+    engagement_type: 'post',
+  },
+  'post.create': {
+    engagement_type: 'post',
+  },
+  'post.edit': {
+    engagement_type: 'post',
+  },
+  'post.reply': {
+    engagement_type: 'post',
+  },
   ...postEvents,
   ...profileEvents,
 }