Skip to content

Commit f5e018a

Browse files
CREDO23CREDO23
authored
Message error (kaliacad#170)
* feat: add message error * feat: add menus
1 parent 2e77541 commit f5e018a

File tree

3 files changed

+27
-36
lines changed

3 files changed

+27
-36
lines changed

‎src/App.jsx‎

Lines changed: 0 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,10 @@
1-
import SetDate from './components/setdate/setdate';
2-
import MostArticleByProject from './components/MostArticleByProject';
3-
import Button from './components/Button.jsx';
4-
import ExportDropdownButton from './components/DropdownExport.jsx';
5-
import { Menu } from './components/Menu';
6-
import { datab } from '../data';
7-
8-
import { useState } from 'react';
91
import TopVisited from './components/TopVisited.jsx';
10-
import WikiAfricaTopArticles from './components/africanArticlesList.jsx';
112
import { Footer } from './components/footer.jsx';
123
function App() {
13-
const titre = 'Pays';
14-
const handleClick = () => {};
15-
const [showArticles, setShowArticles] = useState(false);
16-
const handleClicked = () => {
17-
setShowArticles(!showArticles);
18-
};
194
return (
205
<div>
216
<div className='container mx-auto py-4'>
22-
<div className='flex align-center justify-center py-8'>
23-
<ExportDropdownButton />
24-
<button onClick={handleClicked}>Toggle Articles/Gallery</button>
25-
</div>
267
<TopVisited />
27-
<SetDate />
28-
<Menu data={datab} title={titre} />
29-
<MostArticleByProject project='fr.wikipedia' />
30-
<Button text='submit' event={handleClick}></Button>
31-
<WikiAfricaTopArticles />
328
</div>
339
<Footer />
3410
</div>

‎src/components/NavBar.jsx‎

Lines changed: 20 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,26 @@ const NavBar = () => {
1111
};
1212

1313
return (
14-
<nav className='navbar'>
15-
<div className='navbar-logo'>
16-
Emi - <span className='font-normal'>articles les plus visités par pays</span>
17-
</div>
18-
<div className='navbar-help'>
14+
<nav className='flex items-center justify-between bg-blue-800 h-16 px-6 py-2'>
15+
<a href='/' target='_blank'>
16+
<div className='text-white text-xl font-bold'>
17+
Emi - <span className=' font-light'>articles les plus visités par pays</span>
18+
</div>
19+
</a>
20+
21+
<div className='flex items-center justify-between'>
22+
<ul className='flex items-center justify-center gap-4 text-white'>
23+
<li>
24+
<a href='/page-views' className=' text-white underline' target='_blank'>
25+
Page views
26+
</a>
27+
</li>
28+
<li>
29+
<a href='/top-africa' className=' text-white underline' target='_blank'>
30+
Top Africa
31+
</a>
32+
</li>
33+
</ul>
1934
<button onClick={toggleHelpMenu} className='help-icon'>
2035
Aide ▼
2136
</button>
@@ -46,10 +61,6 @@ const NavBar = () => {
4661
</div>
4762
)}
4863
</div>
49-
{/* <div className='navbar-search'>
50-
<input type='text' className={`search-input`} placeholder='Search...' />
51-
<button className='search-icon'>🔍</button>
52-
</div> */}
5364
</nav>
5465
);
5566
};

‎src/components/TopVisited.jsx‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import ArticleForm from './ArticleForm';
44
import ArticleCard from './ArticleCard';
55
import fetchArticles from '../helpers/fetchdata';
66
import Pagination from './Pagination';
7+
import Loading from './loading';
78

89
const TopVisited = () => {
910
const [loading, setLoading] = useState(false);
@@ -39,12 +40,14 @@ const TopVisited = () => {
3940
setError('No articles found for the given parameters.');
4041
}
4142
} catch (error) {
42-
setArticles([]);
43-
if (error.code === 'ECONNABORTED') {
43+
if (typeof error === 'string') {
44+
setError(error);
45+
} else if (error.code === 'ECONNABORTED') {
4446
setError('Request timed out. Please try again.');
4547
} else {
4648
setError(error.response ? error.response.data : error.message);
4749
}
50+
setArticles([]);
4851
} finally {
4952
setLoading(false);
5053
}
@@ -142,7 +145,7 @@ const TopVisited = () => {
142145
)}
143146

144147
<div className='articles'>
145-
{articles?.length > 0 ? (
148+
{articles && articles?.length > 0 ? (
146149
<div>
147150
<ul className='flex flex-wrap items-center justify-center pt-[2rem]'>
148151
{paginatedItems?.length > 0 &&
@@ -166,6 +169,7 @@ const TopVisited = () => {
166169
) : (
167170
<p className='noArticleMessage text-center text-2xl font-bold'>Please, Fill the form to get your desired articles from country</p>
168171
)}
172+
{loading && <Loading />}
169173
</div>
170174
</div>
171175
);

0 commit comments

Comments
 (0)