付けたい

• HackerRank から移植された問題用にタブを作る
• Open Contest 自体の情報は API から取れないので，自前で用意して結合する

• https://twitter.com/___n___z/status/1251941758717444097

yukicoder problemsの星が表示されません。
Chrome Version 81.0.4044.113 (Official Build) (64-bit)

ユーザ名未入力状態には色は消すようにしたい

maspyさんはTwitterを使っています 「@iiljj 雑対処ですが、上下を逆にすると、◯色以上という見方をしやすくなるかもしれません。」 / Twitter

• 定期的にコンテスト外問題が提供されているので，これを TablePage に表示するべき
  • 例：yukicoder公式アカウントさんはTwitterを使っています 「また突然ですが、 https://t.co/GyG7BkGu3J 26日のAM9:00に問題が公開されます。 雰囲気だけは、前の問題と似てるような感じはます よろしくお願いします。 #yukicoder」 / Twitter
• Open Contests タブと統合して， Other Problems タブとする案があるので，まずはこれをベースにする
  • 脱葉さんはTwitterを使っています 「@iiljj 有志コンと同じタブでいいのでは」 / Twitter

設定値を復元できたほうが便利なので．

「無」の期間を除いて，実質的な精進をしている期間のみ取り出して図を見たいというケースはありそう．

API から取れる Solved 数 = yukicoder 公式のユーザページ上に表示される「AC問題数」，が， Solved Problems に表示される問題の数よりも少ないっぽいので，原因を調査する．
API側の何かしらの仕様っぽい？

https://twitter.com/cs_c_r_5/status/1236889107302739968

AtCoder Problems の方でもかなり前に外していたので．

React.FC is preferable to JSX.Element.

モバイル UI にぎりぎり切り替わらない程度の狭さだと「A... B... C... D...」のようになってしまう

https://twitter.com/sugarknri/status/1236537344389304321

yukicoder problems、problem listの検索欄の挙動が本家と違いそう。（本家では、shortest/fastest所持者の名前なども検索対象）

AtCoder Problems には求められていそうなので，yukicoder problems に試しに入れてみてもいい
kenkoooo/AtCoderProblems#402

<> ボタンで移動はできるが，Reset するまでの間，年のプルダウンがおかしくなる

上図の最初2問はACしているので緑背景にならなければならない

問題の概要

• 現状，7問以上構成の yukicoder contest XXX が開催されると， yukicoder contest (long) タブ内に表示する仕様としているが，この仕様がわかりづらいとの声がある

問題の詳細・原因

• TablePage を開いたユーザは， YukicoderRegularTable に yukicoder contest の全問題が含まれていることを期待する可能性がある
  • 一部コンテストが別タブに移動していることの説明が特にないことも一因
  • 特に7問以上構成の yukicoder contest 終了直後，最新のコンテストが YukicoderRegularTable に含まれない（longタブ内に表示している）状態になるので，戸惑うユーザもいる
• Writer/Tester 目線では，問題が YukicoderRegularTable に表示されたほうが動線の確保が容易で好ましいと考えられる
• タブを操作して (long) タブへ移動する動線が頼りないのは，各タブ内のコンテンツ量の差も手伝っているかもしれない
  • AtCoder Problems では ABC/ARC/AGC/... と多くのタブを用意しているが，その動線は問題となっていない．ユーザは「AGCの問題を見よう」というように目的を持ってタブを移動すると考えられる．
  • (regular) タブから (long) タブへの移動は，上述の例ほど明確な目的を持って行われるとは考えづらい
• 今後，仮に7問以上構成のコンテスト割合が増えれば，コンテンツ量の相対的な差は小さくなる
  • ...ので，その時になって (long) タブが市民権を得るまで，この問題を保留するという選択肢もある

yukicoder 公式がユーザーLv. の小数点以下2桁まで＋あと★いくつで次のレベルに上がるかを表示するようになったので，追従したほうがユーザ的に嬉しいかもしれない

yukicoder 上での表示例

ユーザーLv. 6.39 （レベルアップまで★ * 17）

• API から，単一問題ごとのリクエストでは統計情報が取れるようになった
• これを上手く使えたら嬉しいので，問題ごとに詳細を出すための UI を用意できたらする

★いくつの問題を何問，だけでなく，合計で何問なのかも，同じ Tooltip に載せたほうがよい

https://twitter.com/tatyam_prime/status/1253430170087653377

銅 : #965C2C, #FFDABD
銀 : #808080, #F5F5F5
金 : #CCA11F, #FFF93F

AtCoder Problems は銅は変えたっぽいので，少なくとも銅は変えたほうがいい

• HackerRank から11問が移植されたため，OpenContest として登録する
  • yukicoder公式アカウントさんはTwitterを使っています 「【お知らせ】 No.1128〜No.1138 の問題を公開しました。 難易度がついてないものもそのまま公開しています。 #yukicoder」 / Twitter
• 移植に向かない問題が欠番となっている
  • 脱葉さんはTwitterを使っています 「@iiljj @null_0124 C,H,I,L,N,P,Qは欠番でお願いします」 / Twitter
  • 移植コンテストの欠番が今後も発生しうることを考えると，OpenContest に関しては欠番を扱えるようにするべき

ユーザ名未入力時は当該行を表示しないようにする

前日までの streak が繋がった状態で，当日に Unique AC を出していない状態だと Current Streak が 0 になってしまう模様．

• Fastest Submission が提出 #0 になる
  • これは実際には存在せず 404 が返ってくることがわかっているので， 0 なら不採用とする
• Shortest, Pure Shortest が空欄になる
  • RankingMergedProblem にはショートコード提出情報が含まれないが，問題ごとのリクエストに対するレスポンスには提出IDが含まれているので，リンクは表示可能
  • RankingMergedProblem に情報があったらそれを使う，なかったら問題単体リクエストで得た情報でリンクを表示する

AtCoder Problems が Difficulty ごとの Pie Chart を入れたので，yukicoder problems にも入れたい

AtCoder Problems のように，他の人と比較できる機能があると嬉しい

• YukicoderRegularTable は，埋め終わったコンテストのセル背景が緑になる．
• ContestTable は，埋め終わっても表示が変わらないので，それとわかる可視化を行いたい．
  • たとえば，コンテスト名の左側に緑色の check マークが付く，など．

• 長いタイトルが...で省略される場合など，title 属性があったほうが好ましい場面がある
• 画像のような表示になることが望ましい

TattさんはTwitterを使っています 「yukicoder problems Level 17に到達していたかと思ったら微妙に到達していなかった！ (yukicoderのプロフィールページでは「ユーザーLv. 17 （レベルアップまで★ * 28）」と表示されています。) https://t.co/zNE9fYRdEH」 / Twitter

• @types が用意されていない react-router 6 などはひとまず放置
• 型を付けられる部分から徐々に付けていきたい

API のアップデートにより未証明問題の分類が登場したため，これに対応する必要がある．

問題タイプ 0は通常問題,1は教育的問題,2はスコア形式問題 3はネタ問題,4は未証明問題

• Swagger UI

範囲を狭めると後から広くできない．

現状は☆1~☆6までの11段階にAtCの11色が振り分けられているが，実際の難易度対応としては
y a
1.0 easy(黒)
1.5 灰
2.0 茶
2.5 緑
3.0 水
3.5 青
4.0 黄
4.5 橙
5.0 赤
5.5 銀冠
6.0 金冠
な気がしていて(yukicoderのhelp参照)，難易度対応を1段階ずらした方が(大まかな難易度が分かり易いので)いいのでないか
という提案です．

Swagger UI

ProblemType | integer
問題タイプ 0は通常問題,1は教育的問題,2はスコア形式問題 3はネタ問題

区分の数字と問題タイプとの対応が判明したので，これに即した表示にする

AtCoder Problems の Max Difficulty Heatmap と同様のものがあった方がよい．

https://twitter.com/yukicoder/status/1236566168615276544

cachedProblemArrayのキャッシュが効いてないようで
https://yukicoder.me/api/v1/problems
が2回投げられているようです。

• heroku/react-refetch: A simple, declarative, and composable way to fetch data for React components

• 未証明問題などを含むかどうか切り替えられるようにする
  • AtCoder Problems の「Including 🧪」ボタンと同じように

Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
in UserPage (at App.js:44)

があったらいいかもしれない．

• YukicoderRegularTable など表示がもたつくので，高速化したい
• fetch はそれほど時間がかかっていないが，その後のマージに時間がかかっている模様
  • このあたりをうまくやる

kenkoooo/AtCoderProblems#535 と同じ問題

たとえば regular コンテストのすべての A 問題をACしている場合，ヘッダの A のセル背景色を緑色にする，というような機能を試験的に導入してもよいかもしれない．

• AtCoder Problems に Streak Sum なる概念が登場した
• 同様のものを表示することで，次のような効果があるかもしれない
  • 継続的にACを重ねているかどうかについて，より実情に即した情報を提示できる
  • Streak を切らしたときの精神的ダメージが軽減できる