Skip to content

Commit

Permalink
Update to re-render on calendar event change
Browse files Browse the repository at this point in the history
  • Loading branch information
jonmbake committed Oct 31, 2023
1 parent 508bd59 commit 3f7504d
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 5 deletions.
4 changes: 4 additions & 0 deletions src/calendar.css
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,10 @@
padding: 0;
}

.calendar {
text-align: left;
}

.calendar-event {
position: absolute;
width: 100%;
Expand Down
12 changes: 7 additions & 5 deletions src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,13 @@ export interface Props {
const Calendar = ({ activeDate, dayStartTime, dayEndTime, eventStore }: Props) => {
const [view, setView] = useState("WEEK");
const [activeDateState, setActiveDateState] = useState(activeDate || new Date());
const [, setEvents] = useState(eventStore.events);
const [, setEventStoreUpdateNumber] = useState(0); // TO DO: Refactor - A not-so-great way to force re-render on event store update.

useEffect(() => {
setEvents(eventStore.events);
}, [eventStore.events]);
eventStore.onAdd(() => setEventStoreUpdateNumber(prev => prev + 1));
eventStore.onUpdate(() => setEventStoreUpdateNumber(prev => prev + 1));
eventStore.onDelete(() => setEventStoreUpdateNumber(prev => prev + 1));
}, [eventStore]);

useEffect(() => {
setActiveDateState(activeDate || new Date());
Expand Down Expand Up @@ -93,7 +95,7 @@ const Calendar = ({ activeDate, dayStartTime, dayEndTime, eventStore }: Props) =

const dateInfo = getDateInfo(activeDateState);
return (
<>
<div className="calendar">
<div className="d-flex justify-content-between m-4">
<div className="fs-4">
<strong>{dateInfo.month}</strong> {dateInfo.year}
Expand Down Expand Up @@ -154,7 +156,7 @@ const Calendar = ({ activeDate, dayStartTime, dayEndTime, eventStore }: Props) =
</div>
</div>
{viewEL}
</>
</div>
);
};
export { CalendarEventStore, CalendarEvent };
Expand Down

0 comments on commit 3f7504d

Please sign in to comment.