diff --git a/packages/components/src/datepicker/private/InputsPanel.tsx b/packages/components/src/datepicker/private/InputsPanel.tsx
index 789ea2235c..c4554a0fbf 100644
--- a/packages/components/src/datepicker/private/InputsPanel.tsx
+++ b/packages/components/src/datepicker/private/InputsPanel.tsx
@@ -61,10 +61,10 @@ export const InputsPanel: React.FC<InputsPanelProps> = ({
     ? "yyyy-MM-dd'T'HH:mm"
     : 'yyyy-MM-dd';
   const [inputStartDate, setInputStartDate] = React.useState(
-    startDate ? format(startDate, dateFormat) : undefined
+    startDate ? format(startDate, dateFormat) : ''
   );
   const [inputEndDate, setInputEndDate] = React.useState(
-    endDate ? format(endDate, dateFormat) : undefined
+    endDate ? format(endDate, dateFormat) : ''
   );
   const [hasStartDateError, setStartDateError] = React.useState('');
   const [hasEndDateError, setEndDateError] = React.useState(false);
diff --git a/packages/components/src/datepicker/private/Month.tsx b/packages/components/src/datepicker/private/Month.tsx
index 86cc792c36..2af8d390af 100644
--- a/packages/components/src/datepicker/private/Month.tsx
+++ b/packages/components/src/datepicker/private/Month.tsx
@@ -94,12 +94,13 @@ export const Month: React.FC<MonthProps> = ({
         {monthLabel}&nbsp;&nbsp;{year}
       </MonthYearLabel>
       <Days>
-        {weekDayLabels.map(dayLabel => (
-          <DayName key={dayLabel}>{dayLabel}</DayName>
+        {weekDayLabels.map((dayLabel, weekIndex) => (
+          // eslint-disable-next-line react/no-array-index-key
+          <DayName key={`${dayLabel}-${weekIndex}`}>{dayLabel}</DayName>
         ))}
         {monthDays.map(day => (
           <Day
-            key={day.date}
+            key={day.getTime()}
             onDayClick={onDayClick}
             onMouseEnter={onMouseEnter}
             date={day}