Added a simple UI cypress test, improvements to ui menu

This commit is contained in:
Jamie Curnow
2021-07-14 09:37:49 +10:00
parent 4fbb354d54
commit 76a170b50b
7 changed files with 151 additions and 95 deletions

View File

@@ -47,7 +47,7 @@
"styled-components": "5.3.0",
"tabler-icons-react": "^1.35.0",
"tabler-react": "^2.0.0-alpha.1",
"tabler-react-typescript": "^0.0.4",
"tabler-react-typescript": "0.0.5",
"typescript": "^4.3.5"
},
"scripts": {
@@ -83,10 +83,10 @@
],
"coverageThreshold": {
"global": {
"branches": 1,
"functions": 1,
"lines": 1,
"statements": 1
"branches": 0,
"functions": 0,
"lines": 0,
"statements": 0
}
}
}

View File

@@ -0,0 +1,60 @@
import React from "react";
import {
Book,
DeviceDesktop,
Home,
Lock,
Settings,
Shield,
Users,
} from "tabler-icons-react";
import { Navigation } from "tabler-react-typescript";
function NavMenu() {
return (
<Navigation.Menu
theme="light"
className="mb-3"
items={[
{
title: "Home",
icon: <Home />,
to: "/",
},
{
title: "Hosts",
icon: <DeviceDesktop />,
to: "/hosts",
},
{
title: "Access Lists",
icon: <Lock />,
to: "/access-lists",
},
{
title: "Certificates",
icon: <Shield />,
to: "/certificates",
},
{
title: "Users",
icon: <Users />,
to: "/users",
},
{
title: "Audit Log",
icon: <Book />,
to: "/audit-log",
},
{
title: "Settings",
icon: <Settings />,
to: "/settings",
},
]}
/>
);
}
export { NavMenu };

View File

@@ -3,17 +3,10 @@ import React, { ReactNode } from "react";
import { Footer } from "components";
import { useAuthState, useUserState } from "context";
import styled from "styled-components";
import {
Book,
DeviceDesktop,
Home,
Lock,
Settings,
Shield,
Users,
} from "tabler-icons-react";
import { Avatar, Dropdown, Navigation } from "tabler-react-typescript";
import { NavMenu } from "./NavMenu";
const StyledContainer = styled.div`
padding-bottom: 30px;
`;
@@ -45,52 +38,14 @@ function SiteWrapper({ children }: Props) {
user.roles.includes("admin") ? "Administrator" : "Standard User"
}
profileItems={[
<Dropdown.Item key="m1-1">Set status</Dropdown.Item>,
<Dropdown.Item key="m1-2">Profile &amp; account</Dropdown.Item>,
<Dropdown.Item key="m1-3">Feedback</Dropdown.Item>,
<Dropdown.Item key="m1-2">Profile settings</Dropdown.Item>,
<Dropdown.Item divider key="m1-4" />,
<Dropdown.Item key="m1-5">Settings</Dropdown.Item>,
<Dropdown.Item key="m1-6" onClick={logout}>
Logout
</Dropdown.Item>,
]}
/>
<Navigation.Menu
theme="light"
className="mb-3"
items={[
{
title: "Home",
icon: <Home />,
active: true,
},
{
title: "Hosts",
icon: <DeviceDesktop />,
},
{
title: "Access Lists",
icon: <Lock />,
},
{
title: "Certificates",
icon: <Shield />,
},
{
title: "Users",
icon: <Users />,
},
{
title: "Audit Log",
icon: <Book />,
},
{
title: "Settings",
icon: <Settings />,
},
]}
/>
<NavMenu />
<div className="content">
<div className="container-xl">
<StyledContainer>{children}</StyledContainer>

View File

@@ -1829,13 +1829,6 @@
dependencies:
"@babel/types" "^7.3.0"
"@types/classnames@^2.2.11":
version "2.3.1"
resolved "https://registry.yarnpkg.com/@types/classnames/-/classnames-2.3.1.tgz#3c2467aa0f1a93f1f021e3b9bcf938bd5dfdc0dd"
integrity sha512-zeOWb0JGBoVmlQoznvqXbE0tEC/HONsnoUNH19Hc96NFsTAwTXbTqb8FMYkru1F/iqp7a18Ws3nWJvtA1sHD1A==
dependencies:
classnames "*"
"@types/eslint@^7.2.6":
version "7.2.6"
resolved "https://registry.yarnpkg.com/@types/eslint/-/eslint-7.2.6.tgz#5e9aff555a975596c03a98b59ecd103decc70c3c"
@@ -3646,7 +3639,7 @@ class-utils@^0.3.5:
isobject "^3.0.0"
static-extend "^0.1.1"
classnames@*, classnames@^2.2.6:
classnames@^2.2.6:
version "2.3.1"
resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==
@@ -11784,13 +11777,13 @@ tabler-icons-react@^1.35.0:
resolved "https://registry.yarnpkg.com/tabler-icons-react/-/tabler-icons-react-1.35.0.tgz#b4e7f8da632314d002aa5e34931f2f824395b77c"
integrity sha512-WiJ+dYQ71HCsxKAQpCfPrFVwSfqE6CByYFjq9Gzikmp2RijJBsNpj0sE/T5G0H+nERS9odjAWJoSryvr4FymFg==
tabler-react-typescript@^0.0.4:
version "0.0.4"
resolved "https://registry.yarnpkg.com/tabler-react-typescript/-/tabler-react-typescript-0.0.4.tgz#b40ee7faef743f5d5af6cdf098d3376cdb71989e"
integrity sha512-l/OoB4zQ3+u4xVxARw+1HqaHO13wDYlQIvjFyvs6Sdk7Vdys0sAc/EzN9hxWg5ywRNM+mGwt5+fVHXiuYAcD7g==
tabler-react-typescript@0.0.5:
version "0.0.5"
resolved "https://registry.yarnpkg.com/tabler-react-typescript/-/tabler-react-typescript-0.0.5.tgz#ab14ebada6f0524e13e3c6e60d2739a0f34f617d"
integrity sha512-PIov0LMSZWQzQ0OnlyITTzVdgBOKuc6HzgNLttP6Uz3/evGDBFl/Owl7wcP6niy7varzx4SttzFNXfJyhC3zcg==
dependencies:
"@types/classnames" "^2.2.11"
classnames "^2.2.6"
react-router-dom "^5.2.0"
tabler-react@^2.0.0-alpha.1:
version "2.0.0-alpha.1"