diff --git a/src/react/databrowser/objects/ObjectLockSetting.tsx b/src/react/databrowser/objects/ObjectLockSetting.tsx
index 61301573b..8130dcc3f 100644
--- a/src/react/databrowser/objects/ObjectLockSetting.tsx
+++ b/src/react/databrowser/objects/ObjectLockSetting.tsx
@@ -137,7 +137,10 @@ export default function ObjectLockSetting() {
   useEffect(() => {
     setValue('isRetentionEnabled', isDefaultRetentionEnabled);
     setValue('retentionMode', defaultRetentionMode);
-    setValue('retentionUntilDate', defaultRetentionUntilDate);
+    setValue(
+      'retentionUntilDate',
+      DateTime.fromJSDate(defaultRetentionUntilDate).toFormat('yyyy-LL-dd'),
+    );
   }, [
     setValue,
     isDefaultRetentionEnabled,
@@ -285,9 +288,9 @@ export default function ObjectLockSetting() {
                       type="date"
                       name="retention-until-date"
                       disabled={!isRetentionEnabled}
-                      onChange={(e: ChangeEvent<HTMLInputElement>) =>
-                        onChange(e.target.value)
-                      }
+                      onChange={(e: ChangeEvent<HTMLInputElement>) => {
+                        onChange(e.target.value);
+                      }}
                       value={retentionUntilDate}
                       min={minRetainUtilDate}
                     />
diff --git a/src/react/databrowser/objects/details/__tests__/Properties.test.tsx b/src/react/databrowser/objects/details/__tests__/Properties.test.tsx
index 46b0f7f69..70a834e0b 100644
--- a/src/react/databrowser/objects/details/__tests__/Properties.test.tsx
+++ b/src/react/databrowser/objects/details/__tests__/Properties.test.tsx
@@ -89,11 +89,10 @@ describe('Properties', () => {
       <Properties
         objectMetadata={{
           ...OBJECT_METADATA,
-          //@ts-expect-error fix this when you are working on it
           lockStatus: 'LOCKED',
           objectRetention: {
             mode: 'GOVERNANCE',
-            retainUntilDate: '2020-10-17 10:06:54',
+            retainUntilDate: new Date('2020-10-17 10:06:54'),
           },
         }}
       />,
@@ -120,11 +119,10 @@ describe('Properties', () => {
       <Properties
         objectMetadata={{
           ...OBJECT_METADATA,
-          //@ts-expect-error fix this when you are working on it
           lockStatus: 'RELEASED',
           objectRetention: {
             mode: 'GOVERNANCE',
-            retainUntilDate: '2020-10-17 10:06:54',
+            retainUntilDate: new Date('2020-10-17 10:06:54'),
           },
         }}
       />,
@@ -145,11 +143,10 @@ describe('Properties', () => {
       <Properties
         objectMetadata={{
           ...OBJECT_METADATA,
-          //@ts-expect-error fix this when you are working on it
           lockStatus: 'LOCKED',
           objectRetention: {
             mode: 'GOVERNANCE',
-            retainUntilDate: '2020-10-17 10:06:54',
+            retainUntilDate: new Date('2020-10-17 10:06:54'),
           },
           isLegalHoldEnabled: true,
         }}
@@ -168,11 +165,10 @@ describe('Properties', () => {
       <Properties
         objectMetadata={{
           ...OBJECT_METADATA,
-          //@ts-expect-error fix this when you are working on it
           lockStatus: 'LOCKED',
           objectRetention: {
             mode: 'GOVERNANCE',
-            retainUntilDate: '2020-10-17 10:06:54',
+            retainUntilDate: new Date('2020-10-17 10:06:54'),
           },
           isLegalHoldEnabled: true,
           storageClass: 'europe25-myroom-cold',
@@ -211,11 +207,10 @@ describe('Properties', () => {
       <Properties
         objectMetadata={{
           ...OBJECT_METADATA,
-          //@ts-expect-error fix this when you are working on it
           lockStatus: 'LOCKED',
           objectRetention: {
             mode: 'GOVERNANCE',
-            retainUntilDate: '2020-10-17 10:06:54',
+            retainUntilDate: new Date('2020-10-17 10:06:54'),
           },
           isLegalHoldEnabled: true,
           storageClass: 'europe25-myroom-cold',
@@ -259,11 +254,10 @@ describe('Properties', () => {
       <Properties
         objectMetadata={{
           ...OBJECT_METADATA,
-          //@ts-expect-error fix this when you are working on it
           lockStatus: 'LOCKED',
           objectRetention: {
             mode: 'GOVERNANCE',
-            retainUntilDate: '2020-10-17 10:06:54',
+            retainUntilDate: new Date('2020-10-17 10:06:54'),
           },
           isLegalHoldEnabled: true,
           storageClass: 'europe25-myroom-cold',
diff --git a/src/react/databrowser/objects/utils.ts b/src/react/databrowser/objects/utils.ts
index 3f1d78a59..ac4bf50d7 100644
--- a/src/react/databrowser/objects/utils.ts
+++ b/src/react/databrowser/objects/utils.ts
@@ -4,8 +4,9 @@ import type { ObjectMetadata } from '../../../types/s3';
 function getDefaultRetention(objectMetadata: ObjectMetadata | null) {
   const isDefaultRetentionEnabled =
     objectMetadata?.objectRetention !== undefined;
+
   const defaultRetentionUntilDate =
-    objectMetadata?.objectRetention?.retainUntilDate.split(' ')[0] || '';
+    objectMetadata?.objectRetention?.retainUntilDate;
   const defaultRetentionMode =
     objectMetadata?.objectRetention?.mode || 'GOVERNANCE';
   return {
@@ -17,7 +18,7 @@ function getDefaultRetention(objectMetadata: ObjectMetadata | null) {
 
 // input date format yyyy-mm-dd hh:mm:ss "2017-05-15 09:24:15"
 // get the min value for calendar picker in object retention setting, with yyyy-mm-dd as format
-function getDefaultMinRetainUntilDate(d: string, mode: string): string {
+function getDefaultMinRetainUntilDate(d: Date, mode: string): string {
   const futureDate = DateTime.now()
     .plus(
       Duration.fromObject({
@@ -33,8 +34,8 @@ function getDefaultMinRetainUntilDate(d: string, mode: string): string {
   // when we switch mode from "GOVERNANCE" to "COMPLIANCE", we should be able to keep the same previous retain date
   const previousRetainUntilDate =
     mode === 'GOVERNANCE'
-      ? DateTime.fromSQL(d).toISODate()
-      : DateTime.fromSQL(d)
+      ? DateTime.fromJSDate(d).toISODate()
+      : DateTime.fromJSDate(d)
           .plus(
             Duration.fromObject({
               days: 1,
diff --git a/src/types/s3.ts b/src/types/s3.ts
index d95ce0c0a..4835785b7 100644
--- a/src/types/s3.ts
+++ b/src/types/s3.ts
@@ -161,7 +161,7 @@ export type ObjectMetadata = {
   readonly isLegalHoldEnabled?: boolean;
   readonly objectRetention?: {
     mode: RetentionMode;
-    retainUntilDate: string;
+    retainUntilDate: Date;
   };
   readonly metadata: MetadataItems;
   readonly tags: Tags;