> ## Documentation Index
> Fetch the complete documentation index at: https://wb-21fd5541-update-reference-docs-60.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Chat with ARIA

export const AriaChatBubbles = ({prompt, response}) => {
  const [isDark, setIsDark] = useState(false);
  const [promptCopied, setPromptCopied] = useState(false);
  useEffect(() => {
    const root = document.documentElement;
    const sync = () => setIsDark(root.classList.contains('dark'));
    sync();
    const obs = new MutationObserver(sync);
    obs.observe(root, {
      attributes: true,
      attributeFilter: ['class']
    });
    return () => obs.disconnect();
  }, []);
  useEffect(() => {
    if (!promptCopied) {
      return undefined;
    }
    const timeout = setTimeout(() => setPromptCopied(false), 2000);
    return () => clearTimeout(timeout);
  }, [promptCopied]);
  const copyText = text => {
    navigator.clipboard.writeText(text).then(() => setPromptCopied(true)).catch(console.error);
  };
  const userBg = isDark ? '#363C44' : '#F8F8F8';
  const userBorder = isDark ? '#4B535C' : '#DFE0E2';
  const textColor = isDark ? '#E8E8E9' : '#2B3038';
  const iconColor = isDark ? '#8F949E' : '#79808A';
  const iconHoverBg = isDark ? 'rgba(255,255,255,0.10)' : 'rgba(0,0,0,0.05)';
  const bubbleText = {
    fontSize: '15px',
    color: textColor,
    overflowWrap: 'anywhere'
  };
  const bubbleBase = {
    maxWidth: '85%'
  };
  const copyIcon = promptCopied ? <svg aria-hidden="true" focusable="false" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" style={{
    color: '#FCBC32'
  }}>
      <path d="M20 6 9 17l-5-5" />
    </svg> : <svg aria-hidden="true" focusable="false" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
      <rect width="14" height="14" x="8" y="8" rx="2" ry="2" />
      <path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" />
    </svg>;
  return <div aria-label="ARIA chat example" className="not-prose flex flex-col gap-3" role="group">
      {}
      <div className="flex w-full justify-end">
        <div className="flex w-fit items-start gap-1 rounded-2xl py-2 pl-3 pr-1.5" style={{
    ...bubbleBase,
    backgroundColor: userBg,
    border: `1px solid ${userBorder}`
  }}>
          <div className="min-w-0 flex-1 hyphens-auto whitespace-pre-wrap" style={bubbleText}>
            {prompt}
          </div>
          <button type="button" className="mt-0.5 shrink-0 rounded-lg p-1.5 cursor-pointer" style={{
    color: iconColor,
    background: 'transparent'
  }} onMouseEnter={e => {
    e.currentTarget.style.backgroundColor = iconHoverBg;
  }} onMouseLeave={e => {
    e.currentTarget.style.backgroundColor = 'transparent';
  }} onClick={() => copyText(prompt)} aria-label="Copy user prompt">
            {copyIcon}
          </button>
        </div>
      </div>
      {}
      <div className="flex w-full justify-start">
        <div className="w-fit rounded-2xl py-2 px-3" style={{
    ...bubbleBase,
    border: '1px solid #CDF4F7'
  }}>
          <div className="hyphens-auto whitespace-pre-wrap" style={bubbleText}>
            {response}
          </div>
        </div>
      </div>
    </div>;
};

<Note>
  [W\&B Multi-tenant Cloud](/ja/platform/hosting/#wb-multi-tenant-cloud) でのみ利用できます。
</Note>

このページでは、チャットの開始と再開、フォローアップメッセージのキューイング、Runs や画像などのコンテキストの追加、応答に対するフィードバックの提供など、ARIA との会話を管理する方法について説明します。

<div id="start-a-new-chat">
  ## 新しいチャットを開始する
</div>

新しいチャットを開始するには、ARIA を開き、チャットウィンドウの右上にある鉛筆アイコンをクリックします。

複数のチャットを同時並行で進めることができます。チャットウィンドウを閉じていても、チャットに返信があると ARIA から通知されます。

新しいチャットを開始しても、以前の会話は削除されません。[以前の会話を表示する](/ja/aria/chat#view-chat-history)には、チャットウィンドウの左上にある 3 本線をクリックしてチャット履歴を開きます。

<div id="send-a-message">
  ## メッセージを送信する
</div>

メッセージを入力し、**Enter** を押して送信します。

* **Shift+Enter** を押すと改行できます。
* **+** をクリックして画像を追加します。
* run 参照を追加するには、`<Icon icon="at" iconType="solid"/>` と入力し、リストから run を選択します。入力すると、リストをフィルターしたり、あいまい検索したりできます。
* より柔軟に操作するには、テキストエディターで複雑なメッセージを作成して貼り付けます。プレーンテキストに対応しており、貼り付けた `@` 文字は run 参照として解決されません。

現在の操作をキャンセルし、次の[キューに入っているメッセージ](#queue-messages)を\_すぐに\_送信するには、テキスト入力欄の右にある停止アイコンを押します。

<div id="queue-messages">
  ## キュー内のメッセージ
</div>

メッセージキューには、ARIA の処理中に送信した後続のタスクや質問が保持されます。ARIA は、会話全体をコンテキストとして使用し、キューに入れられた各メッセージを順番に実行します。前のメッセージが完了すると、すぐに次のメッセージが実行されます。

キューを使用すると、ステップごとにチャットに戻って送信する代わりに、複数のステップを一度に並べて、その場を離れることができます。たとえば、まず比較を依頼できます。

<AriaChatBubbles prompt="直近の 10 件の Runs を比較し、最も影響の大きかったハイパーパラメーターを教えてください。" response="これら 10 件の Runs における検証損失のばらつきの大部分は、学習率とバッチサイズによるものです。各 run の詳細を以下に示します。" />

ARIA の処理中に、追加のリクエストをチャットウィンドウに送信できます。W\&B は保留中のリクエストを ARIA のキューに追加します。

この例では、2 つのメッセージを同時に送信します。

```text title="Queued messages" theme={null}
これらの run について、学習率に対する検証損失をチャートにしてください。

その比較内容を、チームで共有できる report にまとめてください。
```

キューのヘッダーには、待機中のメッセージ数が表示されます。キューに入っている各メッセージには、3 つの操作があります。

* **鉛筆アイコン** (<Icon icon="pencil" iconType="solid" />): ARIA が実行する前にメッセージを編集します。ARIA はメッセージをメッセージボックスに移動してキューから削除するため、キューに入れ直すにはもう一度送信します。メッセージボックスにすでに下書きがある場合、この操作は使用できません。
* **上矢印アイコン** (<Icon icon="arrow-up" iconType="solid" />): 順番を待たずに、メッセージを今すぐ実行します。ARIA は現在の処理を中断し、このメッセージを次に実行します。キュー内の他のメッセージの順序は維持されます。
* **ごみ箱アイコン** (<Icon icon="trash" iconType="solid" />): キューからメッセージを削除します。

キューに入っているメッセージには、[run メンション](/ja/aria/chat#add-context-to-a-conversation)や[画像](/ja/aria/chat#add-an-image-to-a-conversation)を含め、添付したコンテキストが保持されます。

キューで実行するには会話が必要なため、キューイングはチャットで最初のメッセージを送信した後に開始されます。最初に送信するメッセージと、キューが空のアイドル状態のチャットに送信するメッセージは、すぐに ARIA に送られます。各チャットには独自のキューがあり、閉じたチャットのキューも引き続き実行されます。

ARIA が続行前に確認への回答や許可を求める場合、応答するまでキューは一時停止します。先に応答せずにキュー内のメッセージを実行するには、その横にある上矢印アイコンをクリックします。

<div id="view-chat-history">
  ## チャット履歴を表示する
</div>

以前の会話を表示するには、次の手順に従います。

1. ARIA を開きます。
2. チャットウィンドウの左上にある 3 本線をクリックして、チャット履歴を開きます。
3. 会話を選択します。

W\&B では、ARIA との会話は project ごと、および日付ごとに整理されます。チャット履歴から選択すると、以前の会話を再開できます。また、会話の横にあるごみ箱アイコンをクリックして、[会話を削除する](/ja/aria/chat#delete-previous-conversations)こともできます。

<div id="delete-previous-conversations">
  ## 以前の会話を削除する
</div>

以前の会話を削除するには、次の手順に従ってください。

1. ARIA を開きます。
2. チャットウィンドウの左上にある 3 本線をクリックして、チャット履歴を開きます。
3. 削除したい会話の横にあるごみ箱アイコンをクリックします。

<div id="undock-chat-window">
  ## チャットウィンドウを切り離す
</div>

チャットウィンドウを別ウィンドウとして切り離すことができます。これにより、エージェントの応答を project データと並べて表示できます。

チャットを切り離すには、チャットウィンドウの右上にある閉じる (**X**) ボタンの横の切り離しアイコンをクリックします。

<div id="add-context-to-a-conversation">
  ## 会話にコンテキストを追加する
</div>

`@` 記号を使用して、プロンプト内で特定の run を指定できます。たとえば、プロンプトにその run 名を含めることで、ARIA に特定の run を分析するよう依頼できます。

```text title="User prompt" theme={null}
Analyze the run @run-20230615_123456-abcdefg and summarize the results
```

<div id="add-an-image-to-a-conversation">
  ## 会話に画像を追加する
</div>

チャットウィンドウの左下にあるプラスアイコン (`+`) をクリックすると、会話に画像を追加できます。その後、ARIA に画像の分析や説明を依頼できます。

<div id="provide-feedback">
  ## フィードバックを送信する
</div>

ARIA の応答についてフィードバックを送信するには、応答の末尾にあるサムズアップまたはサムズダウンのアイコンをクリックします。お寄せいただいたフィードバックは、W\&B による ARIA のパフォーマンスと精度の向上に役立ちます。

W\&B における ARIA のデータ利用の取り扱いについては、[ガバナンスとセキュリティ](/ja/aria/governance)を参照してください。
