Merge pull request #139 from amosproj/dev-#125

Implementation of #125
amosproj · Jun 30, 2021 · e7ecd01 · e7ecd01
2 parents 172680f + 4411df7
commit e7ecd01
Show file tree

Hide file tree

Showing 12 changed files with 594 additions and 4 deletions.
diff --git a/docs/drawing.svg b/docs/drawing.svg
diff --git a/frontend/package.json b/frontend/package.json
@@ -14,8 +14,10 @@
         "jspdf-autotable": "^3.5.14",
         "prop-types": "^15.7.2",
         "react": "^16.13.1",
+        "react-alice-carousel": "^2.5.1",
         "react-apexcharts": "^1.3.9",
         "react-burger-menu": "^2.6.13",
+        "react-collapsible": "^2.8.3",
         "react-collapsible-content": "^1.0.0",
         "react-dom": "^16.8.6",
         "react-grid-system": "^7.1.2",

diff --git a/frontend/src/components/dashboard/UnresolvedTicketsComponent.js b/frontend/src/components/dashboard/UnresolvedTicketsComponent.js
@@ -32,8 +32,13 @@ function UnresolvedTicketsComponent({ containerStyles }) {
             title='Unresolved tickets'
             link='View details'
             subtitle='Group:'
+
             subtitleTwo='Support'
             items={[
+                renderStat('Waiting on Feature Request', 4238),
+                renderStat('Awaiting Customer Response', 1005),
+                renderStat('Awaiting Developer Fix', 914),
+                renderStat('Pending', 281),
                 renderStat('Waiting on Feature Request', 4238),
                 renderStat('Awaiting Customer Response', 1005),
                 renderStat('Awaiting Developer Fix', 914),

diff --git a/frontend/src/components/details/ColumnChartComponent.jsx b/frontend/src/components/details/ColumnChartComponent.jsx
@@ -68,7 +68,7 @@ const ColumnChartComponent = () => {
             },
             responsive: [
                 {
-                    breakpoint: 300,
+                    breakpoint: 6400,
                     options: {
                         chart: {
                             width: 500

diff --git a/frontend/src/components/details/PieChartComponent.jsx b/frontend/src/components/details/PieChartComponent.jsx
@@ -41,7 +41,7 @@ const PieChartComponent = () => {
         ],
         responsive: [
             {
-                breakpoint: 5600,
+                breakpoint: 6400,
                 options: {
                     chart: {
                         height: '300px'

diff --git a/frontend/src/components/mydashboard/MydashboardComponent.js b/frontend/src/components/mydashboard/MydashboardComponent.js
@@ -0,0 +1,59 @@
+import React from 'react';
+import { Column } from 'simple-flexbox';
+import { createUseStyles } from 'react-jss';
+import MydashboardItemComponent from './MydashboardItemComponent';
+import { Container } from 'react-grid-system';
+
+const useStyles = createUseStyles({
+    cardsContainer: {
+        marginRight: -30,
+        marginTop: -30
+    },
+    cardRow: {
+        marginTop: 30,
+        '@media (max-width: 768px)': {
+            marginTop: 0
+        }
+    },
+    miniCardContainer: {
+        flexGrow: 1,
+        marginRight: 30,
+        '@media (max-width: 768px)': {
+            marginTop: 30,
+            maxWidth: 'none'
+        }
+    },
+    todayTrends: {
+        marginTop: 30
+    },
+    lastRow: {
+        marginTop: 30
+    },
+    unresolvedTickets: {
+        marginRight: 30,
+        '@media (max-width: 1024px)': {
+            marginRight: 0
+        }
+    },
+    tasks: {
+        marginTop: 0,
+        '@media (max-width: 1024px)': {
+            marginTop: 30
+        }
+    }
+});
+
+function DashboardComponent() {
+    const classes = useStyles();
+    return (
+        <Container>
+            <Column>
+                <div className={classes.todayTrends}>
+                    <MydashboardItemComponent />
+                </div>
+            </Column>
+        </Container>
+    );
+}
+
+export default DashboardComponent;