Skip to content

Commit

Permalink
Applied linting rules to all tsx files (#53)
Browse files Browse the repository at this point in the history
  • Loading branch information
@sam9291
sam9291 authored Mar 23, 2024
1 parent 9bd51cb commit f5b8c8d
Show file tree
Hide file tree
Showing 5 changed files with 134 additions and 121 deletions.
44 changes: 21 additions & 23 deletions canopeum_frontend/src/App.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,31 +1,29 @@
import './App.scss';
import 'bootstrap/js/index.umd.js';

import { BrowserRouter, Route, Routes } from 'react-router-dom';
import Home from './pages/Home';

import Navbar from './components/Navbar';
import Analytics from './pages/Analytics';
import Home from './pages/Home';
import Login from './pages/Login';
import Map from './pages/Map';
import UserManagement from './pages/UserManagement';
import Login from './pages/Login';

import Navbar from './components/Navbar';
import Utilities from './pages/Utilities';

import 'bootstrap/js/index.umd.js';
const App = () => (
<BrowserRouter>
<Navbar />
<Routes>
<Route element={<Home />} path="/home" />
<Route element={<Home />} path="/" />
<Route element={<Analytics />} path="/analytics" />
<Route element={<Map />} path="/map" />
<Route element={<UserManagement />} path="/user-management" />
<Route element={<Login />} path="/login" />
<Route element={<Utilities />} path="/utilities" />
</Routes>
</BrowserRouter>
);

export default function App() {
return (
<>
<BrowserRouter>
<Navbar />
<Routes>
<Route path="/home" element={<Home />} />
<Route path="/" element={<Home />} />
<Route path="/analytics" element={<Analytics />} />
<Route path="/map" element={<Map />} />
<Route path="/user-management" element={<UserManagement />} />
<Route path="/login" element={<Login />} />
<Route path="/utilities" element={<Utilities />} />
</Routes>
</BrowserRouter>
</>
);
}
export default App;
117 changes: 63 additions & 54 deletions canopeum_frontend/src/components/Navbar.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,57 +1,66 @@
import { Link, useLocation } from 'react-router-dom';

const Navbar = () => {
const location = useLocation();

export default function Navbar() {

const location = useLocation();

return (
<nav className="navbar navbar-expand-lg bg-primary">
<div className="container">
<Link to="/home">
<img className="navbar-logo" src="/Releaf_Logo.svg" alt="Logo" style={{ transition: 'all .5s' }} />
</Link>
<button
className="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span className="navbar-toggler-icon"></span>
</button>
<div className="collapse navbar-collapse" id="navbarNav">
<ul className="navbar-nav d-flex w-100 ms-3 gap-3 fs-4">
<li className={`nav-item ${location.pathname === '/home' ? 'active' : ''}`}>
<Link className="nav-link" to="/home">
<span className="material-symbols-outlined text-light">home</span>
</Link>
</li>
<li className={`nav-item ${location.pathname === '/analytics' ? 'active' : ''}`}>
<Link className="nav-link" to="/analytics">
<span className="material-symbols-outlined text-light">donut_small</span>
</Link>
</li>
<li className={`nav-item ${location.pathname === '/map' ? 'active' : ''}`}>
<Link className="nav-link" to="/map">
<span className="material-symbols-outlined text-light">pin_drop</span>
</Link>
</li>
<li className={`nav-item ${location.pathname === '/utilities' ? 'active' : ''}`}>
<Link className="nav-link" to="/utilities">
<span className="material-symbols-outlined text-light">style</span>
</Link>
</li>
<li className={`nav-item ms-auto ${location.pathname === '/user-management' ? 'active' : ''}`}>
<Link className="nav-link" to="/user-management">
<span className="material-symbols-outlined text-light">account_circle</span>
</Link>
</li>
</ul>
</div>
</div>
</nav>
);
}
return (
<nav className="navbar navbar-expand-lg bg-primary">
<div className="container">
<Link to="/home">
<img alt="Logo" className="navbar-logo" src="/Releaf_Logo.svg" style={{ transition: 'all .5s' }} />
</Link>
<button
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation"
className="navbar-toggler"
data-target="#navbarNav"
data-toggle="collapse"
type="button"
>
<span className="navbar-toggler-icon" />
</button>
<div className="collapse navbar-collapse" id="navbarNav">
<ul className="navbar-nav d-flex w-100 ms-3 gap-3 fs-4">
<li className={`nav-item ${location.pathname === '/home'
? 'active'
: ''}`}>
<Link className="nav-link" to="/home">
<span className="material-symbols-outlined text-light">home</span>
</Link>
</li>
<li className={`nav-item ${location.pathname === '/analytics'
? 'active'
: ''}`}>
<Link className="nav-link" to="/analytics">
<span className="material-symbols-outlined text-light">donut_small</span>
</Link>
</li>
<li className={`nav-item ${location.pathname === '/map'
? 'active'
: ''}`}>
<Link className="nav-link" to="/map">
<span className="material-symbols-outlined text-light">pin_drop</span>
</Link>
</li>
<li className={`nav-item ${location.pathname === '/utilities'
? 'active'
: ''}`}>
<Link className="nav-link" to="/utilities">
<span className="material-symbols-outlined text-light">style</span>
</Link>
</li>
<li className={`nav-item ms-auto ${location.pathname === '/user-management'
? 'active'
: ''}`}>
<Link className="nav-link" to="/user-management">
<span className="material-symbols-outlined text-light">account_circle</span>
</Link>
</li>
</ul>
</div>
</div>
</nav>
);
};
export default Navbar;
68 changes: 37 additions & 31 deletions canopeum_frontend/src/pages/Home.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,50 +1,56 @@
import { useEffect, useState } from 'react'
import { useEffect, useState } from 'react';

import type { BatchAnalytics } from '../services/api.ts'
import api from '../services/apiInterface.ts'
import { ensureError } from '../services/errors.ts'
import type { BatchAnalytics } from '../services/api.ts';
import api from '../services/apiInterface.ts';
import { ensureError } from '../services/errors.ts';

const Home = () => {
const [data, setData] = useState<BatchAnalytics[]>([])
const [isLoading, setIsLoading] = useState(false)
const [error, setError] = useState<Error | undefined>(undefined)
const [data, setData] = useState<BatchAnalytics[]>([]);
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState<Error | undefined>(undefined);

const fetchData = async () => {
setIsLoading(true)
setIsLoading(true);
try {
const response = await api.batches.all()
setData(response)
const response = await api.batches.all();
setData(response);
} catch (error_: unknown) {
setError(ensureError(error_))
setError(ensureError(error_));
} finally {
setIsLoading(false)
setIsLoading(false);
}
}
};

useEffect((): void => {
void fetchData()
}, [])
void fetchData();
}, []);

return (
<div>
<div className='container mt-2 d-flex flex-column gap-2'>
<div className='bg-white rounded-2 px-3 py-2'>
<div className="container mt-2 d-flex flex-column gap-2">
<div className="bg-white rounded-2 px-3 py-2">
<h1>Home</h1>
{isLoading
? <p>Loading...</p>
: error
? <p>Error: {error.message}</p>
: (
<div>
<p>Exemple request from API:</p>
<ul>
{(data).map(item => <li key={item.id}>{item.name}</li>)}
</ul>
</div>
)}
? (
<p>Loading...</p>
)
: error
? (
<p>Error: {error.message}</p>
)
: (
<div>
<p>Example request from API:</p>
<ul>
{data.map((item) => (
<li key={item.id}>{item.name}</li>
))}
</ul>
</div>
)}
</div>
</div>
</div>
)
}
export default Home
);
};
export default Home;
22 changes: 11 additions & 11 deletions canopeum_frontend/src/pages/UserManagement.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
export default function UserManagement() {
return (
<div>
<div className="container mt-2 d-flex flex-column gap-2">
<div className="bg-white rounded-2 px-3 py-2">
<h1>Setting</h1>
</div>
</div>
</div>
);
}
const UserManagement = () => (
<div>
<div className="container mt-2 d-flex flex-column gap-2">
<div className="bg-white rounded-2 px-3 py-2">
<h1>Setting</h1>
</div>
</div>
</div>
);

export default UserManagement;
4 changes: 2 additions & 2 deletions canopeum_frontend/src/services/apiInterface.ts
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import {
AnnouncementClient,
AuthenticationClient,
BatchClient,
CommentClient,
ContactClient,
Expand All @@ -8,8 +9,7 @@ import {
SiteClient,
UserClient,
WidgetClient,
AuthenticationClient,
} from "./api";
} from './api';

const API_URL = String(import.meta.env.VITE_API_URL);

Expand Down

0 comments on commit f5b8c8d

Please sign in to comment.