Change frontend deps
This commit is contained in:
@@ -8,7 +8,6 @@ import { Pie } from "react-chartjs-2";
|
||||
import humanizeDuration from "humanize-duration";
|
||||
|
||||
ChartJS.register(Tooltip, ArcElement, Legend);
|
||||
const logo = new URL("../assets/apiary.svg", import.meta.url)
|
||||
|
||||
interface AppProps {
|
||||
api: ApiaryAPI
|
||||
@@ -34,14 +33,13 @@ let chartColors = [
|
||||
"#d35400",
|
||||
"#c0392b",
|
||||
"#bdc3c7",
|
||||
"#7f8c8d"
|
||||
"#7f8c8d",
|
||||
]
|
||||
|
||||
export function App({ api }: AppProps) {
|
||||
const [mode, setMode] = useState("light");
|
||||
const headerProps: HeaderMenuProps = {
|
||||
title: "apiary.home.2rjus.net",
|
||||
logo: logo,
|
||||
items: [
|
||||
{
|
||||
name: "Totals",
|
||||
@@ -90,7 +88,7 @@ export function App({ api }: AppProps) {
|
||||
<>
|
||||
<BrowserRouter>
|
||||
<div id="app">
|
||||
<HeaderMenu title={headerProps.title} logo={logo} items={headerProps.items} />
|
||||
<HeaderMenu title={headerProps.title} items={headerProps.items} />
|
||||
<div className="content">
|
||||
<Routes>
|
||||
<Route path="/" element={<Home api={api} />} />
|
||||
@@ -113,7 +111,7 @@ export interface StatsProps {
|
||||
}
|
||||
|
||||
export function Stats({ api, type }: StatsProps) {
|
||||
const [stats, setStats] = useState<StatsResult[]|null>(null)
|
||||
const [stats, setStats] = useState<StatsResult[] | null>(null)
|
||||
const [currentType, setCurrentType] = useState(type)
|
||||
|
||||
useEffect(() => {
|
||||
@@ -250,14 +248,14 @@ export function Live({ api }: AppProps) {
|
||||
|
||||
export interface LiveListProps {
|
||||
list: LoginAttempt[]
|
||||
};
|
||||
};
|
||||
|
||||
export interface DateTDProps {
|
||||
date: Date
|
||||
now: Date
|
||||
}
|
||||
|
||||
export function DateTD({ date, now}: DateTDProps) {
|
||||
export function DateTD({ date, now }: DateTDProps) {
|
||||
const [displayDate, setDisplayDate] = useState(date.toLocaleString());
|
||||
|
||||
useEffect(() => {
|
||||
@@ -270,12 +268,12 @@ export function DateTD({ date, now}: DateTDProps) {
|
||||
}, [displayDate, now])
|
||||
|
||||
return (
|
||||
<td className="live-table-date">{displayDate}</td>
|
||||
<td className="live-table-date">{displayDate}</td>
|
||||
)
|
||||
}
|
||||
|
||||
export function LiveList({ list }: LiveListProps) {
|
||||
const [now, setNow] = useState(new Date())
|
||||
const [now, setNow] = useState(new Date())
|
||||
|
||||
let items = list.map((a) => {
|
||||
const attemptDate = new Date(a.date);
|
||||
@@ -389,21 +387,21 @@ interface HeaderItem {
|
||||
|
||||
interface HeaderMenuProps {
|
||||
title: string
|
||||
logo: URL
|
||||
items: Array<HeaderItem>
|
||||
}
|
||||
|
||||
export function HeaderMenu({ title, logo, items }: HeaderMenuProps) {
|
||||
export function HeaderMenu({ title, items }: HeaderMenuProps) {
|
||||
const menuItems = items.map((item) => {
|
||||
return (
|
||||
<li key={item.path}>
|
||||
return (
|
||||
<li key={item.path}>
|
||||
<NavLink to={item.path} className={({ isActive }) => isActive ? "menu-link-active" : "menu-link"}>{item.name}</NavLink>
|
||||
</li>
|
||||
)})
|
||||
</li>
|
||||
)
|
||||
})
|
||||
|
||||
return (
|
||||
<div className="navbar">
|
||||
<img id="menu-logo" src={logo.href}></img>
|
||||
<img id="menu-logo"></img>
|
||||
<h2 id="menu-title">{title}</h2>
|
||||
<nav className="nav-flex">
|
||||
<ul>
|
||||
|
Reference in New Issue
Block a user