[fix]お知らせ欄を更新日時順に変更

[riririn180904]

対応Issue

resolve #1941

概要

• お知らせ欄を更新日時順が新しい順に表示されるように変更

実装詳細

画面スクリーンショット等

テスト項目

• お知らせ欄が新しい順に表示されているか
• お知らせを 管理者画面から新規作成、編集した場合も更新順に表示されるか

備考

前のPRのレビューで指摘されたconst部分消したらエラーになったのでそのままにしてあります

[hikahana]

できればですが、毎回PR消さなくても良いです！
どこで何のコメントしてどうなっているかの情報把握が少し面倒になりそうなので！！！
お願いします～

[hikahana]

ちょっと差分以外のところにコメントできないからここで
下みたいにsortedNewsを消したところをnewsにしたらエラー無く動くと思っているんだけどどうですかね？
エラーの詳細についても貼ってもらえるとうれしいかもです。

const { news, error, isLoading } = useGetNews();

～略～

  const newsList = news.map((item, index) => {
    const date = formattedDates[index] ?? 'お知らせはありません。';

[riririn180904]

const { news, error, isLoading } = useGetNews();
これ全部消したときはこれが出ました↓

あとsortedNewsのところnewsにしてみたんですけどundefindになっちゃいましたね…
const newsList = (news ?? []).map((item, index) => { const date = formattedDates[index] ?? 'お知らせはありません。';
GPTに相談してこんな感じに変更したら動きましたがどうでしょう？

[hikahana]

これで解決できると思われ

const NewsList: FC<NewsListProps> = () => {
  const { news, error, isLoading } = useGetNews();
  if (news === undefined) return [];

  const formattedDates = news.map((item) => {
    const date = new Date(item.createdAt);
    const formattedDate = format(date, 'yyyy/MM/dd');
    return formattedDate;
  });

  const newsList = news.map((item, index) => {
    const date = formattedDates[index] ?? 'お知らせはありません。';

    return (
      <div key={item.id} className="flex flex-col gap-2">
        <span className="w-24 text-base font-medium text-font">{date}</span>
        <span className="w-full whitespace-pre-line text-base font-medium text-font">
          {item.body}
        </span>
      </div>
    );
  });

[hikahana]

これで解決できると思われ

const NewsList: FC<NewsListProps> = () => {
  const { news, error, isLoading } = useGetNews();
  if (news === undefined) return [];

  const formattedDates = news.map((item) => {
    const date = new Date(item.createdAt);
    const formattedDate = format(date, 'yyyy/MM/dd');
    return formattedDate;
  });

  const newsList = news.map((item, index) => {
    const date = formattedDates[index] ?? 'お知らせはありません。';

    return (
      <div key={item.id} className="flex flex-col gap-2">
        <span className="w-24 text-base font-medium text-font">{date}</span>
        <span className="w-full whitespace-pre-line text-base font-medium text-font">
          {item.body}
        </span>
      </div>
    );
  });