imastodon-inline-visibility

概要

imastodon.net（Mastodon 4.5 以降）の投稿欄で、「公開範囲と引用」のダイアログを開かずに、並んだアイコンのボタンを押すだけで公開範囲と引用範囲を切り替えられるようにする Tampermonkey 用のユーザースクリプト。JavaScript で書き、MIT ライセンスで公開している。現在の版は 3.0.2。

できること

• 投稿欄の公開範囲のボタンを、公開範囲（4 種類）と引用できる人（3 種類）の 2 列のボタンに置き換える
• 選んでいるボタンだけ名前を出し、ほかはアイコンとツールチップにする。色はテーマに追従する
• ←→キーで選択を切り替える
• 返信などで公開範囲が自動で変わったときも、ボタンに反映する

設計の判断

• 画面のクリックをまねるのではなく、React の内部から Redux のストアを取り、本家のボタンと同じ action を dispatch する。状態が本家とずれない代わりに、Mastodon の更新で動かなくなることがある
• フォロワーのみでは引用を「自分のみ」に固定する、編集中は公開範囲を変えられない、といった本家の制約を再現する。再現しない処理に関わる組み合わせ（引用中の「指定された相手のみ」）は選ばせない

つまずいた点

• ストアはタイムラインの更新などあらゆる action で通知してくるので、そのたびにボタンを描き直していた。関係する値が変わったときだけ描き直すようにした
• 画面の変化を MutationObserver で見張ると、変化が続く間は走査が何度も走る。requestAnimationFrame で 1 フレームに 1 回にまとめた

技術

• 言語：JavaScript
• 実行環境：Tampermonkey
• 使った仕組み：Mastodon の Web UI の React と Redux、MutationObserver
• アイコン：Material Symbols（Apache License 2.0）

リンク

• リポジトリ：GitHub
• 関連記事：準備中