## File: README.md

[](https://github.com/komodorio/helm-dashboard/issues)    [](https://github.com/komodorio/helm-dashboard/releases)  [](https://github.com/komodorio/helm-dashboard) [](https://codecov.io/gh/komodorio/helm-dashboard)

<kbd>[](images/screenshot.png)</kbd>

## Description

_Helm Dashboard_ is an **open-source project** which offers a UI-driven way to view the installed Helm charts, see their revision history and
corresponding k8s resources. It also allows users to perform simple actions such as rolling back to a
revision or upgrading to a newer version.
This project is part of [Komodor's](https://komodor.com/?utm_campaign=Helm-Dash&utm_source=helm-dash-gh) vision to
help Kubernetes users to navigate and troubleshoot their clusters. It is important to note that Helm Dashboard is **NOT** an official project by the [helm team](https://helm.sh/).

Key capabilities of the tool:

- See all installed charts and their revision history
- See manifest diff of the past revisions
- Browse k8s resources resulting from the chart
- Easy rollback or upgrade version with a clear and easy manifest diff
- Integration with popular problem scanners
- Easy switch between multiple clusters
- Can be used locally, or installed into Kubernetes cluster
- Does not require Helm or Kubectl installed

All the features of the tool can be discovered via our [features overview page](FEATURES.md).

## Installation

### Standalone Binary

Since version 1.0, the recommended install method is to just use standalone binary. It does not require Helm or kubectl to be installed.

Download the appropriate [release package](https://github.com/komodorio/helm-dashboard/releases) for your platform, unpack it and just run `dashboard` binary from it. See below section for some more CLI parameters to use.

### Using Helm plugin manager

To install dashboard as Helm plugin, simply run Helm command:

```shell
helm plugin install https://github.com/komodorio/helm-dashboard.git
```

To update the plugin to the latest version, run:

```shell
helm plugin update dashboard
```

To uninstall, run:

```shell
helm plugin uninstall dashboard
```

To use the plugin, your machine needs to have working `helm` and also `kubectl` commands. Helm version 3.4.0+ is required.

After installing, start the UI by running:

```shell
helm dashboard
```

The command above will launch the local Web server and will open the UI in a new browser tab. The command will hang
waiting for you to terminate it in command-line or web UI.

You can see the list of available command-line flags by running `helm dashboard --help`.

By default, the web server is only available locally. You can change that by specifying `HD_BIND` environment variable
to the desired value. For example, `0.0.0.0` would bind to all IPv4 addresses or `[::0]` would be all IPv6 addresses.
This can also be specified using flag `--bind <host>`, for example `--bind=0.0.0.0` or `--bind 0.0.0.0`.

> Precedence order: flag `--bind=<host>` > env `HD_BIND=<host>` > default value `localhost`

If your port 8080 is busy, you can specify a different port to use via `--port <number>` command-line flag.

If you need to limit the operations to a specific namespace, please use `--namespace=...` in your command-line. You can specify multiple namespaces, separated by commas.

If you don't want the browser tab to automatically open, add `--no-browser` flag in your command-line.

If you want to increase the logging verbosity and see all the debug info, use the `--verbose` flag.

> Disclaimer: For the sake of improving the project quality, there is user analytics collected by the tool. You can disable this collecting with `--no-analytics` option. The collection is done via DataDog RUM and Heap Analytics. Only the anonymous data is collected, no sensitive information is used.

### Deploying Helm Dashboard on Kubernetes

The official helm chart is [available here](https://github.com/komodorio/helm-charts/blob/master/charts/helm-dashboard)

## Support Channels

We have two main channels for supporting the Helm Dashboard
users: [Slack community](https://komodorkommunity.slack.com) for general conversations
and [GitHub issues](https://github.com/komodorio/helm-dashboard/issues) for real bugs.

## Contributing

Kindly read our [Contributing Guide](CONTRIBUTING.md) to learn and understand about our development process, how to propose bug fixes and improvements, and how to build and test your changes to Helm Dashboard. 

## Contributors

<a href="https://github.com/komodorio/helm-dashboard/graphs/contributors">
  
</a>

## Local Dev Testing

Prerequisites, binaries installed and operational:

- [Golang](https://go.dev/doc/install)
- Node.js

There is a need to build frontend and then backend as a series of commands, run:

### Linux

```shell
cd frontend && npm run build && cd ..
go build -o bin/dashboard .
```

Or just `make build` that will do everything inside.

Then, you can run `npm run dev` from `frontend` directory to work on frontend with Vite hot reload.

### Windows

```bat
cd frontend && npm run build && cd ..
go build -o bin\dashboard.exe .
```

You can just run the `dashboard` or `dashboard.exe` binary directly.

To install, checkout the source code and run from source dir:

```shell
helm plugin install .
```

A local installation of the plugin just creates a symlink, so making the changes and rebuilding the binary would not require
to
reinstall a plugin.

To use the plugin, run in your terminal:

```shell
helm dashboard
```

Then, use the web UI.

## Development Snapshots

In our GitHub actions, we attach the built binaries as build artifacts, you can download and test it fully assembled.

Also, we upload `unstable` tag for Docker image upon every build of `main` branch, you can make our Helm chart to use that image by providing values:

```yaml
image:
  pullPolicy: Always
  tag: unstable
```

---

## File: charts/helm-dashboard/README.md

# Helm Dashboard

## TL;DR;

```bash
helm repo add komodorio https://helm-charts.komodor.io
helm repo update
helm upgrade --install helm-dashboard komodorio/helm-dashboard
```

## Introduction

This chart bootstraps a Helm Dashboard deployment on a [Kubernetes](http://kubernetes.io) cluster using the [Helm](https://helm.sh) package manager.

While installed inside cluster, Helm Dashboard will run some additional background actions, for example, will automatically update Helm repositories. To enable that behavior locally, set `HD_CLUSTER_MODE` env variable.

## Prerequisites

- Kubernetes 1.16+

## Installing the Chart

To install the chart with the release name `helm-dashboard`:

```bash
helm install helm-dashboard .
```

The command deploys Helm Dashboard on the Kubernetes cluster in the default configuration. The [Parameters](#parameters) section lists the parameters that can be configured during installation.

> **Tip**: List all releases using `helm list`

## Uninstalling the Chart

To uninstall/delete the `helm-dashboard` deployment:

```bash
helm uninstall helm-dashboard
```

The command removes all the Kubernetes components associated with the chart and deletes the release.

## Adding Authentication

The task of authentication and user control is out of scope for Helm Dashboard. Luckily, there are third-party solutions which are dedicated to provide that functionality.

For instance, you can place authentication proxy in front of Helm Dashboard, like this one: https://github.com/oauth2-proxy/oauth2-proxy

## Parameters

The following table lists the configurable parameters of the chart and their default values.

| Parameter                             | Description                                                                                    | Default                          |
|---------------------------------------|------------------------------------------------------------------------------------------------|----------------------------------|
| `global.imageRegistry`                | Registry for all images, useful for private registry                                           | `""`                             |
| `global.imagePullSecrets`             | Specify Docker-registry secret names as an array                                               | `[]`                             |
| `image.repository`                    | Image registry/name                                                                            | `komodorio/helm-dashboard`       |
| `image.tag`                           | Image tag                                                                                      |                                  |
| `image.imagePullSecrets`              | Specify Docker-registry secret names as an array                                               | `[]`                             |
| `image.pullPolicy`                    | Image pull policy                                                                              | `IfNotPresent`                   |
| `replicaCount`                        | Number of dashboard Pods to run                                                                | `1`                              |
| `dashboard.allowWriteActions`         | Enables write actions. Allow modifying, deleting and creating charts and kubernetes resources. | `true`                           |
| `resources.requests.cpu`              | CPU resource requests                                                                          | `200m`                           |
| `resources.limits.cpu`                | CPU resource limits                                                                            | `1`                              |
| `resources.requests.memory`           | Memory resource requests                                                                       | `256Mi`                          |
| `resources.limits.memory`             | Memory resource limits                                                                         | `1Gi`                            |
| `service.type           `             | Kubernetes service type                                                                        | `ClusterIP`                      |
| `service.port           `             | Kubernetes service port                                                                        | `8080`                           |
| `serviceAccount.create`               | Creates a service account                                                                      | `true`                           |
| `serviceAccount.name`                 | Optional name for the service account                                                          | `{RELEASE_FULLNAME}`             |
| `commonLabels`                        | Labels to add to all resources managed by this chart                                           | `{}`                             |
| `nodeSelector`                        | Node labels for pod assignment                                                                 |                                  |
| `affinity`                            | Affinity settings for pod assignment                                                           |                                  |
| `tolerations`                         | Tolerations for pod assignment                                                                 |                                  |
| `dashboard.persistence.enabled`       | Enable helm data persistene using PVC                                                          | `true`                           |
| `dashboard.persistence.accessModes`   | Persistent Volume access modes                                                                 | `["ReadWriteOnce"]`              |
| `dashboard.persistence.storageClass`  | Persistent Volume storage class                                                                | `""`                             |
| `dashboard.persistence.size`          | Persistent Volume size                                                                         | `100M`                           |
| `dashboard.persistence.labels`        | Extra labels for the Persistent Volume Claim                                                   | `{}`                             |
| `dashboard.persistence.annotations`   | Annotations for the Persistent Volume Claim                                                    | `{}`                             |
| `dashboard.persistence.finalizers`    | Finalizers for the Persistent Volume Claim                                                     | `[kubernetes.io/pvc-protection]`                             |
| `dashboard.persistence.lookupVolumeName` | Lookup volume name for the Persistent Volume Claim                                             | `true`                             |
| `updateStrategy.type`                 | Set up update strategy for helm-dashboard installation.                                        | `RollingUpdate`                  |             
| `extraArgs`                           | Set the arguments to be supplied to the helm-dashboard binary                                  | `[--no-browser, --bind=0.0.0.0]` |
| `testImage.repository`                | Test image registry/name                                                                       | `busybox`                        |
| `testImage.tag`                       | Test image tag                                                                                 | `lastest`                        |
| `testImage.imagePullSecrets`          | Specify Docker-registry secret names as an array                                               | `[]`                             |
| `testImage.pullPolicy`                | Test image pull policy                                                                         | `IfNotPresent`                   |
Specify each parameter using the `--set key=value[,key=value]` argument to `helm install`.

```bash
helm upgrade --install helm-dashboard komodorio/helm-dashboard --set dashboard.allowWriteActions=true --set service.port=9090
```

> **Tip**: You can use the default [values.yaml](values.yaml)

---

## File: frontend/README.md

# Helm dashboard React

Welcome to the frontend of the helm dashboard.
We care most about keeping the project:

1. Maintainable
2. Extendable
3. Contributor friendly

# The FE Stack

- Vite, as our build tool.
- React, as our UI library.
- TypeScript and ESLint will keep the project safe, please keep them clean.
- Tailwind for styling.
- React-Query for fetching data from the backend.
- Storybook is utilized to develop a component library.

Please follow through the file structure to understand how things are structured and should be used.

# Contribution guide

## Setting up your development environment

1. First you should fork this repository.
2. Clone your new repository using `git clone <https_or_ssh_url>`.

## Running helm dashboard

1. Make sure you cloned the project correctly. This is explained in this [stage](https://github.com/komodorio/helm-dashboard/blob/helm-dashboard-v2/dashboard/README.md#setting-up-your-development-environment).
2. run the backend server. This is also explained in the above link.
3. go to `frontend` in your local project.
4. in order to install dependencies and start the development server
   - `npm i`
   - `npm run dev`
5. with the default integration the dashboard should run on http://localhost:5173/

# Component library

We created a components library to have a consistent design system throughout the project. Please rely on these components.
Additional information and examples on how to use them are available when you run Storybook, which shows them in an interactive way and in different scenarios.

Once you run it, you'll be able to see pre-made scenarios, documentation, and play with the component properties.

To run Storybook, make sure that all the dependencies are installed and run:

```shell
npm run storybook
```

Refer to the [official documentation](https://storybook.js.org/docs/react/get-started/install) for more information.

# Helpers

- Icons: https://react-icons.github.io/react-icons/
- Tailwind: https://tailwindcss.com/docs
- Typescript: https://www.typescriptlang.org/docs/handbook/intro.html
- React-query: https://react-query.tanstack.com/overview

# Coding Conventions

- Use only functional components
- Please prefer async/await over .then
- wrap every function with try/catch unless you want to display the error to the user
  in such case we have a general error handler in the app.tsx file which will display the error to the user in a modal
- Please use the component library we created, it will help us keep a consistent design system
- Please use the react-query library to fetch data from the backend
- Prefer use fetch API over axios, if you see axios in the code, replace it with fetch.
- Use <Outlet> for inner routes
- User query params in the url for filters or any other state that can be represented
- Hooks:
  - useCustomSearchParams - for search params