v1.10.0 #471
@@ -165,8 +165,7 @@
|
||||
"keyTypeEcdsaP521": "ECDSA P-521 (SSH)",
|
||||
"keyTypeDsa": "DSA (SSH)",
|
||||
"keyTypeRsaSha256": "RSA-SHA2-256",
|
||||
"keyTypeRsaSha512": "RSA-SHA2-512"
|
||||
},
|
||||
"keyTypeRsaSha512": "RSA-SHA2-512",
|
||||
"keyPairGeneratedSuccessfully": "{{keyType}} key pair generated successfully",
|
||||
"failedToGenerateKeyPair": "Failed to generate key pair",
|
||||
"generateKeyPairNote": "Generate a new SSH key pair directly. This will replace any existing keys in the form.",
|
||||
@@ -286,7 +285,30 @@
|
||||
"deleteTooltip": "Delete command",
|
||||
"tabHint": "Use Tab in Terminal to autocomplete from command history",
|
||||
"authRequiredRefresh": "Authentication required. Please refresh the page.",
|
||||
"dataAccessLockedReauth": "Data access locked. Please re-authenticate."
|
||||
"dataAccessLockedReauth": "Data access locked. Please re-authenticate.",
|
||||
"loading": "Loading command history...",
|
||||
"error": "Error Loading History"
|
||||
},
|
||||
"splitScreen": {
|
||||
"title": "Split Screen",
|
||||
"none": "None",
|
||||
"twoSplit": "2-Way",
|
||||
"threeSplit": "3-Way",
|
||||
"fourSplit": "4-Way",
|
||||
"availableTabs": "Available Tabs",
|
||||
"dragTabsHint": "Drag tabs to the layout cells below to assign them",
|
||||
"layout": "Split Screen Layout",
|
||||
"dropHere": "Drop tab here",
|
||||
"apply": "Apply Split",
|
||||
"clear": "Clear Split",
|
||||
"selectMode": "Select a split screen mode",
|
||||
"helpText": "Choose how many tabs you want to view at once",
|
||||
"success": "Split screen applied successfully",
|
||||
"cleared": "Split screen cleared",
|
||||
"error": {
|
||||
"noAssignments": "Please assign at least one tab to the layout",
|
||||
"fillAllSlots": "Please fill all {{count}} slots before applying"
|
||||
}
|
||||
},
|
||||
"homepage": {
|
||||
"loggedInTitle": "Logged in!",
|
||||
@@ -1578,7 +1600,7 @@
|
||||
"connecting": "Connecting...",
|
||||
"disconnecting": "Disconnecting...",
|
||||
"unknownTunnelStatus": "Unknown",
|
||||
"statusUnknown": "Unknown"
|
||||
"statusUnknown": "Unknown",
|
||||
"error": "Error",
|
||||
"failed": "Failed",
|
||||
"retrying": "Retrying",
|
||||
@@ -1593,7 +1615,7 @@
|
||||
"attempt": "Attempt {{current}} of {{max}}",
|
||||
"nextRetryIn": "Next retry in {{seconds}} seconds",
|
||||
"checkDockerLogs": "Check your Docker logs for the error reason, join the",
|
||||
"orCreate": "or create a ",,
|
||||
"orCreate": "or create a ",
|
||||
"noTunnelConnections": "No tunnel connections configured",
|
||||
"tunnelConnections": "Tunnel Connections",
|
||||
"addTunnel": "Add Tunnel",
|
||||
|
||||
@@ -768,23 +768,38 @@ export function AdminSettings({
|
||||
<Users className="h-4 w-4" />
|
||||
{t("admin.general")}
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="oidc" className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge">
|
||||
<TabsTrigger
|
||||
value="oidc"
|
||||
className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge"
|
||||
>
|
||||
<Shield className="h-4 w-4" />
|
||||
OIDC
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="users" className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge">
|
||||
<TabsTrigger
|
||||
value="users"
|
||||
className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge"
|
||||
>
|
||||
<Users className="h-4 w-4" />
|
||||
{t("admin.users")}
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="sessions" className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge">
|
||||
<TabsTrigger
|
||||
value="sessions"
|
||||
className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge"
|
||||
>
|
||||
<Clock className="h-4 w-4" />
|
||||
Sessions
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="roles" className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge">
|
||||
<TabsTrigger
|
||||
value="roles"
|
||||
className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge"
|
||||
>
|
||||
<Shield className="h-4 w-4" />
|
||||
{t("rbac.roles.label")}
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="security" className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge">
|
||||
<TabsTrigger
|
||||
value="security"
|
||||
className="flex items-center gap-2 bg-elevated data-[state=active]:bg-button data-[state=active]:border data-[state=active]:border-edge"
|
||||
>
|
||||
<Database className="h-4 w-4" />
|
||||
{t("admin.databaseSecurity")}
|
||||
</TabsTrigger>
|
||||
@@ -795,27 +810,27 @@ export function AdminSettings({
|
||||
<h3 className="text-lg font-semibold">
|
||||
{t("admin.userRegistration")}
|
||||
</h3>
|
||||
<label className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={allowRegistration}
|
||||
onCheckedChange={handleToggleRegistration}
|
||||
disabled={regLoading || !allowPasswordLogin}
|
||||
/>
|
||||
{t("admin.allowNewAccountRegistration")}
|
||||
{!allowPasswordLogin && (
|
||||
<span className="text-xs text-muted-foreground">
|
||||
({t("admin.requiresPasswordLogin")})
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<label className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={allowPasswordLogin}
|
||||
onCheckedChange={handleTogglePasswordLogin}
|
||||
disabled={passwordLoginLoading}
|
||||
/>
|
||||
{t("admin.allowPasswordLogin")}
|
||||
</label>
|
||||
<label className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={allowRegistration}
|
||||
onCheckedChange={handleToggleRegistration}
|
||||
disabled={regLoading || !allowPasswordLogin}
|
||||
/>
|
||||
{t("admin.allowNewAccountRegistration")}
|
||||
{!allowPasswordLogin && (
|
||||
<span className="text-xs text-muted-foreground">
|
||||
({t("admin.requiresPasswordLogin")})
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<label className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={allowPasswordLogin}
|
||||
onCheckedChange={handleTogglePasswordLogin}
|
||||
disabled={passwordLoginLoading}
|
||||
/>
|
||||
{t("admin.allowPasswordLogin")}
|
||||
</label>
|
||||
</div>
|
||||
</TabsContent>
|
||||
|
||||
@@ -1189,7 +1204,9 @@ export function AdminSettings({
|
||||
<TabsContent value="sessions" className="space-y-6">
|
||||
<div className="rounded-lg border-2 border-border bg-card p-4 space-y-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<h3 className="text-lg font-semibold">{t("admin.sessionManagement")}</h3>
|
||||
<h3 className="text-lg font-semibold">
|
||||
{t("admin.sessionManagement")}
|
||||
</h3>
|
||||
<Button
|
||||
onClick={fetchSessions}
|
||||
disabled={sessionsLoading}
|
||||
@@ -1297,7 +1314,9 @@ export function AdminSettings({
|
||||
)
|
||||
}
|
||||
className="text-orange-600 hover:text-orange-700 hover:bg-orange-50 text-xs"
|
||||
title={t("admin.revokeAllUserSessionsTitle")}
|
||||
title={t(
|
||||
"admin.revokeAllUserSessionsTitle",
|
||||
)}
|
||||
>
|
||||
{t("admin.revokeAll")}
|
||||
</Button>
|
||||
@@ -1314,7 +1333,9 @@ export function AdminSettings({
|
||||
</TabsContent>
|
||||
|
||||
<TabsContent value="roles" className="space-y-6">
|
||||
<RoleManagement />
|
||||
<div className="rounded-lg border-2 border-border bg-card p-4 space-y-4">
|
||||
<RoleManagement />
|
||||
</div>
|
||||
</TabsContent>
|
||||
|
||||
<TabsContent value="security" className="space-y-6">
|
||||
@@ -1457,10 +1478,11 @@ export function AdminSettings({
|
||||
>
|
||||
<DialogContent className="sm:max-w-[500px] bg-canvas border-2 border-edge">
|
||||
<DialogHeader>
|
||||
<DialogTitle className="flex items-center gap-2">
|
||||
<Link2 className="w-5 h-5" />
|
||||
{t("admin.linkOidcToPasswordAccount")}
|
||||
</DialogTitle> <DialogDescription className="text-muted-foreground">
|
||||
<DialogTitle className="flex items-center gap-2">
|
||||
<Link2 className="w-5 h-5" />
|
||||
{t("admin.linkOidcToPasswordAccount")}
|
||||
</DialogTitle>{" "}
|
||||
<DialogDescription className="text-muted-foreground">
|
||||
{t("admin.linkOidcToPasswordAccountDescription", {
|
||||
username: linkOidcUser?.username,
|
||||
})}
|
||||
|
||||
@@ -19,23 +19,8 @@ import {
|
||||
import { Input } from "@/components/ui/input.tsx";
|
||||
import { Label } from "@/components/ui/label.tsx";
|
||||
import { Textarea } from "@/components/ui/textarea.tsx";
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "@/components/ui/select.tsx";
|
||||
import { Badge } from "@/components/ui/badge.tsx";
|
||||
import {
|
||||
Shield,
|
||||
Plus,
|
||||
Edit,
|
||||
Trash2,
|
||||
Users,
|
||||
Check,
|
||||
ChevronsUpDown,
|
||||
} from "lucide-react";
|
||||
import { Shield, Plus, Edit, Trash2 } from "lucide-react";
|
||||
import { toast } from "sonner";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useConfirmation } from "@/hooks/use-confirmation.ts";
|
||||
@@ -44,39 +29,14 @@ import {
|
||||
createRole,
|
||||
updateRole,
|
||||
deleteRole,
|
||||
getUserList,
|
||||
getUserRoles,
|
||||
assignRoleToUser,
|
||||
removeRoleFromUser,
|
||||
type Role,
|
||||
type UserRole,
|
||||
} from "@/ui/main-axios.ts";
|
||||
import {
|
||||
Command,
|
||||
CommandEmpty,
|
||||
CommandGroup,
|
||||
CommandInput,
|
||||
CommandItem,
|
||||
} from "@/components/ui/command.tsx";
|
||||
import {
|
||||
Popover,
|
||||
PopoverContent,
|
||||
PopoverTrigger,
|
||||
} from "@/components/ui/popover.tsx";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
interface User {
|
||||
id: string;
|
||||
username: string;
|
||||
is_admin: boolean;
|
||||
}
|
||||
|
||||
export function RoleManagement(): React.ReactElement {
|
||||
const { t } = useTranslation();
|
||||
const { confirmWithToast } = useConfirmation();
|
||||
|
||||
const [roles, setRoles] = React.useState<Role[]>([]);
|
||||
const [users, setUsers] = React.useState<User[]>([]);
|
||||
const [loading, setLoading] = React.useState(false);
|
||||
|
||||
// Create/Edit Role Dialog
|
||||
@@ -86,18 +46,6 @@ export function RoleManagement(): React.ReactElement {
|
||||
const [roleDisplayName, setRoleDisplayName] = React.useState("");
|
||||
const [roleDescription, setRoleDescription] = React.useState("");
|
||||
|
||||
// Assign Role Dialog
|
||||
const [assignDialogOpen, setAssignDialogOpen] = React.useState(false);
|
||||
const [selectedUserId, setSelectedUserId] = React.useState<string>("");
|
||||
const [selectedRoleId, setSelectedRoleId] = React.useState<number | null>(
|
||||
null,
|
||||
);
|
||||
const [userRoles, setUserRoles] = React.useState<UserRole[]>([]);
|
||||
|
||||
// Combobox states
|
||||
const [userComboOpen, setUserComboOpen] = React.useState(false);
|
||||
const [roleComboOpen, setRoleComboOpen] = React.useState(false);
|
||||
|
||||
// Load roles
|
||||
const loadRoles = React.useCallback(async () => {
|
||||
setLoading(true);
|
||||
@@ -113,27 +61,9 @@ export function RoleManagement(): React.ReactElement {
|
||||
}
|
||||
}, [t]);
|
||||
|
||||
// Load users
|
||||
const loadUsers = React.useCallback(async () => {
|
||||
try {
|
||||
const response = await getUserList();
|
||||
// Map UserInfo to User format
|
||||
const mappedUsers = (response.users || []).map((user) => ({
|
||||
id: user.id,
|
||||
username: user.username,
|
||||
is_admin: user.is_admin,
|
||||
}));
|
||||
setUsers(mappedUsers);
|
||||
} catch (error) {
|
||||
console.error("Failed to load users:", error);
|
||||
setUsers([]);
|
||||
}
|
||||
}, []);
|
||||
|
||||
React.useEffect(() => {
|
||||
loadRoles();
|
||||
loadUsers();
|
||||
}, [loadRoles, loadUsers]);
|
||||
}, [loadRoles]);
|
||||
|
||||
// Create role
|
||||
const handleCreateRole = () => {
|
||||
@@ -212,70 +142,6 @@ export function RoleManagement(): React.ReactElement {
|
||||
}
|
||||
};
|
||||
|
||||
// Open assign dialog
|
||||
const handleOpenAssignDialog = async () => {
|
||||
setSelectedUserId("");
|
||||
setSelectedRoleId(null);
|
||||
setUserRoles([]);
|
||||
setAssignDialogOpen(true);
|
||||
};
|
||||
|
||||
// Load user roles when user is selected
|
||||
const handleUserSelect = async (userId: string) => {
|
||||
setSelectedUserId(userId);
|
||||
setUserRoles([]);
|
||||
|
||||
if (!userId) return;
|
||||
|
||||
try {
|
||||
const response = await getUserRoles(userId);
|
||||
setUserRoles(response.roles || []);
|
||||
} catch (error) {
|
||||
console.error("Failed to load user roles:", error);
|
||||
setUserRoles([]);
|
||||
}
|
||||
};
|
||||
|
||||
// Assign role to user
|
||||
const handleAssignRole = async () => {
|
||||
if (!selectedUserId || !selectedRoleId) {
|
||||
toast.error(t("rbac.selectUserAndRole"));
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await assignRoleToUser(selectedUserId, selectedRoleId);
|
||||
const selectedUser = users.find((u) => u.id === selectedUserId);
|
||||
toast.success(
|
||||
t("rbac.roleAssignedSuccessfully", {
|
||||
username: selectedUser?.username || selectedUserId,
|
||||
}),
|
||||
);
|
||||
setSelectedRoleId(null);
|
||||
handleUserSelect(selectedUserId);
|
||||
} catch (error) {
|
||||
toast.error(t("rbac.failedToAssignRole"));
|
||||
}
|
||||
};
|
||||
|
||||
// Remove role from user
|
||||
const handleRemoveUserRole = async (roleId: number) => {
|
||||
if (!selectedUserId) return;
|
||||
|
||||
try {
|
||||
await removeRoleFromUser(selectedUserId, roleId);
|
||||
const selectedUser = users.find((u) => u.id === selectedUserId);
|
||||
toast.success(
|
||||
t("rbac.roleRemovedSuccessfully", {
|
||||
username: selectedUser?.username || selectedUserId,
|
||||
}),
|
||||
);
|
||||
handleUserSelect(selectedUserId);
|
||||
} catch (error) {
|
||||
toast.error(t("rbac.failedToRemoveRole"));
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{/* Roles Section */}
|
||||
@@ -366,20 +232,6 @@ export function RoleManagement(): React.ReactElement {
|
||||
</Table>
|
||||
</div>
|
||||
|
||||
{/* User-Role Assignment Section */}
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<h3 className="text-lg font-semibold flex items-center gap-2">
|
||||
<Users className="h-5 w-5" />
|
||||
{t("rbac.userRoleAssignment")}
|
||||
</h3>
|
||||
<Button onClick={handleOpenAssignDialog}>
|
||||
<Users className="h-4 w-4 mr-2" />
|
||||
{t("rbac.assignRoles")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Create/Edit Role Dialog */}
|
||||
<Dialog open={roleDialogOpen} onOpenChange={setRoleDialogOpen}>
|
||||
<DialogContent className="sm:max-w-[500px] bg-dark-bg border-2 border-dark-border">
|
||||
@@ -443,208 +295,6 @@ export function RoleManagement(): React.ReactElement {
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
||||
{/* Assign Role Dialog */}
|
||||
<Dialog open={assignDialogOpen} onOpenChange={setAssignDialogOpen}>
|
||||
<DialogContent className="max-w-2xl bg-dark-bg border-2 border-dark-border">
|
||||
<DialogHeader>
|
||||
<DialogTitle>{t("rbac.assignRoles")}</DialogTitle>
|
||||
<DialogDescription>
|
||||
{t("rbac.assignRolesDescription")}
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<div className="space-y-6 py-4">
|
||||
{/* User Selection */}
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="user-select">{t("rbac.selectUser")}</Label>
|
||||
<Popover open={userComboOpen} onOpenChange={setUserComboOpen}>
|
||||
<PopoverTrigger asChild>
|
||||
<Button
|
||||
variant="outline"
|
||||
role="combobox"
|
||||
aria-expanded={userComboOpen}
|
||||
className="w-full justify-between"
|
||||
>
|
||||
{selectedUserId
|
||||
? users.find((u) => u.id === selectedUserId)?.username +
|
||||
(users.find((u) => u.id === selectedUserId)?.is_admin
|
||||
? " (Admin)"
|
||||
: "")
|
||||
: t("rbac.selectUserPlaceholder")}
|
||||
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent
|
||||
className="p-0"
|
||||
style={{ width: "var(--radix-popover-trigger-width)" }}
|
||||
>
|
||||
<Command>
|
||||
<CommandInput placeholder={t("rbac.searchUsers")} />
|
||||
<CommandEmpty>{t("rbac.noUserFound")}</CommandEmpty>
|
||||
<CommandGroup className="max-h-[300px] overflow-y-auto thin-scrollbar">
|
||||
{users.map((user) => (
|
||||
<CommandItem
|
||||
key={user.id}
|
||||
value={`${user.username} ${user.id}`}
|
||||
onSelect={() => {
|
||||
handleUserSelect(user.id);
|
||||
setUserComboOpen(false);
|
||||
}}
|
||||
>
|
||||
<Check
|
||||
className={cn(
|
||||
"mr-2 h-4 w-4",
|
||||
selectedUserId === user.id
|
||||
? "opacity-100"
|
||||
: "opacity-0",
|
||||
)}
|
||||
/>
|
||||
{user.username}
|
||||
{user.is_admin ? " (Admin)" : ""}
|
||||
</CommandItem>
|
||||
))}
|
||||
</CommandGroup>
|
||||
</Command>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
</div>
|
||||
|
||||
{/* Current User Roles */}
|
||||
{selectedUserId && (
|
||||
<div className="space-y-2">
|
||||
<Label>{t("rbac.currentRoles")}</Label>
|
||||
{userRoles.length === 0 ? (
|
||||
<p className="text-sm text-muted-foreground">
|
||||
{t("rbac.noRolesAssigned")}
|
||||
</p>
|
||||
) : (
|
||||
<div className="space-y-2 max-h-[40vh] overflow-y-auto thin-scrollbar pr-2">
|
||||
{userRoles.map((userRole, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className="flex items-center justify-between p-2 border rounded"
|
||||
>
|
||||
<div>
|
||||
<p className="font-medium">
|
||||
{t(userRole.roleDisplayName)}
|
||||
</p>
|
||||
{userRole.roleDisplayName && (
|
||||
<p className="text-xs text-muted-foreground">
|
||||
{userRole.roleName}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
{userRole.isSystem ? (
|
||||
<Badge variant="secondary" className="text-xs">
|
||||
{t("rbac.systemRole")}
|
||||
</Badge>
|
||||
) : (
|
||||
<Button
|
||||
size="sm"
|
||||
variant="ghost"
|
||||
onClick={() =>
|
||||
handleRemoveUserRole(userRole.roleId)
|
||||
}
|
||||
>
|
||||
<Trash2 className="h-4 w-4" />
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Assign New Role */}
|
||||
{selectedUserId && (
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="role-select">{t("rbac.assignNewRole")}</Label>
|
||||
<div className="flex gap-2">
|
||||
<Popover open={roleComboOpen} onOpenChange={setRoleComboOpen}>
|
||||
<PopoverTrigger asChild>
|
||||
<Button
|
||||
variant="outline"
|
||||
role="combobox"
|
||||
aria-expanded={roleComboOpen}
|
||||
className="flex-1 justify-between"
|
||||
>
|
||||
{selectedRoleId !== null
|
||||
? (() => {
|
||||
const role = roles.find(
|
||||
(r) => r.id === selectedRoleId,
|
||||
);
|
||||
return role
|
||||
? `${t(role.displayName)}${role.isSystem ? ` (${t("rbac.systemRole")})` : ""}`
|
||||
: t("rbac.selectRolePlaceholder");
|
||||
})()
|
||||
: t("rbac.selectRolePlaceholder")}
|
||||
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent
|
||||
className="p-0"
|
||||
style={{ width: "var(--radix-popover-trigger-width)" }}
|
||||
>
|
||||
<Command>
|
||||
<CommandInput placeholder={t("rbac.searchRoles")} />
|
||||
<CommandEmpty>{t("rbac.noRoleFound")}</CommandEmpty>
|
||||
<CommandGroup className="max-h-[300px] overflow-y-auto thin-scrollbar">
|
||||
{roles
|
||||
.filter(
|
||||
(role) =>
|
||||
!role.isSystem &&
|
||||
!userRoles.some((ur) => ur.roleId === role.id),
|
||||
)
|
||||
.map((role) => (
|
||||
<CommandItem
|
||||
key={role.id}
|
||||
value={`${role.displayName} ${role.name} ${role.id}`}
|
||||
onSelect={() => {
|
||||
setSelectedRoleId(role.id);
|
||||
setRoleComboOpen(false);
|
||||
}}
|
||||
>
|
||||
<Check
|
||||
className={cn(
|
||||
"mr-2 h-4 w-4",
|
||||
selectedRoleId === role.id
|
||||
? "opacity-100"
|
||||
: "opacity-0",
|
||||
)}
|
||||
/>
|
||||
{t(role.displayName)}
|
||||
{role.isSystem
|
||||
? ` (${t("rbac.systemRole")})`
|
||||
: ""}
|
||||
</CommandItem>
|
||||
))}
|
||||
</CommandGroup>
|
||||
</Command>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
<Button onClick={handleAssignRole} disabled={!selectedRoleId}>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
{t("rbac.assign")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<DialogFooter>
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setAssignDialogOpen(false)}
|
||||
>
|
||||
{t("common.close")}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -36,7 +36,6 @@ export function LoginStatsWidget({ metrics }: LoginStatsWidgetProps) {
|
||||
|
||||
return (
|
||||
<div className="h-full w-full p-4 rounded-lg bg-canvas/50 border border-edge/50 hover:bg-canvas/70 transition-colors duration-200 flex flex-col overflow-hidden">
|
||||
|
||||
<div className="flex items-center gap-2 flex-shrink-0 mb-3">
|
||||
<UserCheck className="h-5 w-5 text-green-400" />
|
||||
<h3 className="font-semibold text-lg text-foreground">
|
||||
@@ -78,15 +77,10 @@ export function LoginStatsWidget({ metrics }: LoginStatsWidgetProps) {
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-1">
|
||||
{recentLogins.slice(0, 5).map((login) => (
|
||||
{recentLogins.slice(0, 5).map((login, idx) => (
|
||||
<div
|
||||
|
||||
key={`${login.user}-${login.time}-${login.ip}`}
|
||||
className="text-xs bg-dark-bg-darker p-2 rounded border border-dark-border/30 flex justify-between items-center"
|
||||
|
||||
key={idx}
|
||||
className="text-xs bg-elevated p-2 rounded border border-edge/30 flex justify-between items-center"
|
||||
|
||||
>
|
||||
<div className="flex items-center gap-2 min-w-0">
|
||||
<span className="text-green-400 font-mono truncate">
|
||||
|
||||
@@ -29,7 +29,6 @@ export function ProcessesWidget({ metrics }: ProcessesWidgetProps) {
|
||||
|
||||
return (
|
||||
<div className="h-full w-full p-4 rounded-lg bg-canvas/50 border border-edge/50 hover:bg-canvas/70 transition-colors duration-200 flex flex-col overflow-hidden">
|
||||
|
||||
<div className="flex items-center gap-2 flex-shrink-0 mb-3">
|
||||
<List className="h-5 w-5 text-yellow-400" />
|
||||
<h3 className="font-semibold text-lg text-foreground">
|
||||
@@ -60,15 +59,10 @@ export function ProcessesWidget({ metrics }: ProcessesWidgetProps) {
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-2">
|
||||
{topProcesses.map((proc) => (
|
||||
{topProcesses.map((proc, index) => (
|
||||
<div
|
||||
|
||||
key={proc.pid}
|
||||
className="p-2.5 rounded-lg bg-dark-bg/30 hover:bg-dark-bg/50 transition-colors border border-dark-border/20"
|
||||
|
||||
key={index}
|
||||
className="p-2.5 rounded-lg bg-canvas/30 hover:bg-canvas/50 transition-colors border border-edge/20"
|
||||
|
||||
>
|
||||
<div className="flex items-center justify-between mb-1.5">
|
||||
<span className="text-xs font-mono text-muted-foreground font-medium">
|
||||
@@ -82,7 +76,9 @@ export function ProcessesWidget({ metrics }: ProcessesWidgetProps) {
|
||||
<div className="text-xs text-foreground font-mono truncate mb-1">
|
||||
{proc.command}
|
||||
</div>
|
||||
<div className="text-xs text-foreground-subtle">User: {proc.user}</div>
|
||||
<div className="text-xs text-foreground-subtle">
|
||||
User: {proc.user}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
@@ -813,9 +813,7 @@ export function SSHToolsSidebar({
|
||||
const targetFolder = targetSnippet.folder || "";
|
||||
|
||||
if (sourceFolder !== targetFolder) {
|
||||
toast.error(
|
||||
t("snippets.reorderSameFolder"),
|
||||
);
|
||||
toast.error(t("snippets.reorderSameFolder"));
|
||||
setDraggedSnippet(null);
|
||||
setDragOverFolder(null);
|
||||
return;
|
||||
@@ -850,14 +848,10 @@ export function SSHToolsSidebar({
|
||||
|
||||
try {
|
||||
await reorderSnippets(updates);
|
||||
toast.success(
|
||||
t("snippets.reorderSuccess"),
|
||||
);
|
||||
toast.success(t("snippets.reorderSuccess"));
|
||||
fetchSnippets();
|
||||
} catch {
|
||||
toast.error(
|
||||
t("snippets.reorderFailed"),
|
||||
);
|
||||
toast.error(t("snippets.reorderFailed"));
|
||||
}
|
||||
|
||||
setDraggedSnippet(null);
|
||||
@@ -895,6 +889,7 @@ export function SSHToolsSidebar({
|
||||
confirmWithToast(
|
||||
t("snippets.deleteFolderConfirm", {
|
||||
name: folderName,
|
||||
}),
|
||||
async () => {
|
||||
try {
|
||||
await deleteSnippetFolder(folderName);
|
||||
@@ -1013,9 +1008,7 @@ export function SSHToolsSidebar({
|
||||
}
|
||||
|
||||
if (splitAssignments.size === 0) {
|
||||
toast.error(
|
||||
t("splitScreen.error.noAssignments"),
|
||||
);
|
||||
toast.error(t("splitScreen.error.noAssignments"));
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -1051,9 +1044,7 @@ export function SSHToolsSidebar({
|
||||
setCurrentTab(orderedTabIds[0]);
|
||||
}
|
||||
|
||||
toast.success(
|
||||
t("splitScreen.success"),
|
||||
);
|
||||
toast.success(t("splitScreen.success"));
|
||||
};
|
||||
|
||||
const handleClearSplit = () => {
|
||||
@@ -1065,9 +1056,7 @@ export function SSHToolsSidebar({
|
||||
setSplitAssignments(new Map());
|
||||
setPreviewKey((prev) => prev + 1);
|
||||
|
||||
toast.success(
|
||||
t("splitScreen.cleared"),
|
||||
);
|
||||
toast.success(t("splitScreen.cleared"));
|
||||
};
|
||||
|
||||
const handleResetToSingle = () => {
|
||||
@@ -1085,13 +1074,9 @@ export function SSHToolsSidebar({
|
||||
try {
|
||||
await deleteCommandFromHistory(activeTerminalHostId, command);
|
||||
setCommandHistory((prev) => prev.filter((c) => c !== command));
|
||||
toast.success(
|
||||
t("commandHistory.deleteSuccess"),
|
||||
);
|
||||
toast.success(t("commandHistory.deleteSuccess"));
|
||||
} catch {
|
||||
toast.error(
|
||||
t("commandHistory.deleteFailed"),
|
||||
);
|
||||
toast.error(t("commandHistory.deleteFailed"));
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -1606,7 +1591,8 @@ export function SSHToolsSidebar({
|
||||
<div className="text-center text-muted-foreground py-8">
|
||||
<Terminal className="h-12 w-12 mb-4 opacity-20 mx-auto" />
|
||||
<p className="mb-2 font-medium">
|
||||
{t("commandHistory.noTerminal")} </p>
|
||||
{t("commandHistory.noTerminal")}{" "}
|
||||
</p>
|
||||
<p className="text-sm">
|
||||
{t("commandHistory.noTerminalHint")}
|
||||
</p>
|
||||
@@ -1615,7 +1601,8 @@ export function SSHToolsSidebar({
|
||||
<div className="text-center text-muted-foreground py-8">
|
||||
<Loader2 className="h-12 w-12 mb-4 opacity-20 mx-auto animate-spin" />
|
||||
<p className="mb-2 font-medium">
|
||||
{t("commandHistory.loading")} </p>
|
||||
{t("commandHistory.loading")}{" "}
|
||||
</p>
|
||||
</div>
|
||||
) : filteredCommands.length === 0 ? (
|
||||
<div className="text-center text-muted-foreground py-8">
|
||||
@@ -1699,11 +1686,14 @@ export function SSHToolsSidebar({
|
||||
{t("splitScreen.none")}
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="2">
|
||||
{t("splitScreen.twoSplit")} </TabsTrigger>
|
||||
{t("splitScreen.twoSplit")}{" "}
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="3">
|
||||
{t("splitScreen.threeSplit")} </TabsTrigger>
|
||||
{t("splitScreen.threeSplit")}{" "}
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="4">
|
||||
{t("splitScreen.fourSplit")} </TabsTrigger>
|
||||
{t("splitScreen.fourSplit")}{" "}
|
||||
</TabsTrigger>
|
||||
</TabsList>
|
||||
</Tabs>
|
||||
|
||||
@@ -1759,7 +1749,7 @@ export function SSHToolsSidebar({
|
||||
{t("splitScreen.layout")}
|
||||
</label>
|
||||
<div
|
||||
className={`grid gap-2 ${
|
||||
className={`grid gap-2 mt-2 ${
|
||||
splitMode === "2"
|
||||
? "grid-cols-2"
|
||||
: splitMode === "3"
|
||||
@@ -1869,8 +1859,8 @@ export function SSHToolsSidebar({
|
||||
className="absolute top-0 h-full cursor-col-resize z-[60]"
|
||||
onMouseDown={handleMouseDown}
|
||||
style={{
|
||||
left: "-8px",
|
||||
width: "18px",
|
||||
left: "-4px",
|
||||
width: "8px",
|
||||
backgroundColor: isResizing
|
||||
? "var(--bg-active)"
|
||||
: "transparent",
|
||||
@@ -1970,9 +1960,7 @@ export function SSHToolsSidebar({
|
||||
}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue
|
||||
placeholder={t("snippets.selectFolder")}
|
||||
/>
|
||||
<SelectValue placeholder={t("snippets.selectFolder")} />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="__no_folder__">
|
||||
@@ -2051,7 +2039,7 @@ export function SSHToolsSidebar({
|
||||
<h2 className="text-xl font-semibold text-foreground">
|
||||
{editingFolder
|
||||
? t("snippets.editFolder")
|
||||
: t("snippets.createFolder")
|
||||
: t("snippets.createFolder")}
|
||||
</h2>
|
||||
<p className="text-sm text-muted-foreground mt-1">
|
||||
{editingFolder
|
||||
@@ -2155,8 +2143,7 @@ export function SSHToolsSidebar({
|
||||
);
|
||||
})()}
|
||||
<span className="font-medium">
|
||||
{folderFormData.name ||
|
||||
t("snippets.folderName")}
|
||||
{folderFormData.name || t("snippets.folderName")}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -2175,7 +2162,7 @@ export function SSHToolsSidebar({
|
||||
<Button onClick={handleFolderSubmit} className="flex-1">
|
||||
{editingFolder
|
||||
? t("snippets.updateFolder")
|
||||
: t("snippets.createFolder")
|
||||
: t("snippets.createFolder")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -120,7 +120,7 @@ export function LeftSidebar({
|
||||
setCurrentTab(sshManagerTab.id);
|
||||
return;
|
||||
}
|
||||
const id = addTab({ type: "ssh_manager", title: t('nav.hostManager') });
|
||||
const id = addTab({ type: "ssh_manager", title: t("nav.hostManager") });
|
||||
setCurrentTab(id);
|
||||
};
|
||||
const adminTab = tabList.find((t) => t.type === "admin");
|
||||
@@ -481,7 +481,7 @@ export function LeftSidebar({
|
||||
<Sidebar variant="floating">
|
||||
<SidebarHeader>
|
||||
<SidebarGroupLabel className="text-lg font-bold text-foreground">
|
||||
{t('common.appName')}
|
||||
{t("common.appName")}
|
||||
<div className="absolute right-5 flex gap-1">
|
||||
<Button
|
||||
variant="outline"
|
||||
@@ -618,8 +618,8 @@ export function LeftSidebar({
|
||||
className="absolute top-0 h-full cursor-col-resize z-[60]"
|
||||
onMouseDown={handleMouseDown}
|
||||
style={{
|
||||
right: "-8px",
|
||||
width: "18px",
|
||||
right: "-4px",
|
||||
width: "8px",
|
||||
backgroundColor: isResizing
|
||||
? "var(--bg-interact)"
|
||||
: "transparent",
|
||||
|
||||
Reference in New Issue
Block a user