Merge pull request #285 from mitodl/misc_improvements

Misc. improvements - dashboard style, root route, enrollment admin
mitodl · May 16, 2019 · fb796eb · fb796eb
2 parents 2f976b9 + 436dd6e
commit fb796eb
Show file tree

Hide file tree

Showing 7 changed files with 60 additions and 15 deletions.
diff --git a/courses/admin.py b/courses/admin.py
@@ -4,7 +4,7 @@
 
 from django.contrib import admin
 
-from .models import Program, Course, CourseRun
+from .models import Program, Course, CourseRun, ProgramEnrollment, CourseRunEnrollment
 
 
 class ProgramAdmin(admin.ModelAdmin):
@@ -31,6 +31,20 @@ class CourseRunAdmin(admin.ModelAdmin):
     list_filter = ["live", "course"]
 
 
+class ProgramEnrollmentAdmin(admin.ModelAdmin):
+    """Admin for ProgramEnrollment"""
+
+    model = ProgramEnrollment
+
+
+class CourseRunEnrollmentAdmin(admin.ModelAdmin):
+    """Admin for CourseRunEnrollment"""
+
+    model = CourseRunEnrollment
+
+
 admin.site.register(Program, ProgramAdmin)
 admin.site.register(Course, CourseAdmin)
 admin.site.register(CourseRun, CourseRunAdmin)
+admin.site.register(ProgramEnrollment, ProgramEnrollmentAdmin)
+admin.site.register(CourseRunEnrollment, CourseRunEnrollmentAdmin)
diff --git a/courses/views_test.py b/courses/views_test.py
@@ -189,7 +189,7 @@ def test_course_catalog_view(client):
     CourseFactory.create(no_program=True, live=False)
     exp_programs = [program]
     exp_courses = [course_in_program, course_no_program]
-    resp = client.get(reverse("mitxpro-index"))
+    resp = client.get(reverse("mitxpro-catalog"))
     assert resp.templates[0].name == "catalog.html"
     assert list(resp.context["programs"]) == exp_programs
     assert list(resp.context["courses"]) == exp_courses

diff --git a/mitxpro/urls.py b/mitxpro/urls.py
@@ -63,7 +63,8 @@
         name="password-reset-confirm",
     ),
     path("terms-and-conditions/", index, name="terms-and-conditions"),
-    re_path(r"catalog/", CourseCatalogView.as_view(), name="mitxpro-index"),
+    re_path(r"^catalog/", CourseCatalogView.as_view(), name="mitxpro-catalog"),
+    re_path(r"^$", CourseCatalogView.as_view(), name="mitxpro-index"),
     re_path(r"^dashboard/", index, name="user-dashboard"),
     # Wagtail
     re_path(r"^cms/", include(wagtailadmin_urls)),

diff --git a/mitxpro/urls_test.py b/mitxpro/urls_test.py
@@ -9,4 +9,4 @@ class URLTests(TestCase):
 
     def test_urls(self):
         """Make sure URLs match with resolved names"""
-        assert reverse("mitxpro-index") == "/catalog/"
+        assert reverse("mitxpro-catalog") == "/catalog/"
diff --git a/static/js/containers/pages/DashboardPage.js b/static/js/containers/pages/DashboardPage.js
@@ -31,6 +31,16 @@ export class DashboardPage extends React.Component<Props, State> {
     collapseVisible: {}
   }
 
+  enrollmentsExist = (): boolean => {
+    const { enrollments } = this.props
+
+    return (
+      enrollments &&
+      (enrollments.program_enrollments.length > 0 ||
+        enrollments.course_run_enrollments.length > 0)
+    )
+  }
+
   onCollapseToggle = (programEnrollmentId: number): void => {
     this.setState({
       collapseVisible: {
@@ -160,12 +170,18 @@ export class DashboardPage extends React.Component<Props, State> {
   render() {
     const { enrollments } = this.props
 
+    const enrollmentsExist = this.enrollmentsExist()
+
     return (
       <div className="user-dashboard container-fluid">
         <div className="row">
           <div className="header col-12">
             <h1>Dashboard</h1>
-            <h3>Courses and Programs</h3>
+            {enrollmentsExist ? (
+              <h3>Courses and Programs</h3>
+            ) : (
+              <h2>You are not yet enrolled in any courses or programs.</h2>
+            )}
           </div>
         </div>
         {enrollments ? (

diff --git a/static/js/containers/pages/DashboardPage_test.js b/static/js/containers/pages/DashboardPage_test.js
@@ -70,6 +70,24 @@ describe("DashboardPage", () => {
     )
   })
 
+  it("shows a message if the user has no enrollments", async () => {
+    const { inner } = await renderPage({
+      entities: {
+        enrollments: {
+          program_enrollments:    [],
+          course_run_enrollments: []
+        }
+      }
+    })
+
+    const header = inner.find(".user-dashboard .header")
+    assert.isTrue(header.exists())
+    assert.include(
+      header.text(),
+      "You are not yet enrolled in any courses or programs"
+    )
+  })
+
   it("shows specific date information", async () => {
     const { inner } = await renderPage()
     sinon.assert.calledWith(

diff --git a/static/scss/dashboard.scss b/static/scss/dashboard.scss
@@ -18,16 +18,17 @@
   }
 
   h2 {
-    font-size: 1.75rem;
+    font-size: 2rem;
     font-weight: 600;
+    line-height: 2.75rem;
 
     @include media-breakpoint-down(sm) {
-      font-size: 1.25rem;
+      font-size: 1.6rem;
     }
   }
 
   h3 {
-    font-size: 1.25rem;
+    font-size: 1.75rem;
     font-weight: 600;
     color: $navy-blue;
     border-bottom: 1px solid $detail-grid-border-color;
@@ -43,11 +44,11 @@
 
 .user-dashboard,
 .collapse-toggle {
-  font-size: 20px;
+  font-size: 2rem;
   font-weight: 600;
 
   @include media-breakpoint-down(sm) {
-    font-size: 16px;
+    font-size: 1.6rem;
   }
 }
 
@@ -99,11 +100,6 @@
     .course-enrollment {
       margin-top: 15px;
       margin-bottom: 15px;
-
-      h2 {
-        font-size: 20px;
-        font-weight: 600;
-      }
     }
   }