One-click enrollment via org dashboard card titles

[ChristopherChudzicki]

What are the relevant tickets?

Closes https://github.com/mitodl/hq/issues/8803

Description (What does it do?)

In the org dashboard, clicking on the card title and "Start Module" buttons now behaves the same—"one-click" enrollment with "Just-in-time"d dialog if profile info missing..

How can this be tested?

Assuming you have MITxOnline <> Learn integrated locally AND a b2b org set up, with at least one user in it: If not, see "Detailed Instructions" below.

1. Using an admin account on your local MITxOnline, find your Org user on the page http://mitxonline.odl.local:8013/admin/users/user/ and ensure it has no birth year or country set.
   • country is in an expandable section labeled "Legal address"
   • birth year is in an expandable section labeled "user profile"
2. Using your Org User, view your org dashboard, and try enrolling in a course. You should get the "JIT Dialog" where you can enter country/birth year.
3. After submitting the form, you should (1) be enrolled in the course, and (2) redirected to the course. Redirect won't work if you don't have openedx set up;. that's ok.
4. Unenroll in the course and try again. This time you should not get the "just in time" dialog.

Detailed Setup Instructions

In order to test this, you need a basic installation of mitxonline up and running with example data in it. You may be able to skip one or more steps if you have already done them:

• Ensure you have local hosts redirects for the following domains, replacing the example IP with your local IP address (Google how to get this if unsure, mine is 192.168.1.50)
  `
  192.168.1.50 open.odl.local
  192.168.1.50 api.open.odl.local
  192.168.1.50 kc.ol.local
  192.168.1.50 mitxonline.odl.local

- Clone `mitxonline`: https://github.com/mitodl/mitxonline
- Create a `.env` file with the following values:

CELERY_TASK_ALWAYS_EAGER=True
DJANGO_LOG_LEVEL=INFO
LOG_LEVEL=INFO
SENTRY_LOG_LEVEL=ERROR
MAILGUN_KEY=fake
MAILGUN_URL=
MAILGUN_RECIPIENT_OVERRIDE=
MAILGUN_SENDER_DOMAIN=.odl.local
SECRET_KEY=
STATUS_TOKEN=
UWSGI_THREADS=5
SENTRY_DSN=
MITX_ONLINE_BASE_URL=http://open.odl.local:8065/mitxonline
MITX_ONLINE_ADMIN_CLIENT_ID=refine-local-client-id
MITX_ONLINE_ADMIN_BASE_URL=http://mitxonline.odl.local:8016
POSTHOG_PROJECT_API_KEY=
POSTHOG_API_HOST=https://app.posthog.com/
HUBSPOT_HOME_PAGE_FORM_GUID=
HUBSPOT_PORTAL_ID=
APISIX_PORT=9080

APISIX/Keycloak settings

APISIX_LOGOUT_URL=http://api.open.odl.local:8065/logout/
APISIX_SESSION_SECRET_KEY=supertopsecret1234
KC_SPI_THEME_WELCOME_THEME=scim
KC_SPI_REALM_RESTAPI_EXTENSION_SCIM_LICENSE_KEY=
KEYCLOAK_BASE_URL=http://kc.ol.local:8066
KEYCLOAK_CLIENT_ID=apisix

This is not a secret. This is for the Keycloak container, only for local use.

KEYCLOAK_CLIENT_SECRET=HckCZXToXfaetbBx0Fo3xbjnC468oMi4 # pragma: allowlist-secret
KEYCLOAK_DISCOVERY_URL=http://kc.ol.local:8066/realms/ol-local/.well-known/openid-configuration
KEYCLOAK_REALM_NAME=ol-local
KEYCLOAK_SCOPES="openid profile ol-profile"
KEYCLOAK_SVC_KEYSTORE_PASSWORD=supertopsecret1234
KEYCLOAK_SVC_HOSTNAME=kc.ol.local
KEYCLOAK_SVC_ADMIN=admin
KEYCLOAK_SVC_ADMIN_PASSWORD=admin
AUTHORIZATION_URL=http://kc.ol.local:8066/realms/ol-local/protocol/openid-connect/auth
ACCESS_TOKEN_URL=http://kc.ol.local:8066/realms/ol-local/protocol/openid-connect/token
OIDC_ENDPOINT=http://kc.ol.local:8066/realms/ol-local
SOCIAL_AUTH_OL_OIDC_OIDC_ENDPOINT=http://kc.ol.local:8066/realms/ol-local
SOCIAL_AUTH_OL_OIDC_KEY=apisix

This is not a secret. This is for the Keycloak container, only for local use.

SOCIAL_AUTH_OL_OIDC_SECRET=HckCZXToXfaetbBx0Fo3xbjnC468oMi4 # pragma: allowlist-secret
USERINFO_URL=http://kc.ol.local:8066/realms/ol-local/protocol/openid-connect/userinfo
MITOL_APIGATEWAY_DISABLE_MIDDLEWARE=False

FEATURE_IGNORE_EDX_FAILURES=True
OPENEDX_API_CLIENT_ID=fake
OPENEDX_API_CLIENT_SECRET=fake
OPENEDX_SERVICE_WORKER_API_TOKEN=fake

CSRF_COOKIE_DOMAIN=.odl.local
CORS_ALLOWED_ORIGINS=http://mitxonline.odl.local:8065, http://open.odl.local:8062, http://api.open.odl.local:8065
CSRF_TRUSTED_ORIGINS=http://mitxonline.odl.local:8065, http://open.odl.local:8062, http://api.open.odl.local:8065

- Spin up `mitxonline` with `docker compose up --build -d`
- Promote the admin user with `docker compose exec web ./manage.py promote_user promote --superuser --email admin@odl.local`
- Populate test course data with `docker compose exec web ./manage.py populate_course_data`
- Generate docs with `pants docs ::`
- In `dist/sphinx/index.html`, read the section on generating a B2B organization / contract and create one, adding some of the test courses to it
- In Django admin, create a `Program` and add the courses to the program that are included in your B2B org, making sure to mark the program as "live"
- Make sure your user is associated with the B2B org you created
- Make sure you have a personal Posthog project configured and have the API key at the ready
- Before we spin up `mit-learn`, we need to set some env variables:

.env
...
MITX_ONLINE_UPSTREAM=mitxonline.odl.local:8013
MITX_ONLINE_DOMAIN=mitxonline.odl.local
MITX_ONLINE_BASE_URL=http://mitxonline.odl.local:8065
POSTHOG_ENABLED=True
CSRF_COOKIE_DOMAIN=.odl.local

shared.local.env
POSTHOG_PROJECT_API_KEY=YOUR_API_KEY_HERE
POSTHOG_PROJECT_ID=YOUR_PROJECT_ID_HERE
POSTHOG_TIMEOUT_MS=1500

- In your Posthog project, enable the `enrollment-dashboard` and `mitlearn-organization-dashboard` feature flags for all users
- Spin up `MIT Learn`
- Open an Incognito tab
- Browse to the site and click Log In
- Instead of logging in, create an account (this can be done by using a gmail address and then adding a `+` sign after your username, then adding any string)
- In Django admin in your normal browser window, logged in as an admin, set your test user you just created to be part of your B2B org
- Refresh the dashboard in the Incognito window and click on the org tab
- Click Start Module on any course
- You should be prompted with the just in time dialog
- Fill out a country and year of birth and submit it
- Verify that you are redirected to the courseware URL (this will not actually load if you have not properly configured the OpenEdx <-> MITx Online connection
- Browse back to the dashboard and attempt to click Start Module on any of the other courses
- Instead of showing the popup, you should be redirected to the courseware because this information is now set


</details>

[jonkafton]

All looks good!

[jonkafton]

Noticing in the Django admin we have

and on the DashboardCourse -

const EnrollmentStatus = {
  NotEnrolled: "not_enrolled",
  Enrolled: "enrolled",
  Completed: "completed",
} as const

Unenrolling in the dashboard sets the status to unenrolled, but setting values in the admin has no effect. Not sure if this is of consequence.

[ChristopherChudzicki]

I .... do not know what the CourseRunEnrollment status in the admin panel is for :/

[jonkafton]

Very handy! I guess there's no easy way to type for n arrays. I tried without success.

[ChristopherChudzicki]

Yeah, I don't think there is. I know this is how Lodash does some of its types (e.g., https://github.com/DefinitelyTyped/DefinitelyTyped/blob/cec7feb2e975c135a7aefe44ab8ce6ca328d226f/types/lodash/common/array.d.ts#L1983)