docbrown/app/views/notifications/index.html.erb
Julien Maury a2677cc0a9
Remove defer attributes from inline scripts - gist embeds (#13407)
* replace inline attribute defer with external js - show.html.erb

* fix typo in filename

* disable no-undef and bail if not defined

* put js on subfolder utilities

* refactor jsx instead of loading chunk with defer

* fix typo in desc

* better name for global gist helper

* use InstantClick

* working script on preview AND single view, not dynamic import, though

* embed only if gists

* combine all approaches to make dynamic import work

* make gist embeds work on submit comment form

* make gist embeds work on preview comment

* refactor - preview comments and submit

* add pack editComment + helper embedGistsInComments

* comment gist helper

* delete useless file utility

* use new syntax for events

* put code in method embedGistsInComments

* delete older pack gist

* handle edge case 'view full discussion'

* resolve conflict with package ibm-openapi-validator

* resolve conflict with package husky

* empty commit to test random error travis

* better name for class dismiss

* handle future events submit

* delete test code on click toggle form

* delete unused file

* rename pack as js file, not jsx

* Added POC using MutationObserver.

* missing case: notification page

* use custom pack notification page

* add e2e test for comment with embed gist

* add e2e test for preview post with embed gist

* add an extra step in tests to check gist is present

Co-authored-by: Nick Taylor <nick@dev.to>
Co-authored-by: Suzanne Aitchison <suzanne@forem.com>
2021-06-11 08:22:50 +01:00

73 lines
3 KiB
Text

<% title "Notifications" %>
<%= content_for :page_meta do %>
<link rel="canonical" href="<%= app_url("/notifications") %>" />
<meta name="description" content="Notifications inbox for <%= community_name %>">
<%= meta_keywords_default %>
<meta property="og:type" content="article" />
<meta property="og:url" content="<%= app_url("/notifications") %>" />
<meta property="og:title" content="Notifications - <%= community_name %>" />
<meta property="og:description" content="Notifications inbox for <%= community_name %>" />
<meta property="og:site_name" content="<%= community_name %>" />
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@<%= Settings::General.social_media_handles["twitter"] %>">
<meta name="twitter:title" content="Notifications - <%= community_name %>">
<meta name="twitter:description" content="Notifications inbox for <%= community_name %>">
<%= javascript_packs_with_chunks_tag "notificationPage", defer: true %>
<% end %>
<script>
/**
* A script that tracks clicks for welcome notifications.
* The notification must have `trackNotification` as its onclick event
* in order for this to be triggered.
*
* @param {Event} The click event on the notification.
*/
function trackNotification(event) {
const target = event.target;
const { parentElement: { id: title }, text } = target;
// TODO: [@forem/delightful]: This event doesn't appear to be firing on Honeybadger.
// We probably want to remove it eventually if we continually don't see it being triggered.
if (!title) {
Honeybadger.notify(`Could not find parentElement.id when clicking on event target text: ${text}`);
}
ahoy.track("Clicked Welcome Notification", { title, text, target: target.toString() });
}
</script>
<% if user_signed_in? %>
<main id="main-content">
<header class="crayons-layout crayons-layout--limited-l crayons-layout--1-col p-4 flex items-center justify-between">
<h1 class="crayons-title">Notifications</h1>
<a href="<%= user_settings_path(tab: :notifications) %>" class="crayons-btn crayons-btn--ghost">Settings</a>
</header>
<div class="crayons-layout crayons-layout--limited-l crayons-layout--2-cols pt-0" id="notifications-container">
<div class="crayons-layout__sidebar-left">
<%= render "notifications/nav_menu" %>
</div>
<main class="crayons-layout__content">
<div id="articles-list">
<%= render "notifications_list", params: params %>
</div>
<%# new or less active users that don't have a page worth of notifications
won't be shown the "load more" button %>
<% if @notifications.size >= @initial_page_size %>
<button id="load-more-button" type="button" class="crayons-btn crayons-btn--secondary crayons-btn--l my-6 w-100">
Load More
</button>
<% end %>
</main>
</div>
<%= render "articles/fitvids" %>
</main>
<% else %>
<%= render "devise/registrations/registration_form" %>
<% end %>