diff --git a/components/calender/Day.tsx b/components/calender/Day.tsx
index ac548fb..941c72c 100644
--- a/components/calender/Day.tsx
+++ b/components/calender/Day.tsx
@@ -21,6 +21,7 @@ interface DayProps {
sticker: StickerVal;
date: Date;
selectedDate: Date;
+ currDate: Date;
}
/**
@@ -37,7 +38,8 @@ const Day = ({
overflowDirection,
sticker,
date,
- selectedDate
+ selectedDate,
+ currDate
}: DayProps): JSX.Element => {
const handleNav = (direction: "next" | "prev") => {
if (direction === "next") {
@@ -90,7 +92,7 @@ const Day = ({
w="100%"
h="100%"
_hover={{
- cursor: isBefore(date, endOfDay(new Date()))
+ cursor: isBefore(date, endOfDay(currDate))
? "pointer"
: "default",
background: "gray.700",
@@ -131,7 +133,7 @@ const Day = ({
justifyContent="flex-start"
pt={2}
_hover={{
- cursor: isBefore(date, endOfDay(new Date()))
+ cursor: isBefore(date, endOfDay(currDate))
? "pointer"
: "default",
background: "gray.700",
@@ -140,7 +142,7 @@ const Day = ({
>
10
? "0px 6px 3px 6px"
: "0px 9px 3px 9px"
@@ -148,8 +150,8 @@ const Day = ({
}
h="auto"
w="auto"
- border={isSameDay(new Date(), date) ? "1px solid #0068ff" : "0px"}
- borderRadius={isSameDay(new Date(), date) ? "100px" : "0px"}
+ border={isSameDay(currDate, date) ? "1px solid #0068ff" : "0px"}
+ borderRadius={isSameDay(currDate, date) ? "100px" : "0px"}
>
{`${getDate(date)}`}
@@ -162,7 +164,7 @@ const Day = ({
/>
- {isBefore(date, endOfDay(new Date())) && (
+ {isBefore(date, endOfDay(currDate)) && (
)}
diff --git a/components/calender/index.tsx b/components/calender/index.tsx
index c25f481..ec727d6 100644
--- a/components/calender/index.tsx
+++ b/components/calender/index.tsx
@@ -7,7 +7,7 @@ import CalenderNav from "./CalenderNav";
import Day from "./Day";
const Calender = (newDate?: UpdateCalendarProps): JSX.Element => {
- const { selectedDate, layout, updateDate } = useContext(CalenderContext);
+ const { selectedDate, layout, updateDate, currDate } = useContext(CalenderContext);
const { stickersMonth } = useContext(StickersContext);
useEffect(() => {
@@ -91,6 +91,7 @@ const Calender = (newDate?: UpdateCalendarProps): JSX.Element => {
sticker={sticker}
date={date}
selectedDate={selectedDate}
+ currDate={currDate}
key={
id.length
? id
diff --git a/components/calender/modals/AddUpdateSticker.tsx b/components/calender/modals/AddUpdateSticker.tsx
index 9bda161..44ebcee 100644
--- a/components/calender/modals/AddUpdateSticker.tsx
+++ b/components/calender/modals/AddUpdateSticker.tsx
@@ -30,6 +30,7 @@ interface AddStickerProps {
updateStep: React.Dispatch>;
selectedSticker: StickerVal;
updateSelectedSticker: React.Dispatch>;
+ currDate: Date;
}
/**
@@ -52,7 +53,8 @@ const AddUpdateSticker = ({
step,
updateStep,
selectedSticker,
- updateSelectedSticker
+ updateSelectedSticker,
+ currDate
}: AddStickerProps): JSX.Element => {
// TODO: Import the stickers array from the calender context.
@@ -61,7 +63,7 @@ const AddUpdateSticker = ({
// ! Update these states to say "add" and "edit" for easier reading.
const [modalVariant] = useState<"currDate" | "notCurrDate">(
- isSameDay(date, new Date()) ? "currDate" : "notCurrDate"
+ isSameDay(date, currDate) ? "currDate" : "notCurrDate"
);
const handleClose = () => {
diff --git a/contexts/CalenderContext.tsx b/contexts/CalenderContext.tsx
index 6feecc2..a558f80 100644
--- a/contexts/CalenderContext.tsx
+++ b/contexts/CalenderContext.tsx
@@ -240,7 +240,11 @@ const CalenderContextProvider = ({
}
};
- const calenderContextValues = {
+ // * Attempting to fix an issue with static generation where the date does not appear to be updating after initial generation.
+ const [currDate] = useState(new Date);
+
+ const calenderContextValues: CalenderContextState = {
+ currDate,
selectedDate,
title: selectedDateInfo.title,
layout: selectedDateInfo.layout,
diff --git a/types/CalenderContext.d.ts b/types/CalenderContext.d.ts
index 76df92d..a3e0f71 100644
--- a/types/CalenderContext.d.ts
+++ b/types/CalenderContext.d.ts
@@ -55,6 +55,7 @@ interface UpdateCalendarProps {
}
interface CalenderContextState {
+ currDate: Date;
selectedDate: Date;
title: string;
layout: MonthLayout;