Can't deploy changes in tutor dev to tutor local in production

Site Operators Tutor Help
1

Hi everyone,

I have customized my tutor dev that looks almost exactly like what I wanted. I forked Authn and Profile MFEs repos, mounted and customized them. Everything seems to work fine, but when I deployed tutor local launch on the server, I created plugins for both Authn and Profile to load them from my git repo. I did all tutor images build mfe and relaunch.
What’s different is it seems indigo overrides all the styles of my customized MFEs. My customized MFEs styles only show up when I disable indigo plugin.
Anyone has any idea what I should do with tutor local to make it look the same as on my tutor dev or how I can set priority for MFE customization to be higher than indigo?

Your help is very much appreciated.

2

Can you share the content of these plugins? Also, what’s the name of your plugin? (I know, it’s a weird question)

3

Hi @regis,
This is the repo of my forked Authn: GitHub - kanharithsok/frontend-app-authn: Open edX micro-frontend application for new login and registration experience.

from tutormfe.hooks import MFE_APPS
@MFE_APPS.add()
def _add_my_mfe(mfes):
    mfes["authn"] = {
        "repository": "https://github.com/kanharithsok/frontend-app-authn.git",
        "port": 1999,
        "version": "master"
    }
    return mfes

This is the .py plugin that I created. I called it myauthn.py.
I have 3 plugins that are enabled: indigo, mfe, and myauthn.
When I tutor images build mfe and tutor local launch with 3 of these plugins enabled, I can’t see my customized Authn changes, but when I disable indigo plugin, I’m able to see my customized Authn.
Is there any config that I need to set to let myauthn.py plugin override indigo styles of Login/Registration screen?

4

Screenshot 2024-09-24 at 3.25.15 PM

Also, for Sign in button, what I notice is that when I tutor local launch, with indigo enabled, myauthn plugin enabled, I see that _login.scss overrides my styles in _login_page.scss, but when I tutor dev launch with Authn mounted and indigo enabled, _login.scss not showing up.

Not sure if I missed any steps for the deployment :cold_sweat:

5

The Indigo theme is going to install its own branding package in the authentication MFE:

RUN npm install '@edx/brand@npm:@edly-io/indigo-brand-openedx@^2.0.0'

Source: tutor-indigo/tutorindigo/plugin.py at 0cdea0473173ead96d9c8f7e21d823882e5b7d77 · overhangio/tutor-indigo · GitHub

If you don’t want Indigo to add that patch, then you’ll have to implement a “creative” hack:

@hooks.Filters.ENV_PATCHES.add()
def _remove_authn_patches(patches):
    new_patches = [patch for patch in patches if patch[0] != "mfe-dockerfile-post-npm-install-authn"]
    return new_patches
6

Thanks @regis,

It works :tada: