sip

.vscode/settings.json

@@ -0,0 +1,22 @@
+{
+    "workbench.colorCustomizations": {
+        "activityBar.activeBackground": "#52c190",
+        "activityBar.activeBorder": "#965bc4",
+        "activityBar.background": "#52c190",
+        "activityBar.foreground": "#15202b",
+        "activityBar.inactiveForeground": "#15202b99",
+        "activityBarBadge.background": "#965bc4",
+        "activityBarBadge.foreground": "#e7e7e7",
+        "sash.hoverBorder": "#52c190",
+        "statusBar.background": "#3ba576",
+        "statusBar.foreground": "#e7e7e7",
+        "statusBarItem.hoverBackground": "#52c190",
+        "statusBarItem.remoteBackground": "#3ba576",
+        "statusBarItem.remoteForeground": "#e7e7e7",
+        "titleBar.activeBackground": "#3ba576",
+        "titleBar.activeForeground": "#e7e7e7",
+        "titleBar.inactiveBackground": "#3ba57699",
+        "titleBar.inactiveForeground": "#e7e7e799"
+    },
+    "peacock.color": "#3ba576"
+}

actions/pelaporan.js

@@ -0,0 +1,22 @@
+export const getPelaporan = async (query = {}) => {
+	try {
+		let url = "http://localhost:5000/pelaporan";
+		if (query.penjadwalan) url += "?penjadwalan=true";
+		if (query.pemeriksaan) url += "?pemeriksaan=true";
+		const res = await fetch(url);
+		return await res.json();
+	} catch (error) {
+		console.log("error", error);
+		return false;
+	}
+};
+
+// export const getPelaporanJadwal = async () => {
+// 	try {
+// 		const res = await fetch("http://localhost:5000/pelaporan?penjadwalan=true");
+// 		return await res.json();
+// 	} catch (error) {
+// 		console.log("error", error);
+// 		return false;
+// 	}
+// };

actions/pemeriksaan.js

@@ -0,0 +1,14 @@
+export const insetPemeriksaan = async ({ number, ptId }, data) => {
+	try {
+		const requestOptions = {
+			method: "POST",
+			body: data,
+		};
+
+		const res = await fetch(`http://localhost:5000/pelaporan/pemeriksaan/create?number=${number}&ptId=${ptId}`, requestOptions);
+		return await res.json();
+	} catch (error) {
+		console.log("error", error);
+		return false;
+	}
+};

actions/penjadwalan.js

@@ -0,0 +1,20 @@
+export const updateJadwal = async ({number, ptId},data) => {
+	try {
+		const myHeaders = new Headers();
+		myHeaders.append("Content-Type", "application/json");
+
+		const raw = JSON.stringify(data);
+
+		const requestOptions = {
+			method: "POST",
+			body: raw,
+			headers: myHeaders,
+		};
+
+		const updated = await fetch(`http://localhost:5000/pelaporan/jadwal/add?number=${number}&ptId=${ptId}`, requestOptions);
+		return await updated.json();
+	} catch (error) {
+		console.log("error", error);
+		return false;
+	}
+};

components/Common/Loader.js

@@ -0,0 +1,21 @@
+import React from "react";
+import { Spinner } from "react-bootstrap";
+
+const Loader = () => {
+	return (
+		<Spinner
+			animation="border"
+			role="status"
+			style={{
+				width: "100px",
+				height: "100px",
+				margin: "auto",
+				display: "block",
+			}}
+		>
+			<span className="sr-only">Loading...</span>
+		</Spinner>
+	);
+};
+
+export default Loader;

components/Common/Message.js

@@ -0,0 +1,12 @@
+import React from "react";
+import { Alert } from "react-bootstrap";
+
+const Message = ({ variant, children }) => {
+	return <Alert variant={variant}>{children}</Alert>;
+};
+
+Message.defaultProps = {
+	variant: "info",
+};
+
+export default Message;

components/Extras/calendar.view.js

@@ -1,6 +1,8 @@
 import React, { Component } from "react";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Card, CardBody, CardHeader, CardTitle } from "reactstrap";
+import { updateJadwal } from "../../actions/penjadwalan";
+import { getPelaporan } from "../../actions/pelaporan";
 
 import FullCalendar from "@fullcalendar/react";
 import dayGridPlugin from "@fullcalendar/daygrid";
@@ -9,12 +11,6 @@ import interactionPlugin, { Draggable } from "@fullcalendar/interaction";
 import listPlugin from "@fullcalendar/list";
 import bootstrapPlugin from "@fullcalendar/bootstrap";
 
-// import "@fullcalendar/core/main.css";
-// import "@fullcalendar/daygrid/main.css";
-// import "@fullcalendar/timegrid/main.css";
-// import "@fullcalendar/list/main.css";
-// import "@fullcalendar/bootstrap/main.css";
-
 import events from "./calendar.events";
 
 class Calendar extends Component {
@@ -28,24 +24,12 @@ class Calendar extends Component {
 		right: "dayGridMonth,timeGridWeek,timeGridDay,listWeek",
 	};
 
-	// External events properties
-
-	evColors = ["danger", "primary", "info", "success", "warning", "green", "pink", "inverse", "purple"];
-
 	constructor(props) {
 		super(props);
 		this.state = {
 			selectedEvent: null,
 			evRemoveOnDrop: true,
-			evSelectedColor: this.evColors[0],
 			evNewName: "",
-			_externalEvents: [
-				{ color: "green", name: "Lunch" },
-				{ color: "danger", name: "Go home" },
-				{ color: "info", name: "Do homework" },
-				{ color: "warning", name: "Work on UI design" },
-				{ color: "inverse", name: "Sleep tight" },
-			],
 			externalEvents: [],
 			dataLaporan: [],
 			dataEvent: [],
@@ -63,9 +47,12 @@ class Calendar extends Component {
 			},
 		});
 
-		await this.fetchData();
+		// await this.fetchData();
+		const pelaporan = await getPelaporan();
+		this.setState({ dataLaporan: pelaporan });
+		this.getDataEvent();
 
-		const cek = this.state.dataLaporan.filter((e) => e._number === parseInt(this.props.query.number) && e.pt_id == this.props.query.ptId)[0];
+		const cek = this.state.dataLaporan.data.filter((e) => e._number === this.props.query.number && e.pt_id == this.props.query.ptId)[0];
 		let color = "#" + Math.floor(Math.random() * 16777215).toString(16);
 		if (cek.penjadwalan) {
 			color = cek.penjadwalan.background_color;
@@ -73,36 +60,19 @@ class Calendar extends Component {
 		this.setState({ externalEvents: [{ id: this.props.query.number, color: color, name: "Jadwal Pemeriksaan - BI:" + this.props.query.number }] });
 	}
 
-	fetchData = async () => {
-		const res = await fetch("http://localhost:1880/pelaporan");
-		const data = await res.json();
-		this.setState({ dataLaporan: data });
-		const dataEvent = data
+	getDataEvent = () => {
+		const dataEvent = this.state.dataLaporan.data
 			.filter((e) => e.penjadwalan)
-			.map((e) => {
-				return {
-					title: e.penjadwalan.title,
-					start: new Date(e.penjadwalan.from_date),
-					end: new Date(e.penjadwalan.to_date),
-					backgroundColor: e.penjadwalan.background_color, //red
-					borderColor: e.penjadwalan.background_color,
-				};
-			});
-		this.setState({
-			dataEvent: dataEvent,
-		});
+			.map((e) => ({
+				title: e.penjadwalan.title,
+				start: new Date(e.penjadwalan.from_date),
+				end: new Date(e.penjadwalan.to_date),
+				backgroundColor: e.penjadwalan.background_color, //red
+				borderColor: e.penjadwalan.background_color,
+			}));
+		this.setState({ dataEvent });
 	};
 
-	addRandomEvent() {
-		// add dynamically an event
-		this.addEvent({
-			title: "Random Event",
-			start: new Date(new Date().getFullYear(), new Date().getMonth(), Math.random() * (30 - 1) + 1),
-			backgroundColor: "#c594c5", //purple
-			borderColor: "#c594c5", //purple
-		});
-	}
-
 	dayClick = (date) => {
 		this.setState({
 			selectedEvent: {
@@ -111,7 +81,6 @@ class Calendar extends Component {
 		});
 	};
 
-	// add event directly into calendar
 	addEvent(event) {
 		this.calendarEvents.push(event);
 	}
@@ -121,89 +90,20 @@ class Calendar extends Component {
 		info.event.setProp("backgroundColor", styles.backgroundColor);
 		info.event.setProp("borderColor", styles.borderColor);
 		this.handleEventCalendar(info);
-		// is the "remove after drop" checkbox checked?
-		// if (this.state.evRemoveOnDrop) {
-		// 	this.removeExternalEvent(info.draggedEl.textContent);
-		// }
-	};
-
-	getEvColorClasses(evcolor) {
-		return "bg-" + evcolor + (this.state.evSelectedColor === evcolor ? " selected" : "");
-	}
-
-	addNewExternalEvent = () => {
-		const externalEvents = this.state.externalEvents.concat({
-			color: "#" + Math.floor(Math.random() * 16777215).toString(16),
-			name: this.state.evNewName,
-		});
-		this.setState({
-			externalEvents,
-		});
 	};
 
-	removeExternalEvent = (name) => {
-		let externalEvents = [...this.state.externalEvents];
-		const index = externalEvents.findIndex((e) => e.name === name);
-		if (index > -1) {
-			externalEvents.splice(index, 1);
-			this.setState({
-				externalEvents,
-			});
-		}
-	};
-
-	selectColor = (color) => () => {
-		this.setState({
-			evSelectedColor: color,
-		});
-	};
-
-	handleCheck = (event) => {
-		this.setState({
-			//evRemoveOnDrop: event.target.checked
-			evRemoveOnDrop: true,
-		});
-	};
-
-	handleEventCalendar = ({ event }) => {
+	handleEventCalendar = async ({ event }) => {
+		const number = this.props.query.number;
+		const ptId = this.props.query.ptId;
 		const data = {
 			title: event.title,
 			from_date: event.start,
 			to_date: event.end || event.start,
 			background_color: event.backgroundColor,
 		};
-		const update = this.updateJadwal(data);
-	};
-
-	updateJadwal = async (data) => {
-		try {
-			const number = this.props.query.number;
-			const ptId = this.props.query.ptId;
-
-			const myHeaders = new Headers();
-			myHeaders.append("Content-Type", "application/json");
-
-			const raw = JSON.stringify(data);
 
-			const requestOptions = {
-				method: "POST",
-				body: raw,
-				headers: myHeaders,
-			};
-
-			const updated = await fetch(`http://localhost:1880/penjadwalan.add/${number}?ptId=${ptId}`, requestOptions);
-			// .catch((error) => console.log("error", error));
-			return await updated.json();
-		} catch (error) {
-			console.log("error", error);
-			return false;
-		}
-	};
-
-	handleInputName = (event) => {
-		this.setState({
-			evNewName: event.target.value,
-		});
+		const update = await updateJadwal({ number, ptId }, data);
+		console.log(update);
 	};
 
 	render() {
@@ -221,12 +121,10 @@ class Calendar extends Component {
 						<div className="col-xl-3 col-lg-4">
 							<div className="row">
 								<div className="col-lg-12 col-md-6 col-12">
-									{/* START card */}
 									<Card className="card-default" title="">
 										<CardHeader>
 											<CardTitle tag="h4">Daftar Pemeriksaan</CardTitle>
 										</CardHeader>
-										{/* Default external events list */}
 										<CardBody>
 											<div className="external-events" ref="externalEventsList">
 												{externalEvents.map((ev) => (
@@ -242,43 +140,9 @@ class Calendar extends Component {
 													</div>
 												))}
 											</div>
-											{/* <div className="custom-control custom-checkbox mt-3">
-                                                <input className="custom-control-input" id="drop-remove" type="checkbox" onChange={this.handleCheck}/>
-                                                <label className="custom-control-label" htmlFor="drop-remove">Remove after Drop</label>
-                                            </div> */}
 										</CardBody>
 									</Card>
-									{/* END card */}
 								</div>
-								{/* <div className="col-lg-12 col-md-6 col-12"> */}
-								{/* START card */}
-								{/* <Card className="card-default">
-										<CardHeader>
-											<CardTitle tag="h4">Tambah Kegiatan</CardTitle>
-										</CardHeader>
-										<CardBody>
-											<div className="input-group mb-2">
-												<input className="form-control" type="text" placeholder="Event name..." onChange={this.handleInputName} />
-												<div className="input-group-btn">
-													<button className="btn btn-secondary" onClick={this.addNewExternalEvent} type="button">
-														Add
-													</button>
-												</div>
-											</div> */}
-								{/* <p className="text-muted">
-												<small>Choose a Color</small>
-											</p>
-											<ul className="list-inline" id="external-event-color-selector">
-												{this.evColors.map((evc) => (
-													<li className="list-inline-item p-0" key={evc}>
-														<div className="circle circle-xl" onClick={this.selectColor(evc)}></div>
-													</li>
-												))}
-											</ul> */}
-								{/* </CardBody>
-									</Card> */}
-								{/* END card */}
-								{/* </div> */}
 							</div>
 							<div className="mb-3">
 								{selectedEvent && (

package-lock.json

@@ -1769,6 +1769,19 @@
         }
       }
     },
+    "@popperjs/core": {
+      "version": "2.11.2",
+      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.2.tgz",
+      "integrity": "sha512-92FRmppjjqz29VMJ2dn+xdyXZBrMlE42AV6Kq6BwjWV7CNUW1hs2FtxSNLQE+gJhaZ6AAmYuO9y8dshhcBl7vA=="
+    },
+    "@react-aria/ssr": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@react-aria/ssr/-/ssr-3.1.0.tgz",
+      "integrity": "sha512-RxqQKmE8sO7TGdrcSlHTcVzMP450hqowtBSd2bBS9oPlcokVkaGq28c3Rwa8ty5ctw4EBCjXqjP7xdcKMGDzug==",
+      "requires": {
+        "@babel/runtime": "^7.6.2"
+      }
+    },
     "@react-google-maps/api": {
       "version": "1.13.0",
       "resolved": "https://registry.npmjs.org/@react-google-maps/api/-/api-1.13.0.tgz",
@@ -1790,11 +1803,79 @@
       "resolved": "https://registry.npmjs.org/@react-google-maps/marker-clusterer/-/marker-clusterer-1.12.1.tgz",
       "integrity": "sha512-JBSO5VJuouP/boBnSdRDCWq0UKO7jr3HvZVhis3ew+VGJ/BoCPu3lpU0HDsjjulfng+xwqLfVOIzP3QnvBPdCA=="
     },
+    "@restart/hooks": {
+      "version": "0.4.5",
+      "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.4.5.tgz",
+      "integrity": "sha512-tLGtY0aHeIfT7aPwUkvQuhIy3+q3w4iqmUzFLPlOAf/vNUacLaBt1j/S//jv/dQhenRh8jvswyMojCwmLvJw8A==",
+      "requires": {
+        "dequal": "^2.0.2"
+      }
+    },
+    "@restart/ui": {
+      "version": "0.2.6",
+      "resolved": "https://registry.npmjs.org/@restart/ui/-/ui-0.2.6.tgz",
+      "integrity": "sha512-lcutEWPvsxz0uEyRxuysCbHBfXDFnMKNMNTsnuPmLFjZXgW9fVmhksS6rpFklXHMwxOM9g6hRTBq0gS3QRKgzQ==",
+      "requires": {
+        "@babel/runtime": "^7.13.16",
+        "@popperjs/core": "^2.10.1",
+        "@react-aria/ssr": "^3.0.1",
+        "@restart/hooks": "^0.4.0",
+        "@types/warning": "^3.0.0",
+        "dequal": "^2.0.2",
+        "dom-helpers": "^5.2.0",
+        "prop-types": "^15.7.2",
+        "uncontrollable": "^7.2.1",
+        "warning": "^4.0.3"
+      },
+      "dependencies": {
+        "@babel/runtime": {
+          "version": "7.16.7",
+          "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.7.tgz",
+          "integrity": "sha512-9E9FJowqAsytyOY6LG+1KuueckRL+aQW+mKvXRXnuFGyRAyepJPmEo9vgMfXUA6O9u3IeEdv9MAkppFcaQwogQ==",
+          "requires": {
+            "regenerator-runtime": "^0.13.4"
+          }
+        },
+        "csstype": {
+          "version": "3.0.10",
+          "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz",
+          "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA=="
+        },
+        "dom-helpers": {
+          "version": "5.2.1",
+          "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
+          "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==",
+          "requires": {
+            "@babel/runtime": "^7.8.7",
+            "csstype": "^3.0.2"
+          }
+        },
+        "regenerator-runtime": {
+          "version": "0.13.9",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
+          "integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
+        }
+      }
+    },
     "@types/cookie": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.4.1.tgz",
       "integrity": "sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q=="
     },
+    "@types/hoist-non-react-statics": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
+      "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
+      "requires": {
+        "@types/react": "*",
+        "hoist-non-react-statics": "^3.3.0"
+      }
+    },
+    "@types/invariant": {
+      "version": "2.2.35",
+      "resolved": "https://registry.npmjs.org/@types/invariant/-/invariant-2.2.35.tgz",
+      "integrity": "sha512-DxX1V9P8zdJPYQat1gHyY0xj3efl8gnMVjiM9iCY6y27lj+PoQWkgjt8jDqmovPqULkKVpKRg8J36iQiA+EtEg=="
+    },
     "@types/json-schema": {
       "version": "7.0.7",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.7.tgz",
@@ -1805,11 +1886,35 @@
       "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.0.tgz",
       "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA=="
     },
+    "@types/prop-types": {
+      "version": "15.7.4",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz",
+      "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ=="
+    },
     "@types/react": {
       "version": "15.7.0",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-15.7.0.tgz",
       "integrity": "sha512-fROvMBKisHbCUGMRXqAVAhZeehNQkeLYRZW/PhYI+Ahd+HdC1DWNWktiFYUy44Iys7qvBo7O8J5UNneWEVxAQw=="
     },
+    "@types/react-redux": {
+      "version": "7.1.22",
+      "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.22.tgz",
+      "integrity": "sha512-GxIA1kM7ClU73I6wg9IRTVwSO9GS+SAKZKe0Enj+82HMU6aoESFU2HNAdNi3+J53IaOHPiUfT3kSG4L828joDQ==",
+      "requires": {
+        "@types/hoist-non-react-statics": "^3.3.0",
+        "@types/react": "*",
+        "hoist-non-react-statics": "^3.3.0",
+        "redux": "^4.0.0"
+      }
+    },
+    "@types/react-transition-group": {
+      "version": "4.4.4",
+      "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.4.tgz",
+      "integrity": "sha512-7gAPz7anVK5xzbeQW9wFBDg7G++aPLAFY0QaSMOou9rJZpbuI58WAuJrgu+qR92l61grlnCUe7AFX8KGahAgug==",
+      "requires": {
+        "@types/react": "*"
+      }
+    },
     "@types/reactstrap": {
       "version": "8.7.2",
       "resolved": "https://registry.npmjs.org/@types/reactstrap/-/reactstrap-8.7.2.tgz",
@@ -1819,6 +1924,16 @@
         "reactstrap": "*"
       }
     },
+    "@types/scheduler": {
+      "version": "0.16.2",
+      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
+      "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
+    },
+    "@types/warning": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.0.tgz",
+      "integrity": "sha1-DSUBJorY+ZYrdA04fEZU9fjiPlI="
+    },
     "@webassemblyjs/ast": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.9.0.tgz",
@@ -2656,6 +2771,14 @@
       "integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==",
       "dev": true
     },
+    "axios": {
+      "version": "0.25.0",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.25.0.tgz",
+      "integrity": "sha512-cD8FOb0tRH3uuEe6+evtAbgJtfxr7ly3fQjYcMcuPlgkwVS9xboaVIpcDV+cYQe+yGykgwZCs1pzjntcGa6l5g==",
+      "requires": {
+        "follow-redirects": "^1.14.7"
+      }
+    },
     "babel-code-frame": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
@@ -5065,6 +5188,11 @@
         "readable-stream": "^2.3.6"
       }
     },
+    "follow-redirects": {
+      "version": "1.14.7",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz",
+      "integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ=="
+    },
     "fontkit": {
       "version": "1.8.1",
       "resolved": "https://registry.npmjs.org/fontkit/-/fontkit-1.8.1.tgz",
@@ -8091,6 +8219,15 @@
         "react-is": "^16.8.1"
       }
     },
+    "prop-types-extra": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/prop-types-extra/-/prop-types-extra-1.1.1.tgz",
+      "integrity": "sha512-59+AHNnHYCdiC+vMwY52WmvP5dM3QLeoumYuEyceQDi9aEhtwN9zIQ2ZNo25sMyXnbh32h+P1ezDsUpUH3JAew==",
+      "requires": {
+        "react-is": "^16.3.2",
+        "warning": "^4.0.0"
+      }
+    },
     "proxy-addr": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.6.tgz",
@@ -8342,6 +8479,84 @@
         "object-assign": "^4.1.1"
       }
     },
+    "react-bootstrap": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-2.1.1.tgz",
+      "integrity": "sha512-Igagk6LziNW/HgBlMVx+QiwPVt/oqrZ7tiBKgv31VYc/56kJEU0Y+BCJS6hrQP6QmmIpdVtX8TRaanv9xsmW5A==",
+      "requires": {
+        "@babel/runtime": "^7.14.0",
+        "@restart/hooks": "^0.4.5",
+        "@restart/ui": "^0.2.5",
+        "@types/invariant": "^2.2.33",
+        "@types/prop-types": "^15.7.3",
+        "@types/react": ">=16.14.8",
+        "@types/react-transition-group": "^4.4.1",
+        "@types/warning": "^3.0.0",
+        "classnames": "^2.3.1",
+        "dom-helpers": "^5.2.1",
+        "invariant": "^2.2.4",
+        "prop-types": "^15.7.2",
+        "prop-types-extra": "^1.1.0",
+        "react-transition-group": "^4.4.1",
+        "uncontrollable": "^7.2.1",
+        "warning": "^4.0.3"
+      },
+      "dependencies": {
+        "@babel/runtime": {
+          "version": "7.16.7",
+          "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.7.tgz",
+          "integrity": "sha512-9E9FJowqAsytyOY6LG+1KuueckRL+aQW+mKvXRXnuFGyRAyepJPmEo9vgMfXUA6O9u3IeEdv9MAkppFcaQwogQ==",
+          "requires": {
+            "regenerator-runtime": "^0.13.4"
+          }
+        },
+        "@types/react": {
+          "version": "17.0.38",
+          "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.38.tgz",
+          "integrity": "sha512-SI92X1IA+FMnP3qM5m4QReluXzhcmovhZnLNm3pyeQlooi02qI7sLiepEYqT678uNiyc25XfCqxREFpy3W7YhQ==",
+          "requires": {
+            "@types/prop-types": "*",
+            "@types/scheduler": "*",
+            "csstype": "^3.0.2"
+          }
+        },
+        "classnames": {
+          "version": "2.3.1",
+          "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.1.tgz",
+          "integrity": "sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA=="
+        },
+        "csstype": {
+          "version": "3.0.10",
+          "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz",
+          "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA=="
+        },
+        "dom-helpers": {
+          "version": "5.2.1",
+          "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
+          "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==",
+          "requires": {
+            "@babel/runtime": "^7.8.7",
+            "csstype": "^3.0.2"
+          }
+        },
+        "react-transition-group": {
+          "version": "4.4.2",
+          "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.2.tgz",
+          "integrity": "sha512-/RNYfRAMlZwDSr6z4zNKV6xu53/e2BuaBbGhbyYIXTrmgu/bGHzmqOs7mJSJBHy9Ud+ApHx3QjrkKSp1pxvlFg==",
+          "requires": {
+            "@babel/runtime": "^7.5.5",
+            "dom-helpers": "^5.0.1",
+            "loose-envify": "^1.4.0",
+            "prop-types": "^15.6.2"
+          }
+        },
+        "regenerator-runtime": {
+          "version": "0.13.9",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
+          "integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
+        }
+      }
+    },
     "react-chartist": {
       "version": "0.14.4",
       "resolved": "https://registry.npmjs.org/react-chartist/-/react-chartist-0.14.4.tgz",
@@ -8526,16 +8741,36 @@
       }
     },
     "react-redux": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-6.0.1.tgz",
-      "integrity": "sha512-T52I52Kxhbqy/6TEfBv85rQSDz6+Y28V/pf52vDWs1YRXG19mcFOGfHnY2HsNFHyhP+ST34Aih98fvt6tqwVcQ==",
+      "version": "7.2.6",
+      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.6.tgz",
+      "integrity": "sha512-10RPdsz0UUrRL1NZE0ejTkucnclYSgXp5q+tB5SWx2qeG2ZJQJyymgAhwKy73yiL/13btfB6fPr+rgbMAaZIAQ==",
       "requires": {
-        "@babel/runtime": "^7.3.1",
-        "hoist-non-react-statics": "^3.3.0",
-        "invariant": "^2.2.4",
+        "@babel/runtime": "^7.15.4",
+        "@types/react-redux": "^7.1.20",
+        "hoist-non-react-statics": "^3.3.2",
         "loose-envify": "^1.4.0",
         "prop-types": "^15.7.2",
-        "react-is": "^16.8.2"
+        "react-is": "^17.0.2"
+      },
+      "dependencies": {
+        "@babel/runtime": {
+          "version": "7.16.7",
+          "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.16.7.tgz",
+          "integrity": "sha512-9E9FJowqAsytyOY6LG+1KuueckRL+aQW+mKvXRXnuFGyRAyepJPmEo9vgMfXUA6O9u3IeEdv9MAkppFcaQwogQ==",
+          "requires": {
+            "regenerator-runtime": "^0.13.4"
+          }
+        },
+        "react-is": {
+          "version": "17.0.2",
+          "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
+          "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
+        },
+        "regenerator-runtime": {
+          "version": "0.13.9",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
+          "integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
+        }
       }
     },
     "react-refresh": {
@@ -8803,6 +9038,11 @@
       "resolved": "https://registry.npmjs.org/redux-devtools-extension/-/redux-devtools-extension-2.13.9.tgz",
       "integrity": "sha512-cNJ8Q/EtjhQaZ71c8I9+BPySIBVEKssbPpskBfsXqb8HJ002A3KRVHfeRzwRo6mGPqsm7XuHTqNSNeS1Khig0A=="
     },
+    "redux-thunk": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.4.1.tgz",
+      "integrity": "sha512-OOYGNY5Jy2TWvTL1KgAlVy6dcx3siPJ1wTq741EPyUKfn6W6nChdICjZwCd0p8AZBs5kWpZlbkXW2nE/zjUa+Q=="
+    },
     "regenerate": {
       "version": "1.4.2",
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",
@@ -10379,6 +10619,34 @@
         "which-boxed-primitive": "^1.0.2"
       }
     },
+    "uncontrollable": {
+      "version": "7.2.1",
+      "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-7.2.1.tgz",
+      "integrity": "sha512-svtcfoTADIB0nT9nltgjujTi7BzVmwjZClOmskKu/E8FW9BXzg9os8OLr4f8Dlnk0rYWJIWr4wv9eKUXiQvQwQ==",
+      "requires": {
+        "@babel/runtime": "^7.6.3",
+        "@types/react": ">=16.9.11",
+        "invariant": "^2.2.4",
+        "react-lifecycles-compat": "^3.0.4"
+      },
+      "dependencies": {
+        "@types/react": {
+          "version": "17.0.38",
+          "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.38.tgz",
+          "integrity": "sha512-SI92X1IA+FMnP3qM5m4QReluXzhcmovhZnLNm3pyeQlooi02qI7sLiepEYqT678uNiyc25XfCqxREFpy3W7YhQ==",
+          "requires": {
+            "@types/prop-types": "*",
+            "@types/scheduler": "*",
+            "csstype": "^3.0.2"
+          }
+        },
+        "csstype": {
+          "version": "3.0.10",
+          "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz",
+          "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA=="
+        }
+      }
+    },
     "unicode-canonical-property-names-ecmascript": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz",

package.json

@@ -1,112 +1,116 @@
 {
-    "name": "angle",
-    "version": "0.0.0",
-    "description": "Angle - Bootstrap Admin Template",
-    "author": "@themicon_co",
-    "license": "https://wrapbootstrap.com/help/licenses",
-    "private": true,
-    "scripts": {
-        "dev": "(if exist .next rd /s /q .next 2>nul) && next",
-        "dev-server": "node server.js",
-        "build": "next build",
-        "start": "next start",
-        "preview": "npm run build && npm run start",
-        "now-build": "next build"
-    },
-    "dependencies": {
-        "@babel/polyfill": "7.2.5",
-        "@fortawesome/fontawesome-free": "5.15.3",
-        "@fullcalendar/bootstrap": "4.4.2",
-        "@fullcalendar/core": "^4.4.2",
-        "@fullcalendar/daygrid": "^4.4.2",
-        "@fullcalendar/interaction": "4.4.2",
-        "@fullcalendar/list": "4.4.2",
-        "@fullcalendar/react": "^4.4.2",
-        "@fullcalendar/timegrid": "^4.4.2",
-        "@react-google-maps/api": "1.13.0",
-        "animate.css": "3.7.2",
-        "bootstrap": "4.6.0",
-        "canvas": "^2.7.0",
-        "chart.js": "2.9.4",
-        "chartist": "0.11.4",
-        "core-js": "2.5.7",
-        "cropper": "4.1.0",
-        "d3": "3.5.17",
-        "datatables.net": "1.10.24",
-        "datatables.net-bs": "1.10.24",
-        "datatables.net-bs4": "1.10.24",
-        "datatables.net-buttons": "1.7.0",
-        "datatables.net-buttons-bs": "1.7.0",
-        "datatables.net-keytable": "2.6.1",
-        "datatables.net-keytable-bs": "2.6.1",
-        "datatables.net-responsive": "2.2.7",
-        "datatables.net-responsive-bs": "2.2.7",
-        "deep-equal": "1.1.1",
-        "draft-js": "0.11.7",
-        "easy-pie-chart": "2.1.7",
-        "express": "4.17.1",
-        "flot": "themicon/flot",
-        "get-size": "2.0.3",
-        "history": "4.10.1",
-        "html5sortable": "0.11.1",
-        "ika.jvectormap": "themicon/ika.jvectormap",
-        "jqcloud2": "2.0.3",
-        "jquery": "3.6.0",
-        "jquery-knob": "1.2.11",
-        "jquery-sparkline": "2.4.0",
-        "jquery.easing": "1.4.1",
-        "jquery.flot.spline": "themicon/jquery.flot.spline",
-        "jquery.flot.tooltip": "krzysu/flot.tooltip",
-        "jszip": "3.6.0",
-        "loaders.css": "0.1.2",
-        "matchmedia": "0.1.2",
-        "moment": "^2.29.1",
-        "morris.js.so": "0.5.1",
-        "nestable": "themicon/nestable",
-        "next": "9.5.5",
-        "next-iron-session": "^4.2.0",
-        "pdfmake": "0.1.70",
-        "raf": "3.4.1",
-        "raphael": "2.3.0",
-        "rc-slider": "8.7.1",
-        "react": "17.0.1",
-        "react-chartist": "0.14.4",
-        "react-chartjs-2": "2.11.1",
-        "react-color": "2.19.3",
-        "react-data-grid": "6.1.0",
-        "react-datetime": "2.16.3",
-        "react-dnd": "6.0.0",
-        "react-dnd-html5-backend": "6.0.0",
-        "react-dom": "17.0.1",
-        "react-draft-wysiwyg": "1.14.5",
-        "react-dropzone": "10.2.2",
-        "react-flot": "1.3.0",
-        "react-maskedinput": "4.0.1",
-        "react-perfect-scrollbar": "1.5.8",
-        "react-redux": "6.0.1",
-        "react-select": "^3.0.4",
-        "react-toastify": "4.5.2",
-        "react-transition-group": "4.2.2",
-        "reactstrap": "^8.0.1",
-        "redux-devtools-extension": "^2.13.9",
-        "rtlcss": "2.6.2",
-        "screenfull": "3.3.3",
-        "simple-line-icons": "2.5.5",
-        "spinkit": "1.2.5",
-        "sweetalert": "2.1.2",
-        "swr": "^1.0.1",
-        "validator": "10.11.0",
-        "weather-icons": "erikflowers/weather-icons",
-        "whirl": "themicon/whirl"
-    },
-    "devDependencies": {
-        "@types/reactstrap": "^8.7.2",
-        "@zeit/next-css": "1.0.1",
-        "@zeit/next-sass": "1.0.1",
-        "cross-env": "5.2.1",
-        "file-loader": "3.0.1",
-        "imports-loader": "0.8.0",
-        "node-sass": "4.14.1",
-        "url-loader": "1.1.2"
-    }
+	"name": "angle",
+	"version": "0.0.0",
+	"description": "Angle - Bootstrap Admin Template",
+	"author": "@themicon_co",
+	"license": "https://wrapbootstrap.com/help/licenses",
+	"proxy": "http:localhost:5000",
+	"private": true,
+	"scripts": {
+		"dev": "(if exist .next rd /s /q .next 2>nul) && next",
+		"dev-server": "node server.js",
+		"build": "next build",
+		"start": "next start",
+		"preview": "npm run build && npm run start",
+		"now-build": "next build"
+	},
+	"dependencies": {
+		"@babel/polyfill": "7.2.5",
+		"@fortawesome/fontawesome-free": "5.15.3",
+		"@fullcalendar/bootstrap": "4.4.2",
+		"@fullcalendar/core": "^4.4.2",
+		"@fullcalendar/daygrid": "^4.4.2",
+		"@fullcalendar/interaction": "4.4.2",
+		"@fullcalendar/list": "4.4.2",
+		"@fullcalendar/react": "^4.4.2",
+		"@fullcalendar/timegrid": "^4.4.2",
+		"@react-google-maps/api": "1.13.0",
+		"animate.css": "3.7.2",
+		"axios": "^0.25.0",
+		"bootstrap": "4.6.0",
+		"canvas": "^2.7.0",
+		"chart.js": "2.9.4",
+		"chartist": "0.11.4",
+		"core-js": "2.5.7",
+		"cropper": "4.1.0",
+		"d3": "3.5.17",
+		"datatables.net": "1.10.24",
+		"datatables.net-bs": "1.10.24",
+		"datatables.net-bs4": "1.10.24",
+		"datatables.net-buttons": "1.7.0",
+		"datatables.net-buttons-bs": "1.7.0",
+		"datatables.net-keytable": "2.6.1",
+		"datatables.net-keytable-bs": "2.6.1",
+		"datatables.net-responsive": "2.2.7",
+		"datatables.net-responsive-bs": "2.2.7",
+		"deep-equal": "1.1.1",
+		"draft-js": "0.11.7",
+		"easy-pie-chart": "2.1.7",
+		"express": "4.17.1",
+		"flot": "themicon/flot",
+		"get-size": "2.0.3",
+		"history": "4.10.1",
+		"html5sortable": "0.11.1",
+		"ika.jvectormap": "themicon/ika.jvectormap",
+		"jqcloud2": "2.0.3",
+		"jquery": "3.6.0",
+		"jquery-knob": "1.2.11",
+		"jquery-sparkline": "2.4.0",
+		"jquery.easing": "1.4.1",
+		"jquery.flot.spline": "themicon/jquery.flot.spline",
+		"jquery.flot.tooltip": "krzysu/flot.tooltip",
+		"jszip": "3.6.0",
+		"loaders.css": "0.1.2",
+		"matchmedia": "0.1.2",
+		"moment": "^2.29.1",
+		"morris.js.so": "0.5.1",
+		"nestable": "themicon/nestable",
+		"next": "9.5.5",
+		"next-iron-session": "^4.2.0",
+		"pdfmake": "0.1.70",
+		"raf": "3.4.1",
+		"raphael": "2.3.0",
+		"rc-slider": "8.7.1",
+		"react": "17.0.1",
+		"react-bootstrap": "^2.1.1",
+		"react-chartist": "0.14.4",
+		"react-chartjs-2": "2.11.1",
+		"react-color": "2.19.3",
+		"react-data-grid": "6.1.0",
+		"react-datetime": "2.16.3",
+		"react-dnd": "6.0.0",
+		"react-dnd-html5-backend": "6.0.0",
+		"react-dom": "17.0.1",
+		"react-draft-wysiwyg": "1.14.5",
+		"react-dropzone": "10.2.2",
+		"react-flot": "1.3.0",
+		"react-maskedinput": "4.0.1",
+		"react-perfect-scrollbar": "1.5.8",
+		"react-redux": "^7.2.6",
+		"react-select": "^3.0.4",
+		"react-toastify": "4.5.2",
+		"react-transition-group": "4.2.2",
+		"reactstrap": "^8.0.1",
+		"redux-devtools-extension": "^2.13.9",
+		"redux-thunk": "^2.4.1",
+		"rtlcss": "2.6.2",
+		"screenfull": "3.3.3",
+		"simple-line-icons": "2.5.5",
+		"spinkit": "1.2.5",
+		"sweetalert": "2.1.2",
+		"swr": "^1.0.1",
+		"validator": "10.11.0",
+		"weather-icons": "erikflowers/weather-icons",
+		"whirl": "themicon/whirl"
+	},
+	"devDependencies": {
+		"@types/reactstrap": "^8.7.2",
+		"@zeit/next-css": "1.0.1",
+		"@zeit/next-sass": "1.0.1",
+		"cross-env": "5.2.1",
+		"file-loader": "3.0.1",
+		"imports-loader": "0.8.0",
+		"node-sass": "4.14.1",
+		"url-loader": "1.1.2"
+	}
 }

pages/app/pelaporan.js

@@ -1,57 +1,24 @@
 import React, { Component } from "react";
 import Router from "next/router";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
-import { Row, Col, Progress, Button } from "reactstrap";
+import { Row, Col, Progress } from "reactstrap";
+import { getPelaporan } from "../../actions/pelaporan";
 
 import Sparkline from "@/components/Common/Sparklines";
-import Scrollable from "@/components/Common/Scrollable";
 import Datatable from "@/components/Tables/Datatable";
 import moment from "moment";
 
-class BugTracker extends Component {
+class Pelaporan extends Component {
 	constructor(props) {
 		super(props);
 	}
 
 	static getInitialProps = async () => {
-		const res = await fetch("http://localhost:1880/pelaporan");
-		const data = await res.json();
-		return { data };
+		const pelaporan = await getPelaporan();
+		return { pelaporan };
 	};
 
-	renderTable = () => {
-		return this.props.data.map((value) => {
-			return (
-				<tr>
-					<td>BI:{value._number}</td>
-					<td className="text-nowrap">
-						<div className="media align-items-center">
-							<a className="mr-3" href="">
-								<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
-							</a>
-							<div className="media-body d-flex">
-								<div>
-									<h4 className="m-0">Universitas Satyagama</h4>
-									<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
-									<p>Jalan Kamal Raya No 2-A Cengkareng</p>
-									<p> </p>
-								</div>
-							</div>
-						</div>
-					</td>
-					<td>{moment(value.created_at).fromNow()}</td>
-					<td>
-						<div className="inline wd-xxs badge badge-success">open</div>
-					</td>
-				</tr>
-			);
-		});
-	};
-
-	newReportClick = (e, PT_ID) => {
-		//router = useRouter();
-		//const query = { ptId: PT_ID };
-		//    '/app/profile'
+	newReportClick = (e) => {
 		e.preventDefault();
 		Router.push({
 			pathname: "/app/pelaporan.search",
@@ -59,14 +26,13 @@ class BugTracker extends Component {
 	};
 
 	render() {
-		// console.log(this.props.data);
-		// this.fetchData();
+		const { pelaporan } = this.props;
+		console.log(pelaporan);
 		return (
 			<ContentWrapper>
 				<div className="content-heading">Pelaporan</div>
 				<Row>
 					<Col lg="4">
-						{/* Aside card */}
 						<div className="card b">
 							<div className="card-body bb">
 								<p>Overvall progress</p>
@@ -108,44 +74,10 @@ class BugTracker extends Component {
 										/>
 										<p className="mt-3">Close Case</p>
 									</div>
-									{/* <div className="col-3 col-lg-6 col-xl-3">
-                                     <Sparkline values={[20,80]}
-
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#ff902b"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Hours</p>
-                                    </div>
-                                    <div className="col-3 col-lg-6 col-xl-3">
-                                     <Sparkline values={[30,70]}
-
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#f05050"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Assigned</p>
-                                    </div> */}
 								</div>
 							</div>
 							<table className="table bb">
 								<tbody>
-									{/* <tr>
-                                        <td>
-                                            <strong>Assigned Hours</strong>
-                                        </td>
-                                        <td>68 hs</td>
-                                    </tr>
-                                    <tr>
-                                        <td>
-                                            <strong>Time Consumed</strong>
-                                        </td>
-                                        <td>32 hs</td>
-                                    </tr> */}
 									<tr>
 										<td>
 											<strong>Open Case</strong>
@@ -166,50 +98,6 @@ class BugTracker extends Component {
 											<em className="far fa-smile fa-lg text-warning"></em>
 										</td>
 									</tr>
-									{/* <tr>
-                                        <td>
-                                            <strong>Commits</strong>
-                                        </td>
-                                        <td>140</td>
-                                    </tr> */}
-									{/* <tr>
-                                        <td>
-                                            <strong>Last Case Closed</strong>
-                                        </td>
-                                        <td>
-                                            <Scrollable height="120px" className="list-group">
-                                                <table className="table table-bordered bg-transparent">
-                                                    <tbody>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:54678</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:55778</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:56878</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:57978</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:1107</a>
-                                                            </td>
-                                                        </tr>
-                                                    </tbody>
-                                                </table>
-                                            </Scrollable>
-                                        </td>
-                                    </tr> */}
 									<tr>
 										<td>
 											<strong>Last Case Closed</strong>
@@ -219,7 +107,6 @@ class BugTracker extends Component {
 								</tbody>
 							</table>
 						</div>
-						{/* end Aside card */}
 					</Col>
 					<Col lg="8">
 						<div className="mb-3 d-flex">
@@ -235,705 +122,39 @@ class BugTracker extends Component {
 									<table className="table w-100">
 										<thead>
 											<tr>
-												{/* <th>Type</th> */}
 												<th>#ID</th>
 												<th>Description</th>
 												<th>Created</th>
-												{/* <th>Priority</th>
-                                                <th>Asigned</th> */}
 												<th>Status</th>
-												{/* <th>Action</th> */}
 											</tr>
 										</thead>
 										<tbody>
-											{this.renderTable()}
-											{/* <tr> */}
-											{/* <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td> */}
-											{/* <td>BI:54678</td>
-												<td className="text-nowrap">
-													<div className="media align-items-center">
-														<a className="mr-3" href="">
-															<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
-														</a>
-														<div className="media-body d-flex">
-															<div>
-																<h4 className="m-0">Universitas Satyagama</h4>
-																<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
-																<p>Jalan Kamal Raya No 2-A Cengkareng</p>
-																<p> </p>
-															</div> */}
-											{/* <div className="ml-auto">
-                                                                <Button color="info" size="sm" onClick={(e) => this.handleClick(e, pt.id)}>Proses Sangsi</Button>
-                                                            </div> */}
-											{/* </div>
-													</div> */}
-
-											{/* <small>Maecenas mollis egestas convallis.</small> */}
-											{/* </td>
-												<td>{moment("2020-04-04 11:45:26.123").fromNow()}</td> */}
-											{/* <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td> */}
-											{/* <td>
-                                                    <a href="">Sylvia Daniels</a>
-                                                </td> */}
-											{/* <td>
-													<div className="inline wd-xxs badge badge-success">open</div>
-												</td> */}
-											{/* <td>
-                                                    <div className="ml-auto">
-                                                        <button class="btn-oval btn btn-primary" size="sm" onClick={(e) => this.newProcessClick(e)}>Proses Sanksi</button>
-                                                    </div>
-                                                </td> */}
-											{/* </tr> */}
-											{/* <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:55778</td>
-                                                <td className="text-nowrap">
-                                                    <small>Aliquam felis nibh, ultrices non elementum</small>
-                                                </td>
-                                                <td>01/05/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg" data-title="low"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Sherry Carroll</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:56878</td>
-                                                <td className="text-nowrap">
-                                                    <small>Aliquam condimentum enim a risus cursus blandit.</small>
-                                                </td>
-                                                <td>05/01/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Mitchell Jones</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:57978</td>
-                                                <td className="text-nowrap">
-                                                    <small>Sed at libero augue, in euismod tellus.</small>
-                                                </td>
-                                                <td>01/11/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Tracey Parker</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:1107</td>
-                                                <td className="text-nowrap">
-                                                    <small>Praesent lacinia ultricies neque.</small>
-                                                </td>
-                                                <td>01/01/2015</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-danger" data-title="high"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Warren Gray</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:1117</td>
-                                                <td className="text-nowrap">
-                                                    <small>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</small>
-                                                </td>
-                                                <td>11/05/2013</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Jackson Ramos</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:10127</td>
-                                                <td className="text-nowrap">
-                                                    <small>Pellentesque habitant morbi tristique</small>
-                                                </td>
-                                                <td>05/02/2014</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Ernest Berry</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:54678</td>
-                                                <td className="text-nowrap">
-                                                    <small>Integer venenatis ultrices vulputate.</small>
-                                                </td>
-                                                <td>01/01/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Sylvia Daniels</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:55778</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/05/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg" data-title="low"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Sherry Carroll</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:56878</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>05/01/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Mitchell Jones</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:57978</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/11/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Tracey Parker</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:1107</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/01/2015</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-danger" data-title="high"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Warren Gray</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:1117</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>11/05/2013</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Jackson Ramos</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:10127</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>05/02/2014</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Ernest Berry</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:54678</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/01/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Sylvia Daniels</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:55778</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/05/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg" data-title="low"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Sherry Carroll</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:56878</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>05/01/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Mitchell Jones</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:57978</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/11/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Tracey Parker</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:1107</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/01/2015</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-danger" data-title="high"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Warren Gray</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:1117</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>11/05/2013</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Jackson Ramos</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:10127</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>05/02/2014</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Ernest Berry</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:54678</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/01/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Sylvia Daniels</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:55778</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/05/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg" data-title="low"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Sherry Carroll</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:56878</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>05/01/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Mitchell Jones</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:57978</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/11/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Tracey Parker</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:1107</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/01/2015</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-danger" data-title="high"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Warren Gray</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:1117</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>11/05/2013</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Jackson Ramos</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:10127</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>05/02/2014</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Ernest Berry</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:54678</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/01/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Sylvia Daniels</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:55778</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/05/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg" data-title="low"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Sherry Carroll</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:56878</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>05/01/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Mitchell Jones</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:57978</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/11/2016</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Tracey Parker</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-warning">pending</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:1107</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>01/01/2015</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-danger" data-title="high"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Warren Gray</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td>
-                                                <td>BI:1117</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>11/05/2013</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Jackson Ramos</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                            </tr>
-                                            <tr>
-                                                <td>
-                                                    <div className="badge bg-gray-lighter">issue</div>
-                                                </td>
-                                                <td>BI:10127</td>
-                                                <td className="text-nowrap">
-                                                    <small>Maecenas mollis egestas convallis.</small>
-                                                </td>
-                                                <td>05/02/2014</td>
-                                                <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td>
-                                                <td>
-                                                    <a href="">Ernest Berry</a>
-                                                </td>
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-danger">closed</div>
-                                                </td>
-                                            </tr> */}
+											{pelaporan.data.map((value) => {
+												return (
+													<tr key={value._id}>
+														<td>BI:{value._number}</td>
+														<td className="text-nowrap">
+															<div className="media align-items-center">
+																<a className="mr-3" href="">
+																	<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
+																</a>
+																<div className="media-body d-flex">
+																	<div>
+																		<h4 className="m-0">Universitas Satyagama</h4>
+																		<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
+																		<p>Jalan Kamal Raya No 2-A Cengkareng</p>
+																		<p> </p>
+																	</div>
+																</div>
+															</div>
+														</td>
+														<td>{moment(value.createdAt).fromNow()}</td>
+														<td>
+															<div className="inline wd-xxs badge badge-success">open</div>
+														</td>
+													</tr>
+												);
+											})}
 										</tbody>
 									</table>
 								</Datatable>
@@ -946,4 +167,4 @@ class BugTracker extends Component {
 	}
 }
 
-export default BugTracker;
+export default Pelaporan;

pages/app/pelaporan.new.js

@@ -1,5 +1,8 @@
 import React, { Component } from "react";
 import Router from "next/router";
+import { connect } from "react-redux";
+import { listPelaporan, createPelaporan } from "../../store/actions/pelaporan";
+
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import Select from "react-select";
 import {
@@ -445,12 +448,14 @@ const tbljenisPelanggaran = [
 		TMTBulan: 6,
 	},
 ];
+
 const selectJenisPelangaran = tbljenisPelanggaran.map((e) => {
 	return { value: e.idPelanggaran, label: e.Pelanggaran, className: "State-ACT" };
 });
+
 class FormStandard extends Component {
-	constructor() {
-		super();
+	constructor(props) {
+		super(props);
 		this.state = {
 			dropdownOpen: false,
 			splitButtonOpen: false,
@@ -516,7 +521,8 @@ class FormStandard extends Component {
 		});
 	};
 
-	onSubmit = (e) => {
+	onSubmit = async (e) => {
+		e.preventDefault();
 		const formdata = new FormData();
 		formdata.append("number", this.state.pelaporanNumber);
 		formdata.append("pt_id", this.props.query.ptId);
@@ -528,30 +534,16 @@ class FormStandard extends Component {
 			});
 		}
 
-		const inserted = this.insertData(formdata);
-		e.preventDefault();
-		if (inserted) {
+		await this.props.dispatch(createPelaporan(formdata));
+		this.props.dispatch(listPelaporan());
+		if (this.props.pelaporanCreate.success) {
+			this.props.dispatch({ type: "PELAPORAN_CREATE_RESET" });
 			Router.push({
 				pathname: "/app/pelaporan",
 			});
 		}
 	};
 
-	insertData = async (data) => {
-		try {
-			const requestOptions = {
-				method: "POST",
-				body: data,
-			};
-
-			const inserted = await fetch("http://localhost:1880/pelaporan.create", requestOptions);
-			return inserted;
-		} catch (error) {
-			console.log("error", error);
-			return false;
-		}
-	};
-
 	render() {
 		const { selectedOptionMulti, files } = this.state;
 
@@ -675,4 +667,9 @@ class FormStandard extends Component {
 	}
 }
 
-export default FormStandard;
+const mapStateToProps = (state) => ({
+	pelaporanCreate: state.pelaporanCreate,
+});
+// const mapDispatchToProps = (dispatch) => ({ pelaporanCreate: (data) => dispatch(listPelaporan(data)) });
+
+export default connect(mapStateToProps)(FormStandard);

pages/app/pemeriksaan.js

@@ -2,6 +2,7 @@ import React, { Component } from "react";
 import Router from "next/router";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col, Progress, Button } from "reactstrap";
+import { getPelaporan } from "../../actions/pelaporan";
 
 import Sparkline from "@/components/Common/Sparklines";
 import Scrollable from "@/components/Common/Scrollable";
@@ -14,50 +15,11 @@ class BugTracker extends Component {
 	}
 
 	static getInitialProps = async () => {
-		const res = await fetch("http://localhost:1880/pelaporan");
-		let data = await res.json();
-		data = data.filter((e) => e.penjadwalan);
-		return { data };
-	};
-
-	renderTable = () => {
-		console.log(this.props.data);
-		return this.props.data.map((value) => {
-			return (
-				<tr>
-					<td>BI:{value._number}</td>
-					<td className="text-nowrap">
-						<div className="media align-items-center">
-							<a className="mr-3" href="">
-								<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
-							</a>
-							<div className="media-body d-flex">
-								<div>
-									<h4 className="m-0">Universitas Satyagama</h4>
-									<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
-									<p>Jalan Kamal Raya No 2-A Cengkareng</p>
-									<p> </p>
-								</div>
-							</div>
-						</div>
-					</td>
-					<td>{moment(value.created_at).fromNow()}</td>
-					<td>
-						<div className="ml-auto">
-							<button class="btn-oval btn btn-primary" size="sm" onClick={(e) => this.newProcessClick(e, value.pt_id, value._number)}>
-								Update Data
-							</button>
-						</div>
-					</td>
-				</tr>
-			);
-		});
+		const pelaporan = await getPelaporan({ penjadwalan: true });
+		return { pelaporan };
 	};
 
 	newProcessClick = (e, PT_ID, number) => {
-		//router = useRouter();
-		//const query = { ptId: PT_ID };
-		//    '/app/profile'
 		e.preventDefault();
 		Router.push({
 			pathname: "/app/pemeriksaan.new",
@@ -66,12 +28,12 @@ class BugTracker extends Component {
 	};
 
 	render() {
+		const { pelaporan } = this.props;
 		return (
 			<ContentWrapper>
 				<div className="content-heading">Evaluasi</div>
 				<Row>
 					<Col lg="4">
-						{/* Aside card */}
 						<div className="card b">
 							<div className="card-body bb">
 								<p>Overvall progress</p>
@@ -113,44 +75,10 @@ class BugTracker extends Component {
 										/>
 										<p className="mt-3">Close Case</p>
 									</div>
-									{/* <div className="col-3 col-lg-6 col-xl-3">
-                                     <Sparkline values={[20,80]}
-
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#ff902b"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Hours</p>
-                                    </div>
-                                    <div className="col-3 col-lg-6 col-xl-3">
-                                     <Sparkline values={[30,70]}
-
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#f05050"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Assigned</p>
-                                    </div> */}
 								</div>
 							</div>
 							<table className="table bb">
 								<tbody>
-									{/* <tr>
-                                        <td>
-                                            <strong>Assigned Hours</strong>
-                                        </td>
-                                        <td>68 hs</td>
-                                    </tr>
-                                    <tr>
-                                        <td>
-                                            <strong>Time Consumed</strong>
-                                        </td>
-                                        <td>32 hs</td>
-                                    </tr> */}
 									<tr>
 										<td>
 											<strong>Open Case</strong>
@@ -171,50 +99,6 @@ class BugTracker extends Component {
 											<em className="far fa-smile fa-lg text-warning"></em>
 										</td>
 									</tr>
-									{/* <tr>
-                                        <td>
-                                            <strong>Commits</strong>
-                                        </td>
-                                        <td>140</td>
-                                    </tr> */}
-									{/* <tr>
-                                        <td>
-                                            <strong>Last Case Closed</strong>
-                                        </td>
-                                        <td>
-                                            <Scrollable height="120px" className="list-group">
-                                                <table className="table table-bordered bg-transparent">
-                                                    <tbody>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:54678</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:55778</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:56878</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:57978</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:1107</a>
-                                                            </td>
-                                                        </tr>
-                                                    </tbody>
-                                                </table>
-                                            </Scrollable>
-                                        </td>
-                                    </tr> */}
 									<tr>
 										<td>
 											<strong>Last Case Closed</strong>
@@ -224,74 +108,51 @@ class BugTracker extends Component {
 								</tbody>
 							</table>
 						</div>
-						{/* end Aside card */}
 					</Col>
 					<Col lg="8">
-						{/* <div className="mb-3 d-flex"> */}
-						{/* <div> */}
-						{/* <button className="btn btn-sm btn-info" type="button" onClick={(e) => this.newReportClick(e)}>Laporan Baru</button> */}
-						{/* <Button color="info" size="sm" onClick={(e) => this.handleClick(e, pt.id)}>View</Button> */}
-						{/* <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fa fa-user-plus"></em>
-                                </button>
-                                <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fas fa-pencil-alt"></em>
-                                </button>
-                                <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fas fa-share"></em>
-                                </button>
-                                <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fa fa-print"></em>
-                                </button> */}
-						{/* </div> */}
-						{/* <div className="ml-auto">
-                                <p className="mb-0 mt-1">19 bugs / 16 issues</p>
-                            </div> */}
-						{/* </div> */}
 						<div className="card b">
 							<div className="card-body">
 								<Datatable options={{ responsive: true }}>
 									<table className="table w-100">
 										<thead>
 											<tr>
-												{/* <th>Type</th> */}
 												<th>#ID</th>
 												<th>Description</th>
 												<th>Created</th>
-												{/* <th>Priority</th>
-                                                <th>Asigned</th> */}
 												<th>Status</th>
-												{/* <th>Action</th> */}
 											</tr>
 										</thead>
 										<tbody>
-											{this.renderTable()}
-											{/* <tr>
-												<td>BI:54678</td>
-												<td className="text-nowrap">
-													<div className="media align-items-center">
-														<a className="mr-3" href="">
-															<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
-														</a>
-														<div className="media-body d-flex">
-															<div>
-																<h4 className="m-0">Universitas Satyagama</h4>
-																<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
-																<p>Jalan Kamal Raya No 2-A Cengkareng</p>
-																<p> </p>
+											{pelaporan.data.map((value) => {
+												return (
+													<tr>
+														<td>BI:{value._number}</td>
+														<td className="text-nowrap">
+															<div className="media align-items-center">
+																<a className="mr-3" href="">
+																	<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
+																</a>
+																<div className="media-body d-flex">
+																	<div>
+																		<h4 className="m-0">Universitas Satyagama</h4>
+																		<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
+																		<p>Jalan Kamal Raya No 2-A Cengkareng</p>
+																		<p> </p>
+																	</div>
+																</div>
+															</div>
+														</td>
+														<td>{moment(value.created_at).fromNow()}</td>
+														<td>
+															<div className="ml-auto">
+																<button class="btn-oval btn btn-primary" size="sm" onClick={(e) => this.newProcessClick(e, value.pt_id, value._number)}>
+																	Update Data
+																</button>
 															</div>
-														</div>
-													</div>
-												</td>
-												<td>{moment("2020-04-04 11:45:26.123").fromNow()}</td>
-												<td>
-													<div className="ml-auto">
-														<button class="btn-oval btn btn-primary" size="sm" onClick={(e) => this.newProcessClick(e)}>
-															Update Data
-														</button>
-													</div>
-												</td>
-											</tr> */}
+														</td>
+													</tr>
+												);
+											})}
 										</tbody>
 									</table>
 								</Datatable>

pages/app/pemeriksaan.new.js

@@ -2,6 +2,7 @@ import React, { Component } from "react";
 import Router from "next/router";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import Datetime from "react-datetime";
+import { insetPemeriksaan } from "../../actions/pemeriksaan";
 import "react-datetime/css/react-datetime.css";
 import {
 	Row,
@@ -42,12 +43,13 @@ class DropzoneWrapper extends Component {
 const styleHeaderText = {
 	color: "brown",
 };
+
 class FormStandard extends Component {
 	state = {
 		dropdownOpen: false,
 		splitButtonOpen: false,
 		keteranganLaporan: "",
-		tanggal: "",
+		tanggal: new Date(),
 		files: [],
 	};
 
@@ -105,10 +107,10 @@ class FormStandard extends Component {
 		});
 	};
 
-	onSubmit = (e) => {
+	onSubmit = async (e) => {
+		e.preventDefault();
+		const { number, ptId } = this.props.query;
 		const formdata = new FormData();
-		formdata.append("number", this.props.query.number);
-		formdata.append("pt_id", this.props.query.ptId);
 		formdata.append("description", this.state.keteranganLaporan);
 		formdata.append("date", this.state.tanggal);
 		if (this.state.files.length > 0) {
@@ -117,8 +119,7 @@ class FormStandard extends Component {
 			});
 		}
 
-		const inserted = this.insertData(formdata);
-		e.preventDefault();
+		const inserted = await insetPemeriksaan({ number, ptId }, formdata);
 		if (inserted) {
 			Router.push({
 				pathname: "/app/pemeriksaan",
@@ -126,21 +127,6 @@ class FormStandard extends Component {
 		}
 	};
 
-	insertData = async (data) => {
-		try {
-			const requestOptions = {
-				method: "POST",
-				body: data,
-			};
-
-			const inserted = await fetch("http://localhost:1880/pemeriksaan.create", requestOptions);
-			return inserted;
-		} catch (error) {
-			console.log("error", error);
-			return false;
-		}
-	};
-
 	render() {
 		const { files } = this.state;
 

pages/app/penjadwalan.js

@@ -2,6 +2,7 @@ import React, { Component } from "react";
 import Router from "next/router";
 import ContentWrapper from "@/components/Layout/ContentWrapper";
 import { Row, Col, Progress, Button } from "reactstrap";
+import { getPelaporan } from "../../actions/pelaporan";
 
 import Sparkline from "@/components/Common/Sparklines";
 import Scrollable from "@/components/Common/Scrollable";
@@ -14,48 +15,11 @@ class BugTracker extends Component {
 	}
 
 	static getInitialProps = async () => {
-		const res = await fetch("http://localhost:1880/pelaporan");
-		const data = await res.json();
-		return { data };
-	};
-
-	renderTable = () => {
-		return this.props.data.map((value) => {
-			return (
-				<tr>
-					<td>BI:{value._number}</td>
-					<td className="text-nowrap">
-						<div className="media align-items-center">
-							<a className="mr-3" href="">
-								<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
-							</a>
-							<div className="media-body d-flex">
-								<div>
-									<h4 className="m-0">Universitas Satyagama</h4>
-									<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
-									<p>Jalan Kamal Raya No 2-A Cengkareng</p>
-									<p> </p>
-								</div>
-							</div>
-						</div>
-					</td>
-					<td>{moment(value.created_at).fromNow()}</td>
-					<td>
-						<div className="ml-auto">
-							<button class="btn-oval btn btn-primary" size="sm" onClick={(e) => this.newProcessClick(e, value.pt_id, value._number)}>
-								Proses
-							</button>
-						</div>
-					</td>
-				</tr>
-			);
-		});
+		const pelaporan = await getPelaporan();
+		return { pelaporan };
 	};
 
 	newProcessClick = (e, PT_ID, number) => {
-		//router = useRouter();
-		//const query = { ptId: PT_ID };
-		//    '/app/profile'
 		e.preventDefault();
 		Router.push({
 			pathname: "/app/penjadwalan.todo",
@@ -69,7 +33,6 @@ class BugTracker extends Component {
 				<div className="content-heading">Pemeriksaan</div>
 				<Row>
 					<Col lg="4">
-						{/* Aside card */}
 						<div className="card b">
 							<div className="card-body bb">
 								<p>Overvall progress</p>
@@ -111,44 +74,10 @@ class BugTracker extends Component {
 										/>
 										<p className="mt-3">Close Case</p>
 									</div>
-									{/* <div className="col-3 col-lg-6 col-xl-3">
-                                     <Sparkline values={[20,80]}
-
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#ff902b"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Hours</p>
-                                    </div>
-                                    <div className="col-3 col-lg-6 col-xl-3">
-                                     <Sparkline values={[30,70]}
-
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#f05050"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Assigned</p>
-                                    </div> */}
 								</div>
 							</div>
 							<table className="table bb">
 								<tbody>
-									{/* <tr>
-                                        <td>
-                                            <strong>Assigned Hours</strong>
-                                        </td>
-                                        <td>68 hs</td>
-                                    </tr>
-                                    <tr>
-                                        <td>
-                                            <strong>Time Consumed</strong>
-                                        </td>
-                                        <td>32 hs</td>
-                                    </tr> */}
 									<tr>
 										<td>
 											<strong>Open Case</strong>
@@ -169,50 +98,6 @@ class BugTracker extends Component {
 											<em className="far fa-smile fa-lg text-warning"></em>
 										</td>
 									</tr>
-									{/* <tr>
-                                        <td>
-                                            <strong>Commits</strong>
-                                        </td>
-                                        <td>140</td>
-                                    </tr> */}
-									{/* <tr>
-                                        <td>
-                                            <strong>Last Case Closed</strong>
-                                        </td>
-                                        <td>
-                                            <Scrollable height="120px" className="list-group">
-                                                <table className="table table-bordered bg-transparent">
-                                                    <tbody>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:54678</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:55778</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:56878</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:57978</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:1107</a>
-                                                            </td>
-                                                        </tr>
-                                                    </tbody>
-                                                </table>
-                                            </Scrollable>
-                                        </td>
-                                    </tr> */}
 									<tr>
 										<td>
 											<strong>Last Case Closed</strong>
@@ -222,74 +107,49 @@ class BugTracker extends Component {
 								</tbody>
 							</table>
 						</div>
-						{/* end Aside card */}
 					</Col>
 					<Col lg="8">
-						{/* <div className="mb-3 d-flex"> */}
-						{/* <div> */}
-						{/* <button className="btn btn-sm btn-info" type="button" onClick={(e) => this.newReportClick(e)}>Laporan Baru</button> */}
-						{/* <Button color="info" size="sm" onClick={(e) => this.handleClick(e, pt.id)}>View</Button> */}
-						{/* <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fa fa-user-plus"></em>
-                                </button>
-                                <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fas fa-pencil-alt"></em>
-                                </button>
-                                <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fas fa-share"></em>
-                                </button>
-                                <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fa fa-print"></em>
-                                </button> */}
-						{/* </div> */}
-						{/* <div className="ml-auto">
-                                <p className="mb-0 mt-1">19 bugs / 16 issues</p>
-                            </div> */}
-						{/* </div> */}
 						<div className="card b">
 							<div className="card-body">
 								<Datatable options={{ responsive: true }}>
 									<table className="table w-100">
 										<thead>
 											<tr>
-												{/* <th>Type</th> */}
 												<th>#ID</th>
 												<th>Description</th>
 												<th>Created</th>
-												{/* <th>Priority</th>
-                                                <th>Asigned</th> */}
 												<th>Status</th>
-												{/* <th>Action</th> */}
 											</tr>
 										</thead>
 										<tbody>
-											{this.renderTable()}
-											{/* <tr>
-												<td>BI:54678</td>
-												<td className="text-nowrap">
-													<div className="media align-items-center">
-														<a className="mr-3" href="">
-															<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
-														</a>
-														<div className="media-body d-flex">
-															<div>
-																<h4 className="m-0">Universitas Satyagama</h4>
-																<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
-																<p>Jalan Kamal Raya No 2-A Cengkareng</p>
-																<p> </p>
+											{this.props.pelaporan.data.map((value) => (
+												<tr>
+													<td>BI:{value._number}</td>
+													<td className="text-nowrap">
+														<div className="media align-items-center">
+															<a className="mr-3" href="">
+																<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
+															</a>
+															<div className="media-body d-flex">
+																<div>
+																	<h4 className="m-0">Universitas Satyagama</h4>
+																	<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
+																	<p>Jalan Kamal Raya No 2-A Cengkareng</p>
+																	<p> </p>
+																</div>
 															</div>
 														</div>
-													</div>
-												</td>
-												<td>{moment("2020-04-04 11:45:26.123").fromNow()}</td>
-												<td>
-													<div className="ml-auto">
-														<button class="btn-oval btn btn-primary" size="sm" onClick={(e) => this.newProcessClick(e)}>
-															Proses
-														</button>
-													</div>
-												</td>
-											</tr> */}
+													</td>
+													<td>{moment(value.created_at).fromNow()}</td>
+													<td>
+														<div className="ml-auto">
+															<button class="btn-oval btn btn-primary" size="sm" onClick={(e) => this.newProcessClick(e, value.pt_id, value._number)}>
+																Proses
+															</button>
+														</div>
+													</td>
+												</tr>
+											))}
 										</tbody>
 									</table>
 								</Datatable>

pages/app/sanksi.js

@@ -1,285 +1,171 @@
-import React, { Component } from 'react';
-import Router from 'next/router'
-import ContentWrapper from '@/components/Layout/ContentWrapper';
-import { Row, Col, Progress, Button } from 'reactstrap';
+import React, { Component } from "react";
+import Router from "next/router";
+import ContentWrapper from "@/components/Layout/ContentWrapper";
+import { Row, Col, Progress, Button } from "reactstrap";
+import { getPelaporan } from "../../actions/pelaporan";
 
-import Sparkline from '@/components/Common/Sparklines';
-import Scrollable from '@/components/Common/Scrollable'
-import Datatable from '@/components/Tables/Datatable';
-import moment from 'moment';
+import Sparkline from "@/components/Common/Sparklines";
+import Scrollable from "@/components/Common/Scrollable";
+import Datatable from "@/components/Tables/Datatable";
+import moment from "moment";
 
 class BugTracker extends Component {
+	constructor(props) {
+		super(props);
+	}
 
-    newProcessClick = (e, PT_ID) => {
-        //temp variable for dev
-        PT_ID='0BCE4DB7-B207-445D-8D03-0C54B7688252';
-        const query = { ptId: PT_ID };
-        
-        e.preventDefault();
-        Router.push(
-            {
-                pathname: '/app/sanksi.proses',
-                query: { ptId: PT_ID }
-            }
-        );
-    }
+	static getInitialProps = async () => {
+		const pelaporan = await getPelaporan({ pemeriksaan: true });
+		return { pelaporan };
+	};
 
-    render() {
-        return (
-            <ContentWrapper>
-                <div className="content-heading">Sanksi</div>
-                <Row>
-                    <Col lg="4">
-                        {/* Aside card */}
-                        <div className="card b">
-                            <div className="card-body bb">
-                                <p>Overvall progress</p>
-                                <div className="d-flex align-items-center mb-2">
-                                    <div className="w-100">
-                                        <Progress className="progress-xs m0" color="info" value={ 20 } />
-                                    </div>
-                                    <div className="ml-auto">
-                                        <div className="col wd-xxs text-right">
-                                            <div className="text-bold text-muted">20%</div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                            <div className="card-body">
-                                <p>Metrics</p>
-                                <div className="row text-center">
-                                    <div className="col-6 col-lg-6 col-xl-6">
-                                     <Sparkline values={[20,80]}
+	newProcessClick = (e, PT_ID, number) => {
+		//temp variable for dev
+		PT_ID = "0BCE4DB7-B207-445D-8D03-0C54B7688252";
+		const query = { ptId: PT_ID };
 
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#23b7e5"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Open Case</p>
-                                    </div>
-                                    <div className="col-6 col-lg-6 col-xl-6">
-                                     <Sparkline values={[80,20]}
-
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#27c24c"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Close Case</p>
-                                    </div>
-                                    {/* <div className="col-3 col-lg-6 col-xl-3">
-                                     <Sparkline values={[20,80]}
-
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#ff902b"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Hours</p>
-                                    </div>
-                                    <div className="col-3 col-lg-6 col-xl-3">
-                                     <Sparkline values={[30,70]}
-
-                                        options={{
-                                            type:"pie",
-                                            height:"50",
-                                            sliceColors:["#edf1f2", "#f05050"]
-                                        }}
-                                        className="sparkline"/>
-                                        <p className="mt-3">Assigned</p>
-                                    </div> */}
-                                </div>
-                            </div>
-                            <table className="table bb">
-                                <tbody>
-                                    {/* <tr>
-                                        <td>
-                                            <strong>Assigned Hours</strong>
-                                        </td>
-                                        <td>68 hs</td>
-                                    </tr>
-                                    <tr>
-                                        <td>
-                                            <strong>Time Consumed</strong>
-                                        </td>
-                                        <td>32 hs</td>
-                                    </tr> */}
-                                    <tr>
-                                        <td>
-                                            <strong>Open Case</strong>
-                                        </td>
-                                        <td>80</td>
-                                    </tr>
-                                    <tr>
-                                        <td>
-                                            <strong>Close Case</strong>
-                                        </td>
-                                        <td>20</td>
-                                    </tr>
-                                    <tr>
-                                        <td>
-                                            <strong>Performance</strong>
-                                        </td>
-                                        <td>
-                                            <em className="far fa-smile fa-lg text-warning"></em>
-                                        </td>
-                                    </tr>
-                                    {/* <tr>
-                                        <td>
-                                            <strong>Commits</strong>
-                                        </td>
-                                        <td>140</td>
-                                    </tr> */}
-                                    {/* <tr>
-                                        <td>
-                                            <strong>Last Case Closed</strong>
-                                        </td>
-                                        <td>
-                                            <Scrollable height="120px" className="list-group">
-                                                <table className="table table-bordered bg-transparent">
-                                                    <tbody>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:54678</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:55778</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:56878</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:57978</a>
-                                                            </td>
-                                                        </tr>
-                                                        <tr>
-                                                            <td>
-                                                                <a className="text-muted" href="">BI:1107</a>
-                                                            </td>
-                                                        </tr>
-                                                    </tbody>
-                                                </table>
-                                            </Scrollable>
-                                        </td>
-                                    </tr> */}
-                                    <tr>
-                                        <td>
-                                            <strong>Last Case Closed</strong>
-                                        </td>
-                                        <td>BI:1107 - 12/01/2016</td>
-                                    </tr>
-                                </tbody>
-                            </table>
-                        </div>
-                        {/* end Aside card */}
-                    </Col>
-                    <Col lg="8">
-                        {/* <div className="mb-3 d-flex"> */}
-                            {/* <div> */}
-                                {/* <button className="btn btn-sm btn-info" type="button" onClick={(e) => this.newReportClick(e)}>Laporan Baru</button> */}
-                                {/* <Button color="info" size="sm" onClick={(e) => this.handleClick(e, pt.id)}>View</Button> */}
-                                {/* <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fa fa-user-plus"></em>
-                                </button>
-                                <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fas fa-pencil-alt"></em>
-                                </button>
-                                <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fas fa-share"></em>
-                                </button>
-                                <button className="btn btn-sm btn-secondary" type="button">
-                                    <em className="fa fa-print"></em>
-                                </button> */}
-                            {/* </div> */}
-                            {/* <div className="ml-auto">
-                                <p className="mb-0 mt-1">19 bugs / 16 issues</p>
-                            </div> */}
-                        {/* </div> */}
-                        <div className="card b">
-                            <div className="card-body">
-                                <Datatable options={{responsive: true}}>
-                                    <table className="table w-100">
-                                        <thead>
-                                            <tr>
-                                                {/* <th>Type</th> */}
-                                                <th>#ID</th>
-                                                <th>Description</th>
-                                                <th>Created</th>
-                                                {/* <th>Priority</th>
-                                                <th>Asigned</th> */}
-                                                <th>Status</th>
-                                                <th>Action</th>
-                                            </tr>
-                                        </thead>
-                                        <tbody>
-                                            <tr>
-                                                {/* <td>
-                                                    <div className="badge bg-gray-lighter">bug</div>
-                                                </td> */}
-                                                <td>BI:54678</td>
-                                                <td className="text-nowrap">
-                                                    <div className="media align-items-center">
-                                                        <a className="mr-3" href="">
-                                                            <img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy"/>
-                                                        </a>
-                                                        <div className="media-body d-flex">
-                                                            <div>
-                                                                <h4 className="m-0">Universitas Satyagama</h4>
-                                                                <small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
-                                                                <p>Jalan Kamal Raya No 2-A Cengkareng</p>
-                                                                <p> </p>
-                                                            </div>
-                                                            {/* <div className="ml-auto">
-                                                                <Button color="info" size="sm" onClick={(e) => this.handleClick(e, pt.id)}>Proses Sangsi</Button>
-                                                            </div> */}
-                                                        </div>
-                                                    </div>
-                                                
-
-
-
-                                                    {/* <small>Maecenas mollis egestas convallis.</small> */}
-                                                </td>
-                                                <td>{moment("2020-04-04 11:45:26.123").fromNow()}</td>
-                                                {/* <td>
-                                                    <div className="circle circle-lg bg-warning" data-title="normal"></div>
-                                                </td> */}
-                                                {/* <td>
-                                                    <a href="">Sylvia Daniels</a>
-                                                </td> */}
-                                                <td>
-                                                    <div className="inline wd-xxs badge badge-success">open</div>
-                                                </td>
-                                                <td>
-                                                    <div className="ml-auto">
-                                                        <button class="btn-oval btn btn-primary" size="sm" onClick={(e) => this.newProcessClick(e)}>Proses Sanksi</button>
-                                                    </div>
-                                                </td>
-                                            </tr>
-                                            
-                                        </tbody>
-                                    </table>
-                                </Datatable>
-                            </div>
-                        </div>
-                    </Col>
-                </Row>
-            </ContentWrapper>
-            );
-    }
+		e.preventDefault();
+		Router.push({
+			pathname: "/app/sanksi.proses",
+			query: { ptId: PT_ID, number: number },
+		});
+	};
 
+	render() {
+		const { pelaporan } = this.props;
+		console.log(pelaporan);
+		return (
+			<ContentWrapper>
+				<div className="content-heading">Sanksi</div>
+				<Row>
+					<Col lg="4">
+						<div className="card b">
+							<div className="card-body bb">
+								<p>Overvall progress</p>
+								<div className="d-flex align-items-center mb-2">
+									<div className="w-100">
+										<Progress className="progress-xs m0" color="info" value={20} />
+									</div>
+									<div className="ml-auto">
+										<div className="col wd-xxs text-right">
+											<div className="text-bold text-muted">20%</div>
+										</div>
+									</div>
+								</div>
+							</div>
+							<div className="card-body">
+								<p>Metrics</p>
+								<div className="row text-center">
+									<div className="col-6 col-lg-6 col-xl-6">
+										<Sparkline
+											values={[20, 80]}
+											options={{
+												type: "pie",
+												height: "50",
+												sliceColors: ["#edf1f2", "#23b7e5"],
+											}}
+											className="sparkline"
+										/>
+										<p className="mt-3">Open Case</p>
+									</div>
+									<div className="col-6 col-lg-6 col-xl-6">
+										<Sparkline
+											values={[80, 20]}
+											options={{
+												type: "pie",
+												height: "50",
+												sliceColors: ["#edf1f2", "#27c24c"],
+											}}
+											className="sparkline"
+										/>
+										<p className="mt-3">Close Case</p>
+									</div>
+								</div>
+							</div>
+							<table className="table bb">
+								<tbody>
+									<tr>
+										<td>
+											<strong>Open Case</strong>
+										</td>
+										<td>80</td>
+									</tr>
+									<tr>
+										<td>
+											<strong>Close Case</strong>
+										</td>
+										<td>20</td>
+									</tr>
+									<tr>
+										<td>
+											<strong>Performance</strong>
+										</td>
+										<td>
+											<em className="far fa-smile fa-lg text-warning"></em>
+										</td>
+									</tr>
+									<tr>
+										<td>
+											<strong>Last Case Closed</strong>
+										</td>
+										<td>BI:1107 - 12/01/2016</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+					</Col>
+					<Col lg="8">
+						<div className="card b">
+							<div className="card-body">
+								<Datatable options={{ responsive: true }}>
+									<table className="table w-100">
+										<thead>
+											<tr>
+												<th>#ID</th>
+												<th>Description</th>
+												<th>Created</th>
+												<th>Status</th>
+											</tr>
+										</thead>
+										<tbody>
+											{this.props.pelaporan.data.map((value) => (
+												<tr>
+													<td>BI:{value._number}</td>
+													<td className="text-nowrap">
+														<div className="media align-items-center">
+															<a className="mr-3" href="">
+																<img className="img-fluid rounded thumb64" src="/static/img/dummy-search.png" alt="Dummy" />
+															</a>
+															<div className="media-body d-flex">
+																<div>
+																	<h4 className="m-0">Universitas Satyagama</h4>
+																	<small className="text-muted">0742/O/1990 - www.satyagama.ac.id - info@satyagama.ac.id</small>
+																	<p>Jalan Kamal Raya No 2-A Cengkareng</p>
+																	<p> </p>
+																</div>
+															</div>
+														</div>
+													</td>
+													<td>{moment(value.created_at).fromNow()}</td>
+													<td>
+														<div className="ml-auto">
+															<button class="btn-oval btn btn-primary" size="sm" onClick={(e) => this.newProcessClick(e, value.pt_id, value._number)}>
+																Proses Sanksi
+															</button>
+														</div>
+													</td>
+												</tr>
+											))}
+										</tbody>
+									</table>
+								</Datatable>
+							</div>
+						</div>
+					</Col>
+				</Row>
+			</ContentWrapper>
+		);
+	}
 }
 
 export default BugTracker;
-
-

store/actions/pelaporan.js

@@ -0,0 +1,77 @@
+export const CHANGE_THEME = "CHANGE_THEME";
+export const PELAPORAN_LIST_REQUEST = "PELAPORAN_LIST_REQUEST";
+export const PELAPORAN_LIST_SUCCESS = "PELAPORAN_LIST_SUCCESS";
+export const PELAPORAN_LIST_FAIL = "PELAPORAN_LIST_FAIL";
+export const PELAPORAN_DETAILS_REQUEST = "PELAPORAN_DETAILS_REQUEST";
+export const PELAPORAN_DETAILS_SUCCESS = "PELAPORAN_DETAILS_SUCCESS";
+export const PELAPORAN_DETAILS_FAIL = "PELAPORAN_DETAILS_FAIL";
+export const PELAPORAN_CREATE_REQUEST = "PELAPORAN_DETAILS_REQUEST";
+export const PELAPORAN_CREATE_SUCCESS = "PELAPORAN_DETAILS_SUCCESS";
+export const PELAPORAN_CREATE_FAIL = "PELAPORAN_DETAILS_FAIL";
+export const PELAPORAN_CREATE_RESET = "PELAPORAN_CREATE_RESET";
+
+/**
+ * Change current theme path
+ */
+
+export const listPelaporan = () => async (dispatch) => {
+	try {
+		dispatch({ type: PELAPORAN_LIST_REQUEST });
+
+		const res = await fetch("http://localhost:5000/pelaporan");
+		const { data } = await res.json();
+
+		dispatch({
+			type: PELAPORAN_LIST_SUCCESS,
+			payload: data,
+		});
+	} catch (error) {
+		dispatch({
+			type: PELAPORAN_LIST_FAIL,
+			payload: error.response && error.response.data.message ? error.response.data.message : error.message,
+		});
+	}
+};
+
+export const listPelaporanDetails = (number, ptId) => async (dispatch) => {
+	try {
+		dispatch({ type: PELAPORAN_DETAILS_REQUEST });
+
+		const res = await fetch(`http://localhost:5000/pelaporan?number=${number}&ptId=${ptId}`);
+		const { data } = await res.json();
+
+		dispatch({
+			type: PELAPORAN_DETAILS_SUCCESS,
+			payload: data,
+		});
+	} catch (error) {
+		dispatch({
+			type: PELAPORAN_DETAILS_FAIL,
+			payload: error.response && error.response.data.message ? error.response.data.message : error.message,
+		});
+	}
+};
+
+export const createPelaporan = (pelaporanResult) => async (dispatch) => {
+	try {
+		dispatch({
+			type: PELAPORAN_CREATE_REQUEST,
+		});
+
+		const res = await fetch("http://localhost:5000/pelaporan/create", {
+			method: "POST",
+			body: pelaporanResult,
+		});
+		const data = await res.json();
+
+		dispatch({
+			type: PELAPORAN_CREATE_SUCCESS,
+			payload: data,
+		});
+	} catch (error) {
+		dispatch({
+			type: PELAPORAN_CREATE_FAIL,
+			payload: error.response && error.response.data.message ? error.response.data.message : error.message,
+		});
+	}
+};

store/actions/penjadwalan.js

@@ -0,0 +1,33 @@
+export const PENJADWALAN_CREATE_REQUEST = "PENJADWALAN_CREATE_REQUEST";
+export const PENJADWALAN_CREATE_SUCCESS = "PENJADWALAN_CREATE_SUCCESS";
+export const PENJADWALAN_CREATE_FAIL = "PENJADWALAN_CREATE_FAIL";
+export const PENJADWALAN_CREATE_RESET = "PENJADWALAN_CREATE_RESET";
+
+export const createPenjadwalan =
+	({ number, ptId }, penjadwalanData) =>
+	async (dispatch) => {
+		try {
+			dispatch({
+				type: PENJADWALAN_CREATE_REQUEST,
+			});
+
+			const myHeaders = new Headers();
+			myHeaders.append("Content-Type", "application/json");
+			const res = await fetch(`http://localhost:5000/pelaporan/jadwal/add?number=${number}&ptId=${ptId}`, {
+				method: "POST",
+				body: penjadwalanData,
+				headers: myHeaders,
+			});
+			const data = await res.json();
+
+			dispatch({
+				type: PENJADWALAN_CREATE_SUCCESS,
+				payload: data,
+			});
+		} catch (error) {
+			dispatch({
+				type: PENJADWALAN_CREATE_FAIL,
+				payload: error.response && error.response.data.message ? error.response.data.message : error.message,
+			});
+		}
+	};

store/reducers/pelaporan.reducers.js

@@ -0,0 +1,53 @@
+import {
+	PELAPORAN_LIST_REQUEST,
+	PELAPORAN_LIST_SUCCESS,
+	PELAPORAN_LIST_FAIL,
+	PELAPORAN_DETAILS_REQUEST,
+	PELAPORAN_DETAILS_SUCCESS,
+	PELAPORAN_DETAILS_FAIL,
+	PELAPORAN_CREATE_REQUEST,
+	PELAPORAN_CREATE_SUCCESS,
+	PELAPORAN_CREATE_FAIL,
+	PELAPORAN_CREATE_RESET,
+} from "../actions/pelaporan";
+
+export const pelaporanListReducer = (state = { data: [] }, action) => {
+	switch (action.type) {
+		case PELAPORAN_LIST_REQUEST:
+			return { loading: true, data: [] };
+		case PELAPORAN_LIST_SUCCESS:
+			return { loading: false, data: action.payload };
+		case PELAPORAN_LIST_FAIL:
+			return { loading: false, error: action.payload };
+		default:
+			return state;
+	}
+};
+
+export const pelaporanDetailsReducer = (state = { pelaporan: {} }, action) => {
+	switch (action.type) {
+		case PELAPORAN_DETAILS_REQUEST:
+			return { loading: true, ...state };
+		case PELAPORAN_DETAILS_SUCCESS:
+			return { loading: false, data: action.payload };
+		case PELAPORAN_DETAILS_FAIL:
+			return { loading: false, error: action.payload };
+		default:
+			return state;
+	}
+};
+
+export const pelaporanCreateReducer = (state = {}, action) => {
+	switch (action.type) {
+		case PELAPORAN_CREATE_REQUEST:
+			return { loading: true };
+		case PELAPORAN_CREATE_SUCCESS:
+			return { loading: false, success: true, data: action.payload };
+		case PELAPORAN_CREATE_FAIL:
+			return { loading: false, error: action.payload };
+		case PELAPORAN_CREATE_RESET:
+			return {};
+		default:
+			return state;
+	}
+};

store/reducers/penjadwalan.reducers.js

@@ -0,0 +1,16 @@
+import { PENJADWALAN_CREATE_REQUEST, PENJADWALAN_CREATE_SUCCESS, PENJADWALAN_CREATE_FAIL, PENJADWALAN_CREATE_RESET } from "../actions/penjadwalan";
+
+export const penjadwalanCreateReducer = (state = {}, action) => {
+	switch (action.type) {
+		case PENJADWALAN_CREATE_REQUEST:
+			return { loading: true };
+		case PENJADWALAN_CREATE_SUCCESS:
+			return { loading: false, success: true, data: action.payload };
+		case PENJADWALAN_CREATE_FAIL:
+			return { loading: false, error: action.payload };
+		case PENJADWALAN_CREATE_RESET:
+			return {};
+		default:
+			return state;
+	}
+};

store/reducers/reducers.js

@@ -1,11 +1,16 @@
-import { combineReducers } from 'redux';
+import { combineReducers } from "redux";
 
-import settingsReducer from './settings.reducer.js';
-import themesReducer from './themes.reducers.js';
-import isLoggedReducer from './isLogged.reducer.js';
+import settingsReducer from "./settings.reducer.js";
+import themesReducer from "./themes.reducers.js";
+import isLoggedReducer from "./isLogged.reducer.js";
+import { pelaporanListReducer, pelaporanCreateReducer } from "./pelaporan.reducers.js";
+import { penjadwalanCreateReducer } from "./penjadwalan.reducers.js";
 
 export default combineReducers({
-    settings: settingsReducer,
-    theme: themesReducer,
-    logged: isLoggedReducer
+	settings: settingsReducer,
+	theme: themesReducer,
+	logged: isLoggedReducer,
+	pelaporanList: pelaporanListReducer,
+	pelaporanCreate: pelaporanCreateReducer,
+	penjadwalanAdd: penjadwalanCreateReducer,
 });

store/store.js

@@ -1,24 +1,24 @@
-import { createStore,compose } from 'redux';
-import reducers from './reducers/reducers';
-import { saveState } from './persisted.store.cookies.js';
+import { createStore, compose, applyMiddleware } from "redux";
+import thunk from "redux-thunk";
+import reducers from "./reducers/reducers";
+import { saveState } from "./persisted.store.cookies.js";
 
 export default function configureStore(initialState) {
+	const enhancers = compose(typeof window !== "undefined" && window.devToolsExtension ? window.devToolsExtension() : (f) => f);
 
-    const enhancers = compose(
-        (typeof window !== 'undefined' && window.devToolsExtension) ? window.devToolsExtension() : f => f
-      );
+	const store = createStore(
+		reducers,
+		applyMiddleware(thunk)
+		// {
+		// 	...initialState,
+		// },
+		// enhancers
+	);
 
+	// add a listener that will be invoked on any state change
+	store.subscribe(() => {
+		saveState(store.getState());
+	});
 
-    const store = createStore(reducers, {
-        ...initialState
-    },
-    enhancers
-    );
-
-    // add a listener that will be invoked on any state change
-    store.subscribe(() => {
-        saveState(store.getState());
-    });
-
-    return store;
+	return store;
 }