mirror of
https://github.com/komodorio/helm-dashboard.git
synced 2026-03-26 06:18:04 +00:00
Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
cb535b1308 | ||
|
|
c6b1586e88 | ||
|
|
bae6650263 | ||
|
|
d0836eee0e |
@@ -1,6 +1,4 @@
|
||||
Dockerfile
|
||||
*.md
|
||||
bin
|
||||
.idea
|
||||
.git
|
||||
frontend/node_modules
|
||||
.idea
|
||||
59
.github/ISSUE_TEMPLATE/bug.yaml
vendored
59
.github/ISSUE_TEMPLATE/bug.yaml
vendored
@@ -1,59 +0,0 @@
|
||||
name: 🐛 Bug
|
||||
|
||||
description: Report an issue to help improve the project.
|
||||
|
||||
labels: ["🛠 goal: fix"]
|
||||
|
||||
body:
|
||||
|
||||
- type: textarea
|
||||
|
||||
id: description
|
||||
|
||||
attributes:
|
||||
|
||||
label: Description
|
||||
|
||||
description: A brief description of the question or issue, also include what you tried and what didn't work
|
||||
|
||||
validations:
|
||||
|
||||
required: true
|
||||
|
||||
- type: textarea
|
||||
|
||||
id: screenshots
|
||||
|
||||
attributes:
|
||||
|
||||
label: Screenshots
|
||||
|
||||
description: Please add screenshots if applicable
|
||||
|
||||
validations:
|
||||
|
||||
required: false
|
||||
|
||||
- type: textarea
|
||||
|
||||
id: extrainfo
|
||||
|
||||
attributes:
|
||||
|
||||
label: Additional information
|
||||
|
||||
description: Is there anything else we should know about this bug?
|
||||
|
||||
validations:
|
||||
|
||||
required: false
|
||||
|
||||
- type: markdown
|
||||
|
||||
attributes:
|
||||
|
||||
value: |
|
||||
|
||||
You can also join our slack community [here](https://komodorkommunity.slack.com)
|
||||
|
||||
Feel free to check out other cool repositories of the [komodorio](https://github.com/komodorio)
|
||||
68
.github/labeler.yml
vendored
68
.github/labeler.yml
vendored
@@ -1,68 +0,0 @@
|
||||
# This configures label matching for PR's.
|
||||
#
|
||||
# The keys are labels, and the values are lists of minimatch patterns
|
||||
# to which those labels apply.
|
||||
#
|
||||
# NOTE: This can only add labels, not remove them.
|
||||
# NOTE: Due to YAML syntax limitations, patterns or labels which start
|
||||
# with a character that is part of the standard YAML syntax must be
|
||||
# quoted.
|
||||
#
|
||||
# Please keep the labels sorted and deduplicated.
|
||||
|
||||
api:
|
||||
- pkg/dashboard/api.go
|
||||
|
||||
app:
|
||||
- main.go
|
||||
- pkg/dashboard/server.go
|
||||
- pkg/dashboard/subproc/*
|
||||
- pkg/dashboard/utils/*
|
||||
|
||||
backend:
|
||||
- pkg/dashboard/handlers/*
|
||||
- pkg/dashboard/scanners/*
|
||||
|
||||
ci:
|
||||
- .github/workflow/build.yml
|
||||
- ci/*
|
||||
- Makefile
|
||||
- scripts/*
|
||||
|
||||
docs:
|
||||
- CODE_OF_CONDUCT.md
|
||||
- CONTRIBUTING.md
|
||||
- LICENSE
|
||||
- README.md
|
||||
- screenshot*.png
|
||||
- screenshot*.svg
|
||||
|
||||
docker:
|
||||
- .dockerignore
|
||||
- Dockerfile
|
||||
|
||||
helm-charts:
|
||||
- charts/*
|
||||
|
||||
github-actions:
|
||||
- .github/ISSUE_TEMPLATE/*
|
||||
- .github/labeler.yml
|
||||
- .github/pull_request_template
|
||||
- .github/workflow/pull-request-labeler.yaml
|
||||
|
||||
release:
|
||||
- .github/workflows/publish-chart.yaml
|
||||
- .github/workflows/release.yaml
|
||||
- .goreleaser.yml
|
||||
- artifacthub-repo.yml
|
||||
- plugin.yaml
|
||||
|
||||
scanners:
|
||||
- pkg/dashboard/scanners/*
|
||||
|
||||
tests:
|
||||
- pkg/dashboard/**/*_test.go
|
||||
- pkg/dashboard/objects/testdata/*
|
||||
|
||||
frontend:
|
||||
- pkg/dashboard/static/*
|
||||
21
.github/pull_request_template.md
vendored
21
.github/pull_request_template.md
vendored
@@ -1,21 +0,0 @@
|
||||
## Changes Proposed
|
||||
|
||||
<!-- Describe the proposed changes and any additional information -->
|
||||
|
||||
<!-- Add all the screenshots which illustrate your changes -->
|
||||
|
||||
## Check List
|
||||
|
||||
<!-- Mark all the applicable boxes. To mark the box as done follow the following conventions -->
|
||||
<!--
|
||||
[x] - Correct; marked as done
|
||||
[X] - Correct; marked as done
|
||||
|
||||
[ ] - Not correct; marked as **not** done
|
||||
-->
|
||||
|
||||
- [ ] The title of my pull request is a short description of the changes
|
||||
- [ ] This PR relates to some issue: <!-- use "Closes #999" to auto-close related issue -->
|
||||
- [ ] I have documented the changes made (if applicable)
|
||||
- [ ] I have covered the changes with unit tests
|
||||
|
||||
111
.github/workflows/build.yml
vendored
111
.github/workflows/build.yml
vendored
@@ -2,15 +2,9 @@ name: Build
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- main
|
||||
branches: main
|
||||
pull_request:
|
||||
branches:
|
||||
- "*"
|
||||
|
||||
concurrency:
|
||||
group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
|
||||
cancel-in-progress: true
|
||||
branches: main
|
||||
|
||||
jobs:
|
||||
build:
|
||||
@@ -18,30 +12,13 @@ jobs:
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
|
||||
# Node part
|
||||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v2.5.2
|
||||
with:
|
||||
cache: 'npm'
|
||||
cache-dependency-path: frontend/package-lock.json
|
||||
- name: NPM install
|
||||
run: npm i
|
||||
working-directory: ./frontend
|
||||
- name: NPM build
|
||||
run: npm run build
|
||||
working-directory: ./frontend
|
||||
|
||||
# Golang part
|
||||
- name: Set up Go
|
||||
uses: actions/setup-go@v5
|
||||
uses: actions/setup-go@v3
|
||||
with:
|
||||
go-version: "1.22"
|
||||
go-version: 1.18
|
||||
- name: Unit tests
|
||||
run: |
|
||||
go test -v -race ./... -covermode=atomic -coverprofile=coverage.out # Run all the tests with the race detector enabled
|
||||
- name: Upload coverage reports to Codecov
|
||||
uses: codecov/codecov-action@v3
|
||||
go test -v -race ./... # Run all the tests with the race detector enabled
|
||||
- name: Static analysis
|
||||
run: |
|
||||
go vet ./... # go vet is the official Go static analyzer
|
||||
@@ -52,90 +29,42 @@ jobs:
|
||||
- name: Dry Run GoReleaser
|
||||
uses: goreleaser/goreleaser-action@v2
|
||||
with:
|
||||
version: "1.18.2"
|
||||
args: release --snapshot --clean
|
||||
- name: Test if the Binary is Runnable
|
||||
version: latest
|
||||
args: release --snapshot --rm-dist
|
||||
- name: Test Binary is Runnable
|
||||
run: "dist/helm-dashboard_linux_amd64_v1/helm-dashboard --help"
|
||||
- uses: actions/upload-artifact@v3
|
||||
- name: golangci-lint
|
||||
uses: golangci/golangci-lint-action@v3.2.0
|
||||
with:
|
||||
name: binaries
|
||||
path: dist/
|
||||
retention-days: 1
|
||||
# version: latest
|
||||
# skip-go-installation: true
|
||||
skip-pkg-cache: true
|
||||
skip-build-cache: true
|
||||
# args: --timeout=15m
|
||||
|
||||
image:
|
||||
runs-on: ubuntu-latest
|
||||
timeout-minutes: 60
|
||||
steps:
|
||||
- name: Check out the repo
|
||||
uses: actions/checkout@v3
|
||||
|
||||
- name: Docker meta
|
||||
uses: docker/metadata-action@v3
|
||||
id: meta
|
||||
with:
|
||||
images: komodorio/helm-dashboard
|
||||
|
||||
- name: Set up QEMU
|
||||
uses: docker/setup-qemu-action@v2
|
||||
- name: Set up Docker Buildx
|
||||
uses: docker/setup-buildx-action@v2
|
||||
|
||||
- name: Login to DockerHub
|
||||
uses: docker/login-action@v2
|
||||
if: github.event_name != 'pull_request'
|
||||
with:
|
||||
username: ${{ secrets.DOCKERHUB_USER }}
|
||||
password: ${{ secrets.DOCKERHUB_PASS }}
|
||||
uses: actions/checkout@v2
|
||||
|
||||
- name: Build and push
|
||||
uses: docker/build-push-action@v4
|
||||
uses: docker/build-push-action@v2
|
||||
with:
|
||||
context: .
|
||||
push: ${{ github.event_name != 'pull_request' }}
|
||||
tags: komodorio/helm-dashboard:unstable
|
||||
labels: ${{ steps.meta.outputs.labels }}
|
||||
outputs: local
|
||||
build-args: VER=0.0.0-dev
|
||||
platforms: linux/amd64,linux/arm64
|
||||
|
||||
static_and_lint:
|
||||
helm_check:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
uses: actions/checkout@v2
|
||||
with:
|
||||
fetch-depth: 0
|
||||
|
||||
- name: make dir for frontend results # don't delete this step, it will break goreleaser
|
||||
run: mkdir pkg/frontend/dist && touch pkg/frontend/dist/.gitkeep
|
||||
- name: Set up Go
|
||||
uses: actions/setup-go@v5
|
||||
with:
|
||||
go-version: "1.22"
|
||||
- name: golangci-lint
|
||||
uses: golangci/golangci-lint-action@v4
|
||||
with:
|
||||
# version: latest
|
||||
skip-pkg-cache: true
|
||||
skip-build-cache: true
|
||||
args: --timeout=5m
|
||||
|
||||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
cache: 'npm'
|
||||
cache-dependency-path: ./frontend/package-lock.json
|
||||
- name: NPM install
|
||||
run: npm i
|
||||
working-directory: ./frontend
|
||||
- name: NPM lint
|
||||
run: npm run lint
|
||||
working-directory: ./frontend
|
||||
|
||||
- name: Helm Template Check For Sanity
|
||||
uses: igabaydulin/helm-check-action@0.1.4
|
||||
env:
|
||||
CHART_LOCATION: ./charts/helm-dashboard
|
||||
CHART_VALUES: ./charts/helm-dashboard/values.yaml
|
||||
- name: Test if the Helm plugin install script is runnable
|
||||
run: |
|
||||
scripts/install_plugin.sh
|
||||
|
||||
2
.github/workflows/publish-chart.yaml
vendored
2
.github/workflows/publish-chart.yaml
vendored
@@ -14,7 +14,7 @@ jobs:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
uses: actions/checkout@v2
|
||||
with:
|
||||
fetch-depth: 0
|
||||
- name: Bump versions
|
||||
|
||||
14
.github/workflows/pull-request-labeler.yaml
vendored
14
.github/workflows/pull-request-labeler.yaml
vendored
@@ -1,14 +0,0 @@
|
||||
name: "Pull Request Labeler"
|
||||
on:
|
||||
- pull_request_target
|
||||
|
||||
jobs:
|
||||
triage:
|
||||
permissions:
|
||||
contents: read
|
||||
pull-requests: write
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/labeler@v4
|
||||
with:
|
||||
repo-token: "${{ secrets.GITHUB_TOKEN }}"
|
||||
56
.github/workflows/release.yaml
vendored
56
.github/workflows/release.yaml
vendored
@@ -1,4 +1,4 @@
|
||||
name: Release
|
||||
name: release
|
||||
|
||||
on:
|
||||
push:
|
||||
@@ -18,44 +18,41 @@ jobs:
|
||||
uses: actions/checkout@v3
|
||||
with:
|
||||
fetch-depth: 0
|
||||
- name: Get plugin version
|
||||
id: get_plugin_version
|
||||
run: echo "PLUGIN_VERSION=$(cat plugin.yaml | grep "version" | cut -d '"' -f 2)" >> $GITHUB_OUTPUT
|
||||
- name: Get tag name
|
||||
id: get_tag_name
|
||||
run: echo "TAG_NAME=$(echo ${{ github.ref_name }} | cut -d 'v' -f2)" >> $GITHUB_OUTPUT
|
||||
outputs:
|
||||
plugin_version: ${{ steps.get_plugin_version.outputs.PLUGIN_VERSION }}
|
||||
release_tag: ${{ steps.get_tag_name.outputs.TAG_NAME }}
|
||||
|
||||
release:
|
||||
needs: pre_release
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Plugin version/Tag name Check
|
||||
if: needs.pre_release.outputs.release_tag != needs.pre_release.outputs.plugin_version
|
||||
uses: actions/github-script@v3
|
||||
with:
|
||||
script: |
|
||||
core.setFailed('Plugin version and tag name are not equivalent!')
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
|
||||
# Node part
|
||||
- name: Setup Node.js environment
|
||||
uses: actions/setup-node@v2.5.2
|
||||
with:
|
||||
cache: 'npm'
|
||||
cache-dependency-path: frontend/package-lock.json
|
||||
- name: NPM install
|
||||
run: npm i
|
||||
working-directory: ./frontend
|
||||
- name: NPM build
|
||||
run: npm run build
|
||||
working-directory: ./frontend
|
||||
|
||||
# Golang part
|
||||
fetch-depth: 0
|
||||
- name: Set up Go
|
||||
uses: actions/setup-go@v5
|
||||
uses: actions/setup-go@v3
|
||||
with:
|
||||
go-version: "1.22"
|
||||
go-version: 1.18
|
||||
- name: git cleanup
|
||||
run: git clean -f
|
||||
- name: Run GoReleaser
|
||||
uses: goreleaser/goreleaser-action@v2
|
||||
with:
|
||||
version: "1.18.2"
|
||||
args: release --clean
|
||||
version: latest
|
||||
args: release --rm-dist
|
||||
env:
|
||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||
- name: Test Binary Versions
|
||||
@@ -63,11 +60,11 @@ jobs:
|
||||
|
||||
image:
|
||||
runs-on: ubuntu-latest
|
||||
needs: [ release, pre_release ]
|
||||
needs: [release, pre_release]
|
||||
timeout-minutes: 60
|
||||
steps:
|
||||
- name: Check out the repo
|
||||
uses: actions/checkout@v3
|
||||
uses: actions/checkout@v2
|
||||
|
||||
- name: Docker meta
|
||||
uses: docker/metadata-action@v3
|
||||
@@ -75,20 +72,15 @@ jobs:
|
||||
with:
|
||||
images: komodorio/helm-dashboard
|
||||
|
||||
- name: Set up QEMU
|
||||
uses: docker/setup-qemu-action@v2
|
||||
- name: Set up Docker Buildx
|
||||
uses: docker/setup-buildx-action@v2
|
||||
|
||||
- name: Login to DockerHub
|
||||
uses: docker/login-action@v2
|
||||
uses: docker/login-action@v1
|
||||
if: github.event_name != 'pull_request'
|
||||
with:
|
||||
username: ${{ secrets.DOCKERHUB_USER }}
|
||||
password: ${{ secrets.DOCKERHUB_PASS }}
|
||||
|
||||
- name: Build and push
|
||||
uses: docker/build-push-action@v4
|
||||
uses: docker/build-push-action@v2
|
||||
if: github.event_name != 'pull_request'
|
||||
with:
|
||||
context: .
|
||||
@@ -96,15 +88,14 @@ jobs:
|
||||
tags: komodorio/helm-dashboard:${{ needs.pre_release.outputs.release_tag }},komodorio/helm-dashboard:latest
|
||||
labels: ${{ steps.meta.outputs.labels }}
|
||||
build-args: VER=${{ needs.pre_release.outputs.release_tag }}
|
||||
platforms: linux/amd64,linux/arm64
|
||||
|
||||
publish_chart:
|
||||
runs-on: ubuntu-latest
|
||||
needs: [ image, pre_release ]
|
||||
needs: [image, pre_release]
|
||||
if: github.event_name == 'push' || github.event_name == 'workflow_dispatch'
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v3
|
||||
uses: actions/checkout@v2
|
||||
with:
|
||||
fetch-depth: 0
|
||||
- name: Bump versions
|
||||
@@ -115,7 +106,6 @@ jobs:
|
||||
git checkout main
|
||||
sh ./ci/bump-versions.sh
|
||||
git add charts/helm-dashboard/Chart.yaml
|
||||
git add plugin.yaml
|
||||
git commit -m "Increment chart versions [skip ci]" || echo "Already up-to-date"
|
||||
git push -f || echo "Nothing to push!"
|
||||
env:
|
||||
@@ -131,4 +121,4 @@ jobs:
|
||||
user_email: "komi@komodor.io"
|
||||
user_name: "komodor-bot"
|
||||
destination_branch: "master"
|
||||
commit_msg: "feat(OSS helm-dashboard): ${{ github.event.head_commit.message }}" #important!! don't change this commit message unless you change the condition in pipeline.yml on helm-charts repo
|
||||
commit_msg: "feat(helm-dashboard): ${{ github.event.head_commit.message }}" #important!! don't change this commit message unless you change the condition in pipeline.yml on helm-charts repo
|
||||
|
||||
4
.gitignore
vendored
4
.gitignore
vendored
@@ -15,7 +15,6 @@
|
||||
|
||||
# Output of the go coverage tool, specifically when used with LiteIDE
|
||||
*.out
|
||||
*.cov
|
||||
|
||||
# Dependency directories (remove the comment below to include it)
|
||||
# vendor/
|
||||
@@ -26,8 +25,5 @@ go.work
|
||||
/bin
|
||||
/.idea/
|
||||
|
||||
/node_modules
|
||||
.DS_Store
|
||||
.vscode/
|
||||
/pkg/dashboard/objects/testdata/hello-world-0.1.0.tgz
|
||||
/pkg/frontend/dist/*
|
||||
|
||||
@@ -11,9 +11,6 @@ builds:
|
||||
goarch:
|
||||
- amd64
|
||||
- arm64
|
||||
ignore:
|
||||
- goos: windows
|
||||
goarch: arm64
|
||||
env:
|
||||
- CGO_ENABLED=0
|
||||
archives:
|
||||
|
||||
@@ -1,55 +0,0 @@
|
||||
# Contributing to Helm Dashboard
|
||||
|
||||
We love your input! We want to make contributing to this project as easy and transparent as possible, whether it's:
|
||||
|
||||
- Reporting a bug
|
||||
- Discussing the current state of the code
|
||||
- Submitting a fix
|
||||
- Proposing new features
|
||||
|
||||
## We Develop with GitHub
|
||||
|
||||
We use GitHub to host code, to track issues and feature requests, as well as accept pull requests.
|
||||
|
||||
## First-time contributors
|
||||
|
||||
We've tagged some issues to make it easy to get started :smile:
|
||||
[Good first issues](https://github.com/komodorio/helm-dashboard/labels/good%20first%20issue)
|
||||
|
||||
Add a comment on the issue and wait for the issue to be assigned before you start working on it. This helps to avoid multiple people working on similar issues.
|
||||
|
||||
## All Code Changes Happen Through Pull Requests
|
||||
|
||||
Pull requests are the best way to propose changes to the codebase. We actively welcome your pull requests:
|
||||
|
||||
1. Fork the repo and create your branch from `main`.
|
||||
2. If you've added code that should be tested, add tests.
|
||||
3. Ensure the test suite passes.
|
||||
4. Make sure your code lints.
|
||||
5. Issue that pull request!
|
||||
|
||||
## Any contributions you make will be under the Apache License 2.0
|
||||
|
||||
In short, when you submit code changes, your submissions are understood to be under the same [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0) that covers the project.
|
||||
|
||||
## Report bugs using GitHub's [issues](https://github.com/komodorio/helm-dashboard/issues)
|
||||
|
||||
We use GitHub issues to track public bugs. Report a bug by [opening a new issue](https://github.com/komodorio/helm-dashboard/issues/new) and labeling it with the `bug` label. It's that easy!
|
||||
|
||||
**Great Bug Reports** tend to have:
|
||||
|
||||
- A quick summary and/or background
|
||||
- Steps to reproduce
|
||||
- Be specific!
|
||||
- Give sample code if you can.
|
||||
- What you expected would happen
|
||||
- What actually happens
|
||||
- Notes (possibly including why you think this might be happening, or stuff you tried that didn't work)
|
||||
|
||||
## License
|
||||
|
||||
By contributing, you agree that your contributions will be licensed under its Apache License 2.0.
|
||||
|
||||
## Questions?
|
||||
|
||||
Contact us on [Slack](https://komodorkommunity.slack.com).
|
||||
43
Dockerfile
43
Dockerfile
@@ -1,26 +1,12 @@
|
||||
# Stage - frontend
|
||||
FROM node:latest as frontend
|
||||
|
||||
WORKDIR /build
|
||||
|
||||
COPY frontend ./
|
||||
|
||||
RUN npm i && npm run build
|
||||
|
||||
# Stage - builder
|
||||
FROM --platform=${BUILDPLATFORM:-linux/amd64} golang as builder
|
||||
FROM golang as builder
|
||||
|
||||
ARG TARGETPLATFORM
|
||||
ARG BUILDPLATFORM
|
||||
ARG TARGETOS
|
||||
ARG TARGETARCH
|
||||
ARG VER
|
||||
|
||||
ENV GOOS=${TARGETOS:-linux}
|
||||
ENV GOARCH=${TARGETARCH:-amd64}
|
||||
ENV GOOS=linux
|
||||
ENV GOARCH=amd64
|
||||
ENV CGO_ENABLED=0
|
||||
|
||||
ARG VER=0.0.0
|
||||
ENV VERSION=${VER}
|
||||
ENV VERSION=0.0.0
|
||||
|
||||
WORKDIR /build
|
||||
|
||||
@@ -31,22 +17,25 @@ RUN go mod download
|
||||
|
||||
ADD . src
|
||||
|
||||
COPY --from=frontend /pkg/frontend/dist ./src/pkg/frontend/dist/
|
||||
|
||||
WORKDIR /build/src
|
||||
|
||||
RUN make build_go
|
||||
RUN make build
|
||||
|
||||
# Stage - runner
|
||||
FROM --platform=${TARGETPLATFORM:-linux/amd64} alpine
|
||||
FROM alpine/helm
|
||||
|
||||
ARG TARGETPLATFORM
|
||||
ARG BUILDPLATFORM
|
||||
RUN curl -o /bin/kubectl -vf -LO "https://dl.k8s.io/release/$(curl -L -s https://dl.k8s.io/release/stable.txt)/bin/linux/amd64/kubectl" && chmod +x /bin/kubectl && kubectl --help
|
||||
|
||||
EXPOSE 8080
|
||||
# Checkov scanner
|
||||
RUN apk add --update --no-cache python3
|
||||
RUN python3 -m ensurepip
|
||||
RUN pip3 install checkov
|
||||
|
||||
# Trivy
|
||||
RUN curl -sfL https://raw.githubusercontent.com/aquasecurity/trivy/main/contrib/install.sh | sh -s -- -b /usr/local/bin v0.18.3
|
||||
|
||||
COPY --from=builder /build/src/bin/dashboard /bin/helm-dashboard
|
||||
|
||||
ENTRYPOINT ["/bin/helm-dashboard", "--no-browser", "--bind=0.0.0.0", "--port=8080"]
|
||||
ENTRYPOINT ["/bin/helm-dashboard", "--no-browser", "--bind=0.0.0.0"]
|
||||
|
||||
# docker build . -t komodorio/helm-dashboard:0.0.0 && kind load docker-image komodorio/helm-dashboard:0.0.0
|
||||
209
FEATURES.md
209
FEATURES.md
@@ -1,209 +0,0 @@
|
||||
# Helm Dashboard Features Overview
|
||||
|
||||
## General Layout and Navigation
|
||||
|
||||
### Shutting down the app
|
||||
|
||||
If you run the tool locally, you can shutdown the running process. This is useful when you can't find the console where
|
||||
you started it, or when it was started without console.
|
||||
|
||||
To close Helm-dashboard, click on the button in the rightmost corner of the screen. Once you click on it, your
|
||||
Helm-dashboard will be shut down.
|
||||
|
||||
|
||||
|
||||
## Releases Management Section
|
||||
|
||||
### Switching Clusters
|
||||
|
||||
When started as local binary, the tool reads the list of available cluster connections from kubectl config file. Those
|
||||
connections are displayed on the left side of the screen.
|
||||
|
||||
|
||||
|
||||
If you want to switch to a different cluster, simply click on the corresponding cluster as shown in the
|
||||
figure. You
|
||||
can [read here](https://kubernetes.io/docs/tasks/access-application-cluster/configure-access-multiple-clusters/) to
|
||||
learn on how to configure access to multiple clusters.
|
||||
# Reset Cache
|
||||
The "Reset Cache" feature in Helm Dashboard clears the cached data and fetches the latest information from the backend or data source. It ensures that the dashboard displays up-to-date data and reflects any recent changes or updates.
|
||||
|
||||
|
||||
# Repository
|
||||
Essentially, a repository is a location where charts are gathered and can be shared. If you want to learn more about repositories, [click here](https://helm.sh/docs/topics/chart_repository/). You can find the repository in the home section, as depicted in the figure.
|
||||
|
||||
|
||||
You can add the repository by clicking on 'Add Repository', as shown in the figure.
|
||||
|
||||
|
||||
## Installed Releases List
|
||||
|
||||
A release is an installation of your Helm chart deployed in your Kubernetes Cluster. That means every time that you
|
||||
install or upgrade a Helm chart, it creates a new release revision that coexists with other releases. You
|
||||
can filter releases based on namespaces or search for release names
|
||||
|
||||
|
||||
The squares represent k8s resources installed by the release. Hover over each square to view a tooltip with details.
|
||||
Yellow indicates "pending," green signifies a healthy state, and red indicates an unhealthy state.
|
||||
|
||||
|
||||
It indicates the version of chart that corresponds to this release.
|
||||
|
||||
|
||||
A revision is linked to a release to track the number of updates/changes that release encounters.
|
||||
|
||||
|
||||
Namespaces are a way to organize clusters into virtual sub-clusters — they can be helpful when different teams or
|
||||
projects share a Kubernetes cluster. Any number of namespaces are supported within a cluster, each logically separated
|
||||
from others but with the ability to communicate with each other.
|
||||
|
||||
|
||||
Updated" refers to the amount of time that has passed since the last revision of the release. Whenever you install or
|
||||
upgrade the release, a new revision is created. You can think of it as the "age" of the latest revision.
|
||||
|
||||
|
||||
Indication of upgrade possible/repo suggested.
|
||||
|
||||
|
||||
## Release details
|
||||
|
||||
This indicates the status of the deployed release, and 'Age' represents the amount of time that has passed since the
|
||||
creation of the revision until now.
|
||||
|
||||
|
||||
You can use the Upgrade/Downgrade button to switch to different release versions, as shown in the figure.
|
||||
|
||||
|
||||
Confirm the upgrade settings and configuration and click on confirm button to continue
|
||||
|
||||
|
||||
Once the upgrade is done, your release will show the status
|
||||
|
||||
|
||||
It executes the test scripts or commands within the deployed application's environment and displays the results
|
||||
|
||||
|
||||
Running test hooks results
|
||||
|
||||
|
||||
The Helm Dashboard provides basic information about your Helm releases, including revision number, deployment date, release message, cluster details, and deployment status.
|
||||
|
||||
|
||||
### Resource Tab
|
||||
|
||||
In the Resources tab of the Helm Dashboard, you can view the kind (type), name, status, and any associated messages for your Kubernetes resources.
|
||||
|
||||
|
||||
### Manifest Tab
|
||||
|
||||
Text: The Manifests tab displays the textual representation of the Kubernetes manifests associated with your Helm release. It provides the YAML or JSON configuration files that define the desired state of the resources deployed in your cluster.
|
||||
|
||||
|
||||
Diff with Previous: The "Diff with Previous" feature allows you to compare the current version of the manifests with the previous version. It highlights the differences between the two versions, making it easier to identify the changes made in the deployment.
|
||||
|
||||
|
||||
Diff with Specific: The "Diff with Specific" option enables you to compare the current version of the manifests with a specific past version. It allows you to select a particular revision and view the differences between that revision and the current one.
|
||||
|
||||
|
||||
### Values Tab
|
||||
|
||||
Text: The Values tab displays the textual representation of the values file associated with your Helm chart. It shows the YAML or JSON file that contains the configuration values used during the deployment of the chart.
|
||||
|
||||
|
||||
Diff: The "Diff" feature allows you to compare the current values with the previous values used in a previous deployment. It highlights any differences between the two versions, making it easier to identify changes made to the configuration.
|
||||
|
||||
|
||||
### Text Tab
|
||||
|
||||
Text: The Notes tab displays any accompanying notes or documentation related to the Helm chart.
|
||||
|
||||
|
||||
Diff with previous: The "Diff" feature is not typically available in the Notes tab. This tab is primarily meant for viewing the static text-based notes associated with the chart and doesn't involve comparisons or tracking changes like in the Manifests or Values tabs.
|
||||
|
||||
|
||||
Diff with Specific Version: Similar to the previous point, the ability to view a diff with a specific version of the notes is not a standard feature in the Notes section of the Helm Dashboard. The Notes section usually presents the information for the specific version of the Helm chart that is currently deployed.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
### Execute Helm tests
|
||||
|
||||
For all the release(s) (installed helm charts), you can execute helm tests for that release. For the tests to execute
|
||||
successfully, you need to have existing tests for that helm chart.
|
||||
|
||||
You can execute `helm test` for the specific release as below:
|
||||
|
||||
|
||||
The result of executed `helm test` for the release will be displayed as below:
|
||||
|
||||
|
||||
### Scanner Integrations
|
||||
|
||||
Upon startup, Helm Dashboard detects the presence of [Trivy](https://github.com/aquasecurity/trivy)
|
||||
and [Checkov](https://github.com/bridgecrewio/checkov) scanners. When available, these scanners are offered on k8s
|
||||
resources page, as well as install/upgrade preview page.
|
||||
|
||||
You can request scanning of the specific k8s resource in your cluster:
|
||||
|
||||
|
||||
If you want to validate the k8s manifest prior to installing/reconfiguring a Helm chart, look for "Scan for Problems"
|
||||
button at the bottom of the dialog:
|
||||
|
||||
|
||||
## Repository Section
|
||||
|
||||
Essentially, a repository is a location where charts are gathered and can be shared over network. If you want to learn
|
||||
more about Helm chart
|
||||
repositories, [click here](https://helm.sh/docs/topics/chart_repository/).
|
||||
|
||||
You can access the repository management area of Helm Dashboard in the main navigation section, as depicted in the
|
||||
figure.
|
||||
|
||||
|
||||
|
||||
You can add the repository by clicking on 'Add Repository' button on the left, as shown in the figure.
|
||||
|
||||
|
||||
After completing that step, enter the following data: the repository name and its URL. You can also add the username and
|
||||
password, although this is optional.
|
||||
|
||||
|
||||
Updating means refreshing your repository. You can update your repository as shown in the figure.
|
||||
|
||||
|
||||
If you want to remove your repository from the Helm dashboard, click on the 'Remove' button as shown in the figure.
|
||||
|
||||
|
||||
Use the filter option to find the desired chart quicker from the list of charts.
|
||||
|
||||
|
||||
If you want to install a particular chart, simply hover the pointer over the chart name and an 'Install' button will
|
||||
appear, as shown in the figure.
|
||||
|
||||
|
||||
# Support for Local Charts
|
||||
|
||||
Local Helm chart is a directory with specially named files and a `Chart.yaml` file, which you can install via Helm,
|
||||
without the need to publish the chart into Helm repository. Chart developers might want to experiment with the chart
|
||||
locally, before uploading into public repository. Also, a proprietary application might only use non-published chart as
|
||||
an approach to deploy the software.
|
||||
|
||||
For all the above use-cases, you may use Helm Dashboard UI, specifying the location of your local chart folders via
|
||||
special `--local-chart` command-line parameter. The parameter might be specified multiple times, for example:
|
||||
|
||||
```shell
|
||||
helm-dashboard --local-chart=/opt/charts/my-private-app --local-chart=/home/dev/sources/app/chart
|
||||
```
|
||||
|
||||
When _valid_ local chart sources specified, the repository list would contain a surrogate `[local]` entry, with those
|
||||
charts listed inside. All the chart operations are normal: installing, reconfiguring and upgrading.
|
||||
|
||||
|
||||
|
||||
15
Makefile
15
Makefile
@@ -1,10 +1,10 @@
|
||||
DATE ?= $(shell date +%FT%T%z)
|
||||
VERSION ?= $(shell git describe --tags --always --dirty --match=v* 2> /dev/null || \
|
||||
VERSION ?= $(git describe --tags --always --dirty --match=v* 2> /dev/null || \
|
||||
cat $(CURDIR)/.version 2> /dev/null || echo "v0")
|
||||
|
||||
.PHONY: test
|
||||
test: ; $(info $(M) start unit testing...) @
|
||||
@go test $$(go list ./... | grep -v /mocks/) --race -v -short -coverpkg=./... -coverprofile=profile.cov
|
||||
@go test $$(go list ./... | grep -v /mocks/) --race -v -short -coverprofile=profile.cov
|
||||
@echo "\n*****************************"
|
||||
@echo "** TOTAL COVERAGE: $$(go tool cover -func profile.cov | grep total | grep -Eo '[0-9]+\.[0-9]+')% **"
|
||||
@echo "*****************************\n"
|
||||
@@ -13,19 +13,12 @@ test: ; $(info $(M) start unit testing...) @
|
||||
pull: ; $(info $(M) Pulling source...) @
|
||||
@git pull
|
||||
|
||||
.PHONY: build_go
|
||||
build_go: $(BIN) ; $(info $(M) Building GO...) @ ## Build program binary
|
||||
.PHONY: build
|
||||
build: $(BIN) ; $(info $(M) Building executable...) @ ## Build program binary
|
||||
go build \
|
||||
-ldflags '-X main.version=$(VERSION) -X main.buildDate=$(DATE)' \
|
||||
-o bin/dashboard .
|
||||
|
||||
.PHONY: build_ui
|
||||
build_ui: $(BIN) ; $(info $(M) Building UI...) @ ## Build program binary
|
||||
cd frontend && npm i && npm run build && cd ..
|
||||
|
||||
.PHONY: build
|
||||
build: build_ui build_go ; $(info $(M) Building executable...) @ ## Build program binary
|
||||
|
||||
.PHONY: debug
|
||||
debug: ; $(info $(M) Running dashboard in debug mode...) @
|
||||
@DEBUG=1 ./bin/dashboard
|
||||
113
README.md
113
README.md
@@ -1,26 +1,19 @@
|
||||
<p align="center">
|
||||
<picture>
|
||||
<source media="(prefers-color-scheme: dark)" srcset="images/logo-header-inverted.svg">
|
||||
<source media="(prefers-color-scheme: light)" srcset="images/logo-header.svg#gh-light-mode-only">
|
||||
<img alt="Helm Dashboard" src="images/logo-header.svg#gh-light-mode-only">
|
||||
</picture>
|
||||
</p>
|
||||
#  
|
||||
|
||||
<p align="center">A simplified way of working with Helm.</p>
|
||||
A simplified way of working with Helm.
|
||||
|
||||
 [](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>[<img src="screenshot.png" style="width: 100%; border: 1px solid silver;" border="1" alt="Screenshot">](screenshot.png)</kbd>
|
||||
|
||||
<kbd>[<img src="images/screenshot.png" style="width: 100%; border: 1px solid silver;" border="1" alt="Screenshot">](images/screenshot.png)</kbd>
|
||||
## What it Does?
|
||||
|
||||
## Description
|
||||
_Helm Dashboard_ offers a UI-driven way to view the installed Helm charts, see their revision history and
|
||||
corresponding k8s resources. Also, you can perform simple actions like roll back to a revision or upgrade to newer
|
||||
version.
|
||||
|
||||
_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/).
|
||||
This project is part of [Komodor's](https://komodor.com/?utm_campaign=Helm-Dash&utm_source=helm-dash-gh) vision of
|
||||
helping Kubernetes users to navigate and troubleshoot their clusters, the project is **NOT** an offical project by the [helm team](https://helm.sh/).
|
||||
|
||||
Key capabilities of the tool:
|
||||
Some of the key capabilities of the tool:
|
||||
|
||||
- See all installed charts and their revision history
|
||||
- See manifest diff of the past revisions
|
||||
@@ -28,22 +21,12 @@ Key capabilities of the tool:
|
||||
- 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.
|
||||
## Setup
|
||||
|
||||
### Using Helm plugin manager
|
||||
|
||||
To install dashboard as Helm plugin, simply run Helm command:
|
||||
To install the plugin, simply run Helm command:
|
||||
|
||||
```shell
|
||||
helm plugin install https://github.com/komodorio/helm-dashboard.git
|
||||
@@ -69,7 +52,7 @@ After installing, start the UI by running:
|
||||
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
|
||||
The command above will launch the local Web server and will open the UI in 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`.
|
||||
@@ -82,9 +65,9 @@ This can also be specified using flag `--bind <host>`, for example `--bind=0.0.0
|
||||
|
||||
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 need to limit the operations to a specific namespace, please use `--namespace=...` in your command-line.
|
||||
|
||||
If you don't want the browser tab to automatically open, add `--no-browser` flag in your command line.
|
||||
If you don't want 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.
|
||||
|
||||
@@ -94,50 +77,40 @@ If you want to increase the logging verbosity and see all the debug info, use th
|
||||
|
||||
The official helm chart is [available here](https://github.com/komodorio/helm-charts/blob/master/charts/helm-dashboard)
|
||||
|
||||
### Manual Installation
|
||||
|
||||
Download the appropriate [release package](https://github.com/komodorio/helm-dashboard/releases) for your platform, unpack it and just run `dashboard` binary from it.
|
||||
|
||||
## Scanner Integrations
|
||||
|
||||
Upon startup, Helm Dashboard detects the presence of [Trivy](https://github.com/aquasecurity/trivy)
|
||||
and [Checkov](https://github.com/bridgecrewio/checkov) scanners. When available, these scanners are offered on k8s
|
||||
resources page, as well as install/upgrade preview page.
|
||||
|
||||
You can request scanning of the specific k8s resource in your cluster:
|
||||
|
||||
|
||||
If you want to validate the k8s manifest prior to installing/reconfiguring a Helm chart, look for "Scan for Problems"
|
||||
button at the bottom of the dialog:
|
||||
|
||||
|
||||
## Support Channels
|
||||
|
||||
We have two main channels for supporting the Helm Dashboard
|
||||
users: [Slack community](https://komodorkommunity.slack.com) for general conversations
|
||||
users: [Slack community](https://join.slack.com/t/komodorkommunity/shared_invite/zt-1dm3cnkue-ov1Yh~_95teA35QNx5yuMg) 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. <br>
|
||||
|
||||
## Contributors
|
||||
|
||||
<a href="https://github.com/komodorio/helm-dashboard/graphs/contributors">
|
||||
<img src="https://contrib.rocks/image?repo=komodorio/helm-dashboard" />
|
||||
</a>
|
||||
|
||||
## Local Dev Testing
|
||||
|
||||
Prerequisites, binaries installed and operational:
|
||||
Prerequisites: `helm` and `kubectl` 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
|
||||
There is a need to build binary for plugin to function, run:
|
||||
|
||||
```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.
|
||||
You can just run the `bin/dashboard` binary directly, it will just work.
|
||||
|
||||
To install, checkout the source code and run from source dir:
|
||||
|
||||
@@ -145,7 +118,7 @@ To install, checkout the source code and run from source dir:
|
||||
helm plugin install .
|
||||
```
|
||||
|
||||
A local installation of the plugin just creates a symlink, so making the changes and rebuilding the binary would not require
|
||||
Local installation of plugin just creates a symlink, so making the changes and rebuilding the binary would not require
|
||||
to
|
||||
reinstall a plugin.
|
||||
|
||||
@@ -156,15 +129,3 @@ 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
|
||||
```
|
||||
|
||||
@@ -3,7 +3,7 @@ type: application
|
||||
|
||||
name: helm-dashboard
|
||||
description: A GUI Dashboard for Helm by Komodor
|
||||
icon: "https://raw.githubusercontent.com/komodorio/helm-dashboard/refs/heads/main/images/logo.svg"
|
||||
icon: "https://github.com/komodorio/helm-dashboard/blob/main/pkg/dashboard/static/logo.png"
|
||||
|
||||
version: 2.0.1
|
||||
appVersion: "1.3.3"
|
||||
version: 0.1.0
|
||||
appVersion: "0.0.0"
|
||||
|
||||
@@ -5,25 +5,24 @@
|
||||
```bash
|
||||
helm repo add komodorio https://helm-charts.komodor.io
|
||||
helm repo update
|
||||
helm upgrade --install helm-dashboard komodorio/helm-dashboard
|
||||
helm upgrade --install my-release 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+
|
||||
- Helm 3+
|
||||
|
||||
## Installing the Chart
|
||||
|
||||
To install the chart with the release name `helm-dashboard`:
|
||||
To install the chart with the release name `my-release`:
|
||||
|
||||
```bash
|
||||
helm install helm-dashboard .
|
||||
helm install my-release .
|
||||
```
|
||||
|
||||
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.
|
||||
@@ -32,60 +31,46 @@ The command deploys Helm Dashboard on the Kubernetes cluster in the default conf
|
||||
|
||||
## Uninstalling the Chart
|
||||
|
||||
To uninstall/delete the `helm-dashboard` deployment:
|
||||
To uninstall/delete the `my-release` deployment:
|
||||
|
||||
```bash
|
||||
helm uninstall helm-dashboard
|
||||
helm uninstall my-release
|
||||
```
|
||||
|
||||
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}` |
|
||||
| `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.hostPath` | Set path in case you want to use local host path volumes (not recommended in production) | `""` |
|
||||
| `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` |
|
||||
| Parameter | Description | Default |
|
||||
| ------------------------------------ | ---------------------------------------------------------------------------------------------- | ------------------------------------ |
|
||||
| `image.repository` | Image registry/name | `docker.io/komodorio/helm-dashboard` |
|
||||
| `image.tag` | Image tag | |
|
||||
| `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. | `false` |
|
||||
| `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}` |
|
||||
| `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.hostPath` | Set path in case you want to use local host path volumes (not recommended in production) | `""` |
|
||||
|
||||
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
|
||||
helm upgrade --install my-release komodorio/helm-dashboard --set dashboard.allowWriteActions=true --set service.port=9090
|
||||
```
|
||||
|
||||
> **Tip**: You can use the default [values.yaml](values.yaml)
|
||||
|
||||
@@ -1,51 +0,0 @@
|
||||
{{/*
|
||||
Return the proper image name
|
||||
{{ include "common.images.image" ( dict "imageRoot" .Values.path.to.the.image "global" .Values.global ) }}
|
||||
*/}}
|
||||
{{- define "common.images.image" -}}
|
||||
{{- $registryName := .imageRoot.registry -}}
|
||||
{{- $repositoryName := .imageRoot.repository -}}
|
||||
{{- $separator := ":" -}}
|
||||
{{- $termination := .imageRoot.tag | toString -}}
|
||||
{{- if .global }}
|
||||
{{- if .global.imageRegistry }}
|
||||
{{- $registryName = .global.imageRegistry -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
{{- if .imageRoot.digest }}
|
||||
{{- $separator = "@" -}}
|
||||
{{- $termination = .imageRoot.digest | toString -}}
|
||||
{{- end -}}
|
||||
{{- if $registryName }}
|
||||
{{- printf "%s/%s%s%s" $registryName $repositoryName $separator $termination -}}
|
||||
{{- else -}}
|
||||
{{- printf "%s%s%s" $repositoryName $separator $termination -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
|
||||
{{/*
|
||||
Return the proper Docker Image Registry Secret Names (deprecated: use common.images.renderPullSecrets instead)
|
||||
{{ include "common.images.pullSecrets" ( dict "images" (list .Values.path.to.the.image1, .Values.path.to.the.image2) "global" .Values.global) }}
|
||||
*/}}
|
||||
{{- define "common.images.pullSecrets" -}}
|
||||
{{- $pullSecrets := list }}
|
||||
|
||||
{{- if .global }}
|
||||
{{- range .global.imagePullSecrets -}}
|
||||
{{- $pullSecrets = append $pullSecrets . -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
|
||||
{{- range .images -}}
|
||||
{{- range .pullSecrets -}}
|
||||
{{- $pullSecrets = append $pullSecrets . -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
|
||||
{{- if (not (empty $pullSecrets)) }}
|
||||
imagePullSecrets:
|
||||
{{- range $pullSecrets }}
|
||||
- name: {{ . }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
{{- end -}}
|
||||
@@ -60,31 +60,3 @@ Create the name of the service account to use
|
||||
{{- default "default" .Values.serviceAccount.name }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
|
||||
{{/*
|
||||
Return the proper image Registry Secret Names
|
||||
*/}}
|
||||
{{- define "helm-dashboard.imagePullSecrets" -}}
|
||||
{{ include "common.images.pullSecrets" (dict "images" (list .Values.image) "global" .Values.global) }}
|
||||
{{- end -}}
|
||||
|
||||
|
||||
{{/*
|
||||
Return the proper image name
|
||||
*/}}
|
||||
{{- define "helm-dashboard.image" -}}
|
||||
{{- $image := .Values.image -}}
|
||||
{{- $tag := .Chart.AppVersion -}}
|
||||
{{- if $image.tag -}}
|
||||
{{- $tag = $image.tag -}}
|
||||
{{- end -}}
|
||||
{{- $_ := set $image "tag" $tag -}}
|
||||
{{ include "common.images.image" (dict "imageRoot" $_ "global" .Values.global) }}
|
||||
{{- end -}}
|
||||
|
||||
{{/*
|
||||
Return the proper image name
|
||||
*/}}
|
||||
{{- define "test.image" -}}
|
||||
{{ include "common.images.image" (dict "imageRoot" .Values.testImage "global" .Values.global) }}
|
||||
{{- end -}}
|
||||
@@ -11,7 +11,6 @@ spec:
|
||||
selector:
|
||||
matchLabels:
|
||||
{{- include "helm-dashboard.selectorLabels" . | nindent 6 }}
|
||||
strategy: {{- toYaml .Values.updateStrategy | nindent 4 }}
|
||||
template:
|
||||
metadata:
|
||||
{{- with .Values.podAnnotations }}
|
||||
@@ -21,35 +20,26 @@ spec:
|
||||
labels:
|
||||
{{- include "helm-dashboard.selectorLabels" . | nindent 8 }}
|
||||
spec:
|
||||
{{- include "helm-dashboard.imagePullSecrets" . | nindent 6 }}
|
||||
{{- with .Values.imagePullSecrets }}
|
||||
imagePullSecrets:
|
||||
{{- toYaml . | nindent 8 }}
|
||||
{{- end }}
|
||||
serviceAccountName: {{ include "helm-dashboard.serviceAccountName" . }}
|
||||
securityContext:
|
||||
{{- toYaml .Values.podSecurityContext | nindent 8 }}
|
||||
containers:
|
||||
- name: {{ .Chart.Name }}
|
||||
command:
|
||||
- /bin/helm-dashboard
|
||||
args:
|
||||
{{- with .Values.extraArgs }}
|
||||
{{- toYaml . | nindent 12 }}
|
||||
{{- end }}
|
||||
securityContext:
|
||||
{{- toYaml .Values.securityContext | nindent 12 }}
|
||||
image: "{{ include "helm-dashboard.image" . }}"
|
||||
image: "{{ .Values.image.repository }}:{{ .Values.image.tag | default .Chart.AppVersion }}"
|
||||
imagePullPolicy: {{ .Values.image.pullPolicy }}
|
||||
env:
|
||||
- name: HELM_CACHE_HOME
|
||||
value: /opt/dashboard/helm/cache
|
||||
- name: HELM_CONFIG_HOME
|
||||
value: /opt/dashboard/helm/config
|
||||
- name: HELM_DATA_HOME
|
||||
value: /opt/dashboard/helm/data
|
||||
- name: DEBUG
|
||||
value: {{- ternary " '1'" "" .Values.debug }}
|
||||
{{- if .Values.dashboard.namespace }}
|
||||
- name: HELM_NAMESPACE
|
||||
value: {{ .Values.dashboard.namespace }}
|
||||
{{end}}
|
||||
- name: HELM_CACHE_HOME
|
||||
value: /opt/dashboard/helm/cache
|
||||
- name: HELM_CONFIG_HOME
|
||||
value: /opt/dashboard/helm/config
|
||||
- name: HELM_DATA_HOME
|
||||
value: /opt/dashboard/helm/data
|
||||
ports:
|
||||
- name: http
|
||||
containerPort: 8080
|
||||
@@ -57,16 +47,16 @@ spec:
|
||||
livenessProbe:
|
||||
httpGet:
|
||||
path: /status
|
||||
port: 8080
|
||||
port: http
|
||||
readinessProbe:
|
||||
httpGet:
|
||||
path: /status
|
||||
port: 8080
|
||||
port: http
|
||||
resources:
|
||||
{{- toYaml .Values.resources | nindent 12 }}
|
||||
volumeMounts:
|
||||
- name: data
|
||||
mountPath: /opt/dashboard/helm
|
||||
- name: data
|
||||
mountPath: /opt/dashboard/helm
|
||||
{{- with .Values.nodeSelector }}
|
||||
nodeSelector:
|
||||
{{- toYaml . | nindent 8 }}
|
||||
@@ -85,6 +75,5 @@ spec:
|
||||
persistentVolumeClaim:
|
||||
claimName: {{ include "helm-dashboard.fullname" . }}
|
||||
{{- else }}
|
||||
emptyDir: { }
|
||||
emptyDir: {}
|
||||
{{- end }}
|
||||
|
||||
|
||||
@@ -13,10 +13,6 @@ metadata:
|
||||
spec:
|
||||
{{- if .Values.dashboard.persistence.hostPath }}
|
||||
storageClassName: ""
|
||||
{{- else }}
|
||||
{{- if kindIs "string" .Values.dashboard.persistence.storageClass }}
|
||||
storageClassName: "{{ .Values.dashboard.persistence.storageClass }}"
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
accessModes:
|
||||
{{- if not (empty .Values.dashboard.persistence.accessModes) }}
|
||||
@@ -44,13 +40,9 @@ metadata:
|
||||
{{- end }}
|
||||
spec:
|
||||
accessModes:
|
||||
{{- if not (empty .Values.dashboard.persistence.accessModes) }}
|
||||
{{- range .Values.dashboard.persistence.accessModes }}
|
||||
- {{ . | quote }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
- {{ .Values.dashboard.persistence.accessMode | quote }}
|
||||
capacity:
|
||||
storage: {{ .Values.dashboard.persistence.size | quote }}
|
||||
hostPath:
|
||||
path: {{ .Values.dashboard.persistence.hostPath | quote }}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
@@ -9,20 +9,22 @@ metadata:
|
||||
annotations:
|
||||
{{- toYaml . | nindent 4 }}
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
|
||||
---
|
||||
kind: ClusterRole
|
||||
apiVersion: rbac.authorization.k8s.io/v1
|
||||
metadata:
|
||||
name: {{ include "helm-dashboard.serviceAccountName" . }}
|
||||
rules:
|
||||
- apiGroups: ["*"]
|
||||
- apiGroups: ["", "apps", "rbac.authorization.k8s.io", "rbac", "batch", "extensions", "networking.k8s.io", "storage.k8s.io"]
|
||||
resources: ["*"]
|
||||
{{- if .Values.dashboard.allowWriteActions }}
|
||||
verbs: ["get", "list", "watch", "create", "delete", "patch", "update"]
|
||||
{{- else }}
|
||||
verbs: ["get", "list", "watch"]
|
||||
{{- if .Values.dashboard.allowWriteActions }}
|
||||
- apiGroups: ["", "apps", "rbac.authorization.k8s.io", "rbac", "batch", "extensions", "networking.k8s.io", "storage.k8s.io"]
|
||||
resources: ["*"]
|
||||
verbs: ["get", "list", "watch", "create", "delete", "patch", "update"]
|
||||
{{- end }}
|
||||
{{- end }}
|
||||
---
|
||||
apiVersion: rbac.authorization.k8s.io/v1
|
||||
kind: ClusterRoleBinding
|
||||
@@ -35,4 +37,4 @@ roleRef:
|
||||
subjects:
|
||||
- kind: ServiceAccount
|
||||
namespace: {{ .Release.Namespace }}
|
||||
name: {{ include "helm-dashboard.serviceAccountName" . }}
|
||||
name: {{ include "helm-dashboard.serviceAccountName" . }}
|
||||
@@ -7,10 +7,9 @@ metadata:
|
||||
annotations:
|
||||
"helm.sh/hook": test
|
||||
spec:
|
||||
{{- include "helm-dashboard.imagePullSecrets" . | nindent 2 }}
|
||||
containers:
|
||||
- name: wget
|
||||
image: {{ include "test.image" . }}
|
||||
image: busybox
|
||||
command: ['wget']
|
||||
args: ['--timeout=5', '{{ include "helm-dashboard.fullname" . }}:{{ .Values.service.port }}']
|
||||
restartPolicy: Never
|
||||
|
||||
@@ -1,24 +1,12 @@
|
||||
replicaCount: 1
|
||||
|
||||
# Flag for setting environment to debug mode
|
||||
debug: false
|
||||
|
||||
global:
|
||||
## @param global.imageRegistry Global Docker image registry
|
||||
imageRegistry: ""
|
||||
## Optionally specify an array of imagePullSecrets.
|
||||
## Example:
|
||||
## imagePullSecrets:
|
||||
## - myRegistryKeySecretName
|
||||
imagePullSecrets: []
|
||||
|
||||
image:
|
||||
repository: komodorio/helm-dashboard
|
||||
pullPolicy: IfNotPresent
|
||||
# Overrides the image tag whose default is the chart appVersion.
|
||||
tag: ""
|
||||
imagePullSecrets: []
|
||||
|
||||
imagePullSecrets: []
|
||||
nameOverride: ""
|
||||
fullnameOverride: ""
|
||||
|
||||
@@ -38,11 +26,7 @@ resources:
|
||||
memory: 1Gi
|
||||
|
||||
dashboard:
|
||||
allowWriteActions: true
|
||||
|
||||
# default namespace for Helm operations
|
||||
namespace: ""
|
||||
|
||||
allowWriteActions: false
|
||||
persistence:
|
||||
enabled: true
|
||||
|
||||
@@ -52,7 +36,7 @@ dashboard:
|
||||
## set, choosing the default provisioner. (gp2 on AWS, standard on
|
||||
## GKE, AWS & OpenStack)
|
||||
##
|
||||
storageClass: null
|
||||
storageClass: ""
|
||||
|
||||
## Helm Dashboard Persistent Volume access modes
|
||||
## Must match those of existing PV or dynamic provisioner
|
||||
@@ -76,20 +60,6 @@ dashboard:
|
||||
## Helm Dashboard data Persistent Volume size
|
||||
##
|
||||
size: 100M
|
||||
|
||||
## @param.updateStrategy.type Set up update strategy for helm-dashboard installation.
|
||||
## Set to Recreate if you use persistent volume that cannot be mounted by more than one pods to make sure the pods is destroyed first.
|
||||
## ref: https://kubernetes.io/docs/concepts/workloads/controllers/deployment/#strategy
|
||||
## Example:
|
||||
## updateStrategy:
|
||||
## type: RollingUpdate
|
||||
## rollingUpdate:
|
||||
## maxSurge: 25%
|
||||
## maxUnavailable: 25%
|
||||
##
|
||||
updateStrategy:
|
||||
type: RollingUpdate
|
||||
|
||||
|
||||
podAnnotations: {}
|
||||
|
||||
@@ -120,23 +90,6 @@ autoscaling:
|
||||
|
||||
nodeSelector: {}
|
||||
|
||||
extraArgs:
|
||||
- --no-browser
|
||||
- --bind=0.0.0.0
|
||||
|
||||
tolerations: []
|
||||
|
||||
affinity: {}
|
||||
|
||||
|
||||
testImage:
|
||||
repository: busybox
|
||||
tag: latest
|
||||
pullPolicy: IfNotPresent
|
||||
# Overrides the image tag whose default is the chart appVersion.
|
||||
# tag: ""
|
||||
## Optionally specify an array of imagePullSecrets.
|
||||
## Example:
|
||||
## imagePullSecrets:
|
||||
## - myRegistryKeySecretName
|
||||
imagePullSecrets: []
|
||||
|
||||
@@ -1,10 +0,0 @@
|
||||
#!/bin/bash -e
|
||||
|
||||
WORKING_DIRECTORY="$PWD"
|
||||
|
||||
cd "$WORKING_DIRECTORY/dashboard"
|
||||
|
||||
npm i
|
||||
npm run build
|
||||
|
||||
cp -a "$WORKING_DIRECTORY/dashboard/static/" "$WORKING_DIRECTORY/pkg/dashboard/static/"
|
||||
@@ -1,4 +1,4 @@
|
||||
#!/bin/bash -e
|
||||
#!/bin/bash
|
||||
|
||||
WORKING_DIRECTORY="$PWD"
|
||||
|
||||
@@ -9,7 +9,6 @@ WORKING_DIRECTORY="$PWD"
|
||||
}
|
||||
|
||||
sed -i -e "s/appVersion.*/appVersion: \"${APP_VERSION}\" /g" ${HELM_CHARTS_SOURCE}/Chart.yaml
|
||||
sed -i -e "s/version.*/version: \"${APP_VERSION}\" /g" plugin.yaml
|
||||
CURRENT_VERSION=$(cat ${HELM_CHARTS_SOURCE}/Chart.yaml | grep 'version:' | awk '{print $2}')
|
||||
NEW_VERSION=$(echo $CURRENT_VERSION | awk -F. '{$NF = $NF + 1;} 1' | sed 's/ /./g')
|
||||
sed -i -e "s/${CURRENT_VERSION}/${NEW_VERSION}/g" ${HELM_CHARTS_SOURCE}/Chart.yaml
|
||||
|
||||
@@ -1 +0,0 @@
|
||||
VITE_SERVER_PORT=8080
|
||||
@@ -1,44 +0,0 @@
|
||||
module.exports = {
|
||||
env: {
|
||||
browser: true,
|
||||
es2021: true,
|
||||
},
|
||||
extends: ["enpitech", "plugin:@typescript-eslint/recommended"],
|
||||
globals: {
|
||||
heap: "writable",
|
||||
DD_RUM: "writable",
|
||||
},
|
||||
overrides: [
|
||||
{
|
||||
env: {
|
||||
node: true,
|
||||
},
|
||||
files: [".eslintrc.{js,cjs}"],
|
||||
parserOptions: {
|
||||
sourceType: "script",
|
||||
},
|
||||
},
|
||||
],
|
||||
parser: "@typescript-eslint/parser",
|
||||
parserOptions: {
|
||||
ecmaVersion: "latest",
|
||||
sourceType: "module",
|
||||
},
|
||||
plugins: ["@typescript-eslint", "react"],
|
||||
rules: {
|
||||
// please don't make an error occur here we use console.error
|
||||
"no-console": ["error", { allow: ["error"] }],
|
||||
"no-alert": "error",
|
||||
"no-debugger": "error",
|
||||
"@typescript-eslint/ban-ts-comment": "off",
|
||||
"@typescript-eslint/no-unused-vars": [
|
||||
"error",
|
||||
{ vars: "all", args: "after-used", ignoreRestSiblings: true },
|
||||
],
|
||||
"react/react-in-jsx-scope": "off", // Vite does not require you to import React into each component file
|
||||
"linebreak-style": ["error", "unix"],
|
||||
quotes: ["error", "double"],
|
||||
semi: ["error", "always"],
|
||||
"@typescript-eslint/no-explicit-any": "warn",
|
||||
},
|
||||
};
|
||||
27
frontend/.gitignore
vendored
27
frontend/.gitignore
vendored
@@ -1,27 +0,0 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
static
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
||||
/storybook-static
|
||||
@@ -1 +0,0 @@
|
||||
legacy-peer-deps=true
|
||||
@@ -1,3 +0,0 @@
|
||||
# Ignore artifacts:
|
||||
build
|
||||
coverage
|
||||
@@ -1,4 +0,0 @@
|
||||
trailingComma: "es5"
|
||||
tabWidth: 2
|
||||
semi: true
|
||||
singleQuote: false
|
||||
@@ -1,32 +0,0 @@
|
||||
module.exports = {
|
||||
stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
|
||||
addons: [
|
||||
"@storybook/addon-links",
|
||||
"@storybook/addon-essentials",
|
||||
"@storybook/addon-interactions",
|
||||
],
|
||||
framework: "@storybook/react",
|
||||
core: {
|
||||
builder: "@storybook/builder-vite",
|
||||
},
|
||||
webpackFinal: async (config) => {
|
||||
config.module.rules.push({
|
||||
test: /\.css$/,
|
||||
use: [
|
||||
{
|
||||
loader: "postcss-loader",
|
||||
options: {
|
||||
postcssOptions: {
|
||||
plugins: [require("tailwindcss"), require("autoprefixer")],
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
include: path.resolve(__dirname, "../"),
|
||||
});
|
||||
return config;
|
||||
},
|
||||
features: {
|
||||
storyStoreV7: true,
|
||||
},
|
||||
};
|
||||
@@ -1,25 +0,0 @@
|
||||
// .storybook/main.ts
|
||||
|
||||
import type { StorybookConfig } from "@storybook/react-vite";
|
||||
const config: StorybookConfig = {
|
||||
stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
|
||||
addons: [
|
||||
"@storybook/addon-actions",
|
||||
"@storybook/addon-links",
|
||||
"@storybook/addon-essentials",
|
||||
"@storybook/addon-styling",
|
||||
{
|
||||
name: "@storybook/addon-styling",
|
||||
},
|
||||
"@storybook/addon-mdx-gfm",
|
||||
],
|
||||
core: {},
|
||||
framework: {
|
||||
name: "@storybook/react-vite",
|
||||
options: {},
|
||||
},
|
||||
docs: {
|
||||
autodocs: true,
|
||||
},
|
||||
};
|
||||
export default config;
|
||||
@@ -1 +0,0 @@
|
||||
<div id="portal"></div>
|
||||
@@ -1,3 +0,0 @@
|
||||
<script>
|
||||
window.global = window;
|
||||
</script>
|
||||
@@ -1,12 +0,0 @@
|
||||
import "../src/index.css";
|
||||
import "tailwindcss/tailwind.css";
|
||||
|
||||
export const parameters = {
|
||||
actions: { argTypesRegex: "^on[A-Z].*" },
|
||||
controls: {
|
||||
matchers: {
|
||||
color: /(background|color)$/i,
|
||||
date: /Date$/,
|
||||
},
|
||||
},
|
||||
};
|
||||
@@ -1,12 +0,0 @@
|
||||
import "tailwindcss/tailwind.css";
|
||||
import "../src/index.css";
|
||||
|
||||
export const parameters = {
|
||||
actions: { argTypesRegex: "^on[A-Z].*" },
|
||||
controls: {
|
||||
matchers: {
|
||||
color: /(background|color)$/i,
|
||||
date: /Date$/,
|
||||
},
|
||||
},
|
||||
};
|
||||
@@ -1,72 +0,0 @@
|
||||
# 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.
|
||||
2. go to `frontend` in your local project.
|
||||
3. in order to install dependencies and start the development server
|
||||
- `npm i`
|
||||
- `npm run dev`
|
||||
4. 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
|
||||
@@ -1,16 +0,0 @@
|
||||
import { defineConfig } from "cypress";
|
||||
|
||||
export default defineConfig({
|
||||
component: {
|
||||
devServer: {
|
||||
framework: "react",
|
||||
bundler: "vite",
|
||||
},
|
||||
},
|
||||
|
||||
e2e: {
|
||||
setupNodeEvents(on, config) {
|
||||
// implement node event listeners here
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -1,53 +0,0 @@
|
||||
describe("Adding repository flow", () => {
|
||||
const addChartNameInput = "[data-cy='add-chart-name']";
|
||||
const addChartUrlInput = "[data-cy='add-chart-url']";
|
||||
const addChartRepositoryButton = "[data-cy='add-chart-repository-button']";
|
||||
|
||||
it("Adding new chart repository", () => {
|
||||
cy.intercept("GET", "http://localhost:5173/status", {
|
||||
fixture: "status.json",
|
||||
}).as("status");
|
||||
|
||||
cy.intercept("GET", "http://localhost:5173/api/helm/releases", {
|
||||
fixture: "releases.json",
|
||||
}).as("releases");
|
||||
|
||||
cy.visit(
|
||||
"http://localhost:5173/#/minikube/installed?filteredNamespace=default"
|
||||
);
|
||||
|
||||
cy.get("[data-cy='navigation-link']").contains("Repository").click();
|
||||
cy.get("[data-cy='install-repository-button']").click();
|
||||
|
||||
cy.get(addChartNameInput).type("Komodorio");
|
||||
cy.get(addChartUrlInput).type("https://helm-charts.komodor.io");
|
||||
|
||||
cy.intercept("GET", "http://localhost:5173/api/helm/repositories", {
|
||||
fixture: "repositories.json",
|
||||
}).as("repositories");
|
||||
|
||||
cy.get(addChartRepositoryButton).click();
|
||||
|
||||
cy.contains("https://helm-charts.komodor.io");
|
||||
|
||||
cy.get("[data-cy='chart-viewer-install-button']")
|
||||
.eq(0)
|
||||
.click({ force: true })
|
||||
.contains("Install")
|
||||
.click();
|
||||
|
||||
cy.intercept("POST", "http://localhost:5173/api/helm/releases/default", {
|
||||
fixture: "defaultReleases.json",
|
||||
}).as("defaultReleases");
|
||||
|
||||
cy.intercept(
|
||||
"GET",
|
||||
"http://localhost:5173/api/helm/releases/default/helm-dashboard/history",
|
||||
{ fixture: "history.json" }
|
||||
).as("history");
|
||||
|
||||
cy.contains("Confirm").click();
|
||||
|
||||
cy.wait(["@defaultReleases", "@history"]);
|
||||
});
|
||||
});
|
||||
File diff suppressed because one or more lines are too long
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"name": "Using fixtures to represent data",
|
||||
"email": "hello@cypress.io",
|
||||
"body": "Fixtures are a great way to mock data for responses to routes"
|
||||
}
|
||||
@@ -1,13 +0,0 @@
|
||||
[
|
||||
{
|
||||
"revision": 1,
|
||||
"updated": "2024-01-17T22:39:07.2371554+02:00",
|
||||
"status": "deployed",
|
||||
"chart": "helm-dashboard-0.1.10",
|
||||
"app_version": "1.3.3",
|
||||
"description": "Install complete",
|
||||
"chart_name": "helm-dashboard",
|
||||
"chart_ver": "0.1.10",
|
||||
"has_tests": true
|
||||
}
|
||||
]
|
||||
@@ -1 +0,0 @@
|
||||
[]
|
||||
@@ -1,6 +0,0 @@
|
||||
[
|
||||
{
|
||||
"name": "Komodorio",
|
||||
"url": "https://helm-charts.komodor.io"
|
||||
}
|
||||
]
|
||||
@@ -1,7 +0,0 @@
|
||||
{
|
||||
"CurVer": "0.0.0",
|
||||
"LatestVer": "v1.3.3",
|
||||
"Analytics": false,
|
||||
"CacheHitRatio": 0,
|
||||
"ClusterMode": false
|
||||
}
|
||||
@@ -1,37 +0,0 @@
|
||||
/// <reference types="cypress" />
|
||||
// ***********************************************
|
||||
// This example commands.ts shows you how to
|
||||
// create various custom commands and overwrite
|
||||
// existing commands.
|
||||
//
|
||||
// For more comprehensive examples of custom
|
||||
// commands please read more here:
|
||||
// https://on.cypress.io/custom-commands
|
||||
// ***********************************************
|
||||
//
|
||||
//
|
||||
// -- This is a parent command --
|
||||
// Cypress.Commands.add('login', (email, password) => { ... })
|
||||
//
|
||||
//
|
||||
// -- This is a child command --
|
||||
// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
|
||||
//
|
||||
//
|
||||
// -- This is a dual command --
|
||||
// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
|
||||
//
|
||||
//
|
||||
// -- This will overwrite an existing command --
|
||||
// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
|
||||
//
|
||||
// declare global {
|
||||
// namespace Cypress {
|
||||
// interface Chainable {
|
||||
// login(email: string, password: string): Chainable<void>
|
||||
// drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
|
||||
// dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
|
||||
// visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
@@ -1,12 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<title>Components App</title>
|
||||
</head>
|
||||
<body>
|
||||
<div data-cy-root></div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,12 +0,0 @@
|
||||
import "./commands";
|
||||
import { mount } from "cypress/react18";
|
||||
|
||||
declare global {
|
||||
namespace Cypress {
|
||||
interface Chainable {
|
||||
mount: typeof mount;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Cypress.Commands.add("mount", mount);
|
||||
@@ -1,20 +0,0 @@
|
||||
// ***********************************************************
|
||||
// This example support/e2e.ts is processed and
|
||||
// loaded automatically before your test files.
|
||||
//
|
||||
// This is a great place to put global configuration and
|
||||
// behavior that modifies Cypress.
|
||||
//
|
||||
// You can change the location of this file or turn off
|
||||
// automatically serving support files with the
|
||||
// 'supportFile' configuration option.
|
||||
//
|
||||
// You can read more here:
|
||||
// https://on.cypress.io/configuration
|
||||
// ***********************************************************
|
||||
|
||||
// Import commands.js using ES2015 syntax:
|
||||
import "./commands";
|
||||
|
||||
// Alternatively you can use CommonJS syntax:
|
||||
// require('./commands')
|
||||
@@ -1,28 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/assets/logo.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Helm Dashboard</title>
|
||||
<script src="/assets/analytics.js"></script>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.1/styles/github.min.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/styles/lightfair.min.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
href="https://cdn.jsdelivr.net/npm/diff2html/bundles/css/diff2html.min.css"
|
||||
/>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<div id="portal"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
28134
frontend/package-lock.json
generated
28134
frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -1,86 +0,0 @@
|
||||
{
|
||||
"name": "dashboard",
|
||||
"version": "1.0.0",
|
||||
"type": "module",
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"dependencies": {
|
||||
"@tanstack/react-query": "^4.35.3",
|
||||
"@types/luxon": "^3.3.0",
|
||||
"@types/marked": "^5.0.0",
|
||||
"compare-versions": "^6.0.0-rc.2",
|
||||
"diff2html": "^3.4.46",
|
||||
"eslint-config-enpitech": "^1.0.9",
|
||||
"flowbite": "^1.6.6",
|
||||
"flowbite-react": "^0.4.9",
|
||||
"highlight.js": "^11.8.0",
|
||||
"html-react-parser": "^4.0.0",
|
||||
"luxon": "^3.3.0",
|
||||
"marked": "^5.1.0",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-error-boundary": "^4.0.10",
|
||||
"react-icons": "^4.8.0",
|
||||
"react-modern-drawer": "^1.2.0",
|
||||
"react-router-dom": "^6.9.0",
|
||||
"react-select": "^5.7.4",
|
||||
"swagger-ui-react": "^5.1.1",
|
||||
"uuid": "^9.0.1",
|
||||
"vite-plugin-static-copy": "^0.17.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.21.0",
|
||||
"@storybook/addon-actions": "^7.0.24",
|
||||
"@storybook/addon-essentials": "^7.0.24",
|
||||
"@storybook/addon-interactions": "^7.0.24",
|
||||
"@storybook/addon-links": "^7.0.24",
|
||||
"@storybook/addon-mdx-gfm": "7.0.24",
|
||||
"@storybook/addon-styling": "^1.3.2",
|
||||
"@storybook/react": "^7.0.24",
|
||||
"@storybook/react-vite": "7.5.0",
|
||||
"@storybook/testing-library": "^0.2.0",
|
||||
"@tailwindcss/line-clamp": "^0.4.4",
|
||||
"@types/react": "^18.0.27",
|
||||
"@types/react-dom": "^18.0.10",
|
||||
"@types/swagger-ui-react": "^4.18.0",
|
||||
"@types/uuid": "^9.0.4",
|
||||
"@typescript-eslint/eslint-plugin": "^6.2.1",
|
||||
"@typescript-eslint/parser": "^6.2.1",
|
||||
"@vitejs/plugin-react": "^3.1.0",
|
||||
"autoprefixer": "^10.4.14",
|
||||
"cypress": "^13.3.0",
|
||||
"eslint": "^8.46.0",
|
||||
"eslint-config-prettier": "^8.7.0",
|
||||
"eslint-plugin-react": "^7.33.1",
|
||||
"eslint-plugin-storybook": "^0.6.12",
|
||||
"lint-staged": "^13.2.3",
|
||||
"postcss": "^8.4.24",
|
||||
"prettier": "2.8.4",
|
||||
"react-icons": "^4.8.0",
|
||||
"storybook": "7.5.0",
|
||||
"tailwindcss": "^3.3.2",
|
||||
"typescript": "^4.9.5",
|
||||
"vite": "^4.1.0",
|
||||
"vite-plugin-html-config": "^1.0.11"
|
||||
},
|
||||
"lint-staged": {
|
||||
"**/*": "prettier --write --ignore-unknown"
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview",
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"storybook": "storybook dev -p 6006",
|
||||
"build-storybook": "storybook build",
|
||||
"lint": "npx eslint src/",
|
||||
"lint:fix": "npm run lint -- --fix",
|
||||
"prettier": "npx prettier src/ --check",
|
||||
"prettier:fix": "npm run prettier -- --write",
|
||||
"cypress:open": "cypress open",
|
||||
"cypress:run": "cypress run"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
"license": "Apache-2.0"
|
||||
}
|
||||
@@ -1,6 +0,0 @@
|
||||
module.exports = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
};
|
||||
@@ -1,167 +0,0 @@
|
||||
const xhr = new XMLHttpRequest();
|
||||
const TRACK_EVENT_TYPE = "track";
|
||||
const IDENTIFY_EVENT_TYPE = "identify";
|
||||
const BASE_ANALYTIC_MSG = {
|
||||
method: "POST",
|
||||
mode: "cors",
|
||||
cache: "no-cache",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
"api-key": "komodor.analytics@admin.com"
|
||||
},
|
||||
redirect: "follow",
|
||||
referrerPolicy: "no-referrer"
|
||||
};
|
||||
xhr.onload = function() {
|
||||
if (xhr.readyState === XMLHttpRequest.DONE) {
|
||||
const status = JSON.parse(xhr.responseText);
|
||||
const version = status.CurVer;
|
||||
if (status.Analytics) {
|
||||
enableDD(version);
|
||||
enableHeap(version, status.ClusterMode);
|
||||
enableSegmentBackend(version, status.ClusterMode);
|
||||
} else {
|
||||
console.log("Analytics is disabled in this session");
|
||||
}
|
||||
}
|
||||
};
|
||||
xhr.open("GET", "/status", true);
|
||||
xhr.send(null);
|
||||
|
||||
function enableDD(version) {
|
||||
(function(h, o, u, n, d) {
|
||||
h = h[d] = h[d] || {
|
||||
q: [],
|
||||
onReady: function(c) {
|
||||
h.q.push(c);
|
||||
}
|
||||
};
|
||||
d = o.createElement(u);
|
||||
d.async = true;
|
||||
d.src = n;
|
||||
n = o.getElementsByTagName(u)[0];
|
||||
n.parentNode.insertBefore(d, n);
|
||||
})(
|
||||
window,
|
||||
document,
|
||||
"script",
|
||||
"https://www.datadoghq-browser-agent.com/datadog-rum-v4.js",
|
||||
"DD_RUM"
|
||||
);
|
||||
DD_RUM.onReady(function() {
|
||||
DD_RUM.init({
|
||||
clientToken: "pub16d64cd1c00cf073ce85af914333bf72",
|
||||
applicationId: "e75439e5-e1b3-46ba-a9e9-a2e58579a2e2",
|
||||
site: "datadoghq.com",
|
||||
service: "helm-dashboard",
|
||||
version: version,
|
||||
trackInteractions: true,
|
||||
trackResources: true,
|
||||
trackLongTasks: true,
|
||||
defaultPrivacyLevel: "mask",
|
||||
sessionReplaySampleRate: 0
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function enableHeap(version, inCluster) {
|
||||
(window.heap = window.heap || []),
|
||||
(heap.load = function(e, t) {
|
||||
(window.heap.appid = e), (window.heap.config = t = t || {});
|
||||
let r = document.createElement("script");
|
||||
(r.type = "text/javascript"),
|
||||
(r.async = !0),
|
||||
(r.src = "https://cdn.heapanalytics.com/js/heap-" + e + ".js");
|
||||
let a = document.getElementsByTagName("script")[0];
|
||||
a.parentNode.insertBefore(r, a);
|
||||
for (
|
||||
let n = function(e) {
|
||||
return function() {
|
||||
heap.push([e].concat(Array.prototype.slice.call(arguments, 0)));
|
||||
};
|
||||
},
|
||||
p = [
|
||||
"addEventProperties",
|
||||
"addUserProperties",
|
||||
"clearEventProperties",
|
||||
"identify",
|
||||
"resetIdentity",
|
||||
"removeEventProperty",
|
||||
"setEventProperties",
|
||||
"track",
|
||||
"unsetEventProperty"
|
||||
],
|
||||
o = 0;
|
||||
o < p.length;
|
||||
o++
|
||||
)
|
||||
heap[p[o]] = n(p[o]);
|
||||
});
|
||||
heap.load("4249623943");
|
||||
window.heap.addEventProperties({
|
||||
version: version,
|
||||
installationMode: inCluster ? "cluster" : "local"
|
||||
});
|
||||
}
|
||||
|
||||
function sendStats(name, prop) {
|
||||
if (window.heap) {
|
||||
window.heap.track(name, prop);
|
||||
}
|
||||
}
|
||||
|
||||
function enableSegmentBackend(version, ClusterMode) {
|
||||
sendToSegmentThroughAPI(
|
||||
"helm dashboard loaded",
|
||||
{ version, installationMode: ClusterMode ? "cluster" : "local" },
|
||||
TRACK_EVENT_TYPE
|
||||
);
|
||||
}
|
||||
|
||||
function sendToSegmentThroughAPI(eventName, properties, segmentCallType) {
|
||||
const userId = getUserId();
|
||||
try {
|
||||
sendData(properties, segmentCallType, userId, eventName);
|
||||
} catch (e) {
|
||||
console.log("failed sending data to segment", e);
|
||||
}
|
||||
}
|
||||
|
||||
function sendData(data, eventType, userId, eventName) {
|
||||
const body = createBody(eventType, userId, data, eventName);
|
||||
return fetch(`https://api.komodor.com/analytics/segment/${eventType}`, {
|
||||
...BASE_ANALYTIC_MSG,
|
||||
body: JSON.stringify(body)
|
||||
});
|
||||
}
|
||||
|
||||
function createBody(segmentCallType, userId, params, eventName) {
|
||||
const data = { userId: userId };
|
||||
if (segmentCallType === IDENTIFY_EVENT_TYPE) {
|
||||
data["traits"] = params;
|
||||
} else if (segmentCallType === TRACK_EVENT_TYPE) {
|
||||
if (!eventName) {
|
||||
throw new Error("no eventName parameter on segment track call");
|
||||
}
|
||||
data["properties"] = params;
|
||||
data["eventName"] = eventName;
|
||||
}
|
||||
return data;
|
||||
}
|
||||
|
||||
const getUserId = (() => {
|
||||
let userId = null;
|
||||
return () => {
|
||||
if (!userId) {
|
||||
userId = crypto.randomUUID ? crypto.randomUUID() : uuid();
|
||||
}
|
||||
return userId;
|
||||
};
|
||||
})();
|
||||
|
||||
function uuid() {
|
||||
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) {
|
||||
let r = Math.random() * 16 | 0, v = c === "x" ? r : (r & 0x3 | 0x8);
|
||||
return v.toString(16);
|
||||
});
|
||||
}
|
||||
@@ -1,681 +0,0 @@
|
||||
{
|
||||
"openapi": "3.0.3",
|
||||
"info": {
|
||||
"title": "Helm Dashboard API",
|
||||
"version": ""
|
||||
},
|
||||
"tags": [
|
||||
{
|
||||
"name": "Releases"
|
||||
},
|
||||
{
|
||||
"name": "Repositories"
|
||||
},
|
||||
{
|
||||
"name": "K8s"
|
||||
},
|
||||
{
|
||||
"name": "Miscellaneous"
|
||||
}
|
||||
],
|
||||
"paths": {
|
||||
"/api/helm/releases": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "Get list of installed releases",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Returns list of installed releases"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/releases/{ns}": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "ns",
|
||||
"in": "path",
|
||||
"description": "Name of kubernetes namespace, use '[empty]' if you want to use k8s context default"
|
||||
}
|
||||
],
|
||||
"post": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "Install new release",
|
||||
"requestBody": {
|
||||
"content": {
|
||||
"multipart/form-data": {
|
||||
"schema": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"name": {
|
||||
"type": "string",
|
||||
"required": true
|
||||
},
|
||||
"chart": {
|
||||
"type": "string",
|
||||
"required": true
|
||||
},
|
||||
"version": {
|
||||
"type": "string"
|
||||
},
|
||||
"values": {
|
||||
"type": "string",
|
||||
"description": "Text of values.yaml to use"
|
||||
},
|
||||
"preview": {
|
||||
"type": "boolean"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "In case preview=true, the preview diff is generated",
|
||||
"content": {
|
||||
"text/plain": {}
|
||||
}
|
||||
},
|
||||
"202": {
|
||||
"description": "In case preview=false, the actial install is performed and resulting release object is returned",
|
||||
"content": {
|
||||
"application/json": {}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/releases/{ns}/{name}": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "ns",
|
||||
"in": "path",
|
||||
"description": "Name of kubernetes namespace"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "path",
|
||||
"description": "Name of Helm release"
|
||||
}
|
||||
],
|
||||
"post": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "Upgrade/reconfigure existing release",
|
||||
"requestBody": {
|
||||
"content": {
|
||||
"multipart/form-data": {
|
||||
"schema": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"name": {
|
||||
"type": "string",
|
||||
"required": true
|
||||
},
|
||||
"chart": {
|
||||
"type": "string",
|
||||
"required": true
|
||||
},
|
||||
"version": {
|
||||
"type": "string"
|
||||
},
|
||||
"values": {
|
||||
"type": "string",
|
||||
"description": "Text of values.yaml to use"
|
||||
},
|
||||
"preview": {
|
||||
"type": "boolean"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "In case preview=true, the preview diff is generated",
|
||||
"content": {
|
||||
"text/plain": {}
|
||||
}
|
||||
},
|
||||
"202": {
|
||||
"description": "In case preview=false, the actial install is performed and resulting release object is returned",
|
||||
"content": {
|
||||
"application/json": {}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/releases/{ns}/{name}/history": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "ns",
|
||||
"in": "path",
|
||||
"description": "Name of kubernetes namespace"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "path",
|
||||
"description": "Name of Helm release"
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "Get revision history for release",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "List of release revisions"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/releases/{ns}/{name}/manifest": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "ns",
|
||||
"in": "path",
|
||||
"description": "Name of kubernetes namespace"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "path",
|
||||
"description": "Name of Helm release"
|
||||
},
|
||||
{
|
||||
"name": "revision",
|
||||
"in": "query",
|
||||
"description": "Revision to get data from"
|
||||
},
|
||||
{
|
||||
"name": "revisionDiff",
|
||||
"in": "query",
|
||||
"description": "Revision to diff against"
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "Get manifest for release",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Manifest text, or diff if revisionDiff is specified"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/releases/{ns}/{name}/values": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "ns",
|
||||
"in": "path",
|
||||
"description": "Name of kubernetes namespace"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "path",
|
||||
"description": "Name of Helm release"
|
||||
},
|
||||
{
|
||||
"name": "revision",
|
||||
"in": "query",
|
||||
"description": "Revision to get data from"
|
||||
},
|
||||
{
|
||||
"name": "revisionDiff",
|
||||
"in": "query",
|
||||
"description": "Revision to diff against"
|
||||
},
|
||||
{
|
||||
"name": "userDefined",
|
||||
"in": "query",
|
||||
"description": "If set, only user-defined values will be listed"
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "Get values for release",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Values YAML text, or diff if revisionDiff is specified"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/releases/{ns}/{name}/notes": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "ns",
|
||||
"in": "path",
|
||||
"description": "Name of kubernetes namespace"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "path",
|
||||
"description": "Name of Helm release"
|
||||
},
|
||||
{
|
||||
"name": "revision",
|
||||
"in": "query",
|
||||
"description": "Revision to get data from"
|
||||
},
|
||||
{
|
||||
"name": "revisionDiff",
|
||||
"in": "query",
|
||||
"description": "Revision to diff against"
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "Get textual notes for release",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Notes text, or diff if revisionDiff is specified"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/releases/{ns}/{name}/resources": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "ns",
|
||||
"in": "path",
|
||||
"description": "Name of kubernetes namespace"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "path",
|
||||
"description": "Name of Helm release"
|
||||
},
|
||||
{
|
||||
"name": "health",
|
||||
"in": "query",
|
||||
"description": "Flag to query k8s health status of resources"
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "List of installed k8s resources for this release",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Structured list of resources",
|
||||
"content": {
|
||||
"application/json": {}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/releases/{ns}/{name}/rollback": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "ns",
|
||||
"in": "path",
|
||||
"description": "Name of kubernetes namespace"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "path",
|
||||
"description": "Name of Helm release"
|
||||
}
|
||||
],
|
||||
"post": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "Rollback the release to a previous revision",
|
||||
"requestBody": {
|
||||
"content": {
|
||||
"application/x-www-form-urlencoded": {
|
||||
"schema": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"revision": {
|
||||
"type": "integer"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"responses": {
|
||||
"202": {
|
||||
"description": "Rolled back successfully"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/releases/{ns}/{name}/test": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "ns",
|
||||
"in": "path",
|
||||
"description": "Name of kubernetes namespace"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "path",
|
||||
"description": "Name of Helm release"
|
||||
}
|
||||
],
|
||||
"post": {
|
||||
"tags": [
|
||||
"Releases"
|
||||
],
|
||||
"description": "Run the tests on a release",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Logs of a test run"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/repositories": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"Repositories"
|
||||
],
|
||||
"description": "Get list of Helm repositories",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Returns list of Helm repositories"
|
||||
}
|
||||
}
|
||||
},
|
||||
"post": {
|
||||
"tags": [
|
||||
"Repositories"
|
||||
],
|
||||
"description": "Adds new repository",
|
||||
"requestBody": {
|
||||
"content": {
|
||||
"application/x-www-form-urlencoded": {
|
||||
"schema": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"name": {
|
||||
"type": "string"
|
||||
},
|
||||
"url": {
|
||||
"type": "string"
|
||||
}
|
||||
},
|
||||
"required": [
|
||||
"name",
|
||||
"url"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"responses": {
|
||||
"204": {
|
||||
"description": "Empty response in case repository were added"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/repositories/{repo}": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "repo",
|
||||
"in": "path",
|
||||
"description": "Name of Helm repository"
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"tags": [
|
||||
"Repositories"
|
||||
],
|
||||
"description": "Get list of charts in repository",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Returns list of charts"
|
||||
}
|
||||
}
|
||||
},
|
||||
"post": {
|
||||
"tags": [
|
||||
"Repositories"
|
||||
],
|
||||
"description": "Update repository from remote",
|
||||
"responses": {
|
||||
"204": {
|
||||
"description": "Empty response"
|
||||
}
|
||||
}
|
||||
},
|
||||
"delete": {
|
||||
"tags": [
|
||||
"Repositories"
|
||||
],
|
||||
"description": "Remove repository",
|
||||
"responses": {
|
||||
"204": {
|
||||
"description": "Empty response"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/repositories/latestver": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "name",
|
||||
"in": "query",
|
||||
"description": "Name of Helm chart to search for",
|
||||
"required": true
|
||||
}
|
||||
],
|
||||
"description": "Find the latest available version of specified chart through all the repositories",
|
||||
"get": {
|
||||
"tags": [
|
||||
"Repositories"
|
||||
],
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "The object with latest available version is returned"
|
||||
},
|
||||
"204": {
|
||||
"description": "In case no matching repository found, the response is empty with status 204"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/repositories/versions": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "name",
|
||||
"in": "query",
|
||||
"description": "Name of Helm chart to search for",
|
||||
"required": true
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"description": "Get the list of versions for specified chart across the repositories",
|
||||
"tags": [
|
||||
"Repositories"
|
||||
],
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "The list if chart versions is returned"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/helm/repositories/values": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "chart",
|
||||
"in": "query",
|
||||
"description": "Name of Helm chart to search for, in format of <repository>/<chart-name>",
|
||||
"required": true
|
||||
},
|
||||
{
|
||||
"name": "version",
|
||||
"in": "query",
|
||||
"description": "Version of Helm chart to get values from",
|
||||
"required": true
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"description": "Get the original values.yaml file for the chart",
|
||||
"tags": [
|
||||
"Repositories"
|
||||
],
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "The content of values.yaml"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/k8s/contexts": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"K8s"
|
||||
],
|
||||
"description": "Get list of kubectl contexts configured locally",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Returns list of contexts"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/k8s/{kind}/get": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "kind",
|
||||
"in": "path",
|
||||
"description": "Kind of kubernetes resource"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "query",
|
||||
"description": "Name of kubernetes resource",
|
||||
"required": true
|
||||
},
|
||||
{
|
||||
"name": "namespace",
|
||||
"in": "query",
|
||||
"description": "Namespace of kubernetes resource",
|
||||
"required": true
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"tags": [
|
||||
"K8s"
|
||||
],
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Returns resources information"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/k8s/{kind}/list": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "kind",
|
||||
"in": "path",
|
||||
"description": "Kind of kubernetes resource",
|
||||
"schema": {
|
||||
"enum": [
|
||||
"namespaces"
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"tags": [
|
||||
"K8s"
|
||||
],
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Returns list of resources"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/api/k8s/{kind}/describe": {
|
||||
"parameters": [
|
||||
{
|
||||
"name": "kind",
|
||||
"in": "path",
|
||||
"description": "Kind of kubernetes resource"
|
||||
},
|
||||
{
|
||||
"name": "name",
|
||||
"in": "query",
|
||||
"description": "Name of kubernetes resource",
|
||||
"required": true
|
||||
},
|
||||
{
|
||||
"name": "namespace",
|
||||
"in": "query",
|
||||
"description": "Namespace of kubernetes resource",
|
||||
"required": true
|
||||
}
|
||||
],
|
||||
"get": {
|
||||
"tags": [
|
||||
"K8s"
|
||||
],
|
||||
"responses": {
|
||||
"200": {
|
||||
"content": {
|
||||
"text/plain": {}
|
||||
},
|
||||
"description": "Returns describe text"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/": {
|
||||
"delete": {
|
||||
"tags": [
|
||||
"Miscellaneous"
|
||||
],
|
||||
"description": "Shuts down the Helm Dashboard application",
|
||||
"responses": {
|
||||
"202": {
|
||||
"description": "Shutdown command has been accepted"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/status": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"Miscellaneous"
|
||||
],
|
||||
"description": "Gets application status",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "Returns JSON with some options",
|
||||
"headers": {
|
||||
"X-Application-Name": {
|
||||
"description": "A string to self-identify the application"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,164 +0,0 @@
|
||||
import {
|
||||
Chart,
|
||||
ChartVersion,
|
||||
Release,
|
||||
ReleaseHealthStatus,
|
||||
ReleaseRevision,
|
||||
Repository,
|
||||
} from "../data/types";
|
||||
import { type QueryFunctionContext } from "@tanstack/react-query";
|
||||
interface ClustersResponse {
|
||||
AuthInfo: string;
|
||||
Cluster: string;
|
||||
IsCurrent: boolean;
|
||||
Name: string;
|
||||
Namespace: string;
|
||||
}
|
||||
class ApiService {
|
||||
currentCluster = "";
|
||||
constructor(protected readonly isMockMode: boolean = false) {}
|
||||
|
||||
setCluster = (cluster: string) => {
|
||||
this.currentCluster = cluster;
|
||||
};
|
||||
|
||||
public async fetchWithDefaults<T>(
|
||||
url: string,
|
||||
options?: RequestInit
|
||||
): Promise<T> {
|
||||
let response;
|
||||
|
||||
if (this.currentCluster) {
|
||||
const headers = new Headers(options?.headers);
|
||||
if (!headers.has("X-Kubecontext")) {
|
||||
headers.set("X-Kubecontext", this.currentCluster);
|
||||
}
|
||||
response = await fetch(url, { ...options, headers });
|
||||
} else {
|
||||
response = await fetch(url, options);
|
||||
}
|
||||
|
||||
if (!response.ok) {
|
||||
const error = await response.text();
|
||||
throw new Error(error);
|
||||
}
|
||||
|
||||
let data;
|
||||
if (!response.headers.get("Content-Type")) {
|
||||
return {} as T;
|
||||
} else if (response.headers.get("Content-Type")?.includes("text/plain")) {
|
||||
data = await response.text();
|
||||
} else {
|
||||
data = await response.json();
|
||||
}
|
||||
return data;
|
||||
}
|
||||
|
||||
getToolVersion = async () => {
|
||||
const response = await fetch("/status");
|
||||
const data = await response.json();
|
||||
return data;
|
||||
};
|
||||
|
||||
getRepositoryLatestVersion = async (repositoryName: string) => {
|
||||
const data = await this.fetchWithDefaults(
|
||||
`/api/helm/repositories/latestver?name=${repositoryName}`
|
||||
);
|
||||
return data;
|
||||
};
|
||||
|
||||
getInstalledReleases = async () => {
|
||||
const data = await this.fetchWithDefaults("/api/helm/releases");
|
||||
return data;
|
||||
};
|
||||
|
||||
getClusters = async () => {
|
||||
const response = await fetch("/api/k8s/contexts");
|
||||
const data = (await response.json()) as ClustersResponse[];
|
||||
return data;
|
||||
};
|
||||
|
||||
getNamespaces = async () => {
|
||||
const data = await this.fetchWithDefaults("/api/k8s/namespaces/list");
|
||||
return data;
|
||||
};
|
||||
|
||||
getRepositories = async () => {
|
||||
const data = await this.fetchWithDefaults("/api/helm/repositories");
|
||||
return data;
|
||||
};
|
||||
|
||||
getRepositoryCharts = async ({
|
||||
queryKey,
|
||||
}: QueryFunctionContext<Chart[], Repository>) => {
|
||||
const [, repository] = queryKey;
|
||||
const data = await this.fetchWithDefaults(
|
||||
`/api/helm/repositories/${repository}`
|
||||
);
|
||||
return data;
|
||||
};
|
||||
|
||||
getChartVersions = async ({
|
||||
queryKey,
|
||||
}: QueryFunctionContext<ChartVersion[], Chart>) => {
|
||||
const [, chart] = queryKey;
|
||||
|
||||
const data = await this.fetchWithDefaults(
|
||||
`/api/helm/repositories/versions?name=${chart.name}`
|
||||
);
|
||||
return data;
|
||||
};
|
||||
|
||||
getResourceStatus = async ({
|
||||
release,
|
||||
}: {
|
||||
release: Release;
|
||||
}): Promise<ReleaseHealthStatus[] | null> => {
|
||||
if (!release) return null;
|
||||
|
||||
const data = await this.fetchWithDefaults<
|
||||
Promise<ReleaseHealthStatus[] | null>
|
||||
>(
|
||||
`/api/helm/releases/${release.namespace}/${release.name}/resources?health=true`
|
||||
);
|
||||
return data;
|
||||
};
|
||||
|
||||
getReleasesHistory = async ({
|
||||
queryKey,
|
||||
}: QueryFunctionContext<Release[], Release>): Promise<ReleaseRevision[]> => {
|
||||
const [, params] = queryKey;
|
||||
|
||||
if (!params.namespace || !params.chart) return [];
|
||||
|
||||
const data = await this.fetchWithDefaults<ReleaseRevision[]>(
|
||||
`/api/helm/releases/${params.namespace}/${params.chart}/history`
|
||||
);
|
||||
|
||||
return data;
|
||||
};
|
||||
|
||||
getValues = async ({
|
||||
queryKey,
|
||||
}: {
|
||||
queryKey: [
|
||||
string,
|
||||
{ namespace: string; chart: { name: string }; version: number }
|
||||
];
|
||||
}) => {
|
||||
const [, params] = queryKey;
|
||||
const { namespace, chart, version } = params;
|
||||
|
||||
if (!namespace || !chart || !chart.name || version === undefined)
|
||||
return Promise.reject(new Error("missing parameters"));
|
||||
|
||||
const url = `/api/helm/repositories/values?chart=${namespace}/${chart.name}&version=${version}`;
|
||||
const data = await this.fetchWithDefaults(url);
|
||||
|
||||
return data;
|
||||
};
|
||||
}
|
||||
|
||||
const apiService = new ApiService();
|
||||
|
||||
export default apiService;
|
||||
@@ -1,97 +0,0 @@
|
||||
export interface HelmRepository {
|
||||
name: string;
|
||||
url: string;
|
||||
}
|
||||
|
||||
export interface ChartVersion {
|
||||
name: string;
|
||||
version: string;
|
||||
}
|
||||
|
||||
export interface K8sContext {
|
||||
name: string;
|
||||
}
|
||||
|
||||
export interface K8sResource {
|
||||
kind: string;
|
||||
name: string;
|
||||
namespace: string;
|
||||
}
|
||||
|
||||
export interface Scanner {
|
||||
id: string;
|
||||
name: string;
|
||||
type: string;
|
||||
}
|
||||
|
||||
export interface ScanResult {
|
||||
scannerType: string;
|
||||
result: string;
|
||||
}
|
||||
|
||||
export interface ScannersList {
|
||||
scanners: Scanner[];
|
||||
}
|
||||
|
||||
export interface ScanResults {
|
||||
[scannerType: string]: ScanResult;
|
||||
}
|
||||
|
||||
export interface ApplicationStatus {
|
||||
Analytics: boolean;
|
||||
CacheHitRatio: number;
|
||||
ClusterMode: boolean;
|
||||
CurVer: string;
|
||||
LatestVer: string;
|
||||
}
|
||||
|
||||
export interface KubectlContexts {
|
||||
contexts: string[];
|
||||
}
|
||||
|
||||
export interface K8sResourceList {
|
||||
items: K8sResource[];
|
||||
}
|
||||
|
||||
export type HelmRepositories = Repository[];
|
||||
|
||||
export interface ChartList {
|
||||
charts: Chart[];
|
||||
}
|
||||
|
||||
export interface LatestChartVersion {
|
||||
name: string;
|
||||
version: string;
|
||||
app_version: string;
|
||||
description: string;
|
||||
installed_namespace: string;
|
||||
installed_name: string;
|
||||
repository: string;
|
||||
urls: string[];
|
||||
isSuggestedRepo: boolean;
|
||||
}
|
||||
|
||||
export interface ChartVersions {
|
||||
versions: string[];
|
||||
}
|
||||
|
||||
export interface ValuesYamlText {
|
||||
content: string;
|
||||
}
|
||||
|
||||
export interface Repository {
|
||||
name: string;
|
||||
url: string;
|
||||
}
|
||||
|
||||
export interface Chart {
|
||||
name: string;
|
||||
repo: string;
|
||||
version: string;
|
||||
appVersion: string;
|
||||
description: string;
|
||||
created: string;
|
||||
digest: string;
|
||||
urls: string[];
|
||||
icon: string;
|
||||
}
|
||||
@@ -1,65 +0,0 @@
|
||||
/* eslint-disable @typescript-eslint/no-unused-vars */
|
||||
import { type UseQueryOptions, useQuery } from "@tanstack/react-query";
|
||||
import { K8sResource, K8sResourceList, KubectlContexts } from "./interfaces";
|
||||
import apiService from "./apiService";
|
||||
|
||||
// Get list of kubectl contexts configured locally
|
||||
function useGetKubectlContexts(options?: UseQueryOptions<KubectlContexts>) {
|
||||
return useQuery<KubectlContexts>(
|
||||
["k8s", "contexts"],
|
||||
() => apiService.fetchWithDefaults<KubectlContexts>("/api/k8s/contexts"),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
// Get resources information
|
||||
function useGetK8sResource(
|
||||
kind: string,
|
||||
name: string,
|
||||
namespace: string,
|
||||
options?: UseQueryOptions<K8sResource>
|
||||
) {
|
||||
return useQuery<K8sResource>(
|
||||
["k8s", kind, "get", name, namespace],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<K8sResource>(
|
||||
`/api/k8s/${kind}/get?name=${name}&namespace=${namespace}`
|
||||
),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
// Get list of resources
|
||||
function useGetK8sResourceList(
|
||||
kind: string,
|
||||
options?: UseQueryOptions<K8sResourceList>
|
||||
) {
|
||||
return useQuery<K8sResourceList>(
|
||||
["k8s", kind, "list"],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<K8sResourceList>(`/api/k8s/${kind}/list`),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
// Get describe text for kubernetes resource
|
||||
function useGetK8sResourceDescribe(
|
||||
kind: string,
|
||||
name: string,
|
||||
namespace: string,
|
||||
options?: UseQueryOptions<string>
|
||||
) {
|
||||
return useQuery<string>(
|
||||
["k8s", kind, "describe", name, namespace],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<string>(
|
||||
`/api/k8s/${kind}/describe?name=${name}&namespace=${namespace}`,
|
||||
{
|
||||
headers: {
|
||||
Accept: "text/plain",
|
||||
},
|
||||
}
|
||||
),
|
||||
options
|
||||
);
|
||||
}
|
||||
@@ -1,34 +0,0 @@
|
||||
import {
|
||||
type UseMutationOptions,
|
||||
type UseQueryOptions,
|
||||
useMutation,
|
||||
useQuery,
|
||||
} from "@tanstack/react-query";
|
||||
import { ApplicationStatus } from "./interfaces";
|
||||
import apiService from "./apiService";
|
||||
|
||||
// Shuts down the Helm Dashboard application
|
||||
export function useShutdownHelmDashboard(
|
||||
options?: UseMutationOptions<void, Error>
|
||||
) {
|
||||
return useMutation<void, Error>(
|
||||
() =>
|
||||
apiService.fetchWithDefaults("/", {
|
||||
method: "DELETE",
|
||||
}),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
// Gets application status
|
||||
export function useGetApplicationStatus(
|
||||
options?: UseQueryOptions<ApplicationStatus>
|
||||
) {
|
||||
return useQuery<ApplicationStatus>(
|
||||
["status"],
|
||||
() => apiService.fetchWithDefaults<ApplicationStatus>("/status"),
|
||||
{
|
||||
...options,
|
||||
}
|
||||
);
|
||||
}
|
||||
@@ -1,360 +0,0 @@
|
||||
import {
|
||||
useQuery,
|
||||
type UseQueryOptions,
|
||||
useMutation,
|
||||
type UseMutationOptions,
|
||||
} from "@tanstack/react-query";
|
||||
import { ChartVersion, Release } from "../data/types";
|
||||
import { LatestChartVersion } from "./interfaces";
|
||||
import apiService from "./apiService";
|
||||
import { getVersionManifestFormData } from "./shared";
|
||||
export const HD_RESOURCE_CONDITION_TYPE = "hdHealth"; // it's our custom condition type, only one exists
|
||||
|
||||
export function useGetInstalledReleases(
|
||||
context: string,
|
||||
options?: UseQueryOptions<Release[]>
|
||||
) {
|
||||
return useQuery<Release[]>(
|
||||
["installedReleases", context],
|
||||
() => apiService.fetchWithDefaults<Release[]>("/api/helm/releases"),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
export interface ReleaseManifest {
|
||||
apiVersion: string;
|
||||
kind: string;
|
||||
metadata: {
|
||||
name: string;
|
||||
namespace: string;
|
||||
labels: Record<string, string>;
|
||||
};
|
||||
spec: {
|
||||
replicas: number;
|
||||
selector: Record<string, string>;
|
||||
template: {
|
||||
metadata: {
|
||||
labels: Record<string, string>;
|
||||
};
|
||||
spec: {
|
||||
containers: {
|
||||
name: string;
|
||||
image: string;
|
||||
ports: {
|
||||
containerPort: number;
|
||||
}[];
|
||||
env: {
|
||||
name: string;
|
||||
value: string;
|
||||
}[];
|
||||
}[];
|
||||
};
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
export function useGetReleaseManifest({
|
||||
namespace,
|
||||
chartName,
|
||||
options,
|
||||
}: {
|
||||
namespace: string;
|
||||
chartName: string;
|
||||
options?: UseQueryOptions<ReleaseManifest[]>;
|
||||
}) {
|
||||
return useQuery<ReleaseManifest[]>(
|
||||
["manifest", namespace, chartName],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<ReleaseManifest[]>(
|
||||
`/api/helm/releases/${namespace}/${chartName}/manifests`
|
||||
),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
// List of installed k8s resources for this release
|
||||
export function useGetResources(
|
||||
ns: string,
|
||||
name: string,
|
||||
options?: UseQueryOptions<StructuredResources[]>
|
||||
) {
|
||||
const { data, ...rest } = useQuery<StructuredResources[]>(
|
||||
["resources", ns, name],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<StructuredResources[]>(
|
||||
`/api/helm/releases/${ns}/${name}/resources?health=true`
|
||||
),
|
||||
options
|
||||
);
|
||||
|
||||
return {
|
||||
data: data
|
||||
?.map((resource) => ({
|
||||
...resource,
|
||||
status: {
|
||||
...resource.status,
|
||||
conditions: resource.status.conditions.filter(
|
||||
(c) => c.type === HD_RESOURCE_CONDITION_TYPE
|
||||
),
|
||||
},
|
||||
}))
|
||||
.sort((a, b) => {
|
||||
const interestingResources = ["STATEFULSET", "DEAMONSET", "DEPLOYMENT"];
|
||||
return (
|
||||
interestingResources.indexOf(b.kind.toUpperCase()) -
|
||||
interestingResources.indexOf(a.kind.toUpperCase())
|
||||
);
|
||||
}),
|
||||
...rest,
|
||||
};
|
||||
}
|
||||
|
||||
export function useGetResourceDescription(
|
||||
type: string,
|
||||
ns: string,
|
||||
name: string,
|
||||
options?: UseQueryOptions<string>
|
||||
) {
|
||||
return useQuery<string>(
|
||||
["describe", type, ns, name],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<string>(
|
||||
`/api/k8s/${type}/describe?name=${name}&namespace=${ns}`,
|
||||
{
|
||||
headers: { "Content-Type": "text/plain; charset=utf-8" },
|
||||
}
|
||||
),
|
||||
options
|
||||
);
|
||||
}
|
||||
export function useGetLatestVersion(
|
||||
chartName: string,
|
||||
options?: UseQueryOptions<ChartVersion[]>
|
||||
) {
|
||||
return useQuery<ChartVersion[]>(
|
||||
["latestver", chartName],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<ChartVersion[]>(
|
||||
`/api/helm/repositories/latestver?name=${chartName}`
|
||||
),
|
||||
options
|
||||
);
|
||||
}
|
||||
export function useGetVersions(
|
||||
chartName: string,
|
||||
options?: UseQueryOptions<LatestChartVersion[]>
|
||||
) {
|
||||
return useQuery<LatestChartVersion[]>(
|
||||
["versions", chartName],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<LatestChartVersion[]>(
|
||||
`/api/helm/repositories/versions?name=${chartName}`
|
||||
),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
export function useGetReleaseInfoByType(
|
||||
params: ReleaseInfoParams,
|
||||
additionalParams = "",
|
||||
options?: UseQueryOptions<string>
|
||||
) {
|
||||
const { chart, namespace, tab, revision } = params;
|
||||
return useQuery<string>(
|
||||
[tab, namespace, chart, revision, additionalParams],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<string>(
|
||||
`/api/helm/releases/${namespace}/${chart}/${tab}?revision=${revision}${additionalParams}`,
|
||||
{
|
||||
headers: { "Content-Type": "text/plain; charset=utf-8" },
|
||||
}
|
||||
),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
export function useGetDiff(
|
||||
formData: FormData,
|
||||
options?: UseQueryOptions<string>
|
||||
) {
|
||||
return useQuery<string>(
|
||||
["diff", formData],
|
||||
() => {
|
||||
return apiService.fetchWithDefaults<string>("/diff", {
|
||||
body: formData,
|
||||
|
||||
method: "POST",
|
||||
});
|
||||
},
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
// Rollback the release to a previous revision
|
||||
export function useRollbackRelease(
|
||||
options?: UseMutationOptions<
|
||||
void,
|
||||
unknown,
|
||||
{ ns: string; name: string; revision: number }
|
||||
>
|
||||
) {
|
||||
return useMutation<
|
||||
void,
|
||||
unknown,
|
||||
{ ns: string; name: string; revision: number }
|
||||
>(({ ns, name, revision }) => {
|
||||
const formData = new FormData();
|
||||
formData.append("revision", revision.toString());
|
||||
|
||||
return apiService.fetchWithDefaults<void>(
|
||||
`/api/helm/releases/${ns}/${name}/rollback`,
|
||||
{
|
||||
method: "POST",
|
||||
body: formData,
|
||||
}
|
||||
);
|
||||
}, options);
|
||||
}
|
||||
|
||||
// Run the tests on a release
|
||||
export function useTestRelease(
|
||||
options?: UseMutationOptions<void, unknown, { ns: string; name: string }>
|
||||
) {
|
||||
return useMutation<void, unknown, { ns: string; name: string }>(
|
||||
({ ns, name }) => {
|
||||
return apiService.fetchWithDefaults<void>(
|
||||
`/api/helm/releases/${ns}/${name}/test`,
|
||||
{
|
||||
method: "POST",
|
||||
}
|
||||
);
|
||||
},
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
export function useChartReleaseValues({
|
||||
namespace = "default",
|
||||
release,
|
||||
userDefinedValue,
|
||||
revision,
|
||||
options,
|
||||
version,
|
||||
}: {
|
||||
namespace?: string;
|
||||
release: string;
|
||||
userDefinedValue?: string;
|
||||
revision?: number;
|
||||
version?: string;
|
||||
options?: UseQueryOptions<unknown>;
|
||||
}) {
|
||||
return useQuery<unknown>(
|
||||
["values", namespace, release, userDefinedValue, version],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<unknown>(
|
||||
`/api/helm/releases/${namespace}/${release}/values?${"userDefined=true"}${
|
||||
revision ? `&revision=${revision}` : ""
|
||||
}`,
|
||||
{
|
||||
headers: { "Content-Type": "text/plain; charset=utf-8" },
|
||||
}
|
||||
),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
export const useVersionData = ({
|
||||
version,
|
||||
userValues,
|
||||
chartAddress,
|
||||
releaseValues,
|
||||
namespace,
|
||||
releaseName,
|
||||
isInstallRepoChart = false,
|
||||
options,
|
||||
}: {
|
||||
version: string;
|
||||
userValues: string;
|
||||
chartAddress: string;
|
||||
releaseValues: string;
|
||||
namespace: string;
|
||||
releaseName: string;
|
||||
isInstallRepoChart?: boolean;
|
||||
options?: UseQueryOptions;
|
||||
}) => {
|
||||
return useQuery(
|
||||
[
|
||||
version,
|
||||
userValues,
|
||||
chartAddress,
|
||||
releaseValues,
|
||||
namespace,
|
||||
releaseName,
|
||||
isInstallRepoChart,
|
||||
],
|
||||
async () => {
|
||||
const formData = getVersionManifestFormData({
|
||||
version,
|
||||
userValues,
|
||||
chart: chartAddress,
|
||||
releaseValues,
|
||||
releaseName,
|
||||
});
|
||||
|
||||
const fetchUrl = isInstallRepoChart
|
||||
? `/api/helm/releases/${namespace || "default"}`
|
||||
: `/api/helm/releases/${
|
||||
namespace ? namespace : "[empty]"
|
||||
}${`/${releaseName}`}`;
|
||||
|
||||
const data = await apiService.fetchWithDefaults(fetchUrl, {
|
||||
method: "post",
|
||||
body: formData,
|
||||
});
|
||||
|
||||
return data;
|
||||
},
|
||||
// @ts-ignore
|
||||
options
|
||||
);
|
||||
};
|
||||
|
||||
// Request objects
|
||||
interface ReleaseInfoParams {
|
||||
chart?: string;
|
||||
tab: string;
|
||||
namespace?: string;
|
||||
revision?: string;
|
||||
}
|
||||
|
||||
export interface StructuredResources {
|
||||
kind: string;
|
||||
apiVersion: string;
|
||||
metadata: Metadata;
|
||||
spec: Spec;
|
||||
status: Status;
|
||||
}
|
||||
|
||||
export interface Metadata {
|
||||
name: string;
|
||||
namespace: string;
|
||||
creationTimestamp: Date;
|
||||
labels: string[];
|
||||
}
|
||||
|
||||
export interface Spec {
|
||||
[key: string]: string;
|
||||
}
|
||||
|
||||
export interface Status {
|
||||
conditions: Condition[];
|
||||
}
|
||||
|
||||
export interface Condition {
|
||||
type: string;
|
||||
status: string;
|
||||
lastProbeTime: Date;
|
||||
lastTransitionTime: Date;
|
||||
reason: string;
|
||||
message: string;
|
||||
}
|
||||
@@ -1,72 +0,0 @@
|
||||
import {
|
||||
type UseMutationOptions,
|
||||
type UseQueryOptions,
|
||||
useMutation,
|
||||
useQuery,
|
||||
} from "@tanstack/react-query";
|
||||
import { HelmRepositories } from "./interfaces";
|
||||
import apiService from "./apiService";
|
||||
|
||||
// Get list of Helm repositories
|
||||
export function useGetRepositories(
|
||||
options?: UseQueryOptions<HelmRepositories>
|
||||
) {
|
||||
return useQuery<HelmRepositories>(
|
||||
["helm", "repositories"],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<HelmRepositories>("/api/helm/repositories"),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
// Update repository from remote
|
||||
export function useUpdateRepo(
|
||||
repo: string,
|
||||
options?: UseMutationOptions<void, unknown, void>
|
||||
) {
|
||||
return useMutation<void, unknown, void>(() => {
|
||||
return apiService.fetchWithDefaults<void>(
|
||||
`/api/helm/repositories/${repo}`,
|
||||
{
|
||||
method: "POST",
|
||||
}
|
||||
);
|
||||
}, options);
|
||||
}
|
||||
|
||||
// Remove repository
|
||||
export function useDeleteRepo(
|
||||
repo: string,
|
||||
options?: UseMutationOptions<void, unknown, void>
|
||||
) {
|
||||
return useMutation<void, unknown, void>(() => {
|
||||
return apiService.fetchWithDefaults<void>(
|
||||
`/api/helm/repositories/${repo}`,
|
||||
{
|
||||
method: "DELETE",
|
||||
}
|
||||
);
|
||||
}, options);
|
||||
}
|
||||
|
||||
export function useChartRepoValues({
|
||||
version,
|
||||
chart,
|
||||
}: {
|
||||
version: string;
|
||||
chart: string;
|
||||
}) {
|
||||
return useQuery<string>(
|
||||
["helm", "repositories", "values", chart, version],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<string>(
|
||||
`/api/helm/repositories/values?chart=${chart}&version=${version}`,
|
||||
{
|
||||
headers: { "Content-Type": "text/plain; charset=utf-8" },
|
||||
}
|
||||
),
|
||||
{
|
||||
enabled: Boolean(version) && Boolean(chart),
|
||||
}
|
||||
);
|
||||
}
|
||||
@@ -1,54 +0,0 @@
|
||||
/** DO NOT DELETE THESE FUNCTIONS - we left this until we support scan ops again */
|
||||
|
||||
/* eslint-disable @typescript-eslint/no-unused-vars */
|
||||
import {
|
||||
type UseMutationOptions,
|
||||
type UseQueryOptions,
|
||||
useMutation,
|
||||
useQuery,
|
||||
} from "@tanstack/react-query";
|
||||
import { ScanResult, ScanResults, ScannersList } from "./interfaces";
|
||||
import apiService from "./apiService";
|
||||
|
||||
// Get list of discovered scanners
|
||||
function useGetDiscoveredScanners(options?: UseQueryOptions<ScannersList>) {
|
||||
return useQuery<ScannersList>(
|
||||
["scanners"],
|
||||
() => apiService.fetchWithDefaults<ScannersList>("/api/scanners"),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
// Scan manifests using all applicable scanners
|
||||
function useScanManifests(
|
||||
manifest: string,
|
||||
options?: UseMutationOptions<ScanResults, Error, string>
|
||||
) {
|
||||
const formData = new FormData();
|
||||
formData.append("manifest", manifest);
|
||||
return useMutation<ScanResults, Error, string>(
|
||||
() =>
|
||||
apiService.fetchWithDefaults<ScanResults>("/api/scanners/manifests", {
|
||||
method: "POST",
|
||||
body: formData,
|
||||
}),
|
||||
options
|
||||
);
|
||||
}
|
||||
|
||||
// Scan specified k8s resource in cluster
|
||||
function useScanK8sResource(
|
||||
kind: string,
|
||||
namespace: string,
|
||||
name: string,
|
||||
options?: UseQueryOptions<ScanResults>
|
||||
) {
|
||||
return useQuery<ScanResults>(
|
||||
["scanners", "resource", kind, namespace, name],
|
||||
() =>
|
||||
apiService.fetchWithDefaults<ScanResults>(
|
||||
`/api/scanners/resource/${kind}?namespace=${namespace}&name=${name}`
|
||||
),
|
||||
options
|
||||
);
|
||||
}
|
||||
@@ -1,64 +0,0 @@
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import apiService from "./apiService";
|
||||
|
||||
export const getVersionManifestFormData = ({
|
||||
version,
|
||||
userValues,
|
||||
chart,
|
||||
releaseValues,
|
||||
releaseName,
|
||||
}: {
|
||||
version: string;
|
||||
userValues?: string;
|
||||
chart: string;
|
||||
releaseValues?: string;
|
||||
releaseName?: string;
|
||||
}) => {
|
||||
const formData = new FormData();
|
||||
// preview needs to come first, for some reason it has a meaning at the backend
|
||||
formData.append("preview", "true");
|
||||
formData.append("chart", chart);
|
||||
formData.append("version", version);
|
||||
formData.append(
|
||||
"values",
|
||||
userValues ? userValues : releaseValues ? releaseValues : ""
|
||||
);
|
||||
if (releaseName) {
|
||||
formData.append("name", releaseName);
|
||||
}
|
||||
|
||||
return formData;
|
||||
};
|
||||
|
||||
export const useDiffData = ({
|
||||
selectedRepo,
|
||||
versionsError,
|
||||
currentVerManifest,
|
||||
selectedVerData,
|
||||
chart,
|
||||
}: {
|
||||
selectedRepo: string;
|
||||
versionsError: string;
|
||||
currentVerManifest: string;
|
||||
selectedVerData: { [key: string]: string };
|
||||
chart: string;
|
||||
}) => {
|
||||
return useQuery(
|
||||
[selectedRepo, versionsError, chart, currentVerManifest, selectedVerData],
|
||||
async () => {
|
||||
const formData = new FormData();
|
||||
formData.append("a", currentVerManifest);
|
||||
formData.append("b", selectedVerData.manifest);
|
||||
|
||||
const diff = await apiService.fetchWithDefaults("/diff", {
|
||||
method: "post",
|
||||
body: formData,
|
||||
});
|
||||
|
||||
return diff;
|
||||
},
|
||||
{
|
||||
enabled: Boolean(selectedVerData),
|
||||
}
|
||||
);
|
||||
};
|
||||
@@ -1,96 +0,0 @@
|
||||
.app-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 5px;
|
||||
padding: 10px;
|
||||
}
|
||||
.header-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
flex: 0.6;
|
||||
}
|
||||
.header-items {
|
||||
display: flex;
|
||||
flex: 0.8;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
.header-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex: 0.2;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.redirect {
|
||||
display: flex;
|
||||
flex: 0.8;
|
||||
}
|
||||
.redirect > img {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.signout-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.signout-btn:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
.signout-btn > span {
|
||||
font-weight: bolder;
|
||||
font-size: x-large;
|
||||
color: gray;
|
||||
}
|
||||
.card {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
}
|
||||
.card-left {
|
||||
flex: 0.2;
|
||||
margin-top: 5px;
|
||||
margin-left: 4px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
.card-left > h2,
|
||||
form {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.btn {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.card-right {
|
||||
flex: 0.8;
|
||||
margin-top: 5px;
|
||||
margin-left: 4px;
|
||||
margin-right: 1px;
|
||||
}
|
||||
.card-right-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.card-right-header-right-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.content-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.title {
|
||||
flex: 0.2;
|
||||
}
|
||||
.description {
|
||||
flex: 0.6;
|
||||
}
|
||||
.version {
|
||||
flex: 0.2;
|
||||
}
|
||||
.charts {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.charts > h3 {
|
||||
flex: 0.2;
|
||||
}
|
||||
@@ -1,85 +0,0 @@
|
||||
import Header from "./layout/Header";
|
||||
import { HashRouter, Outlet, Route, Routes, useParams } from "react-router-dom";
|
||||
import "./index.css";
|
||||
import Installed from "./pages/Installed";
|
||||
import RepositoryPage from "./pages/Repository";
|
||||
import Revision from "./pages/Revision";
|
||||
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
||||
import { useState } from "react";
|
||||
import { ErrorAlert, ErrorModalContext } from "./context/ErrorModalContext";
|
||||
import GlobalErrorModal from "./components/modal/GlobalErrorModal";
|
||||
import { AppContextProvider } from "./context/AppContext";
|
||||
import apiService from "./API/apiService";
|
||||
import DocsPage from "./pages/DocsPage";
|
||||
|
||||
const queryClient = new QueryClient({
|
||||
defaultOptions: {
|
||||
queries: {
|
||||
refetchOnWindowFocus: false,
|
||||
retry: false,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
const PageLayout = () => {
|
||||
return (
|
||||
<div className="flex flex-col h-screen">
|
||||
<Header />
|
||||
<div className="bg-body-background bg-no-repeat bg-[url('./assets/body-background.svg')] flex-1">
|
||||
<Outlet />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const SyncContext: React.FC = () => {
|
||||
const { context } = useParams();
|
||||
if (context) {
|
||||
apiService.setCluster(context);
|
||||
}
|
||||
|
||||
return <Outlet />;
|
||||
};
|
||||
|
||||
export default function App() {
|
||||
const [shouldShowErrorModal, setShowErrorModal] = useState<
|
||||
ErrorAlert | undefined
|
||||
>(undefined);
|
||||
const value = { shouldShowErrorModal, setShowErrorModal };
|
||||
|
||||
return (
|
||||
<AppContextProvider>
|
||||
<ErrorModalContext.Provider value={value}>
|
||||
<QueryClientProvider client={queryClient}>
|
||||
<HashRouter>
|
||||
<Routes>
|
||||
<Route path="docs/" element={<DocsPage />} />
|
||||
<Route path="*" element={<PageLayout />}>
|
||||
<Route path=":context?/*" element={<SyncContext />}>
|
||||
<Route path="installed/?" element={<Installed />} />
|
||||
<Route
|
||||
path=":namespace/:chart/installed/revision/:revision"
|
||||
element={<Revision />}
|
||||
/>
|
||||
<Route path="repository/" element={<RepositoryPage />} />
|
||||
<Route
|
||||
path="repository/:selectedRepo?"
|
||||
element={<RepositoryPage />}
|
||||
/>
|
||||
<Route path="*" element={<Installed />} />
|
||||
</Route>
|
||||
<Route path="*" element={<Installed />} />
|
||||
</Route>
|
||||
</Routes>
|
||||
<GlobalErrorModal
|
||||
isOpen={!!shouldShowErrorModal}
|
||||
onClose={() => setShowErrorModal(undefined)}
|
||||
titleText={shouldShowErrorModal?.title || ""}
|
||||
contentText={shouldShowErrorModal?.msg || ""}
|
||||
/>
|
||||
</HashRouter>
|
||||
</QueryClientProvider>
|
||||
</ErrorModalContext.Provider>
|
||||
</AppContextProvider>
|
||||
);
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 512.02 319.26"><path d="M5.9 48.96 48.97 5.89c7.86-7.86 20.73-7.84 28.56 0l178.48 178.48L434.5 5.89c7.86-7.86 20.74-7.82 28.56 0l43.07 43.07c7.83 7.84 7.83 20.72 0 28.56l-192.41 192.4-.36.37-43.07 43.07c-7.83 7.82-20.7 7.86-28.56 0l-43.07-43.07-.36-.37L5.9 77.52c-7.87-7.86-7.87-20.7 0-28.56z"/></svg>
|
||||
|
Before Width: | Height: | Size: 501 B |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 77 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 731 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/code-brackets</title><g id="illustration/code-brackets" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#87E6E5" d="M11.4139325,12 C11.7605938,12 12,12.5059743 12,13.3779712 L12,17.4951758 L6.43502246,23.3839989 C5.85499251,23.9978337 5.85499251,25.0021663 6.43502246,25.6160011 L12,31.5048242 L12,35.6220288 C12,36.4939606 11.7605228,37 11.4139325,37 C11.2725831,37 11.1134406,36.9158987 10.9453839,36.7379973 L0.435022463,25.6160011 C-0.145007488,25.0021663 -0.145007488,23.9978337 0.435022463,23.3839989 L10.9453839,12.2620027 C11.1134051,12.0841663 11.2725831,12 11.4139325,12 Z M36.5860675,12 C36.7274169,12 36.8865594,12.0841013 37.0546161,12.2620027 L47.5649775,23.3839989 C48.1450075,23.9978337 48.1450075,25.0021663 47.5649775,25.6160011 L37.0546161,36.7379973 C36.8865949,36.9158337 36.7274169,37 36.5860675,37 C36.2394062,37 36,36.4940257 36,35.6220288 L36,31.5048242 L41.5649775,25.6160011 C42.1450075,25.0021663 42.1450075,23.9978337 41.5649775,23.3839989 L36,17.4951758 L36,13.3779712 C36,12.5060394 36.2394772,12 36.5860675,12 Z"/><rect id="Rectangle-7-Copy-5" width="35.57" height="4" x="5.009" y="22.662" fill="#A0DB77" rx="2" transform="translate(22.793959, 24.662305) rotate(-75.000000) translate(-22.793959, -24.662305)"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 1.4 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 8.3 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/comments</title><g id="illustration/comments" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Path" fill="#96D07C" d="M2.52730803,17.9196415 C2.44329744,17.9745167 2.36370847,18.000488 2.29303375,18.000488 C2.1197031,18.000488 2,17.8443588 2,17.5752855 L2,4 C2,1.790861 3.790861,3.23296945e-13 6,3.23296945e-13 L33.9995117,3.23296945e-13 C36.2086507,3.23296945e-13 37.9995117,1.790861 37.9995117,4 L37.9995117,9.999512 C37.9995117,12.208651 36.2086507,13.999512 33.9995117,13.999512 L8,13.999512 C7.83499225,13.999512 7.6723181,13.9895206 7.51254954,13.9701099 L2.52730803,17.9196415 Z"/><path id="Path" fill="#73E1E0" d="M7.51066,44.9703679 L2.52730803,47.9186655 C2.44329744,47.9735407 2.36370847,47.999512 2.29303375,47.999512 C2.1197031,47.999512 2,47.8433828 2,47.5743095 L2,35 C2,32.790861 3.790861,31 6,31 L26,31 C28.209139,31 30,32.790861 30,35 L30,41 C30,43.209139 28.209139,45 26,45 L8,45 C7.8343417,45 7.67103544,44.9899297 7.51066,44.9703679 Z"/><path id="Path" fill="#FFD476" d="M46,19.5 L46,33.0747975 C46,33.3438708 45.8802969,33.5 45.7069663,33.5 C45.6362915,33.5 45.5567026,33.4740287 45.472692,33.4191535 L40.4887103,29.4704446 C40.3285371,29.489956 40.1654415,29.5 40,29.5 L18,29.5 C15.790861,29.5 14,27.709139 14,25.5 L14,19.5 C14,17.290861 15.790861,15.5 18,15.5 L42,15.5 C44.209139,15.5 46,17.290861 46,19.5 Z"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 1.5 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/direction</title><g id="illustration/direction" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#FFD476" d="M23.4917015,33.6030641 L2.93840258,31.4321033 C2.38917316,31.3740904 1.99096346,30.8818233 2.04897631,30.3325939 C2.0747515,30.0885705 2.18934861,29.8625419 2.37095722,29.6975265 L34.2609105,0.721285325 C34.6696614,0.349881049 35.3021022,0.38015648 35.6735064,0.788907393 C35.9232621,1.06377731 36.0001133,1.45442096 35.8730901,1.80341447 L24.5364357,32.9506164 C24.3793473,33.3822133 23.9484565,33.6513092 23.4917015,33.6030641 L23.4917015,33.6030641 Z"/><path id="Combined-Shape-Copy" fill="#FFC445" d="M24.3163597,33.2881029 C24.0306575,33.0138462 23.9337246,32.5968232 24.069176,32.2246735 L35.091923,1.9399251 C35.2266075,1.56988243 35.5659249,1.31333613 35.9586669,1.28460955 C36.5094802,1.24432106 36.9886628,1.65818318 37.0289513,2.20899647 L40.2437557,46.1609256 C40.2644355,46.4436546 40.1641446,46.7218752 39.9678293,46.9263833 C39.5853672,47.3248067 38.9523344,47.3377458 38.5539111,46.9552837 L24.3163597,33.2881029 L24.3163597,33.2881029 Z"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 1.3 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/flow</title><g id="illustration/flow" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#79C9FC" fill-rule="nonzero" d="M30,29 C32.7614237,29 35,26.7614237 35,24 C35,14.6111593 27.3888407,7 18,7 C8.61115925,7 1,14.6111593 1,24 C1,33.3888407 8.61115925,41 18,41 C19.3333404,41 20.6447683,40.8466238 21.9154603,40.5471706 C19.5096374,39.3319645 17.5510566,37.8612875 16.0456579,36.1314815 C14.1063138,33.9030427 12.769443,31.0725999 12.0293806,27.6556449 C11.360469,26.565281 11,25.3082308 11,24 C11,20.1340068 14.1340068,17 18,17 C21.8659932,17 25,20.1340068 25,24 C25,26.125 27.7040312,29 30,29 Z"/><path id="Combined-Shape-Copy" fill="#FFC445" fill-rule="nonzero" d="M42,29 C44.7614237,29 47,26.7614237 47,24 C47,14.6111593 39.3888407,7 30,7 C20.6111593,7 13,14.6111593 13,24 C13,33.3888407 20.6111593,41 30,41 C31.3333404,41 32.6447683,40.8466238 33.9154603,40.5471706 C31.5096374,39.3319645 29.4051056,37.9781963 28.0456579,36.1314815 C26.0625,33.4375 23,27.1875 23,24 C23,20.1340068 26.1340068,17 30,17 C33.8659932,17 37,20.1340068 37,24 C37.02301,26.3435241 39.7040312,29 42,29 Z" transform="translate(30.000000, 24.000000) scale(-1, -1) translate(-30.000000, -24.000000)"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 1.4 KiB |
@@ -1,5 +0,0 @@
|
||||
<svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M47.1106 45.775C49.9376 45.775 52.2294 42.4134 52.2294 38.2667C52.2294 34.1199 49.9376 30.7583 47.1106 30.7583C44.2835 30.7583 41.9918 34.1199 41.9918 38.2667C41.9918 42.4134 44.2835 45.775 47.1106 45.775Z" fill="#1347FF"/>
|
||||
<path d="M37.0077 38.2667C37.0077 42.4134 34.7159 45.775 31.8888 45.775C29.0618 45.775 26.77 42.4134 26.77 38.2667C26.77 34.12 29.0618 30.7584 31.8888 30.7584C34.7159 30.7584 37.0077 34.12 37.0077 38.2667Z" fill="#1347FF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M9 23.7087L14.4407 18H64.5597L70 23.6838V56.3162L64.5597 62H14.4403L9 56.3162V23.7087ZM17.9923 24.2134L15.8664 26.3861V53.6519L17.9923 55.8246H61.0736L63.1212 53.6483V26.3897L61.0736 24.2134H17.9923Z" fill="#1347FF"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 827 B |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 12 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/plugin</title><g id="illustration/plugin" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#79C9FC" d="M26,15.3994248 C26,15.4091303 26,15.4188459 26,15.4285714 L26,21.4694881 C25.8463595,21.4969567 25.6941676,21.51275 25.5873784,21.51275 C25.4974117,21.51275 25.4230979,21.4768034 25.377756,21.4206259 L25.2660784,21.2822603 L25.1317423,21.1657666 C24.2436317,20.3956144 23.100098,19.9633214 21.895551,19.9633214 C19.2039137,19.9633214 17,22.1075558 17,24.7804643 C17,27.4533728 19.2039137,29.5976071 21.895551,29.5976071 C23.1972122,29.5976071 24.3149423,29.2878193 25.1231445,28.3613697 C25.4542273,27.9818463 25.568273,27.9073214 25.5873784,27.9073214 C25.681532,27.9073214 25.8352452,27.9239643 26,27.9524591 L26,32.5714286 C26,32.5811541 26,32.5908697 26,32.6005752 L26,33 C26,35.209139 24.209139,37 22,37 L4,37 C1.790861,37 0,35.209139 0,33 L0,15 C0,12.790861 1.790861,11 4,11 L22,11 C24.209139,11 26,12.790861 26,15 L26,15.3994248 Z"/><path id="Path" fill="#87E6E5" d="M27.9998779,32.5714286 C27.9998779,33.3604068 28.6572726,34 29.4682101,34 L46.5315458,34 C47.3424832,34 47.9998779,33.3604068 47.9998779,32.5714286 L47.9998779,15.4285714 C47.9998779,14.6395932 47.3424832,14 46.5315458,14 L29.4682101,14 C28.6572726,14 27.9998779,14.6395932 27.9998779,15.4285714 L27.9998779,21.8355216 C27.9334367,22.2650514 27.8567585,22.6454496 27.746391,22.8084643 C27.4245309,23.2838571 26.2402709,23.51275 25.5873784,23.51275 C24.8705773,23.51275 24.2322714,23.1857725 23.8214379,22.6767605 C23.3096996,22.2329909 22.6349941,21.9633214 21.895551,21.9633214 C20.2963823,21.9633214 19,23.2245992 19,24.7804643 C19,26.3363293 20.2963823,27.5976071 21.895551,27.5976071 C22.5398535,27.5976071 23.2399343,27.477727 23.6160247,27.0466112 C24.1396029,26.4464286 24.7367044,25.9073214 25.5873784,25.9073214 C26.2402709,25.9073214 27.5912951,26.1766031 27.8226692,26.6116071 C27.8819199,26.7230038 27.9403239,26.921677 27.9998779,27.1556219 L27.9998779,32.5714286 Z"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 2.1 KiB |
@@ -1,6 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img"
|
||||
class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228">
|
||||
<path fill="#00D8FF"
|
||||
d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z">
|
||||
</path>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 4.1 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/repo</title><g id="illustration/repo" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Rectangle-62-Copy" fill="#B7F0EF" d="M27.2217723,9.04506931 L41.2217723,6.2682098 C43.3886973,5.83840648 45.4937616,7.2466219 45.9235649,9.41354696 C45.9743993,9.66983721 46,9.93049166 46,10.1917747 L46,32.581381 C46,34.4904961 44.650862,36.1335143 42.7782277,36.5049459 L28.7782277,39.2818054 C26.6113027,39.7116087 24.5062384,38.3033933 24.0764351,36.1364682 C24.0256007,35.880178 24,35.6195235 24,35.3582405 L24,12.9686342 C24,11.0595191 25.349138,9.4165009 27.2217723,9.04506931 Z" opacity=".7"/><path id="Combined-Shape" fill="#87E6E5" d="M6.77822775,6.2682098 L20.7782277,9.04506931 C22.650862,9.4165009 24,11.0595191 24,12.9686342 L24,35.3582405 C24,37.5673795 22.209139,39.3582405 20,39.3582405 C19.738717,39.3582405 19.4780625,39.3326398 19.2217723,39.2818054 L5.22177225,36.5049459 C3.34913798,36.1335143 2,34.4904961 2,32.581381 L2,10.1917747 C2,7.98263571 3.790861,6.19177471 6,6.19177471 C6.26128305,6.19177471 6.5219375,6.21737537 6.77822775,6.2682098 Z"/><path id="Rectangle-63-Copy-2" fill="#61C1FD" d="M22,10 C23.1666667,10.2291667 24.0179036,10.625 24.5537109,11.1875 C25.0895182,11.75 25.5716146,12.875 26,14.5625 C26,29.3020833 26,37.5208333 26,39.21875 C26,40.9166667 26.4241536,42.9583333 27.2724609,45.34375 L24.5537109,41.875 L22.9824219,45.34375 C22.327474,43.1979167 22,41.2291667 22,39.4375 C22,37.6458333 22,27.8333333 22,10 Z"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 1.6 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/stackalt</title><g id="illustration/stackalt" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#FFAE00" d="M23.8628277,0 L23.8628277,48 L3.32291648,36.2491883 L3.32155653,11.9499781 L23.8628277,0 Z M23.8670509,0 L44.408322,11.9499781 L44.4069621,36.2491883 L23.8670509,48 L23.8670509,0 Z" opacity=".196"/><path id="Rectangle-46-Copy-3" fill="#66BF3C" d="M15.8232279,19.1155258 L24.7368455,21.4714881 C29.6053842,22.7582937 33.4077423,26.5606518 34.694548,31.4291905 L37.0505103,40.3428082 C37.6150232,42.4786032 36.3412474,44.6676353 34.2054524,45.2321482 C33.5569474,45.4035549 32.87575,45.4091235 32.2245294,45.2483418 L23.3459013,43.0562718 C18.2976962,41.809906 14.3561301,37.8683399 13.1097642,32.8201348 L10.9176943,23.9415066 C10.3881737,21.7967682 11.6975664,19.6288529 13.8423049,19.0993322 C14.4935255,18.9385505 15.1747229,18.9441191 15.8232279,19.1155258 Z" opacity=".5" transform="translate(23.999997, 32.166058) rotate(-45.000000) translate(-23.999997, -32.166058)"/><path id="Rectangle-46-Copy-2" fill="#FFAE00" d="M15.8232279,11.2216893 L24.7368455,13.5776516 C29.6053842,14.8644572 33.4077423,18.6668153 34.694548,23.5353541 L37.0505103,32.4489717 C37.6150232,34.5847667 36.3412474,36.7737988 34.2054524,37.3383117 C33.5569474,37.5097184 32.87575,37.515287 32.2245294,37.3545053 L23.3459013,35.1624353 C18.2976962,33.9160695 14.3561301,29.9745034 13.1097642,24.9262983 L10.9176943,16.0476701 C10.3881737,13.9029317 11.6975664,11.7350164 13.8423049,11.2054957 C14.4935255,11.044714 15.1747229,11.0502826 15.8232279,11.2216893 Z" opacity=".5" transform="translate(23.999997, 24.272222) rotate(-45.000000) translate(-23.999997, -24.272222)"/><path id="Rectangle-46-Copy" fill="#FC521F" d="M15.8232279,3.32785281 L24.7368455,5.68381509 C29.6053842,6.97062075 33.4077423,10.7729788 34.694548,15.6415176 L37.0505103,24.5551352 C37.6150232,26.6909302 36.3412474,28.8799623 34.2054524,29.4444752 C33.5569474,29.6158819 32.87575,29.6214505 32.2245294,29.4606688 L23.3459013,27.2685988 C18.2976962,26.022233 14.3561301,22.0806669 13.1097642,17.0324618 L10.9176943,8.15383364 C10.3881737,6.00909519 11.6975664,3.84117987 13.8423049,3.31165925 C14.4935255,3.15087753 15.1747229,3.15644615 15.8232279,3.32785281 Z" opacity=".5" transform="translate(23.999997, 16.378385) rotate(-45.000000) translate(-23.999997, -16.378385)"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 2.5 KiB |
@@ -1,39 +0,0 @@
|
||||
/*
|
||||
* @file Badge.stories.tsx
|
||||
* @description Badge stories, using Storybook.
|
||||
* We create a story for the component badge,
|
||||
* and we can use it to test the component in Storybook.
|
||||
* There, we can see the component in different states, and
|
||||
* play with the props to see how it behaves.
|
||||
* We'll use a generic story for the component, and we'll
|
||||
* use the args to pass the props.
|
||||
* We'll use a template to create the story.
|
||||
* Refer to Badge.tsx and the BadgeProps interface to see what props
|
||||
* the component accepts. The story works with the same props.
|
||||
*
|
||||
* @see https://storybook.js.org/docs/react/writing-stories/introduction
|
||||
*/
|
||||
|
||||
import { Meta } from "@storybook/react";
|
||||
import Badge from "./Badge";
|
||||
|
||||
// We set the metadata for the story.
|
||||
// Refer to https://storybook.js.org/docs/react/writing-stories/introduction
|
||||
// for more information.
|
||||
const meta = {
|
||||
title: "Badge",
|
||||
component: Badge,
|
||||
args: {
|
||||
type: "success",
|
||||
children: "Success",
|
||||
},
|
||||
} satisfies Meta<typeof Badge>;
|
||||
|
||||
export default meta;
|
||||
|
||||
export const Default = {
|
||||
args: {
|
||||
type: "success",
|
||||
children: "Success",
|
||||
},
|
||||
};
|
||||
@@ -1,72 +0,0 @@
|
||||
/**
|
||||
* This is a generic badge component.
|
||||
* By passing props you can customize the badge.
|
||||
* The basic custom types are:
|
||||
* warning, success, error, info, default.
|
||||
* You can use this badge like any other html element.
|
||||
*
|
||||
* behind the scenes, it uses tailwindcss classes to imlement the badge,
|
||||
* with the correct styles.
|
||||
*
|
||||
* @example
|
||||
* <Badge type="warning">Warning</Badge>
|
||||
*
|
||||
* @param {string} type - The type of the badge.
|
||||
* @param {string} children - The content of the badge.
|
||||
* @returns {JSX.Element} - The badge component.
|
||||
*
|
||||
*
|
||||
*/
|
||||
|
||||
export type BadgeCode = "success" | "warning" | "error" | "unknown";
|
||||
|
||||
export const BadgeCodes = Object.freeze({
|
||||
ERROR: "error",
|
||||
WARNING: "warning",
|
||||
SUCCESS: "success",
|
||||
UNKNOWN: "unknown",
|
||||
});
|
||||
|
||||
export interface BadgeProps {
|
||||
type: BadgeCode;
|
||||
children: React.ReactNode;
|
||||
additionalClassNames?: string;
|
||||
}
|
||||
export default function Badge(props: BadgeProps): JSX.Element {
|
||||
const colorVariants = {
|
||||
[BadgeCodes.SUCCESS]: "bg-text-success text-black-800",
|
||||
[BadgeCodes.WARNING]: "bg-text-warning text-white",
|
||||
[BadgeCodes.ERROR]: "bg-text-danger text-white",
|
||||
[BadgeCodes.UNKNOWN]: "bg-secondary text-danger",
|
||||
};
|
||||
|
||||
const badgeBase =
|
||||
"inline-flex items-center px-1 py-1 rounded text-xs font-light";
|
||||
|
||||
const badgeElem = (
|
||||
<span
|
||||
className={`${badgeBase} ${colorVariants[props.type]} ${
|
||||
props.additionalClassNames ?? ""
|
||||
}`}
|
||||
>
|
||||
{props.children}
|
||||
</span>
|
||||
);
|
||||
return badgeElem;
|
||||
}
|
||||
|
||||
export const getBadgeType = (status: string): BadgeCode => {
|
||||
if (status === "Unknown") {
|
||||
return BadgeCodes.UNKNOWN;
|
||||
} else if (
|
||||
status === "Healthy" ||
|
||||
status.toLowerCase().includes("exists") ||
|
||||
status === "available"
|
||||
) {
|
||||
return BadgeCodes.SUCCESS;
|
||||
} else if (status === "Progressing") {
|
||||
return BadgeCodes.WARNING;
|
||||
} else {
|
||||
return BadgeCodes.ERROR;
|
||||
}
|
||||
};
|
||||
@@ -1,31 +0,0 @@
|
||||
import { mount } from "cypress/react18";
|
||||
import { Button } from "./common/Button/Button";
|
||||
|
||||
describe("Button component tests", () => {
|
||||
const buttonText = "buttonText";
|
||||
|
||||
it("renders", () => {
|
||||
mount(<Button onClick={() => {}}></Button>);
|
||||
cy.get("button").should("exist");
|
||||
});
|
||||
|
||||
it("Should have correct text", () => {
|
||||
mount(<Button label={buttonText} onClick={() => {}}></Button>);
|
||||
cy.get("button").contains(buttonText);
|
||||
});
|
||||
|
||||
it("calls onClick when clicked", () => {
|
||||
const onClickStub = cy.stub().as("onClick");
|
||||
|
||||
mount(<Button onClick={onClickStub}></Button>);
|
||||
|
||||
cy.get("button").click();
|
||||
cy.get("@onClick").should("have.been.calledOnce");
|
||||
});
|
||||
|
||||
it("should be disabled", () => {
|
||||
mount(<Button onClick={() => {}} disabled></Button>);
|
||||
|
||||
cy.get("button").should("be.disabled");
|
||||
});
|
||||
});
|
||||
@@ -1,27 +0,0 @@
|
||||
import { Meta, StoryObj } from "@storybook/react";
|
||||
import Button from "./Button";
|
||||
|
||||
const meta = {
|
||||
/* 👇 The title prop is optional.
|
||||
* See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
|
||||
* to learn how to generate automatic titles
|
||||
*/
|
||||
title: "Button",
|
||||
component: Button,
|
||||
} satisfies Meta<typeof Button>;
|
||||
|
||||
export default meta;
|
||||
|
||||
export const Default: StoryObj<typeof Button> = {
|
||||
args: {
|
||||
children: (
|
||||
<>
|
||||
<span>↑</span>
|
||||
<span>Update</span>
|
||||
</>
|
||||
),
|
||||
},
|
||||
argTypes: {
|
||||
onClick: { action: "clicked" },
|
||||
},
|
||||
};
|
||||
@@ -1,36 +0,0 @@
|
||||
/**
|
||||
* @file Button.tsx
|
||||
* This component is a generic button component using tailwind.
|
||||
* You can include an optional icon.
|
||||
* You can pass the action to be done when the button is clicked using
|
||||
* the onClick prop.
|
||||
*
|
||||
* Props:
|
||||
*
|
||||
* @param children: children
|
||||
* @param onClick: () => void
|
||||
*
|
||||
*
|
||||
*/
|
||||
|
||||
// this is a type declaration for the action prop.
|
||||
// it is a function that takes a string as an argument and returns void.
|
||||
export interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
|
||||
children: React.ReactNode;
|
||||
disabled?: boolean;
|
||||
onClick: () => void;
|
||||
className?: string;
|
||||
}
|
||||
export default function Button(props: ButtonProps): JSX.Element {
|
||||
return (
|
||||
<>
|
||||
<button
|
||||
onClick={props.onClick}
|
||||
className={`${props.className} bg-white border border-gray-300 hover:bg-gray-50 text-black py-1 px-4 rounded `}
|
||||
disabled={props.disabled}
|
||||
>
|
||||
{props.children}
|
||||
</button>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -1,69 +0,0 @@
|
||||
import { AppContextProvider } from "../context/AppContext";
|
||||
import ClustersList from "./ClustersList";
|
||||
import { BrowserRouter } from "react-router-dom";
|
||||
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
||||
import { Release } from "../data/types";
|
||||
|
||||
type ClustersListProps = {
|
||||
onClusterChange: (clusterName: string) => void;
|
||||
selectedCluster: string;
|
||||
filteredNamespaces: string[];
|
||||
installedReleases?: Release[];
|
||||
};
|
||||
|
||||
const generateTestReleaseData = (): Release => ({
|
||||
id: "id",
|
||||
name: "helm-dashboard",
|
||||
namespace: "default",
|
||||
revision: 1,
|
||||
updated: "2024-01-23T15:37:35.0992836+02:00",
|
||||
status: "deployed",
|
||||
chart: "helm-dashboard-0.1.10",
|
||||
chart_name: "helm-dashboard",
|
||||
chart_ver: "0.1.10",
|
||||
app_version: "1.3.3",
|
||||
icon: "https://raw.githubusercontent.com/komodorio/helm-dashboard/main/pkg/dashboard/static/logo.svg",
|
||||
description: "A GUI Dashboard for Helm by Komodor",
|
||||
has_tests: true,
|
||||
chartName: "helm-dashboard",
|
||||
chartVersion: "0.1.10",
|
||||
});
|
||||
|
||||
const renderClustersList = (props: ClustersListProps) => {
|
||||
const queryClient = new QueryClient();
|
||||
cy.mount(
|
||||
<AppContextProvider>
|
||||
<BrowserRouter>
|
||||
<QueryClientProvider client={queryClient}>
|
||||
<ClustersList {...props} />
|
||||
</QueryClientProvider>
|
||||
</BrowserRouter>
|
||||
</AppContextProvider>
|
||||
);
|
||||
};
|
||||
|
||||
describe("ClustersList", () => {
|
||||
it("Got one cluster information", () => {
|
||||
renderClustersList({
|
||||
selectedCluster: "minikube",
|
||||
filteredNamespaces: ["default"],
|
||||
onClusterChange: () => {},
|
||||
installedReleases: [generateTestReleaseData()],
|
||||
});
|
||||
|
||||
cy.get(".data-cy-clusterName").contains("minikube");
|
||||
cy.get(".data-cy-clusterList-namespace").contains("default");
|
||||
cy.get(".data-cy-clustersInput").should("be.checked");
|
||||
});
|
||||
|
||||
it("Dont have a cluster chekced", () => {
|
||||
renderClustersList({
|
||||
selectedCluster: "",
|
||||
filteredNamespaces: [""],
|
||||
onClusterChange: () => {},
|
||||
installedReleases: [generateTestReleaseData()],
|
||||
});
|
||||
|
||||
cy.get(".data-cy-clustersInput").should("not.be.checked");
|
||||
});
|
||||
});
|
||||
@@ -1,26 +0,0 @@
|
||||
import { Meta, StoryObj } from "@storybook/react";
|
||||
import ClustersList from "./ClustersList";
|
||||
|
||||
const meta = {
|
||||
/* 👇 The title prop is optional.
|
||||
* See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
|
||||
* to learn how to generate automatic titles
|
||||
*/
|
||||
title: "ClustersList",
|
||||
component: ClustersList,
|
||||
} satisfies Meta<typeof ClustersList>;
|
||||
|
||||
export default meta;
|
||||
|
||||
//👇 We create a “template” of how args map to rendering
|
||||
export const Default: StoryObj<typeof ClustersList> = {
|
||||
args: {
|
||||
filteredNamespaces: [""],
|
||||
installedReleases: [],
|
||||
selectedCluster: "",
|
||||
},
|
||||
|
||||
argTypes: {
|
||||
onClusterChange: { actions: "onClusterChange called" },
|
||||
},
|
||||
};
|
||||
@@ -1,165 +0,0 @@
|
||||
import { useMemo } from "react";
|
||||
import { Cluster, Release } from "../data/types";
|
||||
import apiService from "../API/apiService";
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import useCustomSearchParams from "../hooks/useCustomSearchParams";
|
||||
import { useAppContext } from "../context/AppContext";
|
||||
import { v4 as uuidv4 } from "uuid";
|
||||
|
||||
type ClustersListProps = {
|
||||
onClusterChange: (clusterName: string) => void;
|
||||
selectedCluster: string;
|
||||
filteredNamespaces: string[];
|
||||
installedReleases?: Release[];
|
||||
};
|
||||
|
||||
function getCleanClusterName(rawClusterName: string) {
|
||||
if (rawClusterName.indexOf("arn") === 0) {
|
||||
// AWS cluster
|
||||
const clusterSplit = rawClusterName.split(":");
|
||||
const clusterName = clusterSplit.slice(-1)[0].replace("cluster/", "");
|
||||
const region = clusterSplit.at(-3);
|
||||
return region + "/" + clusterName + " [AWS]";
|
||||
}
|
||||
|
||||
if (rawClusterName.indexOf("gke") === 0) {
|
||||
// GKE cluster
|
||||
return (
|
||||
rawClusterName.split("_").at(-2) +
|
||||
"/" +
|
||||
rawClusterName.split("_").at(-1) +
|
||||
" [GKE]"
|
||||
);
|
||||
}
|
||||
|
||||
return rawClusterName;
|
||||
}
|
||||
|
||||
function ClustersList({
|
||||
installedReleases,
|
||||
selectedCluster,
|
||||
filteredNamespaces,
|
||||
onClusterChange,
|
||||
}: ClustersListProps) {
|
||||
const { upsertSearchParams, removeSearchParam } = useCustomSearchParams();
|
||||
const { clusterMode } = useAppContext();
|
||||
|
||||
const { data: clusters } = useQuery<Cluster[]>({
|
||||
queryKey: ["clusters", selectedCluster],
|
||||
queryFn: apiService.getClusters,
|
||||
onSuccess(data) {
|
||||
const sortedData = data?.sort((a, b) =>
|
||||
getCleanClusterName(a.Name).localeCompare(getCleanClusterName(b.Name))
|
||||
);
|
||||
|
||||
if (sortedData && sortedData.length > 0 && !selectedCluster) {
|
||||
onClusterChange(sortedData[0].Name);
|
||||
}
|
||||
|
||||
if (selectedCluster) {
|
||||
const cluster = data.find(
|
||||
(cluster) => getCleanClusterName(cluster.Name) === selectedCluster
|
||||
);
|
||||
if (!filteredNamespaces && cluster?.Namespace) {
|
||||
upsertSearchParams("filteredNamespace", cluster.Namespace);
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
const namespaces = useMemo(() => {
|
||||
const mapNamespaces = new Map<string, number>();
|
||||
|
||||
installedReleases?.forEach((release) => {
|
||||
const amount = mapNamespaces.get(release.namespace)
|
||||
? Number(mapNamespaces.get(release.namespace)) + 1
|
||||
: 1;
|
||||
mapNamespaces.set(release.namespace, amount);
|
||||
});
|
||||
|
||||
return Array.from(mapNamespaces, ([key, value]) => ({
|
||||
id: uuidv4(),
|
||||
name: key,
|
||||
amount: value,
|
||||
}));
|
||||
}, [installedReleases]);
|
||||
|
||||
const onNamespaceChange = (namespace: string) => {
|
||||
const newSelectedNamespaces = filteredNamespaces?.includes(namespace)
|
||||
? filteredNamespaces?.filter((ns) => ns !== namespace)
|
||||
: [...(filteredNamespaces ?? []), namespace];
|
||||
removeSearchParam("filteredNamespace");
|
||||
if (newSelectedNamespaces.length > 0) {
|
||||
upsertSearchParams(
|
||||
"filteredNamespace",
|
||||
newSelectedNamespaces.map((ns) => ns).join("+")
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bg-white flex flex-col p-2 rounded custom-shadow text-cluster-list w-48 m-5 h-fit pb-4 custom-">
|
||||
{!clusterMode ? (
|
||||
<>
|
||||
<label className="font-bold">Clusters</label>
|
||||
{clusters
|
||||
?.sort((a, b) =>
|
||||
getCleanClusterName(a.Name).localeCompare(
|
||||
getCleanClusterName(b.Name)
|
||||
)
|
||||
)
|
||||
?.map((cluster) => {
|
||||
return (
|
||||
<span
|
||||
key={cluster.Name}
|
||||
className="data-cy-clusterName flex items-center mt-2 text-xs"
|
||||
>
|
||||
<input
|
||||
className="cursor-pointer data-cy-clustersInput"
|
||||
onChange={(e) => {
|
||||
onClusterChange(e.target.value);
|
||||
}}
|
||||
type="radio"
|
||||
id={cluster.Name}
|
||||
value={cluster.Name}
|
||||
checked={cluster.Name === selectedCluster}
|
||||
name="clusters"
|
||||
/>
|
||||
<label htmlFor={cluster.Name} className="ml-1 ">
|
||||
{getCleanClusterName(cluster.Name)}
|
||||
</label>
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
</>
|
||||
) : null}
|
||||
|
||||
<label className="font-bold mt-4">Namespaces</label>
|
||||
{namespaces
|
||||
?.sort((a, b) => a.name.localeCompare(b.name))
|
||||
?.map((namespace) => (
|
||||
<span key={namespace.name} className="flex items-center mt-2 text-xs">
|
||||
<input
|
||||
type="checkbox"
|
||||
id={namespace.name}
|
||||
onChange={(event) => {
|
||||
onNamespaceChange(event.target.value);
|
||||
}}
|
||||
value={namespace.name}
|
||||
checked={
|
||||
filteredNamespaces
|
||||
? filteredNamespaces.includes(namespace.name)
|
||||
: false
|
||||
}
|
||||
/>
|
||||
<label
|
||||
htmlFor={namespace.name}
|
||||
className="data-cy-clusterList-namespace ml-1"
|
||||
>{`${namespace.name} [${namespace.amount}]`}</label>
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default ClustersList;
|
||||
@@ -1,41 +0,0 @@
|
||||
import { HD_RESOURCE_CONDITION_TYPE } from "../../API/releases";
|
||||
import { Tooltip } from "flowbite-react";
|
||||
import { ReleaseHealthStatus } from "../../data/types";
|
||||
import { v4 as uuidv4 } from "uuid";
|
||||
|
||||
interface Props {
|
||||
statusData: ReleaseHealthStatus[];
|
||||
}
|
||||
|
||||
const HealthStatus = ({ statusData }: Props) => {
|
||||
const statuses = statusData.map((item) => {
|
||||
for (let i = 0; i < item.status.conditions.length; i++) {
|
||||
const cond = item.status.conditions[i];
|
||||
|
||||
if (cond.type !== HD_RESOURCE_CONDITION_TYPE) {
|
||||
continue;
|
||||
}
|
||||
|
||||
return (
|
||||
<Tooltip
|
||||
key={uuidv4()} // this is not a good practice, we need to fetch some unique id from the backend
|
||||
content={`${cond.status} ${item.kind} ${item.metadata.name}`}
|
||||
>
|
||||
<span
|
||||
className={`inline-block ${
|
||||
cond.status === "Healthy"
|
||||
? "bg-success"
|
||||
: cond.status === "Progressing"
|
||||
? "bg-warning"
|
||||
: "bg-danger"
|
||||
} w-2.5 h-2.5 rounded-sm`}
|
||||
></span>
|
||||
</Tooltip>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
return <div className="flex flex-wrap gap-1">{statuses}</div>;
|
||||
};
|
||||
|
||||
export default HealthStatus;
|
||||
@@ -1,35 +0,0 @@
|
||||
import { Meta } from "@storybook/react";
|
||||
import InstalledPackageCard from "./InstalledPackageCard";
|
||||
|
||||
const meta = {
|
||||
/* 👇 The title prop is optional.
|
||||
* See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
|
||||
* to learn how to generate automatic titles
|
||||
*/
|
||||
title: "InstalledPackageCard",
|
||||
component: InstalledPackageCard,
|
||||
} satisfies Meta<typeof InstalledPackageCard>;
|
||||
|
||||
export default meta;
|
||||
|
||||
export const Default = {
|
||||
args: {
|
||||
release: {
|
||||
id: "",
|
||||
name: "",
|
||||
namespace: "",
|
||||
revision: 1,
|
||||
updated: "",
|
||||
status: "",
|
||||
chart: "",
|
||||
chart_name: "",
|
||||
chart_ver: "",
|
||||
app_version: "",
|
||||
icon: "",
|
||||
description: "",
|
||||
has_tests: false,
|
||||
chartName: "", // duplicated in some cases in the backend, we need to resolve this
|
||||
chartVersion: "", // duplicated in some cases in the backend, we need to resolve this
|
||||
},
|
||||
},
|
||||
};
|
||||
@@ -1,150 +0,0 @@
|
||||
import { useState } from "react";
|
||||
import { Release } from "../../data/types";
|
||||
import { BsArrowUpCircleFill, BsPlusCircleFill } from "react-icons/bs";
|
||||
import { getAge } from "../../timeUtils";
|
||||
import StatusLabel, {
|
||||
DeploymentStatus,
|
||||
getStatusColor,
|
||||
} from "../common/StatusLabel";
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import apiService from "../../API/apiService";
|
||||
import HealthStatus from "./HealthStatus";
|
||||
import HelmGrayIcon from "../../assets/helm-gray-50.svg";
|
||||
import Spinner from "../Spinner";
|
||||
import { useGetLatestVersion } from "../../API/releases";
|
||||
import { isNewerVersion } from "../../utils";
|
||||
import { LatestChartVersion } from "../../API/interfaces";
|
||||
import useNavigateWithSearchParams from "../../hooks/useNavigateWithSearchParams";
|
||||
|
||||
type InstalledPackageCardProps = {
|
||||
release: Release;
|
||||
};
|
||||
|
||||
export default function InstalledPackageCard({
|
||||
release,
|
||||
}: InstalledPackageCardProps) {
|
||||
const navigate = useNavigateWithSearchParams();
|
||||
|
||||
const [isMouseOver, setIsMouseOver] = useState(false);
|
||||
|
||||
const { data: latestVersionResult } = useGetLatestVersion(release.chartName, {
|
||||
queryKey: ["chartName", release.chartName],
|
||||
cacheTime: 0,
|
||||
});
|
||||
|
||||
const { data: statusData } = useQuery<unknown>({
|
||||
queryKey: ["resourceStatus", release],
|
||||
queryFn: () => apiService.getResourceStatus({ release }),
|
||||
});
|
||||
|
||||
const latestVersionData: LatestChartVersion | undefined =
|
||||
latestVersionResult?.[0];
|
||||
|
||||
const canUpgrade =
|
||||
!latestVersionData?.version || !release.chartVersion
|
||||
? false
|
||||
: isNewerVersion(release.chartVersion, latestVersionData?.version);
|
||||
|
||||
const installRepoSuggestion = latestVersionData?.isSuggestedRepo
|
||||
? latestVersionData.repository
|
||||
: null;
|
||||
|
||||
const handleMouseOver = () => {
|
||||
setIsMouseOver(true);
|
||||
};
|
||||
|
||||
const handleMouseOut = () => {
|
||||
setIsMouseOver(false);
|
||||
};
|
||||
|
||||
const handleOnClick = () => {
|
||||
const { name, namespace } = release;
|
||||
navigate(`/${namespace}/${name}/installed/revision/${release.revision}`, {
|
||||
state: release,
|
||||
});
|
||||
};
|
||||
|
||||
const statusColor = getStatusColor(release.status as DeploymentStatus);
|
||||
const borderLeftColor: { [key: string]: string } = {
|
||||
[DeploymentStatus.DEPLOYED]: "border-l-border-deployed",
|
||||
[DeploymentStatus.FAILED]: "border-l-text-danger",
|
||||
[DeploymentStatus.PENDING]: "border-l-border",
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`${
|
||||
borderLeftColor[release.status]
|
||||
} text-xs grid grid-cols-12 items-center bg-white rounded-md p-2 py-6 my-2 custom-shadow border-l-4 border-l-[${statusColor}] cursor-pointer ${
|
||||
isMouseOver && "custom-shadow-lg"
|
||||
}`}
|
||||
onMouseOver={handleMouseOver}
|
||||
onMouseOut={handleMouseOut}
|
||||
onClick={handleOnClick}
|
||||
>
|
||||
<img
|
||||
src={release.icon || HelmGrayIcon}
|
||||
alt="helm release icon"
|
||||
className="w-[45px] mx-4 col-span-1 min-w-[45px]"
|
||||
/>
|
||||
|
||||
<div className="col-span-11 -mb-5">
|
||||
<div className="grid grid-cols-11">
|
||||
<div className="col-span-3 font-bold text-xl mr-0.5 font-roboto-slab">
|
||||
{release.name}
|
||||
</div>
|
||||
<div className="col-span-3">
|
||||
<StatusLabel status={release.status} />
|
||||
</div>
|
||||
<div className="col-span-2 font-bold">{release.chart}</div>
|
||||
<div className="col-span-1 font-bold text-xs">
|
||||
#{release.revision}
|
||||
</div>
|
||||
<div className="col-span-1 font-bold text-xs">
|
||||
{release.namespace}
|
||||
</div>
|
||||
<div className="col-span-1 font-bold text-xs">{getAge(release)}</div>
|
||||
</div>
|
||||
<div
|
||||
className="grid grid-cols-11 text-xs mt-3"
|
||||
style={{ marginBottom: "12px" }}
|
||||
>
|
||||
<div className="col-span-3 h-12 line-clamp-3 mr-1">
|
||||
{release.description}
|
||||
</div>
|
||||
<div className="col-span-3 mr-2">
|
||||
{statusData ? (
|
||||
<HealthStatus statusData={statusData} />
|
||||
) : (
|
||||
<Spinner size={4} />
|
||||
)}
|
||||
</div>
|
||||
<div className="col-span-2 text-muted flex flex-col items">
|
||||
<span>CHART VERSION</span>
|
||||
{(canUpgrade || installRepoSuggestion) && (
|
||||
<div
|
||||
className="text-upgradable flex flex-row items-center gap-1 font-bold"
|
||||
title={`upgrade available: ${latestVersionData?.version} from ${latestVersionData?.repository}`}
|
||||
>
|
||||
{canUpgrade && !installRepoSuggestion ? (
|
||||
<>
|
||||
<BsArrowUpCircleFill />
|
||||
UPGRADE
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<BsPlusCircleFill />
|
||||
ADD REPO
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="col-span-1 text-muted">REVISION</div>
|
||||
<div className="col-span-1 text-muted">NAMESPACE</div>
|
||||
<div className="col-span-1 text-muted">UPDATED</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,54 +0,0 @@
|
||||
import { Meta } from "@storybook/react";
|
||||
import InstalledPackagesHeader from "./InstalledPackagesHeader";
|
||||
|
||||
const meta = {
|
||||
/* 👇 The title prop is optional.
|
||||
* See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
|
||||
* to learn how to generate automatic titles
|
||||
*/
|
||||
title: "InstalledPackagesHeader",
|
||||
component: InstalledPackagesHeader,
|
||||
} satisfies Meta<typeof InstalledPackagesHeader>;
|
||||
|
||||
export default meta;
|
||||
|
||||
export const Default = {
|
||||
args: {
|
||||
filteredReleases: [
|
||||
{
|
||||
id: "",
|
||||
name: "",
|
||||
namespace: "",
|
||||
revision: 1,
|
||||
updated: "",
|
||||
status: "",
|
||||
chart: "",
|
||||
chart_name: "",
|
||||
chart_ver: "",
|
||||
app_version: "",
|
||||
icon: "",
|
||||
description: "",
|
||||
has_tests: false,
|
||||
chartName: "", // duplicated in some cases in the backend, we need to resolve this
|
||||
chartVersion: "", // duplicated in some cases in the
|
||||
},
|
||||
{
|
||||
id: "",
|
||||
name: "",
|
||||
namespace: "",
|
||||
revision: 1,
|
||||
updated: "",
|
||||
status: "",
|
||||
chart: "",
|
||||
chart_name: "",
|
||||
chart_ver: "",
|
||||
app_version: "",
|
||||
icon: "",
|
||||
description: "",
|
||||
has_tests: false,
|
||||
chartName: "", // duplicated in some cases in the backend, we need to resolve this
|
||||
chartVersion: "", // duplicated in some cases in the
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
@@ -1,51 +0,0 @@
|
||||
import HeaderLogo from "../../assets/packges-header.svg";
|
||||
import { Release } from "../../data/types";
|
||||
|
||||
type InstalledPackagesHeaderProps = {
|
||||
filteredReleases?: Release[];
|
||||
setFilterKey: React.Dispatch<React.SetStateAction<string>>;
|
||||
isLoading: boolean;
|
||||
};
|
||||
|
||||
export default function InstalledPackagesHeader({
|
||||
filteredReleases,
|
||||
setFilterKey,
|
||||
isLoading,
|
||||
}: InstalledPackagesHeaderProps) {
|
||||
const numOfPackages = filteredReleases?.length;
|
||||
const showNoPackageAlert = Boolean(
|
||||
!isLoading && (numOfPackages === undefined || numOfPackages === 0)
|
||||
);
|
||||
return (
|
||||
<div className="custom-shadow rounded-t-md ">
|
||||
<div className="flex items-center justify-between bg-white px-2 py-0.5 font-inter rounded-t-md ">
|
||||
<div className="flex items-center">
|
||||
<img
|
||||
src={HeaderLogo}
|
||||
alt="Helm-DashBoard"
|
||||
className="display-inline h-12 ml-3 mr-3 w-[28px] "
|
||||
/>
|
||||
<h2 className="display-inline font-bold text-base ">{`Installed Charts (${
|
||||
numOfPackages || "0"
|
||||
})`}</h2>
|
||||
</div>
|
||||
|
||||
<div className="w-1/3">
|
||||
<input
|
||||
className="border-installed-charts-filter rounded p-1 text-sm w-11/12"
|
||||
placeholder="Filter..."
|
||||
type="text"
|
||||
onChange={(ev) => setFilterKey(ev.target.value)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{showNoPackageAlert && (
|
||||
<div className="bg-white rounded shadow display-none no-charts mt-3 text-sm p-4">
|
||||
Looks like you don't have any charts installed.
|
||||
"Repository" section may be a good place to start.
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,54 +0,0 @@
|
||||
import { Meta } from "@storybook/react";
|
||||
import InstalledPackagesList from "./InstalledPackagesList";
|
||||
|
||||
const meta = {
|
||||
/* 👇 The title prop is optional.
|
||||
* See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
|
||||
* to learn how to generate automatic titles
|
||||
*/
|
||||
title: "InstalledPackagesList",
|
||||
component: InstalledPackagesList,
|
||||
} satisfies Meta<typeof InstalledPackagesList>;
|
||||
|
||||
export default meta;
|
||||
|
||||
export const Default = {
|
||||
args: {
|
||||
installedReleases: [
|
||||
{
|
||||
id: "",
|
||||
name: "",
|
||||
namespace: "",
|
||||
revision: 1,
|
||||
updated: "",
|
||||
status: "",
|
||||
chart: "",
|
||||
chart_name: "",
|
||||
chart_ver: "",
|
||||
app_version: "",
|
||||
icon: "",
|
||||
description: "",
|
||||
has_tests: false,
|
||||
chartName: "", // duplicated in some cases in the backend, we need to resolve this
|
||||
chartVersion: "", // duplicated in some cases in the
|
||||
},
|
||||
{
|
||||
id: "",
|
||||
name: "",
|
||||
namespace: "",
|
||||
revision: 1,
|
||||
updated: "",
|
||||
status: "",
|
||||
chart: "",
|
||||
chart_name: "",
|
||||
chart_ver: "",
|
||||
app_version: "",
|
||||
icon: "",
|
||||
description: "",
|
||||
has_tests: false,
|
||||
chartName: "", // duplicated in some cases in the backend, we need to resolve this
|
||||
chartVersion: "", // duplicated in some cases in the
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
@@ -1,23 +0,0 @@
|
||||
import InstalledPackageCard from "./InstalledPackageCard";
|
||||
import { Release } from "../../data/types";
|
||||
|
||||
type InstalledPackagesListProps = {
|
||||
filteredReleases: Release[];
|
||||
};
|
||||
|
||||
export default function InstalledPackagesList({
|
||||
filteredReleases,
|
||||
}: InstalledPackagesListProps) {
|
||||
return (
|
||||
<div>
|
||||
{filteredReleases.map((installedPackage: Release) => {
|
||||
return (
|
||||
<InstalledPackageCard
|
||||
key={installedPackage.name}
|
||||
release={installedPackage}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,39 +0,0 @@
|
||||
import { NavLink, useLocation, useParams } from "react-router-dom";
|
||||
import { useAppContext } from "../context/AppContext";
|
||||
|
||||
const LinkWithSearchParams = ({
|
||||
to,
|
||||
...props
|
||||
}: {
|
||||
to: string;
|
||||
end?: boolean;
|
||||
exclude?: string[];
|
||||
className?: string;
|
||||
children: React.ReactNode;
|
||||
}) => {
|
||||
const { search } = useLocation();
|
||||
const { context } = useParams();
|
||||
const { clusterMode } = useAppContext();
|
||||
|
||||
const params = new URLSearchParams(search);
|
||||
// For state we don't want to keep while navigating
|
||||
props.exclude?.forEach((key) => {
|
||||
params.delete(key);
|
||||
});
|
||||
|
||||
let prefixedUrl = to;
|
||||
|
||||
if (!clusterMode) {
|
||||
prefixedUrl = `/${context}${to}`;
|
||||
}
|
||||
|
||||
return (
|
||||
<NavLink
|
||||
data-cy="navigation-link"
|
||||
to={`${prefixedUrl}/?${params.toString()}`}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default LinkWithSearchParams;
|
||||
@@ -1,35 +0,0 @@
|
||||
/**
|
||||
* @file SelectMenu.stories.tsx
|
||||
* @description This file contains the SelectMenu
|
||||
* component stories.
|
||||
* currently there is only the default story.
|
||||
* The default story renders the component with the default props.
|
||||
*/
|
||||
|
||||
import { Meta, StoryObj } from "@storybook/react";
|
||||
import { action } from "@storybook/addon-actions";
|
||||
import SelectMenu, { SelectMenuItem } from "./SelectMenu";
|
||||
|
||||
const meta = {
|
||||
/* 👇 The title prop is optional.
|
||||
* See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
|
||||
* to learn how to generate automatic titles
|
||||
*/
|
||||
title: "SelectMenu",
|
||||
component: SelectMenu,
|
||||
} satisfies Meta<typeof SelectMenu>;
|
||||
|
||||
export default meta;
|
||||
|
||||
export const Default: StoryObj<typeof SelectMenu> = {
|
||||
args: {
|
||||
header: "Header",
|
||||
children: [
|
||||
<SelectMenuItem label="Item 1" id={1} key="item1" />,
|
||||
<SelectMenuItem label="Item 2" id={2} key="item2" />,
|
||||
<SelectMenuItem label="Item 3" id={3} key="item3" />,
|
||||
],
|
||||
selected: 1,
|
||||
onSelect: (id: number) => action("onSelect")(id),
|
||||
},
|
||||
};
|
||||
@@ -1,82 +0,0 @@
|
||||
/**
|
||||
*
|
||||
* @file SelectMenu.tsx
|
||||
* @description SelectMenu component
|
||||
* This component is used to render a select menu. This is a component
|
||||
* with two parts: The menu header and the menu items. The menu header
|
||||
* is just text, and the menu items are radio toggles.
|
||||
* The menu items are passed as children of type SelectMenuItem,
|
||||
* which is an object with a label and id.
|
||||
* SelectMenuItem is defined in this file.
|
||||
* The menu header is a string.
|
||||
*
|
||||
* We use an interface to define the props that are passed to the component.
|
||||
* The interface name is SelectMenuProps. The interface is defined in the
|
||||
* same file as the component.
|
||||
*
|
||||
* @interface SelectMenuProps:
|
||||
* @property {string} header - The menu header
|
||||
* @property {SelectMenuItem[]} children - The menu items
|
||||
* @property {number} selected - The id of the selected menu item
|
||||
* @property {Function} onSelect - The function to call when a menu item is selected
|
||||
*
|
||||
* @return {JSX.Element} - The component
|
||||
*
|
||||
*
|
||||
*/
|
||||
|
||||
// define the SelectMenuItem type:
|
||||
// This is an object with a label and id.
|
||||
// The label is a string, and the id is a number.
|
||||
// The id is used to identify the selected menu item.
|
||||
export interface SelectMenuItemProps {
|
||||
label: string;
|
||||
id: number;
|
||||
}
|
||||
|
||||
// define the SelectMenuProps interface:
|
||||
|
||||
export interface SelectMenuProps {
|
||||
header: string;
|
||||
children: React.ReactNode;
|
||||
selected: number;
|
||||
onSelect: (id: number) => void;
|
||||
}
|
||||
|
||||
// define the SelectMenu component:
|
||||
// remember to use tailwind classes for styling
|
||||
// recall that the menu items are radio buttons
|
||||
// the selected menu item is the one that is checked
|
||||
// the onSelect function is called when a menu item is selected
|
||||
// the onSelect function is passed the id of the selected menu item
|
||||
|
||||
export function SelectMenuItem({
|
||||
label,
|
||||
id,
|
||||
}: SelectMenuItemProps): JSX.Element {
|
||||
return (
|
||||
<div className="flex flex-row">
|
||||
<input
|
||||
type="radio"
|
||||
name="menu"
|
||||
id={id.toString()} // id must be a string
|
||||
value={id}
|
||||
checked={false}
|
||||
onChange={() => {
|
||||
return;
|
||||
}}
|
||||
/>
|
||||
<label htmlFor={id.toString()}>{label}</label>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default function SelectMenu(props: SelectMenuProps): JSX.Element {
|
||||
const { header, children } = props;
|
||||
return (
|
||||
<div className="card flex flex-col">
|
||||
<h2 className="text-xl font-bold">{header}</h2>
|
||||
<div className="flex flex-col">{children}</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,20 +0,0 @@
|
||||
import { StoryFn, Meta } from "@storybook/react";
|
||||
import ShutDownButton from "./ShutDownButton";
|
||||
|
||||
const meta = {
|
||||
/* 👇 The title prop is optional.
|
||||
* See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
|
||||
* to learn how to generate automatic titles
|
||||
*/
|
||||
title: "ShutDownButton",
|
||||
component: ShutDownButton,
|
||||
} satisfies Meta<typeof ShutDownButton>;
|
||||
|
||||
export default meta;
|
||||
|
||||
//👇 We create a “template” of how args map to rendering
|
||||
const Template: StoryFn<typeof ShutDownButton> = () => <ShutDownButton />;
|
||||
|
||||
export const Default = {
|
||||
render: Template,
|
||||
};
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user