Add/update user dashboards.

smileys2 · May 6, 2019 · 3448330 · 3448330
1 parent 856d840
commit 3448330
Show file tree

Hide file tree

Showing 23 changed files with 852 additions and 446 deletions.
diff --git a/controllers/user.js b/controllers/user.js
@@ -12,18 +12,18 @@ const HIBP = require("../hibp");
 const sha1 = require("../sha1-utils");
 
 
-function _requireSessionUser(req) {
+function _requireSessionUser(req,res) {
   if (!req.session.user) {
-    throw new FluentError("must-be-signed-in");
+    return res.redirect("https://accounts.firefox.com/");
   }
   return req.session.user;
 }
 
 function removeEmail(req, res) {
-  // console.log(req.body.emailId);
+  const emailId = req.body.emailId;
 
-  // Remove secondary email
-  return res.json("Email is removed");
+  DB.removeOneSecondaryEmail(emailId);
+  res.redirect("/user/preferences");
 }
 
 function resendEmail(req, res) {
@@ -72,10 +72,7 @@ async function add(req, res) {
     }
   );
 
-
-  res.send({
-    title: req.fluentFormat("user-add-title"),
-  });
+  res.redirect("/user/preferences");
 }
 
 async function bundleVerifiedEmails(email, emailSha1, ifPrimary, id, verificationStatus, allBreaches) {
@@ -94,7 +91,7 @@ async function bundleVerifiedEmails(email, emailSha1, ifPrimary, id, verificatio
 
 async function getAllEmailsAndBreaches(user, allBreaches) {
   const monitoredEmails = await DB.getUserEmails(user.id);
-  const verifiedEmails = [];
+  let verifiedEmails = [];
   const unverifiedEmails = [];
   verifiedEmails.push(await bundleVerifiedEmails(user.primary_email, user.primary_sha1, true, user.id, user.primary_verified, allBreaches));
   for (const email of monitoredEmails) {
@@ -105,37 +102,36 @@ async function getAllEmailsAndBreaches(user, allBreaches) {
       unverifiedEmails.push(email);
     }
   }
+  verifiedEmails = getNewBreachesForEmailEntriesSinceDate(verifiedEmails, user.breaches_last_shown);
   return { verifiedEmails, unverifiedEmails };
 }
 
 
 function getNewBreachesForEmailEntriesSinceDate(emailEntries, date) {
-  const breaches = new Set();
   for (const emailEntry of emailEntries) {
     const newBreachesForEmail = emailEntry.breaches.filter(breach => breach.AddedDate >= date);
+
     for (const newBreachForEmail of newBreachesForEmail) {
-      breaches.add(newBreachForEmail);
+      newBreachForEmail["NewBreach"] = true; // add "NewBreach" property to the new breach.
+      emailEntry["hasNewBreaches"] = newBreachesForEmail.length; // add the number of new breaches to the email
     }
   }
-  return breaches;
+  return emailEntries;
 }
 
 
 async function getDashboard(req, res) {
-  _requireSessionUser(req);
+  _requireSessionUser(req, res);
   const allBreaches = req.app.locals.breaches;
   const user = req.session.user;
   const { verifiedEmails, unverifiedEmails } = await getAllEmailsAndBreaches(user, allBreaches);
 
-  const newBreachesFound = getNewBreachesForEmailEntriesSinceDate(verifiedEmails, user.breaches_last_shown);
-
   req.session.user = await DB.setBreachesLastShownNow(user);
 
   res.render("dashboards", {
     title: req.fluentFormat("user-dash"),
     verifiedEmails,
     unverifiedEmails,
-    newBreachesFound,
     whichPartial: "dashboards/breaches-dash",
   });
 }
@@ -169,7 +165,7 @@ async function _verify(req) {
 
 
 async function verify(req, res) {
-  _requireSessionUser(req);
+  _requireSessionUser(req, res);
   if (!req.query.token) {
     throw new FluentError("user-verify-token-error");
   }

diff --git a/db/DB.js b/db/DB.js
@@ -253,6 +253,15 @@ const DB = {
     return subscriber;
   },
 
+  async removeOneSecondaryEmail(emailId) {
+    await knex("email_addresses")
+      .where({
+        "id": emailId,
+      })
+      .del();
+      return;
+  },
+
   async getSubscribersByHashes(hashes) {
     return await knex("subscribers").whereIn("primary_sha1", hashes).andWhere("primary_verified", "=", true);
   },

diff --git a/hibp.js b/hibp.js
@@ -119,9 +119,7 @@ const HIBP = {
         foundBreaches = allBreaches.filter(breach => breachedAccount.websites.includes(breach.Name));
         foundBreaches = this.filterBreaches(foundBreaches);
         foundBreaches.sort( (a,b) => {
-          const oldestBreach = new Date(a.BreachDate);
-          const newestBreach = new Date(b.BreachDate);
-          return newestBreach-oldestBreach;
+          return new Date(b.AddedDate) - new Date(a.AddedDate);
         });
         break;
       }

diff --git a/public/css/breach-cards.css b/public/css/breach-cards.css
@@ -2,30 +2,47 @@
   display: flex;
   flex-direction: column;
   border-radius: var(--radius);
-  color: var(--color);
+
+  /* color: var(--color); */
   overflow: hidden;
   margin: 0.5rem;
   transform: scale(1);
 }
 
+.scan-res.breach-card {
+  color: rgba(255, 255, 255, 1);
+  background-color: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+.scan-res .breach-card-title-wrapper {
+  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
+}
+
 a.breach-card:focus,
 a.latest-breach-link {
   border: none;
   outline: none;
   box-shadow: none;
 }
 
+.latest-breach-link {
+  color: var(--blue4);
+}
+
 .breach-card-title-wrapper {
-  padding: var(--margin) var(--padding);
+  padding: var(--margin);
   justify-content: space-between;
   align-content: center;
+  width: 100%;
 }
 
 .breach-info-wrapper {
   height: 100%;
   justify-content: space-between;
-  padding: var(--margin) var(--padding) var(--padding) var(--padding);
-  background-color: rgba(255, 255, 255, 1);
+  padding: var(--margin);
+
+  /* background-color: rgba(255, 255, 255, 1); */
 }
 
 .breach-logo {
@@ -34,15 +51,9 @@ a.latest-breach-link {
 }
 
 .demi.key {
-  color: var(--color);
   font-size: 0.9rem;
 }
 
-.breach-title {
-  color: rgba(255, 255, 255, 1);
-  margin: auto auto auto 0;
-}
-
 .breach-card-link-wrap {
   padding-top: 1rem;
 }
@@ -72,24 +83,15 @@ a.latest-breach-link {
 .email-card-breach-wrapper {
   border-radius: var(--radius);
   overflow: hidden;
-  margin: var(--margin) 0;
-}
-
-.email-card-breach-wrapper .breach-card-title-wrapper {
-  background-color: rgba(0, 0, 0, 0.05);
-}
-
-.breach-title.demi.ec {
-  color: var(--color);
 }
 
 a.breach-card:hover {
   opacity: 1;
 }
 
 .two-up {
-  flex: 0 1 47%;
-  margin: 1rem 0.5rem;
+  flex: 1 1 45%;
+  margin: 1rem;
 }
 
 .three-up {
@@ -102,11 +104,15 @@ a.breach-card:hover {
     max-width: 48%;
     flex: 1 1 48%;
   }
+
+  .breach-card.ec.two-up {
+    flex: 1 1 100%;
+  }
 }
 
 @media screen and (max-width: 800px) {
   .breach-card {
-    margin: 1rem auto;
+    margin: 0.5rem var(--margin);
   }
 
   .two-up,
@@ -115,3 +121,9 @@ a.breach-card:hover {
     flex: 1 1 100%;
   }
 }
+
+@media screen and (max-width: 500px) {
+  .breach-card {
+    margin: 0.5rem 0;
+  }
+}