From 4f1cb0d774c9b2109c9f3fd0ef76d172a4048c01 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cemalettin=20Ta=C5=9F?= <cemalettin.tas@simsoft.com.tr>
Date: Mon, 14 Sep 2020 15:25:25 +0300
Subject: [PATCH] NCI-Agency/anet#3172: Add month layout

---
 client/src/layouts/monthLayout.js | 35 +++++++++++++++++++++----------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/client/src/layouts/monthLayout.js b/client/src/layouts/monthLayout.js
index 7a40c49ada..f80a9f7428 100644
--- a/client/src/layouts/monthLayout.js
+++ b/client/src/layouts/monthLayout.js
@@ -1,15 +1,28 @@
-import PropTypes from "prop-types"
-import React from "react"
+import moment from "moment"
 
 const monthLayout = ({ item, dimensions }) => {
-  return (
-    <>
-      Hello {item} {dimensions}
-    </>
-  )
-}
-monthLayout.propTypes = {
-  item: PropTypes.object,
-  dimensions: PropTypes.object
+  // figure out which month
+  const momentDate = moment(item.date)
+
+  // This is the [0,0] day of the month
+  const firstDayofFirstWeekOfTheMonth = momentDate
+    .startOf("month")
+    .startOf("isoWeek")
+
+  const endOfMonth = momentDate.endOf("month")
+
+  const numOfWeeks = endOfMonth.diff(firstDayofFirstWeekOfTheMonth, "weeks") + 1
+  const daysDiff = momentDate.diff(firstDayofFirstWeekOfTheMonth, "days")
+
+  const weekDiff = Math.floor(daysDiff / 7)
+  const weekDayDiff = daysDiff % 7
+
+  return {
+    xPos: (dimensions.width * weekDayDiff) / 7,
+    yPos: (dimensions.height * weekDiff) / numOfWeeks,
+    width: dimensions.width / 7,
+    height: dimensions.height / numOfWeeks
+  }
 }
+
 export default monthLayout