refactor: news

src/pages/News/News.css

@@ -2,6 +2,10 @@
     padding-top: 60px;
 }
 
+.news__title {
+    margin-bottom: 1rem;
+}
+
 .news__list {
     display: flex;
     flex-direction: column;

src/pages/News/News.tsx

@@ -7,12 +7,14 @@ import {
   type RootState,
 } from "../../stores/store";
 import { fetchAllNews } from "../../stores/slices/newsSlice";
+import { useTranslation } from "react-i18next";
 
 const News: React.FC = () => {
   const { news, isNewsLoading } = useAppSelector(
     (state: RootState) => state.news
   );
   const dispatch = useAppDispatch();
+  const { t } = useTranslation();
 
   useEffect(() => {
     dispatch(fetchAllNews());
@@ -20,12 +22,18 @@ const News: React.FC = () => {
 
   return (
     <div className="news wrapper">
+      <h3 className="news__title">{t("navs.news")}</h3>
+
       {isNewsLoading && news.length === 0 && (
         <div className="cloading__center">
           <CLoading />
         </div>
       )}
 
+      {!isNewsLoading && news.length === 0 && (
+        <p className="news__empty">{t("common.noData")}</p>
+      )}
+
       <div className="news__list">
         {news.map((item) => {
           return (