Update Style so that everything fits properly on the page

controllers/renderer.js

@@ -93,7 +93,7 @@ module.exports = {
                         merchant: new ObjectId(req.session.user),
                         date: {$gte: firstDay},
                     }},
-                    {$sort: {date: -1}},
+                    {$sort: {date: 1}},
                     {$project: {
                         date: 1,
                         recipes: 1

views/dashboardPage/bundle.js

@@ -619,7 +619,6 @@ let analytics = {
     },
 
     ingredientDisplay: function(ingredient, li){
-        console.time("timing");
         const itemsList = document.getElementById("itemsList");
         for(let i = 0; i < itemsList.children.length; i++){
             itemsList.children[i].classList.remove("analItemActive");
@@ -646,10 +645,7 @@ let analytics = {
         }
 
         //Create Graph
-        console.log(startDate);
         const dateIndices = merchant.transactionIndices(startDate);
-        console.log(dateIndices);
-        console.log(merchant.transactions[dateIndices[0]]);
         let quantities = [];
         let dates = [];
         let currentDate = merchant.transactions[dateIndices[0]].date;
@@ -686,8 +682,11 @@ let analytics = {
             mode: "lines+markers"
         }
 
-        console.timeEnd("timing");
-        Plotly.newPlot("itemUseGraph", [trace]);
+        const layout = {
+            title: ingredient.ingredient.name
+        }
+
+        Plotly.newPlot("itemUseGraph", [trace], layout);
 
         //Create daily use card
         let sum = 0;
@@ -1371,7 +1370,6 @@ let ingredientDetails = {
                 }
             })
             .catch((err)=>{
-                console.log(err);
                 banner.createError("SOMETHING WENT WRONG. PLEASE REFRESH THE PAGE");
             })
             .finally(()=>{

views/dashboardPage/dashboard.css

@@ -40,6 +40,7 @@ Multi-strand use classes
         padding: 10px 50px 0 50px;
         align-items: center;
         box-sizing: border-box;
+        height: 10%;
     }
 
         .strandTitle{
@@ -441,12 +442,16 @@ Analytics Strand
 .analContent{
     display: flex;
     justify-content: space-around;
+    align-items:center;
     padding: 15px;
+    box-sizing: border-box;
+    height: 90%;
 }
 
     .itemsList{
         list-style-type: none;
         width: 15%;
+        max-height: 95%;
         overflow-y: auto;
     }
 
@@ -468,6 +473,7 @@ Analytics Strand
 
         .analItemActive{
             background: rgb(179, 191, 209);
+            cursor: default;
         }
 
     .analData{
@@ -480,9 +486,22 @@ Analytics Strand
 
         #itemUseGraph{
             padding: 10px;
-            height: 50%;
+            height: 70%;
+            flex-grow: 0;
+        }
+
+        .dataRow{
+            display: flex;
+            justify-content: space-around;
+            height: 20%;
         }
 
+            .analCard{
+                display: flex;
+                flex-direction: column;
+                justify-content: space-around;
+            }
+
 /* 
 Orders Strand 
 */

views/dashboardPage/dashboard.ejs

@@ -265,8 +265,8 @@
                     <div class="analData">
                         <div id="itemUseGraph" class="card"></div>
 
-                        <div class="flexRow">
-                            <div class="card">
+                        <div class="dataRow">
+                            <div class="card analCard">
                                 <p>AVERAGE DAILY USE</p>
 
                                 <h1 id="analAvgUse"></h1>

views/dashboardPage/js/analytics.js

@@ -17,7 +17,6 @@ let analytics = {
     },
 
     ingredientDisplay: function(ingredient, li){
-        console.time("timing");
         const itemsList = document.getElementById("itemsList");
         for(let i = 0; i < itemsList.children.length; i++){
             itemsList.children[i].classList.remove("analItemActive");
@@ -44,10 +43,7 @@ let analytics = {
         }
 
         //Create Graph
-        console.log(startDate);
         const dateIndices = merchant.transactionIndices(startDate);
-        console.log(dateIndices);
-        console.log(merchant.transactions[dateIndices[0]]);
         let quantities = [];
         let dates = [];
         let currentDate = merchant.transactions[dateIndices[0]].date;
@@ -84,8 +80,11 @@ let analytics = {
             mode: "lines+markers"
         }
 
-        console.timeEnd("timing");
-        Plotly.newPlot("itemUseGraph", [trace]);
+        const layout = {
+            title: ingredient.ingredient.name
+        }
+
+        Plotly.newPlot("itemUseGraph", [trace], layout);
 
         //Create daily use card
         let sum = 0;

views/dashboardPage/js/ingredientDetails.js

@@ -194,7 +194,6 @@ let ingredientDetails = {
                 }
             })
             .catch((err)=>{
-                console.log(err);
                 banner.createError("SOMETHING WENT WRONG. PLEASE REFRESH THE PAGE");
             })
             .finally(()=>{