views/index.html

@@ -7,9 +7,6 @@
     <script src="/static/feed-item.js" defer></script>
 
     <script src="https://unpkg.com/vue@2.5.17/dist/vue.min.js"></script>
-    <script src="https://unpkg.com/dayjs@1.8.21/dayjs.min.js"></script>
-    <script src="https://unpkg.com/dayjs@1.9.5/plugin/relativeTime.js"></script>
-    <script>dayjs.extend(window.dayjs_plugin_relativeTime)</script>
 
     <link rel="stylesheet" href="https://unpkg.com/hack@0.8.1/dist/hack.css">
     <link rel="stylesheet" href="https://unpkg.com/hack@0.8.1/dist/dark.css">
@@ -42,8 +39,8 @@
             All ({{unread}})
           </div>
 
-          <div v-for="feed in feeds" :class="{strong: unreadCounts[feed.ID], 'alert': true, 'alert-success': selectedFeed == feed.FeedURL  }" :data-feed="feed.FeedURL" v-on:click="loadFeed(feed.ID)">
+          <div v-for="feed in feeds" :class="{strong: unreadCount(feed), 'alert': true, 'alert-success': selectedFeed == feed.FeedURL  }" :data-feed="feed.FeedURL" v-on:click="loadFeed(feed.ID)">
-            {{feed.Title}} ({{unreadCounts[feed.ID]}})
+            {{feed.Title}} ({{unreadCount(feed)}})
           </div>
 
           <div class="menu">
@@ -81,8 +78,8 @@
           <div v-for="item in shownItems" :id="item.ID">
             <div :class="{'alert': true, 'alert-info': item.Read == false, 'item-heading': true}" :data-feed="item.FeedHomepageURL" v-on:click="loadItem(item)">
               <span class="feed-title">{{item.FeedTitle}}</span>
-              <span class="date" :title="item.Created">{{ dayjs(item.Created).fromNow() }}</span>
+              <span class="date" :title="item.Created">{{item.Created}}</span>
-              <h3 class="item-title">{{item.Title}} <a :href="item.URL">↗</a></h3>
+              <h3 class="item-title"><a :href="item.URL">{{item.Title}}</a></h3>
             </div>
             <div class="card item-content" :data-id="item.ID" v-if="item.ID == selectedItem">
               <div class="card-content">
@@ -124,13 +121,6 @@
             },
             unread() {
               return this.items.filter(item => !item.Read).length;
-            },
-            unreadCounts() {
-              return this.items.filter(item => !item.Read).reduce((acc, item) => {
-                if (!acc[item.FeedID]) acc[item.FeedID] = 0;
-                acc[item.FeedID]++;
-                return acc;
-              }, {})
             }
           },
           methods: {
@@ -143,6 +133,9 @@
               document.body.classList.toggle('dark');
               document.body.classList.toggle('dark-grey');
             },
+            unreadCount(feed) {
+              return this.items.filter(item => item.FeedID == feed.ID).length;
+            },
             loadFeed(feed) {
               this.selectedItem = undefined;
               this.selectedFeed = feed;
@@ -189,9 +182,8 @@
                 });
             },
             markAllRead() {
-              let ids = this.shownItems.filter(item => !item.Read).map(item => item.ID);
-              if (confirm(`Are you sure you want to mark ${ids.length} items as read?`)) {
               this.setBusy(true);
+              let ids = this.shownItems.filter(item => !item.Read).map(item => item.ID);
               fetch(
                 `/api/read`,
                 {method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(ids)}
@@ -205,7 +197,6 @@
                   console.error(err);
                   this.setBusy(false);
                 });
-              }
             },
             addSite(url) {
               this.setBusy(true);

views/static/feed-item.js

@@ -56,10 +56,6 @@ class FeedItem extends HTMLElement {
       .then(item => {
         template.innerHTML += item.Content || item.Description;
         this.shadowRoot.appendChild(template.content.cloneNode(true));
-        [...this.shadowRoot.querySelectorAll('a[href^=http]')].forEach(a => {
-          a.setAttribute("target", "_blank");
-          a.setAttribute("rel", "noopener");
-        })
       })
 
   }