LiquidCode/LiquidCode_Frontend
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

articles view

Browse Source
This commit is contained in:
Виталий Лавшонок
2025-11-04 20:55:02 +03:00
parent cdb5595769
commit 42da6684ba
8 changed files with 472 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
src/views/home/articles/Articles.tsx
View File

@@ -1,9 +1,10 @@
import { useEffect } from 'react';
import { SecondaryButton } from '../../../components/button/SecondaryButton';
import { useAppDispatch } from '../../../redux/hooks';
import { useAppDispatch, useAppSelector } from '../../../redux/hooks';
import ArticleItem from './ArticleItem';
import { setMenuActivePage } from '../../../redux/slices/store';
import { useNavigate } from 'react-router-dom';
import { fetchArticles } from '../../../redux/slices/articles';
export interface Article {
id: number;
@@ -15,123 +16,16 @@ const Articles = () => {
const dispatch = useAppDispatch();
const navigate = useNavigate();
const articles: Article[] = [
{
id: 1,
name: 'Todo List App',
tags: ['Sertificated', 'state', 'list'],
},
{
id: 2,
name: 'Search Filter Component',
tags: ['filter', 'props', 'hooks'],
},
{
id: 3,
name: 'User Card List',
tags: ['components', 'props', 'array'],
},
{
id: 4,
name: 'Theme Switcher',
tags: ['Sertificated', 'theme', 'hooks'],
},
{
id: 2,
name: 'Search Filter Component',
tags: ['filter', 'props', 'hooks'],
},
{
id: 3,
name: 'User Card List',
tags: ['components', 'props', 'array'],
},
{
id: 4,
name: 'Theme Switcher',
tags: ['Sertificated', 'theme', 'hooks'],
},
{
id: 2,
name: 'Search Filter Component',
tags: ['filter', 'props', 'hooks'],
},
{
id: 3,
name: 'User Card List',
tags: ['components', 'props', 'array'],
},
{
id: 4,
name: 'Theme Switcher',
tags: ['Sertificated', 'theme', 'hooks'],
},
{
id: 2,
name: 'Search Filter Component',
tags: ['filter', 'props', 'hooks'],
},
{
id: 3,
name: 'User Card List',
tags: ['components', 'props', 'array'],
},
{
id: 4,
name: 'Theme Switcher',
tags: ['Sertificated', 'theme', 'hooks'],
},
{
id: 2,
name: 'Search Filter Component',
tags: ['filter', 'props', 'hooks'],
},
{
id: 3,
name: 'User Card List',
tags: ['components', 'props', 'array'],
},
{
id: 4,
name: 'Theme Switcher',
tags: ['Sertificated', 'theme', 'hooks'],
},
{
id: 2,
name: 'Search Filter Component',
tags: ['filter', 'props', 'hooks'],
},
{
id: 3,
name: 'User Card List',
tags: ['components', 'props', 'array'],
},
{
id: 4,
name: 'Theme Switcher',
tags: ['Sertificated', 'theme', 'hooks'],
},
{
id: 2,
name: 'Search Filter Component',
tags: ['filter', 'props', 'hooks'],
},
{
id: 3,
name: 'User Card List',
tags: ['components', 'props', 'array'],
},
{
id: 4,
name: 'Theme Switcher',
tags: ['Sertificated', 'theme', 'hooks'],
},
];
const articles = useAppSelector((state) => state.articles.articles);
const status = useAppSelector((state) => state.articles.statuses.fetchAll);
useEffect(() => {
dispatch(setMenuActivePage('articles'));
dispatch(fetchArticles({}));
}, []);
if (status == 'loading') return <div>Загрузка...</div>;
return (
<div className=" h-full w-full box-border p-[20px] pt-[20px]">
<div className="h-full box-border">