From c2bc6f324802f61282705d06c7d025c54a32e08f Mon Sep 17 00:00:00 2001
From: Rafael Horvat <rafael.horvat@glowingblue.com>
Date: Wed, 27 Sep 2023 11:27:25 +0200
Subject: [PATCH] Use imported LanguageDropdown

---
 js/src/forum/compat.js                        |  5 --
 .../components/LanguageDropdown/Language.js   | 31 -------------
 .../LanguageDropdown/LanguageDropdown.js      | 46 -------------------
 js/src/forum/pages/BlogComposer.js            | 18 ++++++--
 js/src/forum/pages/BlogOverview.js            |  7 ++-
 js/webpack.config.js                          |  4 +-
 6 files changed, 23 insertions(+), 88 deletions(-)
 delete mode 100644 js/src/forum/components/LanguageDropdown/Language.js
 delete mode 100644 js/src/forum/components/LanguageDropdown/LanguageDropdown.js

diff --git a/js/src/forum/compat.js b/js/src/forum/compat.js
index 1a3f73f..7247a45 100644
--- a/js/src/forum/compat.js
+++ b/js/src/forum/compat.js
@@ -10,8 +10,6 @@ import Composer from './components/Composer/Composer';
 import ComposerPreview from './components/Composer/ComposerPreview';
 import FeaturedBlogItem from './components/FeaturedBlogItem';
 import ForumNav from './components/ForumNav';
-import Language from './components/LanguageDropdown/Language';
-import LanguageDropdown from './components/LanguageDropdown/LanguageDropdown';
 import BlogPostSettingsModal from './components/Modals/BlogPostSettingsModal';
 import RenameArticleModal from './components/Modals/RenameArticleModal';
 import BlogItem from './pages/BlogItem';
@@ -25,9 +23,6 @@ export default () => {
     'v17development/blog/components/Composer/Composer': Composer,
     'v17development/blog/components/Composer/ComposerPreview': ComposerPreview,
 
-    'v17development/blog/components/LanguageDropdown/Language': Language,
-    'v17development/blog/components/LanguageDropdown/LanguageDropdown': LanguageDropdown,
-
     'v17development/blog/components/Modals/BlogPostSettingsModal': BlogPostSettingsModal,
     'v17development/blog/components/Modals/RenameArticleModal': RenameArticleModal,
 
diff --git a/js/src/forum/components/LanguageDropdown/Language.js b/js/src/forum/components/LanguageDropdown/Language.js
deleted file mode 100644
index 7cb2f26..0000000
--- a/js/src/forum/components/LanguageDropdown/Language.js
+++ /dev/null
@@ -1,31 +0,0 @@
-import Component from 'flarum/common/Component';
-
-export default class Language extends Component {
-  oninit(vnode) {
-    super.oninit(vnode);
-
-    this.languages = app.store.all('discussion-languages');
-    this.options = this.languages.reduce((o, lang) => {
-      o[lang.code()] = (
-        <span>
-          <i className={'fas fa-globe'} /> {lang.name()}
-        </span>
-      );
-
-      return o;
-    }, this.attrs.extra || {});
-  }
-
-  view() {
-    const { language, uppercase } = this.attrs;
-    const name = language.name() || '';
-
-    return (
-      <span>
-        <i className={'fas fa-globe'} />
-        &nbsp;
-        {uppercase ? name.toUpperCase() : name}
-      </span>
-    );
-  }
-}
diff --git a/js/src/forum/components/LanguageDropdown/LanguageDropdown.js b/js/src/forum/components/LanguageDropdown/LanguageDropdown.js
deleted file mode 100644
index 5f2c02c..0000000
--- a/js/src/forum/components/LanguageDropdown/LanguageDropdown.js
+++ /dev/null
@@ -1,46 +0,0 @@
-import Component from 'flarum/common/Component';
-import Dropdown from 'flarum/common/components/Dropdown';
-import Button from 'flarum/common/components/Button';
-import Language from './Language';
-
-export default class LanguageDropdown extends Component {
-  oninit(vnode) {
-    super.oninit(vnode);
-    this.languages = app.store.all('discussion-languages');
-    this.options = this.languages.reduce((o, lang) => {
-      o[lang.code()] = <Language language={lang} />;
-
-      return o;
-    }, this.attrs.extra || {});
-  }
-
-  view() {
-    const selected = this.attrs.selected;
-
-    return Dropdown.component(
-      {
-        buttonClassName: 'Button',
-        label: this.options[selected] || this.options[this.attrs.default],
-      },
-      Object.keys(this.options).map((key) => {
-        let defaultSelected;
-        if (app.forum.attribute('fof-discussion-language.composerLocaleDefault')) {
-          defaultSelected = 'any';
-        } else {
-          defaultSelected = app.translator.formatter.locale;
-        }
-        const isSelected = selected || defaultSelected;
-        const active = key === isSelected;
-
-        return Button.component(
-          {
-            active,
-            icon: active ? 'fas fa-check' : true,
-            onclick: () => this.attrs.onclick(key),
-          },
-          this.options[key]
-        );
-      })
-    );
-  }
-}
diff --git a/js/src/forum/pages/BlogComposer.js b/js/src/forum/pages/BlogComposer.js
index ad503f1..1637626 100644
--- a/js/src/forum/pages/BlogComposer.js
+++ b/js/src/forum/pages/BlogComposer.js
@@ -7,8 +7,9 @@ import RenameArticleModal from '../components/Modals/RenameArticleModal';
 import TagDiscussionModal from 'flarum/tags/components/TagDiscussionModal';
 import BlogPostSettingsModal from '../components/Modals/BlogPostSettingsModal';
 import Composer from '../components/Composer/Composer';
-import LanguageDropdown from '../components/LanguageDropdown/LanguageDropdown';
 import ItemList from 'flarum/common/utils/ItemList';
+import Stream from 'flarum/common/utils/Stream';
+import { components } from '@fof-discussion-language';
 
 export default class BlogComposer extends Page {
   oninit(vnode) {
@@ -32,7 +33,7 @@ export default class BlogComposer extends Page {
     this.bodyClass = 'BlogItemPage BlogItemPage--composer';
 
     // Article data
-    this.articleLanguage = m.route.param('lang') ? m.route.param('lang') : app.translator.locale;
+    this.articleLanguage = new Stream(m.route.param('lang') ? m.route.param('lang') : app.translator.locale);
     this.article = app.store.createRecord('discussions');
     this.blogMeta = null;
 
@@ -153,6 +154,11 @@ export default class BlogComposer extends Page {
 
     const blogImage = this.blogMeta && this.blogMeta.featuredImage() ? `url(${this.blogMeta.featuredImage()})` : defaultImage;
 
+    let LanguageDropdown;
+    if ('fof-discussion-language' in flarum.extensions) {
+      LanguageDropdown = components.LanguageDropdown;
+    }
+
     items.add(
       'content',
       <div className="FlarumBlog-Article-Content">
@@ -168,7 +174,13 @@ export default class BlogComposer extends Page {
         <div className={'FlarumBlog-Article-Content-Edit-Button'}>
           <div className={this.languages.length === 0 ? 'FlarumBlog-Article-Content-Edit-Dropdown' : 'FlarumBlog-Article-Content-EditButtons'}>
             {this.languages !== null && this.languages.length >= 1 && (
-              <LanguageDropdown selected={this.articleLanguage} onclick={(language) => (this.articleLanguage = language)} />
+              <LanguageDropdown
+                selected={this.articleLanguage()}
+                onclick={(language) => {
+                  this.articleLanguage(language);
+                  m.redraw();
+                }}
+              />
             )}
 
             <Button className={'Button'} onclick={(e) => this.openBlogSettings(e)} icon={'fas fa-pencil-alt'} loading={this.isSaving}>
diff --git a/js/src/forum/pages/BlogOverview.js b/js/src/forum/pages/BlogOverview.js
index d4ec760..2760ca6 100644
--- a/js/src/forum/pages/BlogOverview.js
+++ b/js/src/forum/pages/BlogOverview.js
@@ -5,7 +5,7 @@ import Page from 'flarum/common/components/Page';
 import Button from 'flarum/common/components/Button';
 import BlogCategories from '../components/BlogCategories';
 import Link from 'flarum/common/components/Link';
-import LanguageDropdown from '../components/LanguageDropdown/LanguageDropdown';
+import { components } from '@fof-discussion-language';
 import ForumNav from '../components/ForumNav';
 import BlogOverviewItem from '../components/BlogOverviewItem';
 import FeaturedBlogItem from '../components/FeaturedBlogItem';
@@ -138,6 +138,11 @@ export default class BlogOverview extends Page {
       ? `url(${app.forum.attribute('baseUrl') + '/assets/' + app.forum.attribute('blogDefaultImage')})`
       : null;
 
+    let LanguageDropdown;
+    if ('fof-discussion-language' in flarum.extensions) {
+      LanguageDropdown = components.LanguageDropdown;
+    }
+
     return [
       app.forum.attribute('blogAddHero') == true && IndexPage.prototype.hero(),
       <div className={'FlarumBlogOverview'}>
diff --git a/js/webpack.config.js b/js/webpack.config.js
index 70ca017..7716174 100644
--- a/js/webpack.config.js
+++ b/js/webpack.config.js
@@ -1,5 +1,5 @@
-const config = require("flarum-webpack-config");
+const config = require('flarum-webpack-config');
 
 module.exports = config({
-  useExtensions: ["fof-upload"],
+  useExtensions: ['fof-upload', 'fof-discussion-language'],
 });