add column settings into the hashtag timelines

[fvh-P]

2017/12/03 Modified

Add column settings into the hashtag timelines. It enables to set the following settings for each hashtag columns.

• Favourite tag Add/Remove button (Added on 03 Dec., 2017)
  If the tag has already added to favourites, Show a Remove button.
  Otherwise, Show two Add buttons (public/unlisted)
• Show local only (true / false)
  If true, only server-internal toots are shown.
• Show replies (true / false) (Removed on 03 Dec., 2017. Because of タグTLにunlistedなリプライが流れないように #107)
  If false, replies are not shown. (タグTL上にin_reply_to入りのreply投稿も表示されてしまう #92)
• Regex filter (string)
  Filter out the toots based on the regular expression.

カラム設定をハッシュタグタイムラインに追加します。これによってそれぞれのハッシュタグカラムごとに以下の設定が可能になります。

• お気に入りタグ登録/解除ボタン (2017/12/03追加)
  すでにお気に入りに追加されていれば解除ボタンを、そうでなければ2つの追加ボタン(公開/未収載)を表示します。
• ローカルのみ表示 (true / false)
  trueならサーバ内部のトゥートのみ表示します。(タグストリームをlocalに切り替えます)
• Show replies (true / false) (2017/12/03に削除しました。タグTLにunlistedなリプライが流れないように #107 で解決されたためです。)
  falseならリプライを表示しません。 (タグTL上にin_reply_to入りのreply投稿も表示されてしまう #92)
• Regex filter (string)
  正規表現にマッチしたトゥートを非表示にします。

settingsのinitialStateにtag: ImmutableMap()をつくり、その内部にtagIdをキーとして

ImmutableMap({
  shows: ImmutableMap({
    local: false,
  }),

  regex: ImmutableMap({
    body: '',
  }),
});

という構造を動的に格納しています。
SettingToggleやSettingTextにsettingsを渡すときに、settings.get(`${tagId}`)がundefinedであった場合、上記の構造を初期値としてSettingToggleやSettingTextに渡します。

確認済み

• 各設定トグルのスイッチ動作やテキストボックスの入力動作、正規表現が正しく動作すること。
• リロードしたときに各カラムの設定が復元されること
• ストリームの切り替え
  自環境で確認する術がないため確認可能な方に確認していただきたいです。
  (2017/12/03)Chromeのデバッガーで、WebSocketの接続先が適切に切り替わっていることを確認しました。

要確認

• リプライ表示/非表示の切り替え
  　ホームカラムのものをそのまま持ってきましたが動くかどうか不安です。
  　(自環境ではそもそもホームでもこの設定が動いていないように見える)
  2017/12/03解決。(機能削除のため)

また私のReact・Reduxについての知識は非常にあいまいで、変なコードを書いている可能性があるのでどんどんReviewをお願いします。

間違えて押しました

[fvh-P]

#107 でリプライ表示に関するものは解決されたと思うので、Show repliesトグルは削除しました。

また、お気に入りタグ登録/解除ボタンをカラム設定エリアのトップに表示する機能を追加しました。
既に登録済みのタグの場合は解除ボタンを1つ、未登録のタグの場合は登録ボタンを2つ(公開/未収載)表示します。非公開での登録ボタンは使用頻度が少ないと思われるうえに、設定エリアの縦幅が長くなっていってしまうので表示しません。（要望があれば対応します。）

[fvh-P]

また、#62 においても示されている通り、現在お気に入りタグの登録名は大文字小文字が区別されているため、大文字小文字含めて完全に一致するタグが登録されているときのみ解除ボタンが表示されます。

お気に入りタグについてこの仕様をどうするかはまた検討が必要かと思います。個人的には、大文字小文字が違うだけで、同じタグであっても別の公開範囲で登録しておけるのでこのままでもいいかなとは思いますが、お気に入りタグ一覧からタグカラムへ飛ぶとカラムidが小文字に直されてしまうため、大文字が入っているタグをクリックしてタグカラムに飛んでも、すべて小文字になっている同じタグが登録されていない限り「解除ボタン」ではなく「登録ボタン」が表示されるという動作になってしまうので、どうしたものかという感じです。

[takayamaki]

お気に入りタグ一覧からタグカラムへ飛ぶとカラムidが小文字に直されてしまう

についてはその元となる #62 が本家 tootsuite#4804 にて修正済みであるため、 #64 は戻してしまって問題ないと思います。

が、それはそうとReactのエラーが出ていて動作の確認自体が出来ておらず、調べたところnpmの
react-immutable-proptypes パッケージではnumber自体存在しないようなのですがそのあたりご確認いただけますでしょうか。

[fvh-P]

column_settings.jsの23行目
tagId: ImmutablePropTypes.number.isRequired, ではなく、正しくは
tagId: PropTypes.number.isRequired, でした。

[takayamaki]

お気に入りタグの登録/解除については動作を確認しました。

ColumnSettingsコンポーネント、SettingToggleコンポーネント、SettingTextコンポーネントについて、propのtagIDにnumberではなくstringが渡されているというwarnが出ていますので、これは直してください。
お気に入りタグの登録/解除が既に動作していることを考えると、propTypeをstringにして、prop名をtagにしたほうがきれいかなと思います。
また、キーワードミュートが動作していないように見えます。

[fvh-P]

idはstringでしたね失礼しました。

正規表現フィルタは tootsuite#4225で自分の投稿は必ず表示したままという仕様に変わったはずなのでこれで動いていると思います。違うアカウントに切り替えてやってみてください。

[takayamaki]

ColumnSettingsコンポーネント、SettingToggleコンポーネント、SettingTextコンポーネントにpropsのtagが流れてきていません。
/app/javascript/mastodon/features/hashtag_timeline/index.js および各コンテナの修正漏れだと思われます。

[fvh-P]

これでどうでしょう。

[takayamaki]

propsのエラーは解消されました。

しかし、ミュートについては2つめのユーザを作成して試してみましたがハッシュタグTLのもののみ引き続き動作しませんでした。

[fvh-P]

まだtagIdのまま残ってるところがいくつかありました。おそらくそれの影響かと思います。

[takayamaki]

LGTM