Take this prototype to GA

[krancour]

⚠️ Important: This issue is currently reserved as a potential Google Summer of Code project. No one should do any work on this without first being formally paired with our project for GSoC'22.

The contents of this repository, at present, represent an early-stage prototype of a web-based, Brigade v2-compatible dashboard application. While this prototype works well enough to be useful, it does not yet meet the high bar for quality that the Brigade project, as a whole, aspires to. With our core team's front-end bench strength somewhat lacking at the moment, this issue calls for a suitable candidate to take on ownership of its principal development. Specific areas of focus may include, but are not limited to:

• Improving error-handling
• Developing test suites (we currently have none)
• Ensuring compatibility across popular browsers
• Improving the overall look, feel, and responsiveness of UI elements
• Improving the overall user experience
• Improving accessibility

A modest degree of familiarity with the Brigade project would be beneficial, but is not required. The successful candidate will be proficient with HTML, CSS, TypeScript, and React. Prior experience testing React applications would be preferred. Familiarity with web accessibility standards (like ARIA) is not required, but would be helpful. Most importantly, the successful candidate will be a motivated self-starter with excellent collaboration and communication skills. They will need to be capable of triaging issues reported by maintainers and the community, reviewing PRs, and proactively identifying and reporting opportunities to improve the application without waiting for them to be reported by others.

The desired outcome of the summer's efforts is a GA release of this dashboard.

This is estimated to be a medium difficulty project that a qualified candidate can complete with roughly 350 hours of effort.

[ORKO06]

Hello @krancour
I am Hemant Bajaj, a second-year student pursuing my bachelor's in Industrial Design. I have been doing frontend development over the past 1 year and am currently focusing on improving my skills. I have had experience building frontend websites using React and Javascript. I have gone through the ideas in the ideas list as well as in this issue and I would like to propose:

1. For testing we can use Jest or React Testing Library.
2. For ensuring compatibility we can write codes in those versions of Typescript and React which will be compatible with all the browsers
3. As I mentioned earlier, I'm pursuing my bachelor's in Industrial design whose major part is UI/UX development. After considering all the aspects and requirements, I can propose changes and further implement them as well.
4. For improving user experience we can also develop the dark theme as many people prefer dark themes.
5. For improving accessibility we can use google translate API and we can make it more dynamic by getting the user location**(this will be based on user permission)** by using the javascript GEOLOCATION API. If they agree we can dynamically show the languages which will be best suited alongside all other languages otherwise we can give them the option to select the language from the given language list.
6. I am also getting familiar with ARIA as it will help us make the website more accessible.

This project can help me learn new things under your guidance. This project will be a great opportunity for my career.

[krancour]

@ORKO06, welcome!

I'll offer a little feedback to help you refine your official proposal:

For ensuring compatibility we can write codes in those versions of Typescript and React which will be compatible with all the browsers

I think the issue of browser compatibility potentially goes far beyond this. Ideally I'd like to see some kind of automated validation that the application looks and behaves both as expected and consistently across browsers. I think I had something like browserstack in the back of my head when I was writing the issue.

we can also develop the dark theme as many people prefer dark themes

I'm open to this, but wouldn't suggest prioritizing it. I think there are certain screens (like when looking at an event) that are very, very "busy," with multiple levels of tabs/pills and it feels easy to get "lost." These are the kind of UX optimizations I would prioritize.

For improving accessibility we can use google translate API and we can make it more dynamic by getting the user location**(this will be based on user permission)** by using the javascript GEOLOCATION API. If they agree we can dynamically show the languages which will be best suited alongside all other languages otherwise we can give them the option to select the language from the given language list.

I would not count internationalization as a current priority.

I am also getting familiar with ARIA as it will help us make the website more accessible.

This is a high priority.

[ORKO06]

@krancour I am unable to join the slack channel. Can you send me an invite link over here?

[krancour]

@ORKO06 you have to join the Kubernetes Slack. Our channel is there.

http://slack.k8s.io/