From 4874cf4d4f202e0d8fbfdb52a7cb6d4fa8b32472 Mon Sep 17 00:00:00 2001
From: dhruvik7 <dhruvik.parikh@hotmail.com>
Date: Sun, 21 Feb 2021 14:50:22 -0500
Subject: [PATCH] working commit graph, needs tooltips

---
 src/calendar.tsx | 34 +++++++++++++++++++---------------
 src/github.tsx   |  0
 src/view.ts      | 12 +++++++++++-
 styles.css       |  4 ++--
 4 files changed, 32 insertions(+), 18 deletions(-)
 delete mode 100644 src/github.tsx

diff --git a/src/calendar.tsx b/src/calendar.tsx
index 2f87889..05b1d66 100644
--- a/src/calendar.tsx
+++ b/src/calendar.tsx
@@ -6,31 +6,35 @@ interface HeatmapProps {
     data: any[];
 }
 
+const MAX_COLORS = 5;
+const COLOR_FREQ = 6;
+
 class Heatmap extends React.Component<HeatmapProps> {
     render() {
         const customTooltipDataAttrs = (value: any) => ({
             'data-tip': value.date === null ? '' : value.status + ' on ' + value.date
         });
 
-        return <><ReactCalendarHeatmap
-            startDate={new Date(new Date().setFullYear(new Date().getFullYear() - 1))}
-            endDate={new Date()}
-            values={this.props.data}
-            horizontal={false}
-            showMonthLabels={false}
-            classForValue={(value) => {
-                if (!value) {
-                    return 'color-empty';
-                }
-                return `color-github-${value.count}`;
-            }}
-            tooltipDataAttrs={customTooltipDataAttrs}
-        />
+        return <div style={{ padding: "10px 10px 0px 10px", maxWidth: "300px", marginLeft: "auto", marginRight: "auto" }}>
+            <ReactCalendarHeatmap
+                startDate={new Date(new Date().setFullYear(new Date().getFullYear() - 1))}
+                endDate={new Date()}
+                values={this.props.data}
+                horizontal={false}
+                showMonthLabels={false}
+                classForValue={(value) => {
+                    if (!value || value.count == 0) {
+                        return 'color-empty';
+                    }
+                    return `color-github-${Math.min(MAX_COLORS, Math.floor(Math.log(value.count) / Math.log(COLOR_FREQ)))}`;
+                }}
+                tooltipDataAttrs={customTooltipDataAttrs}
+            />
             <ReactTooltip
                 type='warning'
                 effect='solid'
             />
-        </>
+        </div>
     }
 }
 
diff --git a/src/github.tsx b/src/github.tsx
deleted file mode 100644
index e69de29..0000000
diff --git a/src/view.ts b/src/view.ts
index 47be658..95e3c19 100644
--- a/src/view.ts
+++ b/src/view.ts
@@ -11,6 +11,16 @@ export default class StatsTrackerView extends ItemView {
     constructor(leaf: WorkspaceLeaf, dayCounts: Record<string, number>) {
         super(leaf);
         this.dayCounts = dayCounts;
+
+        this.registerInterval(
+            window.setInterval(() => {
+                ReactDOM.render(React.createElement(Calendar, {
+                    data: Object.keys(this.dayCounts).map(day => {
+                        return { "date": new Date(new Date(day).setMonth(new Date(day).getMonth() + 1)), "count": this.dayCounts[day] }
+                    }),
+                }), (this as any).contentEl);
+            }, 1000)
+        );
     }
 
     getDisplayText() {
@@ -28,7 +38,7 @@ export default class StatsTrackerView extends ItemView {
     async onOpen() {
         ReactDOM.render(React.createElement(Calendar, {
             data: Object.keys(this.dayCounts).map(day => {
-                return { "date": day, "count": this.dayCounts[day] }
+                return { "date": new Date(new Date(day).setMonth(new Date(day).getMonth() + 1)), "count": this.dayCounts[day] }
             }),
         }), (this as any).contentEl);
     }
diff --git a/styles.css b/styles.css
index f536d2a..33a57e2 100644
--- a/styles.css
+++ b/styles.css
@@ -8,7 +8,7 @@ react-calendar-heatmap-small-text {
 
 rect:hover {
     stroke: #555;
-    stroke-width: 1px;
+    stroke-width: 0.5px;
 }
 
 /*
@@ -24,7 +24,7 @@ rect:hover {
 }
 
 /*
-* Github color scale
+* Github color scale   
 */
 
 .color-github-0 {