mirror/helm-dashboard
1
0
Fork 0
mirror of https://github.com/komodorio/helm-dashboard.git synced 2026-03-29 07:48:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

Huge bump of versions + husky + fixed DropDown key issue and pointer (#628)

Browse Source 
* Bump lint-staged

* Check

* Check

* Added husky

* Check

* Check

* Check

* Check

* Check

* Check

* Check

* Check

* Fix husky

* Used * instead **/* in lint-staged

* Bump tailwindcss and related

* Added @tailwindcss/vite and removed postcss

* Added lint into staged

* Bump @babel/core and updated .prettierignore

* Removed tailwind.config.cjs

* Added ThemeInit

* Added cursor-pointer to Help dropdown

* Bump react-router

* Removed @types/uuid and react-router-dom

* Bump diff2html, prettier, @typescript-eslint/eslint-plugin, @typescript-eslint/parser

* removed vite-plugin-html-config and @babel/core

* removed "@eslint/eslintrc" and "@eslint/js"

* Removed redundant link

* Returned plugins and source to index.css

* Set dark to false in tailwindcss

* Fixed storybook

* Fixed useGetLatestVersion with correct gcTime: 0 option

* Added eslint-plugin-prettier

* Removed spaces

* ClustersList.tsx improved and type fixes for another files

* Repository.tsx improved

* Huge fix of types

* Huge fix of types missed

* Fixed type of SingleValue

* Added cursor pointer
This commit is contained in:
yuri-sakharov
2025-11-29 18:49:51 +02:00
committed by GitHub
parent 1129651e6c
commit 7572f00f7c
65 changed files with 1476 additions and 1893 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
frontend/src/components/ClustersList.tsx
View File

@@ -1,4 +1,4 @@
import { useMemo } from "react";
import { useEffect, useEffectEvent, useMemo, useState } from "react";
import { Cluster, Release } from "../data/types";
import apiService from "../API/apiService";
import { useQuery } from "@tanstack/react-query";
@@ -43,30 +43,39 @@ function ClustersList({
}: ClustersListProps) {
const { upsertSearchParams, removeSearchParam } = useCustomSearchParams();
const { clusterMode } = useAppContext();
const [sortedClusters, setSortedClusters] = useState<Cluster[]>([]);
const { data: clusters } = useQuery<Cluster[]>({
const { data: clusters, isSuccess } = 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 onSuccess = useEffectEvent((clusters: Cluster[]) => {
const sortedData = [...clusters].sort((a, b) =>
getCleanClusterName(a.Name).localeCompare(getCleanClusterName(b.Name))
);
setSortedClusters(sortedData);
if (sortedData && sortedData.length > 0 && !selectedCluster) {
onClusterChange(sortedData[0].Name);
}
if (selectedCluster) {
const cluster = clusters.find(
(cluster) => getCleanClusterName(cluster.Name) === selectedCluster
);
if (!filteredNamespaces && cluster?.Namespace) {
upsertSearchParams("filteredNamespace", cluster.Namespace);
}
}
});
useEffect(() => {
if (clusters && isSuccess) {
onSuccess(clusters);
}
}, [clusters, isSuccess]);
const namespaces = useMemo(() => {
const mapNamespaces = new Map<string, number>();
@@ -98,39 +107,33 @@ function ClustersList({
};
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-">
<div className="bg-white flex flex-col p-2 rounded-sm 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>
);
})}
{sortedClusters?.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}