Merge pull request #3944 from Klauswk/FixUnselectableOption

Fix unselectable 'Choose Language' and fallback lang error.

bigbluebutton-html5/imports/startup/client/intl.js

@@ -15,6 +15,7 @@ class IntlStartup extends Component {
 
     this.state = {
       messages: {},
+      appLocale : this.props.locale,
     };
     
     this.fetchLocalizedMessages = this.fetchLocalizedMessages.bind(this);
@@ -27,7 +28,14 @@ class IntlStartup extends Component {
 
     baseControls.updateLoadingState(true);
     fetch(url)
-      .then(response => response.json())
+      .then(response => {
+        if (response.ok) {
+          return response.json();
+        } else {
+          this.setState({appLocale: 'en'});
+          return response.json();
+        }
+      })
       .then(messages => {
         this.setState({ messages }, () => {
           baseControls.updateLoadingState(false);
@@ -40,18 +48,19 @@ class IntlStartup extends Component {
   }
 
   componentWillMount() {
-    this.fetchLocalizedMessages(this.props.locale);
+    this.fetchLocalizedMessages(this.state.appLocale);
   }
 
   componentWillUpdate(nextProps, nextState) {
     if (this.props.locale !== nextProps.locale) {
+      this.setState({appLocale: nextProps.locale});
       this.fetchLocalizedMessages(nextProps.locale);
     }
   }
 
   render() {
     return (
-      <IntlProvider locale={this.props.locale} messages={this.state.messages}>
+      <IntlProvider locale={this.state.appLocale} messages={this.state.messages}>
         {this.props.children}
       </IntlProvider>
     );

bigbluebutton-html5/imports/startup/server/index.js

@@ -24,9 +24,8 @@ WebApp.connectHandlers.use('/locale', (req, res) => {
   let defaultLocale = APP_CONFIG.defaultLocale;
   let localeRegion = req.query.locale.split('-');
   let messages = {};
-
   let locales = [defaultLocale, localeRegion[0]];
-
+  let statusCode = 200;
   if (localeRegion.length > 1) {
     locales.push(`${localeRegion[0]}_${localeRegion[1].toUpperCase()}`);
   }
@@ -36,14 +35,15 @@ WebApp.connectHandlers.use('/locale', (req, res) => {
       const data = Assets.getText(`locales/${locale}.json`);
       messages = Object.assign(messages, JSON.parse(data));
     } catch (e) {
-      // console.error(e);
-      // We dont really care about those errors since they will be a parse error
-      // or a file not found which is ok
+      //Variant Also Negotiates Status-Code, to alert the client that we
+      //do not support the following lang.
+      //https://en.wikipedia.org/wiki/Content_negotiation
+      statusCode = 506;
     }
   });
 
   res.setHeader('Content-Type', 'application/json');
-  res.writeHead(200);
+  res.writeHead(statusCode);
   res.end(JSON.stringify(messages));
 });
 

bigbluebutton-html5/imports/ui/components/settings/submenus/application/component.jsx

@@ -181,7 +181,7 @@ class ApplicationMenu extends BaseMenu {
                   defaultValue={this.state.settings.locale}
                   className={styles.select}
                   onChange={this.handleSelectChange.bind(this, 'locale', availableLocales)}>
-                  <option>
+                  <option disabled={true}>
                     { availableLocales &&
                       availableLocales.length ?
                       intl.formatMessage(intlMessages.languageOptionLabel) :