WSTEAM1-827: Add EMP core work.

[shayneahchoon]

Resolves WSTEAM1-827

Overall changes

Adds a dynamic Media Player component that loads the correct embedded media player for a user device.
Article Page:

Live Page:

Code changes

• An EMP loader has been added here src/app/components/MediaPlayer/index.tsx
• A BUMP settings builder has been added here /src/app/components/MediaPlayer/utils/buildSettings.ts
• Parameter extractor functions have been modified to fit BUMP requirements here src/app/legacy/containers/MediaPlayer/helpers/propsInference/default/index.js
• Added the EMP loader to LivePage

Testing

1. For localhost:
2. In your terminal, run sudo -- sh -c -e "echo '127.0.0.1 localhost.bbc.com' >> /etc/hosts";.
3. For the Express app: Go to http://localhost.bbc.com:7080/afaanoromoo/articles/c4g19kgl85ko and check that the video loads.
4. For the NextJS app: Go to http://localhost.bbc.com:7081/pidgin/live/c7p765ynk9qt?renderer_env=test and check that the video loads.

Helpful Links

Add Links to useful resources related to this PR if applicable.

Coding Standards

Repository use guidelines

[amoore108]

This looks like a great start, thanks for all the hard work!

[amoore108]

Just thinking, do we need to use the Test mediator if we're on the Test environment in general? We tend to not use the renderer_env flag on Test, as the environment variables should determine what to use behind the scenes.

I'm not 100% sure the videos will work when this is deployed to Test if we aren't using the Test mediator.

[shayneahchoon]

I put this one in to apply this setting: { mediator: { host: 'open.test.bbc.co.uk' } }

[shayneahchoon]

I figured that way, we could easily switch between live and test assets when doing development on our localhost.

[shayneahchoon]

I could switch it the other way round so that { mediator: { host: 'open.test.bbc.co.uk' } } is applied by default, but removed if it's on live?

[amoore108]

I think its ok for localhost, I'm just thinking when its deployed to Test, will we need to remember to add in renderer_env=test to get the video player to work correctly?

[amoore108]

My gut feeling is that the mediator value should default to the environment its on and then we override it with the renderer_env query param.

So on local/test it defaults to { mediator: { host: 'open.test.bbc.co.uk' } } and we use renderer_env flags to override it if needed.
On Live mediator is removed entirely and cannot be overridden.

[shayneahchoon]

Coolio

[amoore108]

Something along these lines may work:

switch (true) {
  // Conditions to use Test Mediator
  case queryParams.get('renderer_env') === 'test':
  case isLocal():
  case isTest():
    return true;
  // Conditions to use Live Mediator
  case queryParams.get('renderer_env') === 'live' && !isLive():
    return false;
  default:
    return false;
}

The ordering of the cases is important, so the above may not work and require a bit of testing to get it just right. if statements maybe clearer for this.

[Isabella-Mitchell]

Looks good - thanks for going through it! A few notes from our call

• Will need to check that this doesn't break if editorial try to upload audio before we support it.
• Will need to update the NextJS threat model with BUMP/ our Runbook before it goes to production.