チャットの表示をparallel routesにする

[na-trium-144]

• 今チャット内容を表示している場所に、いきなりチャットの内容を表示する代わりに、「このセクションのチャット一覧」を表示する
  • 幅が広いPCの場合、チャットの見出しのリストを表示
  • 幅が狭いPCの場合、コメントアイコン → 押すとリストをポップアップで表示
• チャット本体は、slackやdiscordのスレッドのようにサイドバーみたいにする
  • https://nextjs.org/docs/15/app/api-reference/file-conventions/parallel-routes を使い、@chat/chat/[chatId]/page.tsx と @docs/docs/[docsId]/page.tsx を作ると、
  • docs/[docsId] へのリンクをクリックすると今開いているチャットはそのままドキュメントが切り替わり、
  • chat/[chatId] へのリンクをクリックすると今開いているドキュメントはそのままチャットが切り替わる
  • という動作になるはず。
  • もしかしたらもう1段ディレクトリを作ったほうがトップページと混ざらなくて作りやすいかもしれない? (docs/@docs/docs/[docsId]/page.tsx と docs/@chat/chat/[chatId]/page.tsx とか)
    • ディレクトリ構造はあとからでも変えられるので、やりやすいやり方でお願いします
  • アプリ内のページ遷移ではなく直接外から chat/[chatId] のurlを開いた場合にチャットだけ表示されてドキュメントはnullという状態になってしまうが、その場合にはページ表示後?に対応するドキュメントを探して開く必要がある (後回しでも良い)
• スマホの場合(幅が狭いPC よりもさらに幅が狭い場合)、チャットの見出しリストとチャット本体がそれぞれ全画面表示
  • ただ、urlやディレクトリ構造を変える必要はなく、スマホ表示ではchatがnullでないときドキュメントを隠してチャットを表示する、という仕様にすれば良さそう

Originally posted by @na-trium-144 in #59 (comment)