You need to sign in or sign up before continuing.
index.tsx 1.31 KB
Newer Older
Ken's avatar
Ken committed
1 2 3
import { handleLoading } from "app/globalSlice";
import { useAppDispatch, useAppSelector } from "app/hooks";
import { newsDetailSelector } from "app/selectors";
4
import WrapperContainer from "components/WrapperContainer";
Ken's avatar
Ken committed
5 6 7 8
import React, { useEffect } from "react";
import { useParams } from "react-router-dom";
import { purifyHTML } from "utils/helpers/purifyHTML";
import { getNewsDetail } from "./newsDetailSlice";
Ken's avatar
Ken committed
9 10

const NewsDetail = () => {
Ken's avatar
Ken committed
11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36
  const dispatch = useAppDispatch();
  const { newsDetail } = useAppSelector(newsDetailSelector);
  const { id } = useParams();

  useEffect(() => {
    dispatch(handleLoading(true));

    try {
      if (id) {
        const fetchData = async () => {
          await dispatch(getNewsDetail(id));
        };

        fetchData();
      }
    } catch (err) {
      console.error("ERROR: ", err);
    } finally {
      dispatch(handleLoading(false));
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [id]);

  return (
    <>
      {newsDetail ? (
37 38 39 40 41 42 43 44
        <WrapperContainer className="news-detail py-4">
          <div
            className=""
            dangerouslySetInnerHTML={{
              __html: purifyHTML(newsDetail.content),
            }}
          ></div>
        </WrapperContainer>
Ken's avatar
Ken committed
45 46 47 48 49
      ) : (
        <div></div>
      )}
    </>
  );
Ken's avatar
Ken committed
50 51 52
};

export default NewsDetail;