44 lines
1.1 KiB
TypeScript
44 lines
1.1 KiB
TypeScript
import clsx from "clsx";
|
|
import React from "react";
|
|
import { NavLink } from "react-router-dom";
|
|
|
|
import styles from "./Stats.module.css";
|
|
|
|
const navLinkStyles = ({ isActive }: { isActive: boolean }) => clsx(styles.navLink, { [styles.active]: isActive });
|
|
|
|
export const StatsNav = () => (
|
|
<nav className={styles.statsNav}>
|
|
<ul>
|
|
<li>
|
|
<NavLink className={navLinkStyles} to="/stats" end>
|
|
Oversikt
|
|
</NavLink>
|
|
</li>
|
|
<li>
|
|
<NavLink className={navLinkStyles} to="/stats/products">
|
|
Produkter
|
|
</NavLink>
|
|
</li>
|
|
<li>
|
|
<NavLink className={navLinkStyles} to="/stats/orders">
|
|
Ordre
|
|
</NavLink>
|
|
</li>
|
|
<li>
|
|
<NavLink className="disabled" to="/stats/users" title="TODO">
|
|
Folk
|
|
</NavLink>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
);
|
|
|
|
export const StatsView = ({ children, loading }: { children: React.ReactNode; loading: boolean }) => (
|
|
<div className={styles.stats}>
|
|
<h2>Statistikk</h2>
|
|
<StatsNav />
|
|
{loading && <div>Loading...</div>}
|
|
{!loading && children}
|
|
</div>
|
|
);
|