fix: ui fixes for subscription programs (#32693)

* fix: hide title for mobile users in program dashboard

* fix: fix subscription trial remaining days logic

lms/djangoapps/learner_dashboard/programs.py

@@ -78,7 +78,8 @@ class ProgramsFragmentView(EdxFragmentView):
             'progress': meter.progress(),
             'programs_subscription_data': programs_subscription_data,
             'user_preferences': get_user_preferences(user),
-            'is_user_b2c_subscriptions_enabled': is_user_b2c_subscriptions_enabled
+            'is_user_b2c_subscriptions_enabled': is_user_b2c_subscriptions_enabled,
+            'mobile_only': bool(mobile_only)
         }
         html = render_to_string('learner_dashboard/programs_fragment.html', context)
         programs_fragment = Fragment(html)

lms/static/js/learner_dashboard/models/program_subscription_model.js

@@ -110,14 +110,17 @@ class ProgramSubscriptionModel extends Backbone.Model {
         const trialEndTime = DateUtils.localizeTime(
             DateUtils.stringToMoment(trialEndDate),
             userTimezone
-        ).startOf('day');
+        );
         const currentTime = DateUtils.localizeTime(
             moment.utc(),
             userTimezone
-        ).startOf('day');
-
-        return trialEndTime.diff(currentTime, 'days');
+        );
 
+        return trialEndTime.diff(currentTime, 'days') < 1
+            ? // 0 if trial end time is less than 24 hrs
+              0
+            : // else return actual difference in days
+              trialEndTime.startOf('day').diff(currentTime.startOf('day'), 'days');
     }
 }
 

lms/static/js/learner_dashboard/program_list_factory.js

@@ -22,9 +22,11 @@ function ProgramListFactory(options) {
     }
 
     if (options.programsData.length) {
-        new HeaderView({
-            context: options,
-        }).render();
+        if (!options.mobileOnly) {
+            new HeaderView({
+                context: options,
+            }).render();
+        }
 
         const activeSubscriptions = options.programsSubscriptionData
             .filter(({ subscription_state }) => subscription_state === 'active')

lms/templates/learner_dashboard/programs_fragment.html

@@ -11,7 +11,9 @@ from openedx.core.djangolib.js_utils import (
 
 <div class="program-list-wrapper grid-container">
     <div class="program-list-container col-12 col-md-9">
-        <div class="js-program-list-header"></div>
+        % if not mobile_only:
+            <div class="js-program-list-header"></div>
+        % endif
         <div class="program-cards-container col"></div>
     </div>
     <div class="sidebar col-12 col-md-3"></div>
@@ -26,7 +28,8 @@ ProgramListFactory({
     programsSubscriptionData: ${programs_subscription_data | n, dump_js_escaped_json},
     userProgress: ${progress | n, dump_js_escaped_json},
     userPreferences: ${user_preferences | n, dump_js_escaped_json},
-    isUserB2CSubscriptionsEnabled: ${is_user_b2c_subscriptions_enabled | n, dump_js_escaped_json}
+    isUserB2CSubscriptionsEnabled: ${is_user_b2c_subscriptions_enabled | n, dump_js_escaped_json},
+    mobileOnly: ${mobile_only | n, dump_js_escaped_json}
 });
 </%static:webpack>
 </%block>