Change frontend deps

frontend/src/css/style.css

@@ -132,7 +132,9 @@ a {
 }
 #menu-logo {
     padding: 5px;
-
+    content: url("../assets/apiary.svg");
+    width: 30px;
+    height: 30px;
 }
 .menu-link {
     color: var(--menu-color-text);

frontend/src/js/app.tsx

@@ -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>

frontend/src/tests/api.test.ts

@@ -0,0 +1,17 @@
+import { DummyApiaryAPIClient, TotalStats } from "../js/api";
+
+describe("DummyApiaryAPIClient", () => {
+    const api = new DummyApiaryAPIClient()
+    test("totals returns expeced value", async () => {
+        let totals = await api.totals()
+        const expected: TotalStats = {
+            password: 1,
+            username: 1,
+            ip: 1,
+            attempts: 1,
+            country: 1,
+        }
+
+        expect(totals).toEqual(expected)
+    })
+});