refactor: full-stack restructure with multi-tenancy, workspace management, and K8s diagnostics
- Add Workspace domain (entity, repository, service, handler, DTO) - Add multi-tenant K8s client with tenant binding and quota management - Add K8s diagnostics client (instance diagnostics) - Add authorization middleware (authz package) - Restructure frontend to feature-based architecture (features/) - Add User Management page in configuration - Add AccessDenied page and route guards - Refactor shared components (form inputs, layout, UI) - Update Tailwind config for new design system - Add comprehensive documentation (docs/, tasks/, plans) - Improve cluster service with better kubeconfig handling - Add tests for crypto, config, helm client, tenant binding
This commit is contained in:
@ -7,12 +7,15 @@ import { Edit2, Trash2, Database, ExternalLink } from "lucide-react";
|
||||
import type { AppRegistry } from "@/core/types";
|
||||
import { EmptyStateSimple } from "@/shared/components";
|
||||
import { LoadingText, EmptyText } from "@/shared/constants";
|
||||
import type { User } from "@/app/providers/AuthContext";
|
||||
import { canUseResourceAction, getVisibilityLabel, type ResourceWithAccess } from "@/app/providers/auth-model";
|
||||
|
||||
interface RegistryListProps {
|
||||
registries: AppRegistry[];
|
||||
loading: boolean;
|
||||
onEdit: (registry: AppRegistry) => void;
|
||||
onDelete: (registry: AppRegistry) => void;
|
||||
user?: User | null;
|
||||
}
|
||||
|
||||
export const RegistryList: React.FC<RegistryListProps> = ({
|
||||
@ -20,10 +23,11 @@ export const RegistryList: React.FC<RegistryListProps> = ({
|
||||
loading,
|
||||
onEdit,
|
||||
onDelete,
|
||||
user,
|
||||
}) => {
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="text-center py-12 text-gray-400">
|
||||
<div className="text-center py-12 text-slate-500">
|
||||
{LoadingText.LOADING_REGISTRIES}
|
||||
</div>
|
||||
);
|
||||
@ -41,19 +45,27 @@ export const RegistryList: React.FC<RegistryListProps> = ({
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
{registries.map((registry) => (
|
||||
<div
|
||||
key={registry.id}
|
||||
className="p-4 bg-gray-800 border border-gray-700 rounded-lg hover:border-gray-600 transition"
|
||||
>
|
||||
{registries.map((registry) => {
|
||||
const access = registry as AppRegistry & ResourceWithAccess;
|
||||
const canEdit = canUseResourceAction(access, "update", user);
|
||||
const canDelete = canUseResourceAction(access, "delete", user);
|
||||
|
||||
return (
|
||||
<div
|
||||
key={registry.id}
|
||||
className="p-4 bg-slate-50 border border-slate-200 rounded-lg hover:border-slate-300 transition"
|
||||
>
|
||||
<div className="flex items-start justify-between">
|
||||
{/* Left: Basic Info */}
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-3 mb-2">
|
||||
<Database className="w-5 h-5 text-purple-400 flex-shrink-0" />
|
||||
<h3 className="text-lg font-semibold text-white">
|
||||
<Database className="w-5 h-5 text-blue-600 flex-shrink-0" />
|
||||
<h3 className="text-lg font-semibold text-slate-900">
|
||||
{registry.name}
|
||||
</h3>
|
||||
<span className="rounded border border-slate-200 bg-white px-1.5 py-0.5 text-[11px] font-medium text-slate-500">
|
||||
{getVisibilityLabel(access.visibility)}
|
||||
</span>
|
||||
{registry.insecure && (
|
||||
<span className="px-2 py-0.5 bg-yellow-900/30 text-yellow-400 text-xs rounded">
|
||||
Insecure
|
||||
@ -62,25 +74,25 @@ export const RegistryList: React.FC<RegistryListProps> = ({
|
||||
</div>
|
||||
|
||||
<div className="ml-8 space-y-1">
|
||||
<div className="flex items-center gap-2 text-sm text-gray-400">
|
||||
<div className="flex items-center gap-2 text-sm text-slate-500">
|
||||
<ExternalLink className="w-4 h-4" />
|
||||
<a
|
||||
href={registry.url}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:text-purple-400 transition"
|
||||
className="hover:text-blue-600 transition"
|
||||
>
|
||||
{registry.url}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{registry.description && (
|
||||
<p className="text-sm text-gray-500">{registry.description}</p>
|
||||
<p className="text-sm text-slate-500">{registry.description}</p>
|
||||
)}
|
||||
|
||||
{registry.username && (
|
||||
<p className="text-sm text-gray-500">
|
||||
Username: <span className="text-gray-400">{registry.username}</span>
|
||||
<p className="text-sm text-slate-500">
|
||||
Username: <span className="text-slate-500">{registry.username}</span>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
@ -90,22 +102,25 @@ export const RegistryList: React.FC<RegistryListProps> = ({
|
||||
<div className="flex items-center gap-2 ml-4">
|
||||
<button
|
||||
onClick={() => onEdit(registry)}
|
||||
className="p-2 text-gray-400 hover:text-blue-400 hover:bg-gray-700 rounded-lg transition"
|
||||
title="Edit"
|
||||
disabled={!canEdit}
|
||||
className="p-2 text-slate-500 hover:text-blue-400 hover:bg-white rounded-lg transition disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:text-slate-500"
|
||||
title={canEdit ? "Edit" : "Read-only"}
|
||||
>
|
||||
<Edit2 className="w-4 h-4" />
|
||||
</button>
|
||||
<button
|
||||
onClick={() => onDelete(registry)}
|
||||
className="p-2 text-gray-400 hover:text-red-400 hover:bg-gray-700 rounded-lg transition"
|
||||
title="Delete"
|
||||
disabled={!canDelete}
|
||||
className="p-2 text-slate-500 hover:text-red-400 hover:bg-white rounded-lg transition disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:text-slate-500"
|
||||
title={canDelete ? "Delete" : "Read-only"}
|
||||
>
|
||||
<Trash2 className="w-4 h-4" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user