fix(kubernetes): use kubeconfig files from Settings instead of duplicate cluster management
Some checks failed
Test / frontend-tests (pull_request) Successful in 1m28s
Test / frontend-typecheck (pull_request) Successful in 1m34s
PR Review Automation / review (pull_request) Successful in 3m42s
Test / rust-tests (pull_request) Has been cancelled
Test / rust-fmt-check (pull_request) Has been cancelled
Test / rust-clippy (pull_request) Has been cancelled
Some checks failed
Test / frontend-tests (pull_request) Successful in 1m28s
Test / frontend-typecheck (pull_request) Successful in 1m34s
PR Review Automation / review (pull_request) Successful in 3m42s
Test / rust-tests (pull_request) Has been cancelled
Test / rust-fmt-check (pull_request) Has been cancelled
Test / rust-clippy (pull_request) Has been cancelled
- Remove duplicate 'Add Cluster' button and modal - Remove duplicate 'Start Port Forward' button and modal - KubernetesPage now uses kubeconfig files from Settings → Kubeconfig - Clusters section displays kubeconfig files with active indicator - Port forwarding section shows active port forwards without duplicate controls - All tests passing, build successful
This commit is contained in:
parent
91b6bf3d90
commit
e928011839
@ -1,25 +1,24 @@
|
|||||||
import React, { useState, useEffect } from "react";
|
import React, { useState, useEffect } from "react";
|
||||||
import { useKubernetesStore } from "@/stores/kubernetesStore";
|
import { useKubernetesStore } from "@/stores/kubernetesStore";
|
||||||
import { ClusterList } from "@/components/Kubernetes/ClusterList";
|
|
||||||
import { PortForwardList } from "@/components/Kubernetes/PortForwardList";
|
import { PortForwardList } from "@/components/Kubernetes/PortForwardList";
|
||||||
import { AddClusterModal } from "@/components/Kubernetes/AddClusterModal";
|
|
||||||
import { PortForwardForm } from "@/components/Kubernetes/PortForwardForm";
|
import { PortForwardForm } from "@/components/Kubernetes/PortForwardForm";
|
||||||
import { ResourceBrowser } from "@/components/Kubernetes/ResourceBrowser";
|
import { ResourceBrowser } from "@/components/Kubernetes/ResourceBrowser";
|
||||||
import type { ClusterInfo, PortForwardResponse } from "@/lib/tauriCommands";
|
import type { PortForwardResponse, KubeconfigInfo, PortForwardRequest } from "@/lib/tauriCommands";
|
||||||
import {
|
import {
|
||||||
listClustersCmd,
|
|
||||||
removeClusterCmd,
|
|
||||||
listPortForwardsCmd,
|
listPortForwardsCmd,
|
||||||
stopPortForwardCmd,
|
stopPortForwardCmd,
|
||||||
deletePortForwardCmd,
|
deletePortForwardCmd,
|
||||||
|
listKubeconfigsCmd,
|
||||||
|
activateKubeconfigCmd,
|
||||||
|
startPortForwardCmd,
|
||||||
} from "@/lib/tauriCommands";
|
} from "@/lib/tauriCommands";
|
||||||
|
|
||||||
export function KubernetesPage() {
|
export function KubernetesPage() {
|
||||||
const { clusters, addCluster, removeCluster, selectedClusterId } = useKubernetesStore();
|
const { selectedClusterId } = useKubernetesStore();
|
||||||
|
const [kubeconfigs, setKubeconfigs] = useState<KubeconfigInfo[]>([]);
|
||||||
const [portForwards, setPortForwards] = useState<PortForwardResponse[]>([]);
|
const [portForwards, setPortForwards] = useState<PortForwardResponse[]>([]);
|
||||||
const [isLoading, setIsLoading] = useState(true);
|
const [isLoading, setIsLoading] = useState(true);
|
||||||
const [isAddClusterOpen, setIsAddClusterOpen] = useState(false);
|
|
||||||
const [isStartPortForwardOpen, setIsStartPortForwardOpen] = useState(false);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
loadData();
|
loadData();
|
||||||
@ -28,12 +27,12 @@ export function KubernetesPage() {
|
|||||||
const loadData = async () => {
|
const loadData = async () => {
|
||||||
setIsLoading(true);
|
setIsLoading(true);
|
||||||
try {
|
try {
|
||||||
const [clustersData, portForwardsData] = await Promise.all([
|
const [kubeconfigsData, portForwardsData] = await Promise.all([
|
||||||
listClustersCmd(),
|
listKubeconfigsCmd(),
|
||||||
listPortForwardsCmd(),
|
listPortForwardsCmd(),
|
||||||
]);
|
]);
|
||||||
|
|
||||||
clustersData.forEach(addCluster);
|
setKubeconfigs(kubeconfigsData);
|
||||||
setPortForwards(portForwardsData);
|
setPortForwards(portForwardsData);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error("Failed to load data:", err);
|
console.error("Failed to load data:", err);
|
||||||
@ -42,13 +41,13 @@ export function KubernetesPage() {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleRemoveCluster = async (clusterId: string) => {
|
const handleActivateKubeconfig = async (id: string) => {
|
||||||
try {
|
try {
|
||||||
await removeClusterCmd(clusterId);
|
await activateKubeconfigCmd(id);
|
||||||
removeCluster(clusterId);
|
await loadData();
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error("Failed to remove cluster:", err);
|
console.error("Failed to activate kubeconfig:", err);
|
||||||
alert("Failed to remove cluster");
|
alert("Failed to activate kubeconfig");
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -72,12 +71,14 @@ export function KubernetesPage() {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleAddCluster = (cluster: ClusterInfo) => {
|
const handleStartPortForward = async (portForward: PortForwardRequest) => {
|
||||||
addCluster(cluster);
|
try {
|
||||||
};
|
const result = await startPortForwardCmd(portForward);
|
||||||
|
setPortForwards((prev) => [...prev, result]);
|
||||||
const handleStartPortForward = (portForward: PortForwardResponse) => {
|
} catch (err) {
|
||||||
setPortForwards((prev) => [...prev, portForward]);
|
console.error("Failed to start port forward:", err);
|
||||||
|
alert("Failed to start port forward");
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
if (isLoading) {
|
if (isLoading) {
|
||||||
@ -100,40 +101,94 @@ export function KubernetesPage() {
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Cluster Management Section */}
|
{/* Cluster Management Section - Uses kubeconfig files from Settings */}
|
||||||
<div className="space-y-6">
|
<div className="space-y-6">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<h2 className="text-xl font-semibold">Clusters</h2>
|
<h2 className="text-xl font-semibold">Clusters (from kubeconfig files)</h2>
|
||||||
<button
|
<div className="flex gap-2">
|
||||||
onClick={() => setIsAddClusterOpen(true)}
|
<button
|
||||||
className="px-4 py-2 bg-primary text-primary-foreground rounded-md hover:bg-primary/90"
|
onClick={() => window.location.href = "/settings/kubeconfig"}
|
||||||
>
|
className="px-4 py-2 bg-secondary text-secondary-foreground rounded-md hover:bg-secondary/90"
|
||||||
Add Cluster
|
>
|
||||||
</button>
|
Manage kubeconfigs
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ClusterList
|
{kubeconfigs.length === 0 ? (
|
||||||
clusters={clusters}
|
<div className="rounded-lg border border-dashed px-6 py-12 text-center bg-card">
|
||||||
onAdd={() => setIsAddClusterOpen(true)}
|
<div className="mx-auto w-12 h-12 text-muted-foreground mb-4">
|
||||||
onRemove={handleRemoveCluster}
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth={1.5} stroke="currentColor">
|
||||||
/>
|
<path strokeLinecap="round" strokeLinejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m2.25 0H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<h3 className="text-lg font-medium mb-2">No kubeconfig files uploaded</h3>
|
||||||
|
<p className="text-sm text-muted-foreground mb-4">
|
||||||
|
Upload kubeconfig files in Settings → Kubeconfig to manage Kubernetes clusters
|
||||||
|
</p>
|
||||||
|
<button
|
||||||
|
onClick={() => window.location.href = "/settings/kubeconfig"}
|
||||||
|
className="px-4 py-2 bg-primary text-primary-foreground rounded-md hover:bg-primary/90"
|
||||||
|
>
|
||||||
|
Go to Kubeconfig Manager
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="grid gap-4">
|
||||||
|
{kubeconfigs.map((config) => (
|
||||||
|
<div
|
||||||
|
key={config.id}
|
||||||
|
className={`rounded-lg border bg-card p-4 hover:border-primary/50 transition-colors ${
|
||||||
|
config.is_active ? "border-primary ring-1 ring-primary/20" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<div className="flex items-start justify-between">
|
||||||
|
<div className="space-y-1 flex-1">
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<h3 className="font-medium text-lg">{config.name}</h3>
|
||||||
|
{config.is_active && (
|
||||||
|
<span className="px-2 py-1 text-xs font-semibold bg-green-100 text-green-800 rounded">
|
||||||
|
Active
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
<div className="text-sm text-muted-foreground space-y-1">
|
||||||
|
<div>
|
||||||
|
<span className="font-medium">Context:</span> {config.context}
|
||||||
|
</div>
|
||||||
|
{config.cluster_url && (
|
||||||
|
<div>
|
||||||
|
<span className="font-medium">Cluster:</span> {config.cluster_url}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex gap-2">
|
||||||
|
{!config.is_active && (
|
||||||
|
<button
|
||||||
|
onClick={() => handleActivateKubeconfig(config.id)}
|
||||||
|
className="px-3 py-1 text-sm bg-secondary text-secondary-foreground rounded hover:bg-secondary/90"
|
||||||
|
>
|
||||||
|
Activate
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Port Forwarding Section */}
|
{/* Port Forwarding Section */}
|
||||||
<div className="space-y-6">
|
<div className="space-y-6">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<h2 className="text-xl font-semibold">Port Forwarding</h2>
|
<h2 className="text-xl font-semibold">Port Forwarding</h2>
|
||||||
<button
|
|
||||||
onClick={() => setIsStartPortForwardOpen(true)}
|
|
||||||
className="px-4 py-2 bg-primary text-primary-foreground rounded-md hover:bg-primary/90"
|
|
||||||
>
|
|
||||||
Start Port Forward
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<PortForwardList
|
<PortForwardList
|
||||||
portForwards={portForwards}
|
portForwards={portForwards}
|
||||||
onStart={() => setIsStartPortForwardOpen(true)}
|
onStart={() => {}}
|
||||||
onStop={handleStopPortForward}
|
onStop={handleStopPortForward}
|
||||||
onDelete={handleDeletePortForward}
|
onDelete={handleDeletePortForward}
|
||||||
/>
|
/>
|
||||||
@ -146,20 +201,8 @@ export function KubernetesPage() {
|
|||||||
<ResourceBrowser clusterId={selectedClusterId} />
|
<ResourceBrowser clusterId={selectedClusterId} />
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{/* Add Cluster Modal */}
|
|
||||||
<AddClusterModal
|
|
||||||
isOpen={isAddClusterOpen}
|
|
||||||
onClose={() => setIsAddClusterOpen(false)}
|
|
||||||
onAdd={handleAddCluster}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{/* Port Forward Form */}
|
|
||||||
<PortForwardForm
|
|
||||||
isOpen={isStartPortForwardOpen}
|
|
||||||
onClose={() => setIsStartPortForwardOpen(false)}
|
|
||||||
onStart={handleStartPortForward}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user