diff --git a/src/payment/checkout/Checkout.jsx b/src/payment/checkout/Checkout.jsx
index 4221e669c..ad7edc491 100644
--- a/src/payment/checkout/Checkout.jsx
+++ b/src/payment/checkout/Checkout.jsx
@@ -161,7 +161,8 @@ class Checkout extends React.Component {
     if (products || products.length !== 0) {
       products.forEach(product => {
         productList.push({
-          externalId: String(product.courseKey || ''),
+          id: this.getCourseKey(product), // Course key
+          externalId: String(product.courseKey || ''), // Course run key
           variant: BaseTagularVariant.Courses, // TODO: all are 'courses' now, use translateVariant() in the future
           brand: this.getPartnerName(product), // School or Partner name
           name: String(product.title || ''), // Course(s) title
@@ -171,6 +172,17 @@ class Checkout extends React.Component {
     return productList;
   };
 
+  getCourseKey = (product) => {
+    try {
+      // The courseKey from the product is actually the course run key,
+      // which is the same as the course.id from a stock record product in ecomm.
+      // ex: "course-v1:MITx+COMM101+1T2024"
+      return product.courseKey.split('+').slice(0, 2).join('+');
+    } catch {
+      return '';
+    }
+  };
+
   getPartnerName = (product) => {
     // Assumes a Program/Bulk Purchase has the same Partner for all courses
     try {