ChatChannelSettingsSection component: remove hardcoded email

[Rafi993]

Describe the bug

Email yo@dev.to is hardcoded in component app/javascript/chat/ChatChannelSettings/ChatChannelSettingsSection.jsx

Expected behavior

Email should be fetched from the settings

Desktop:

• OS, version: Ubuntu 20.04
• Browser, version: Brave Version 1.12.112 Chromium: 84.0.4147.125 (Official Build) (64-bit)

[github-actions]

Thanks for the issue! We'll take your request into consideration and follow up if we decide to tackle this issue.

To our amazing contributors: issues labeled type: bug are always up for grabs, but for feature requests, please wait until we add a ready for dev before starting to work on it.

To claim an issue to work on, please leave a comment. If you've claimed the issue and need help, please ping @forem/oss and we will follow up within 3 business days.

For full info on how to contribute, please check out our contributors guide.

[Rafi993]

Hello there. If this issue is not taken I would like to help.

[rhymes]

I've assigned you the issue. How do you plan to tackle this?

[Rafi993]

Right now email is available via rails helper email_link. These could be exposed to the Javascript side by couple of ways

1. Expose helpers output as Globals

<script type="javascript">
  window.email = <%= email_link %>
</script>

We could build a Javascript (using some helper) that sets these globals that gets included in the app/views/layouts/application.html.erb

2. Create a route that exposes config as json like GET /config

[Rafi993]

I feel like there could be a better way. any thoughts on this?

[rhymes]

My thought was to simply add the email somewhere in the DOM of the page where the chat is mounted but not sure if that's the best approach either. I remember we have a way to pass data from Rails to webpack but I don't remember where is that used and I can't find it in the docs.

cc @nickytonline

[nickytonline]

You can create a webpacker pack file that is an erb template. The webpack loader to do this is already in place. See https://github.com/usabilityhub/rails-erb-loader for an example of how to do this.

The pack file can get the value from the Rails side and then pass it in as a prop to a component.

One thing to note is that you will not be able to test this file in jest, which is why making the pack file an erb template makes the most sense.