Fix sticker seeder.

contexts/CalenderContext.tsx

@@ -11,6 +11,7 @@ import {
   isBefore,
   compareAsc
 } from "date-fns";
+import stickersSeeder from "../data/stickerSeeder";
 
 const CalenderContext = createContext({} as CalenderContextState);
 
@@ -40,8 +41,6 @@ const CalenderContextProvider = ({
     ]
   };
 
-  //TODO Add a function that will populate the "MONTH" layout for the context. It should take in the start of the week (Sunday, Monday) and output the appropriate layout based on that preference.
-
   /**
    * Using date-fns, this function checks if currDate is within the month of selectedDate or not.
    * @param {Date} selectedDate The current month.
@@ -74,6 +73,10 @@ const CalenderContextProvider = ({
     return { isOverflow: flag, overflowDirection: direction };
   };
 
+  const [stickersMonth, setStickersMonth] = useState<StickerDays>(
+    stickersSeeder()
+  );
+
   /**
    * A function that will return a month layout when given a date. It produces
    * an object with 6 weeks that include overflow from the previous and next month
@@ -84,6 +87,9 @@ const CalenderContextProvider = ({
     const endLastMonth = getDate(endOfMonth(sub(selectedDate, { months: 1 })));
     const startOfSelectedMonth = format(startOfMonth(selectedDate), "iii");
 
+    // console.log(stickersMonth);
+    console.log(stickersSeeder());
+
     const ISOToIndex = {
       sunday: {
         Sun: 0,
@@ -129,8 +135,10 @@ const CalenderContextProvider = ({
 
         const day: MonthDay = {
           ...overflowInfo,
-          date: sunCurrDate
+          date: sunCurrDate,
+          // sticker: stickersMonth[getDate(sunCurrDate)].sticker
         };
+
         sunCurrDate = add(sunCurrDate, {
           days: 1
         });
@@ -162,8 +170,10 @@ const CalenderContextProvider = ({
 
         const day: MonthDay = {
           ...overflowInfo,
-          date: monCurrDate
+          date: monCurrDate,
+          // sticker: stickersMonth[getDate(monCurrDate)].sticker
         };
+
         monCurrDate = add(monCurrDate, {
           days: 1
         });

data/stickerSeeder.ts

@@ -7,8 +7,7 @@ import { getDaysInMonth, getYear, getMonth, isBefore } from "date-fns";
  */
 
 const generateSticker = (): -2 | -1 | 0 | 1 | 2 => {
-  const stickerPossibility = [-2, -1, 0, 1, 2];
-  const sticker = Math.floor(Math.random() * stickerPossibility.length);
+  const sticker = Math.floor(Math.random() * (2 - -2 + 1)) + -2;
 
   if (
     sticker === -2 ||
@@ -21,14 +20,14 @@ const generateSticker = (): -2 | -1 | 0 | 1 | 2 => {
   }
 };
 
-const stickersSeeder = (): Sticker[] => {
+const stickersSeeder = (): StickerDays => {
   const stickers = [] as Sticker[];
 
   const now = new Date();
   const daysOfThisMonth = getDaysInMonth(now);
 
-  for (let i = 0; i <= daysOfThisMonth; i++) {
-    const currDate = new Date(getYear(now), getMonth(now) - 1, i);
+  for (let i = 1; i <= daysOfThisMonth; i++) {
+    const currDate = new Date(getYear(now), getMonth(now), i);
 
     const newSticker: Sticker = {
       date: currDate,

types/CalenderContext.d.ts

@@ -19,6 +19,8 @@ interface Sticker {
   sticker: -2 | -1 | 0 | 1 | 2 | null;
 }
 
+type StickerDays = Sticker[];
+
 interface MonthSticker {
   date: Date;
   month: Sticker[];
@@ -69,4 +71,4 @@ interface CalenderContextState {
   title: string;
   layout: MonthLayout;
   updateDate: (input: UpdateCalendarProps) => void;
-}
+}