ユーザーページのAllタブへのリンクが機能しない

[your-diary]

ユーザーページのDifficulty Pies, AllといったタブのURLを開いたとき、真っ白なページが表示されます

AchievementタブやAtCoder Pie Chartsタブは正常に機能します

macOS版Firefox, Chromeで再現

前は確実に動いていて、おそらく3ヶ月前〜1ヶ月前から動かなくなっています

再現方法

1. 任意のユーザーのAllタブのページにアクセス(例: https://kenkoooo.com/atcoder/#/user/YourDiary?userPageTab=All)

2. 真っ白なページが表示される

Workaround

1. まず、Achievementタブのページにアクセス(例: https://kenkoooo.com/atcoder/#/user/YourDiary?userPageTab=Achievement)

2. Allタブに手動で移動

3. ちなみに、ここでブラウザをリロードすると真っ白な画面になる(Cmd+Shift+rによるforce refreshでも同様)

[hotate29]

DifficultyPieChartコンポーネントでエラーが起きているようです。

内部ではcontestMap = useContestMap()という形でcontest.jsonの情報を受け取っています。useContestMap()はcontest.jsonを読み込んでいる間はundefinedを返すようになっており、contestMapがundefinedになる可能性があります。これを確認せずにcontestMap.get()を呼び出してしまい、エラーが発生。という流れのようです。

AtCoderProblems/atcoder-problems-frontend/src/pages/UserPage/DifficultyPieChart/index.tsx

Lines 36 to 45 in 163bb96

	export const DifficultyPieChart: React.FC<Props> = (props) => {
	const [onlyRated, setOnlyRated] = useState(true);
	const contestMap = useContestMap();
	const problemModels = useProblemModelMap();
	const colorCount = new Map<RatingColor, number>();
	const allSubmissions = useUserSubmission(props.userId) ?? [];
	const submissions = allSubmissions.filter(
	(submission) =>
	isRatedContest(contestMap.get(submission.contest_id), 2) || !onlyRated
	);

対応としては、他のコンポーネント（MyAccountPageなど）の例に倣って読み込み中の表示を出すようにするとかでしょうか。

この処理は b49bac1 で追加されたようです。PRのマージと発生時期が概ね一致していますね（デプロイまでの時間もあるので、即反映という事ではないとは思いますが）。

しかしこういうのってlintに引っかかったりしませんかね。手元のVSCodeでは警告が出たのですが、yarn lintしても何も出ませんでした。TypeScriptのlint事情はよく知らないのでちょっと調べてみます。

[kenkoooo]

@your-diary @hotate29 #1369 を一旦リバートしました！調査ありがとうございます！！！

[your-diary]

@hotate29 調査ありがとうございます！
@kenkoooo ご対応ありがとうございます！

リンクが機能するようになったことが確認できたため、close致します。