awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-05 21:26:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: increase select width in org access control page and added overflow bounding for select

Browse Source
This commit is contained in:
=
2024-10-01 00:35:11 +05:30
parent 2bca46886a
commit b5065f13c9
5 changed files with 14 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/v2/Select/Select.tsx
+4 -4
View File
@@ -56,7 +56,7 @@ export const Select = forwardRef<HTMLButtonElement, SelectProps>(
isDisabled && "cursor-not-allowed opacity-50" isDisabled && "cursor-not-allowed opacity-50"
)} )}
> >
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2 overflow-hidden text-ellipsis whitespace-nowrap">
{props.icon && <FontAwesomeIcon icon={props.icon} />} {props.icon && <FontAwesomeIcon icon={props.icon} />}
<SelectPrimitive.Value placeholder={placeholder} /> <SelectPrimitive.Value placeholder={placeholder} />
</div> </div>
@@ -72,7 +72,7 @@ export const Select = forwardRef<HTMLButtonElement, SelectProps>(
<SelectPrimitive.Portal> <SelectPrimitive.Portal>
<SelectPrimitive.Content <SelectPrimitive.Content
className={twMerge( className={twMerge(
"relative top-1 z-[100] overflow-hidden rounded-md border border-mineshaft-600 bg-mineshaft-900 font-inter text-bunker-100 shadow-md", "relative top-1 z-[100] max-w-sm overflow-hidden rounded-md border border-mineshaft-600 bg-mineshaft-900 font-inter text-bunker-100 shadow-md",
position === "popper" && "max-h-72", position === "popper" && "max-h-72",
dropdownContainerClassName dropdownContainerClassName
)} )}
@@ -122,8 +122,8 @@ export const SelectItem = forwardRef<HTMLDivElement, SelectItemProps>(
{...props} {...props}
className={twMerge( className={twMerge(
`relative mb-0.5 flex `relative mb-0.5 flex
cursor-pointer select-none items-center rounded-md py-2 pl-10 pr-4 text-sm cursor-pointer select-none items-center overflow-hidden text-ellipsis whitespace-nowrap rounded-md py-2
outline-none transition-all hover:bg-mineshaft-500 data-[highlighted]:bg-mineshaft-700/80`, pl-10 pr-4 text-sm outline-none transition-all hover:bg-mineshaft-500 data-[highlighted]:bg-mineshaft-700/80`,
isSelected && "bg-primary", isSelected && "bg-primary",
isDisabled && isDisabled &&
"cursor-not-allowed text-gray-600 hover:bg-transparent hover:text-mineshaft-600", "cursor-not-allowed text-gray-600 hover:bg-transparent hover:text-mineshaft-600",
frontend/src/views/Org/MembersPage/components/OrgGroupsTab/components/OrgGroupsSection/OrgGroupsTable.tsx
+1 -1
View File
@@ -108,7 +108,7 @@ export const OrgGroupsTable = ({ handlePopUpOpen }: Props) => {
<Select <Select
value={role === "custom" ? (customRole?.slug as string) : role} value={role === "custom" ? (customRole?.slug as string) : role}
isDisabled={!isAllowed} isDisabled={!isAllowed}
className="w-40 bg-mineshaft-600" className="w-48 bg-mineshaft-600"
dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800" dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
onValueChange={(selectedRole) => onValueChange={(selectedRole) =>
handleChangeRole({ handleChangeRole({
frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityTable.tsx
+1 -1
View File
@@ -199,7 +199,7 @@ export const IdentityTable = ({ handlePopUpOpen }: Props) => {
<Select <Select
value={role === "custom" ? (customRole?.slug as string) : role} value={role === "custom" ? (customRole?.slug as string) : role}
isDisabled={!isAllowed} isDisabled={!isAllowed}
className="w-40 bg-mineshaft-600" className="w-48 bg-mineshaft-600"
dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800" dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
onValueChange={(selectedRole) => onValueChange={(selectedRole) =>
handleChangeRole({ handleChangeRole({
frontend/src/views/Org/MembersPage/components/OrgMembersTab/components/OrgMembersSection/OrgMembersTable.tsx
+2 -2
View File
@@ -212,7 +212,7 @@ export const OrgMembersTable = ({ handlePopUpOpen, setCompleteInviteLinks }: Pro
<Select <Select
value={role === "custom" ? findRoleFromId(roleId)?.slug : role} value={role === "custom" ? findRoleFromId(roleId)?.slug : role}
isDisabled={userId === u?.id || !isAllowed} isDisabled={userId === u?.id || !isAllowed}
className="w-40 bg-mineshaft-600" className="w-48 bg-mineshaft-600"
dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800" dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
onValueChange={(selectedRole) => onValueChange={(selectedRole) =>
onRoleChange(orgMembershipId, selectedRole) onRoleChange(orgMembershipId, selectedRole)
@@ -235,7 +235,7 @@ export const OrgMembersTable = ({ handlePopUpOpen, setCompleteInviteLinks }: Pro
serverDetails?.emailConfigured && ( serverDetails?.emailConfigured && (
<Button <Button
isDisabled={!isAllowed} isDisabled={!isAllowed}
className="w-40" className="w-48"
colorSchema="primary" colorSchema="primary"
variant="outline_bg" variant="outline_bg"
onClick={() => onResendInvite(email)} onClick={() => onResendInvite(email)}
frontend/src/views/Org/MembersPage/components/OrgRoleTabSection/OrgRoleTable.tsx
+6 -2
View File
@@ -96,8 +96,12 @@ export const OrgRoleTable = () => {
className="h-10 cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700" className="h-10 cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700"
onClick={() => router.push(`/org/${orgId}/roles/${id}`)} onClick={() => router.push(`/org/${orgId}/roles/${id}`)}
> >
<Td>{name}</Td> <Td className="max-w-md overflow-hidden text-ellipsis whitespace-nowrap">
<Td>{slug}</Td> {name}
</Td>
<Td className="max-w-md overflow-hidden text-ellipsis whitespace-nowrap">
{slug}
</Td>
<Td> <Td>
<DropdownMenu> <DropdownMenu>
<DropdownMenuTrigger asChild className="rounded-lg"> <DropdownMenuTrigger asChild className="rounded-lg">