Instrument product usage for Vue to-do list

Purpose

We don't have any instrumentation on the to-do list right now. We're preparing to make some major changes in our to-dos and notifications features, so having a baseline of usage behavior would help us evaluate whether we're on the right track.

Proposal

• Implement basic product usage metrics for the to-dos list
• See the table below for the full list of events

Events

Event	Trigger	Snowplow	Additional properties	Service ping?
Page view	User views the to-do list		Role (e.g. Development Team Lead, Product Manager)	✅
Click todo	User clicks on an item in the to-do list	action: follow_todo_link / property: target_type:	Role (e.g. Development Team Lead, Product Manager)	✅
Mark as done	User clicks "Mark as done" on a todo	action: click_todo_item_action / label: mark_pending / mark_done
Mark all as done	User clicks "Mark all as done"	action: click_todo_item_action / label: mark_all_done / mark_all_done_undo
Filter todos	User filters the list of todos	action: filter_todo_list / label: filter_type	Property (one of Group, Project, Author, Type, Action)
Sort todos	User sorts the list of todos	action: sort_todo_list / label: filter_type	Order (one of Label priority, last created, oldest created, updated date)
Views "Done" todos	User views the "Done" tab on the todo list	action: filter_todo_list / label: filter_type