synced/infisical
1
0
Fork 0
mirror of https://github.com/Infisical/infisical.git synced 2025-03-28 15:29:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: truncate too long proj or org name

Browse Source
This commit is contained in:
Salman
2024-02-28 14:38:13 +05:30
parent d9828db2ec
commit 449617d271
4 changed files with 18 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/components/navigation/NavHeader.tsx
View File

@ -56,18 +56,20 @@ export default function NavHeader({
return (
<div className="flex flex-row items-center pt-6">
<div className="mr-2 flex h-5 w-5 items-center justify-center rounded-md bg-primary text-sm text-black">
<div className="mr-2 flex h-5 w-5 items-center justify-center rounded-md bg-primary text-sm text-black min-w-[1.25rem]">
{currentOrg?.name?.charAt(0)}
</div>
<Link passHref legacyBehavior href={`/org/${currentOrg?.id}/overview`}>
<a className="pl-0.5 text-sm font-semibold text-primary/80 hover:text-primary">
<a className="truncate pl-0.5 text-sm font-semibold text-primary/80 hover:text-primary">
{currentOrg?.name}
</a>
</Link>
{isProjectRelated && (
<>
<FontAwesomeIcon icon={faAngleRight} className="ml-3 mr-3 text-xs text-gray-400" />
<div className="text-sm font-semibold text-bunker-300">{currentWorkspace?.name}</div>
<div className="truncate text-sm font-semibold text-bunker-300">
{currentWorkspace?.name}
</div>
</>
)}
{isOrganizationRelated && (

17
frontend/src/layouts/AppLayout/AppLayout.tsx
View File

@ -274,13 +274,16 @@ export const AppLayout = ({ children }: LayoutProps) => {
</Link>
)}
<DropdownMenu>
<DropdownMenuTrigger asChild className="data-[state=open]:bg-mineshaft-600">
<DropdownMenuTrigger
asChild
className="max-w-[160px] data-[state=open]:bg-mineshaft-600"
>
<div className="mr-auto flex items-center rounded-md py-1.5 pl-1.5 pr-2 hover:bg-mineshaft-600">
<div className="flex h-5 w-5 items-center justify-center rounded-md bg-primary text-sm">
<div className="flex h-5 w-5 min-w-[20px] items-center justify-center rounded-md bg-primary text-sm">
{currentOrg?.name.charAt(0)}
</div>
<div
className="overflow-hidden text-ellipsis pl-2 text-sm text-mineshaft-100"
className="overflow-hidden truncate text-ellipsis pl-2 text-sm text-mineshaft-100"
style={{ maxWidth: "140px" }}
>
{currentOrg?.name}
@ -324,7 +327,7 @@ export const AppLayout = ({ children }: LayoutProps) => {
)
}
>
<div className="flex w-full items-center justify-between">
<div className="flex w-full max-w-[150px] items-center justify-between truncate">
{org.name}
</div>
</Button>
@ -423,7 +426,7 @@ export const AppLayout = ({ children }: LayoutProps) => {
<Select
defaultValue={currentWorkspace?.id}
value={currentWorkspace?.id}
className="w-full truncate bg-mineshaft-600 py-2.5 font-medium"
className="w-full [&>*:first-child]:truncate bg-mineshaft-600 py-2.5 font-medium"
onValueChange={(value) => {
router.push(`/project/${value}/secrets/overview`);
localStorage.setItem("projectData.id", value);
@ -438,7 +441,9 @@ export const AppLayout = ({ children }: LayoutProps) => {
<SelectItem
key={`ws-layout-list-${id}`}
value={id}
className={`${currentWorkspace?.id === id && "bg-mineshaft-600"}`}
className={`${
currentWorkspace?.id === id && "bg-mineshaft-600"
} truncate`}
>
{name}
</SelectItem>

2
frontend/src/pages/org/[id]/overview/index.tsx
View File

@ -633,7 +633,7 @@ const OrganizationPage = withPermission(
key={workspace.id}
className="min-w-72 flex h-40 flex-col justify-between rounded-md border border-mineshaft-600 bg-mineshaft-800 p-4"
>
<div className="mt-0 text-lg text-mineshaft-100">{workspace.name}</div>
<div className="mt-0 truncate text-lg text-mineshaft-100">{workspace.name}</div>
<div className="mt-0 pb-6 text-sm text-mineshaft-300">
{workspace.environments?.length || 0} environments
</div>

2
frontend/src/views/Settings/OrgSettingsPage/components/OrgDeleteSection/OrgDeleteSection.tsx
View File

@ -55,7 +55,7 @@ export const OrgDeleteSection = () => {
onClick={() => handlePopUpOpen("deleteOrg")}
isDisabled={Boolean(membership && membership.role !== "admin")}
>
{`Delete ${currentOrg?.name}`}
<p className="max-w-[180px] truncate">Delete {currentOrg?.name}</p>
</Button>
<DeleteActionModal
isOpen={popUp.deleteOrg.isOpen}