Southball

Results 17 comments of Southball

たぶん recharts での `` を使うと何とかできると思います。([ここの例](https://recharts.org/en-US/examples/SynchronizedLineChart)と似ているかな)

AtCoder は今 Bootstrap 3.3.6 を使っていますが、Problems は Bootstrap 4.4.1 (`yarn.lock` には 4.3.1…) を使っていますから、スタイルは大きな差があるかもしれません。 AtCoder の CSS ファイルでこの [gist](https://gist.github.com/1969b0dd8dd3ae9e6b722fe0e6f0421f) の URL を得た。これを基づいてテーマを作成することができると思います。 表示できる情報を増やすために `$table-cell-padding: .5rem;` (デフォルトは `.75rem`)とかの設定を変更すればできると考えています。

今はもう SCSS が使えるので、ライトテーマの色・他の色の変数を変えたいなら変えられます。 例えば、情報密度を上げたいなら、こういうことができます。(どう変えればいいんですかまた分かりませんけど) ```scss // src/style/_common.scss $spacer: .75rem; $table-cell-padding: .5rem; ``` Before: ![Screenshot_20200627-164555](https://user-images.githubusercontent.com/6523469/85918507-fb102a80-b895-11ea-8854-ead3d3e01112.jpg) With `$spacer: .75rem;` and `$table-cell-padding: .5rem;`: ![Screenshot_20200627-164648](https://user-images.githubusercontent.com/6523469/85918509-fcd9ee00-b895-11ea-8e30-2d6f22dcc857.jpg)

これは server-side rendering しなければ解決できなさそうです… Twitter や Facebook はクライアントサイドの JavaScript を実行しないので、react-helmet の meta tag はカードに反映しません。 https://github.com/geelen/react-snapshot このようなライブラリーもあるけどバーチャルコンテストのページには使えないでしょう。

この機能の実装について考えていますが、レコードが多いのでどこで扱ったらいいのかはまたわかりません。 クライアントから数百のリクエストを送るのはよくないので、サーバー(`ProgressResetManager`)で扱ったらいいと思ったが、 なのでちょっと難しいかもしれません。 もちろん、ID を一つずつ insert クエリを作ればできますが、遅くなる心配があります。

> > > そもそもリセット機能をどのくらいの人が使っているか分からないので、それを測ってからで良さそう。 そうですね… #726 のデーターならちょっと少ない気がする。

`react-table` をちょっと使ってみました。 確かにロジックと UI を分かれると便利です。 Type definition がつらかったです。`@types/react-table` をインストールして、そして `react-table-config.d.ts` を作らなければならないです。( を参照。) それに、このファイルは使った hook を反映して、編集する必要がありますが、正しい type definition が作れないかもしれません。例えば、sortBy のあるテーブルが一つあって、sortBy のないテーブルが一つあれば、正しいタイプが作れないです。 > ( より) > > ## Configuration Using Declaration Merging...

この機能、昔作ろうと思った時、 * Join は重いか重くないか。特に `get_recent_contest_info` のようなよくリクエストされる(?)path に join を入れるかと思いました。(Index があるので多分大丈夫かな) * また始めていないコンテストの問題数を見ても大丈夫ですか などの問題点について考えました。 でも、役立つ機能だそうですね。特に個人ページのテーブルに。

ちょっと調べましたが、`merged-problems.json` で JOI の問題の `point` が全部 `null` になっているのでその情報がないと(少なくとも JOI の問題の部分点は)実装できないではないかなと思います。 ちなみに、`merged-problems.json` の中の 4349 問の中に `point` が `null` ではない問題は 1670 問あります。

> > > 効果が実感できると良くて、Heatmap みたいなやつで、各マスを「その日に解いた最大の diff の色で塗る」とかやると、やりこんでいる人は灰からだんだん茶、緑、…と色が変わっていくさまが見えるかもしれない。 作ってみました。いいですね。 ![image](https://user-images.githubusercontent.com/6523469/82545153-cf0fd400-9b88-11ea-9b37-93ad3f3cd806.png) ![image](https://user-images.githubusercontent.com/6523469/82545417-3cbc0000-9b89-11ea-90fd-0915b9b6c1c4.png)