Bootbox は非推奨です

開発
1

このコミット以降:

ダイアログ用の bootbox ライブラリは非推奨になりました。

開発者の皆様は、カスタムテーマやプラグインで bootbox の代わりにコアの dialog サービスを使用してください。bootbox ライブラリは、2023 年中にコア Discourse から完全に削除される予定です。

以下は、dialog サービスへの移行方法を示す、プラグインやテーマからの PR の例です。

「いいね！」 3
2

カスタムテーマで次のようなものがあります。

    bootbox.alert('alert text');

ダイアログサービスにはテーマからどのようにアクセスできますか？グローバルで利用可能ではないようです。

3

最も簡単な方法は、ルックアップを使用してサービスをロードすることです。以下にコード例を示します（これはテストされていませんが、Emberコンポーネント/コントローラー/ルートの外側でコア内でこれに似たものを使用しています）。

<script type="text/discourse-plugin" version="0.8">
  import { getOwner } from "discourse-common/lib/get-owner";
  const dialog = getOwner(this).lookup("service:dialog");
  dialog.alert('alert text');
</script>
「いいね！」 1
4

ありがとうございます。これを試しましたが、エラーが発生しました。
SyntaxError: /discourse/theme-11/initializers/theme-field-36-common-html-script-2: 'import' および 'export' はトップレベルでのみ使用できます。(13:4)

「いいね！」 1
5

ああ、そうですね。これらのスクリプトタグにはrequireを使用する必要があります。もし共有してもよろしければ、ここで何をしているのか、コード全体を教えていただけますか？この<script>タグの代替案を提案したいのですが、私たちが保守しているテーマコンポーネントのほとんどのテーマコードは、スタンドアロンのJSファイルに移行されており、ここでより一般的なリファクタリングを行う方が簡単な場合があります。

「いいね！」 1
6

提供ありがとうございます！以下が完全なスクリプトです（一部のテキストはわずかに変更されています）。このスクリプトは、Bootbox ポップアップが HTML タグを正しくレンダリングしなくなったことに気づくまで正常に動作していました。

<script type="text/discourse-plugin" version="0.8">
    if (typeof bootbox === 'undefined') {
        console.log('Cannot trigger undefined "bootbox"');

        return;
    }

    let currentUser = api.getCurrentUser();

    if (currentUser) {
        api.container.lookup('store:main').find('user', currentUser.username).then((user) => {
            let userGroups = user.groups.map(group => group.name);

            let bodyClasses = userGroups.map(group => `user-group--${group}`);

            document.querySelector('body').classList.add(...bodyClasses)

            let showPopup;

            switch(true) {
                case userGroups.includes('restricted_member'):
                    showPopup = true;
                    break;
                case userGroups.includes('users_all'):
                case userGroups.includes('officers'):
                    showPopup = false;
                    break;
                default:
                    showPopup = true;
                    break;
            }

            if (!showPopup) {
                return;
            }

            let alertHeading = '<h2>Oh no!</h2>';

            let alertBody = '<p>Your account is currently restricted and you no longer have access to valuable resources. <a href="https://meta.discourse.org">Click here</a> for more information.</p>';

            bootbox.alert(alertHeading + alertBody);
        });
    }
</script>
「いいね！」 1
7

Timさん、こんにちは。

こちらが代替案です。この内容はコンポーネントの初期化JSファイルに入れる必要があることに注意してください。完全なコンポーネント構造の簡単な例はこちらで確認できます。

import { withPluginApi } from "discourse/lib/plugin-api";
import { getOwner } from "discourse-common/lib/get-owner";
import { schedule } from "@ember/runloop";
import { htmlSafe } from "@ember/template";

export default {
  name: "tester-initializer",

  initialize() {
    withPluginApi("0.8", (api) => {
      const currentUser = api.getCurrentUser();

      if (currentUser) {
        const userGroups = currentUser.groups.map((group) => group.name);
        let showPopup = false;

        switch (true) {
          case userGroups.includes("admins"):
            showPopup = true;
            break;
        }

        if (!showPopup) {
          return;
        }

        const alertHeading = "Oh no!";
        const alertBody =
          'Your account is currently restricted and you no longer have access to valuable resources. <a href="https://meta.discourse.org">Click here</a> for more information.';

        schedule("afterRender", () => {
          // delay needed so that the dialog service is loaded
          const dialog = getOwner(this).lookup("service:dialog");
          dialog.alert({
            message: htmlSafe(alertBody),
            title: alertHeading,
          });
        });
      }
    });
  },
};

これで役立つことを願っています。

「いいね！」 3
8

完璧です。本当にありがとうございます！

「いいね！」 1
9

bootbox の非推奨は、この PR で完全に解決されました: https://github.com/discourse/discourse/pull/27443。OP の指示に従い、代わりに dialog サービスを使用してください。

「いいね！」 3
10

このトピックは11日後に自動的に閉じられました。返信はもうできません。