diff --git a/src/components/Dropdown/Dropdown.tsx b/src/components/Dropdown/Dropdown.tsx
index 7169be29e0..cebe7d04a8 100644
--- a/src/components/Dropdown/Dropdown.tsx
+++ b/src/components/Dropdown/Dropdown.tsx
@@ -71,7 +71,7 @@ const Dropdown: React.FunctionComponent<DropdownProps> = ({
               value={value}
               className={classes.option}
               disabled={disabled}
-              selected={value === defaultValue}
+              selected={value.toString() === defaultValue?.toString()}
             >
               {optionsLabel}
             </option>
diff --git a/src/components/reservation/UserListItems.tsx b/src/components/reservation/UserListItems.tsx
index 8ca023f373..733e03393e 100644
--- a/src/components/reservation/UserListItems.tsx
+++ b/src/components/reservation/UserListItems.tsx
@@ -36,12 +36,7 @@ export interface UserListItemsProps {
 
 const UserListItems: FC<UserListItemsProps> = ({
   patron,
-  patron: {
-    defaultInterestPeriod,
-    preferredPickupBranch,
-    phoneNumber,
-    emailAddress
-  },
+  patron: { preferredPickupBranch, phoneNumber, emailAddress },
   branches,
   selectedBranch,
   selectBranchHandler,
@@ -74,7 +69,7 @@ const UserListItems: FC<UserListItemsProps> = ({
 
   return (
     <>
-      {defaultInterestPeriod && (
+      {interestPeriods && (
         <>
           <ReservationFormListItem
             icon={LoanHistoryIcon}
@@ -84,7 +79,9 @@ const UserListItems: FC<UserListItemsProps> = ({
             buttonAriaLabel={t("changeInterestPeriodText")}
           />
           <NoInterestAfterModal
-            selectedInterest={selectedInterest ?? defaultInterestPeriod}
+            selectedInterest={
+              selectedInterest ?? interestPeriods.defaultInterestPeriod.value
+            }
             setSelectedInterest={setSelectedInterest}
           />
         </>
diff --git a/src/components/reservation/forms/NoInterestAfterModal.tsx b/src/components/reservation/forms/NoInterestAfterModal.tsx
index 2451f0be33..f63fa63d6a 100644
--- a/src/components/reservation/forms/NoInterestAfterModal.tsx
+++ b/src/components/reservation/forms/NoInterestAfterModal.tsx
@@ -6,7 +6,7 @@ import { RequestStatus } from "../../../core/utils/types/request";
 import { Periods } from "../types";
 
 export interface PickupModalProps {
-  selectedInterest: number;
+  selectedInterest: number | string;
   setSelectedInterest: (value: number) => void;
   saveCallback?: () => void;
   reservationStatus?: RequestStatus;
diff --git a/src/components/reservation/helper.ts b/src/components/reservation/helper.ts
index b20c5a97a2..0afa820ff6 100644
--- a/src/components/reservation/helper.ts
+++ b/src/components/reservation/helper.ts
@@ -34,9 +34,9 @@ export const getNoInterestAfter = (
   interestPeriod: Periods,
   t: UseTextFunction
 ) => {
-  const interestPeriodFound = interestPeriod.interestPeriods.find(
-    ({ value }) => value === String(days)
-  );
+  const interestPeriodFound = interestPeriod.interestPeriods.find((period) => {
+    return period.value.toString() === days.toString();
+  });
 
   if (interestPeriodFound) {
     return interestPeriodFound.label;