Skip to content

LG-10418: Add analytics tracking for "You will also need" IdV accordion on Sign In page #9018

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jmdembe merged 8 commits into from
Aug 18, 2023
Merged

LG-10418: Add analytics tracking for "You will also need" IdV accordion on Sign In page #9018

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
e2d1329
Add logging for IdV accordion on home page
jmdembe Aug 15, 2023
2f8fd8c
alphabetize events list
jmdembe Aug 15, 2023
d6b6ce6
add analytics event
jmdembe Aug 15, 2023
caa9d21
add logging for required pii accordion
jmdembe Aug 16, 2023
6218048
rip out accordion react element
jmdembe Aug 16, 2023
03e7d63
sort analytics event
jmdembe Aug 16, 2023
390aa3d
changelog: Internal, analytics, add analytics for you will need accor…
jmdembe Aug 16, 2023
3a13575
Update app/services/analytics_events.rb
jmdembe Aug 17, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 13 additions & 11 deletions app/controllers/frontend_log_controller.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,26 +8,28 @@ class FrontendLogController < ApplicationController
# In rare circumstances, these writes can clobber other, more important writes.
before_action :skip_session_commit

# Please try to keep this list alphabetical as well!
Copy link
Copy Markdown
Contributor Author

@jmdembe jmdembe Aug 16, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This might be an opportunity to script this?

Copy link
Copy Markdown
Contributor

@aduth aduth Aug 17, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We could consider adding a controller spec to check that it's sorted?

e.g.

expect(described_class::EVENT_MAP.keys).to eq(described_class::EVENT_MAP.keys.sort)

# rubocop:disable Layout/LineLength
EVENT_MAP = {
'IdV: verify in person troubleshooting option clicked' => :idv_verify_in_person_troubleshooting_option_clicked,
'IdV: location visited' => :idv_in_person_location_visited,
'IdV: consent checkbox toggled' => :idv_consent_checkbox_toggled,
'IdV: download personal key' => :idv_personal_key_downloaded,
'IdV: location submitted' => :idv_in_person_location_submitted,
'IdV: location visited' => :idv_in_person_location_visited,
'IdV: Mobile device and camera check' => :idv_mobile_device_and_camera_check,
'IdV: prepare visited' => :idv_in_person_prepare_visited,
'IdV: prepare submitted' => :idv_in_person_prepare_submitted,
'IdV: switch_back visited' => :idv_in_person_switch_back_visited,
'IdV: switch_back submitted' => :idv_in_person_switch_back_submitted,
'IdV: download personal key' => :idv_personal_key_downloaded,
'IdV: Native camera forced after failed attempts' => :idv_native_camera_forced,
'Multi-Factor Authentication: download backup code' => :multi_factor_auth_backup_code_download,
'Show Password button clicked' => :show_password_button_clicked,
'IdV: personal key acknowledgment toggled' => :idv_personal_key_acknowledgment_toggled,
'IdV: prepare submitted' => :idv_in_person_prepare_submitted,
'IdV: prepare visited' => :idv_in_person_prepare_visited,
'IdV: switch_back submitted' => :idv_in_person_switch_back_submitted,
'IdV: switch_back visited' => :idv_in_person_switch_back_visited,
'IdV: user clicked sp link on ready to verify page' => :idv_in_person_ready_to_verify_sp_link_clicked,
'IdV: user clicked what to bring link on ready to verify page' => :idv_in_person_ready_to_verify_what_to_bring_link_clicked,
'IdV: consent checkbox toggled' => :idv_consent_checkbox_toggled,
'User prompted before navigation' => :user_prompted_before_navigation,
'IdV: verify in person troubleshooting option clicked' => :idv_verify_in_person_troubleshooting_option_clicked,
'Multi-Factor Authentication: download backup code' => :multi_factor_auth_backup_code_download,
'Show Password button clicked' => :show_password_button_clicked,
'Sign In: IdV requirements accordion clicked' => :sign_in_idv_requirements_accordion_clicked,
'User prompted before navigation and still on page' => :user_prompted_before_navigation_and_still_on_page,
'User prompted before navigation' => :user_prompted_before_navigation,
}.transform_values { |method| AnalyticsEvents.instance_method(method) }.freeze
# rubocop:enable Layout/LineLength

Expand Down
36 changes: 0 additions & 36 deletions app/javascript/packages/components/accordion.tsx
View file
Open in desktop

This file was deleted.

1 change: 0 additions & 1 deletion app/javascript/packages/components/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
export { default as Accordion } from './accordion';
export { default as Alert } from './alert';
export { default as BlockLink } from './block-link';
export { default as Button } from './button';
Expand Down
5 changes: 5 additions & 0 deletions app/services/analytics_events.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3538,6 +3538,11 @@ def show_password_button_clicked(path:, **extra)
track_event('Show Password Button Clicked', path: path, **extra)
end

# Tracks if a user clicks the "You will also need" accordion on the homepage
def sign_in_idv_requirements_accordion_clicked
track_event('Sign In: IdV requirements accordion clicked')
end

# @param [String] flash
# @param [String] stored_location
# tracks when a user visits the sign in page
Expand Down
120 changes: 61 additions & 59 deletions app/views/sign_up/registrations/_required_pii_accordion.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,63 +8,65 @@
</span>
</p>

<%= render AccordionComponent.new(class: 'margin-y-2') do |c| %>
<% c.with_header { t('devise.registrations.start.accordion') } %>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/email-password.svg'),
size: '40', alt: t('devise.registrations.start.bullet_1_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_1_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/2FA.svg'),
size: '40', alt: t('devise.registrations.start.bullet_2_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_2_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/personal-details.svg'),
size: '40', alt: t('devise.registrations.start.bullet_3_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_3_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/personal-details.svg'),
size: '40', alt: t('devise.registrations.start.bullet_3_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_4_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/financial.svg'),
size: '40', alt: t('devise.registrations.start.bullet_5_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_5_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/personal-key.svg'),
size: '40', alt: t('devise.registrations.start.bullet_6_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_6_html') %>
</span>
</p>
<p>
<%= new_tab_link_to t('devise.registrations.start.learn_more'), MarketingSite.help_url %>
</p>
<%= render ClickObserverComponent.new(event_name: 'Sign In: IdV requirements accordion clicked') do %>
<%= render AccordionComponent.new(class: 'margin-y-2') do |c| %>
<% c.with_header { t('devise.registrations.start.accordion') } %>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/email-password.svg'),
size: '40', alt: t('devise.registrations.start.bullet_1_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_1_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/2FA.svg'),
size: '40', alt: t('devise.registrations.start.bullet_2_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_2_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/personal-details.svg'),
size: '40', alt: t('devise.registrations.start.bullet_3_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_3_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/personal-details.svg'),
size: '40', alt: t('devise.registrations.start.bullet_3_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_4_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/financial.svg'),
size: '40', alt: t('devise.registrations.start.bullet_5_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_5_html') %>
</span>
</p>
<p class="grid-row grid-gutter">
<%= image_tag(
asset_url('get-started/personal-key.svg'),
size: '40', alt: t('devise.registrations.start.bullet_6_img'), class: 'margin-top-05 grid-col-auto',
) %>
<span class="grid-col-fill padding-left-2">
<%= t('devise.registrations.start.bullet_6_html') %>
</span>
</p>
<p>
<%= new_tab_link_to t('devise.registrations.start.learn_more'), MarketingSite.help_url %>
</p>
<% end %>
<% end %>