32 | {/* logo section */}
33 |
{
35 | // get the element with id overview. use the Links array from the top
36 | const homePage = document.getElementById(Links[0].id);
37 | // use the scrollIntoView method to scroll to the top
38 | homePage.scrollIntoView({ behavior: 'smooth' });
39 | }}
40 | className='font-bold text-2xl cursor-pointer flex items-center gap-1 flex-col '
41 | >
42 | {/* logo here */}
43 |
48 |
Prism
49 |
50 | {/* Menu icon */}
51 |
setIsOpen(!isOpen)}
53 | className=' cursor-pointer md:hidden w-9 h-9 my-auto mx-auto bg-transparent hover:text-[var(--secondary)] hover:bg-[var(--primary)] rounded-sm flex justify-center items-center '
54 | >
55 | {isOpen ? (
56 |
57 | ) : (
58 |
59 | )}
60 |
61 | {/* link items */}
62 |
67 | {Links.map((link) => (
68 | - handleNavLinkClick(link.id)}
71 | className=' p-3 cursor-pointer bg-transparent hover:text-[var(--secondary)] hover:bg-[var(--primary)] rounded-sm flex justify-center items-center'
72 | >
73 | {link.name}
74 |
75 | ))}
76 |
77 | {/* Social Media */}
78 |
106 | {/* light/Dark Mode */}
107 |
108 |
109 | Dashboard
110 |
111 |
2 |
3 | 
4 | 
5 | 
6 | 
7 | 
8 | 
9 | 
10 | 
11 | 
12 | 
13 | 
14 | 
15 | 
16 | 
17 | 
18 |
19 | 
29 |
30 | ## Secure, and built for you!
31 |
32 | Login to Prism to see your clusters, nodes, and pods automatically. And with a dark/light mode, you can enjoy it how you want.
33 |
34 | 
35 |
36 | ## Features
37 |
38 | | Feature | Status |
39 | | ----------------------------------------------------------------- | ------ |
40 | | Prometheus and Grafana Intergration | ✅ |
41 | | Custom Dashboard | ✅ |
42 | | an Overview, Pods view and Node view of metrics | ✅ |
43 | | SASS and Tailwind CSS | ✅ |
44 | | Typescript conversion | ✅ |
45 | | Testing (React Testing Library/Jest front-end, Supertest backend) | ⏳ |
46 | | Fully intergrated OAuth/User authentication | ⏳ |
47 | | Customizable Dashboards | 🙏🏻 |
48 | | Historcial Data and Trends | 🙏🏻 |
49 |
50 | Done = ✅
51 | 
87 |
88 | ## Contribute to the project
89 |
90 | - View our [Contributor README](/DEV_README.md)
91 |
92 | ## Read More
93 |
94 | [Check out our article on Medium!](https://medium.com/@k8s.prism/prism-all-in-one-kubernetes-visualizer-7338b56f8de2)
95 |
96 | ## Authors
97 |
98 | - list of all people and our links
99 | - [Beserat Tafesse](https://github.com/BeseratT)
100 | - [Dawit Merid](https://github.com/dawitmerid)
101 | - [James Li](https://github.com/Jxmes-Li)
102 | - [Josh Hall](https://github.com/joshuarhall)
103 | - [Paul Glenn](https://github.com/paglenn)
104 |
--------------------------------------------------------------------------------
/__tests__/Login.test.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { render, screen } from '@testing-library/react';
3 | import '@testing-library/jest-dom/extend-expect';
4 | import Login from '../client/components/Login';
5 | import { beforeEach, describe, expect, jest, test } from '@jest/globals';
6 | import { useNavigate } from 'react-router';
7 | // to import Jest and mocking useNavigate
8 | const mockUsedNavigate = jest.fn();
9 |
10 | jest.mock('react-router-dom', () => ({
11 | useNavigate: () => mockUsedNavigate,
12 | }));
13 |
14 | // const useNavigateMock = () => {
15 | // return mockUsedNavigate
16 | // }
17 |
18 | // jest.mock('react-router-dom', () => {
19 | // useNavigate: () => mockUsedNavigate
20 | // })
21 |
22 | // Renders Login component before each test
23 | beforeEach(() => {
24 | render(