mirror of
https://github.com/coder/coder.git
synced 2025-07-18 14:17:22 +00:00
fix: fix UI bugs for orgs (#16302)
resolves coder/internal#288 resolves coder/internal#287 Fixes alignment issue on create organizations page when license banner is visible. before <img width="1178" alt="Screenshot 2025-01-27 at 18 36 35" src="https://github.com/user-attachments/assets/b845f1df-adb3-4876-aba5-8fa9d56eb22b" /> after <img width="961" alt="Screenshot 2025-01-27 at 18 47 06" src="https://github.com/user-attachments/assets/4a6374f9-9571-453c-9258-9cc4631afb77" />
This commit is contained in:
@ -86,6 +86,12 @@ const OrganizationsSettingsNavigation: FC<
|
|||||||
return <Loader />;
|
return <Loader />;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Sort organizations to put active organization first
|
||||||
|
const sortedOrganizations = [
|
||||||
|
activeOrganization,
|
||||||
|
...organizations.filter((org) => org.id !== activeOrganization.id),
|
||||||
|
];
|
||||||
|
|
||||||
const [isPopoverOpen, setIsPopoverOpen] = useState(false);
|
const [isPopoverOpen, setIsPopoverOpen] = useState(false);
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|
||||||
@ -117,9 +123,9 @@ const OrganizationsSettingsNavigation: FC<
|
|||||||
<Command loop>
|
<Command loop>
|
||||||
<CommandList>
|
<CommandList>
|
||||||
<CommandGroup className="pb-2">
|
<CommandGroup className="pb-2">
|
||||||
{organizations.length > 1 && (
|
{sortedOrganizations.length > 1 && (
|
||||||
<div className="flex flex-col max-h-[260px] overflow-y-auto">
|
<div className="flex flex-col max-h-[260px] overflow-y-auto">
|
||||||
{organizations.map((organization) => (
|
{sortedOrganizations.map((organization) => (
|
||||||
<CommandItem
|
<CommandItem
|
||||||
key={organization.id}
|
key={organization.id}
|
||||||
value={organization.name}
|
value={organization.name}
|
||||||
|
@ -18,7 +18,7 @@ const CreateOrganizationPage: FC = () => {
|
|||||||
const error = createOrganizationMutation.error;
|
const error = createOrganizationMutation.error;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<main className="py-20 sm:py-7">
|
<main className="py-7">
|
||||||
<CreateOrganizationPageView
|
<CreateOrganizationPageView
|
||||||
error={error}
|
error={error}
|
||||||
isEntitled={feats.multiple_organizations}
|
isEntitled={feats.multiple_organizations}
|
||||||
|
@ -64,7 +64,7 @@ export const CreateOrganizationPageView: FC<
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex flex-row font-medium">
|
<div className="flex flex-row font-medium">
|
||||||
<div className="absolute top-40 left-12">
|
<div className="absolute left-12">
|
||||||
<Link
|
<Link
|
||||||
to="/organizations"
|
to="/organizations"
|
||||||
className="flex flex-row items-center gap-2 no-underline text-content-secondary hover:text-content-primary"
|
className="flex flex-row items-center gap-2 no-underline text-content-secondary hover:text-content-primary"
|
||||||
@ -73,7 +73,7 @@ export const CreateOrganizationPageView: FC<
|
|||||||
Go Back
|
Go Back
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex flex-col gap-4 w-full min-w-72 mx-auto">
|
<div className="flex flex-col gap-4 w-full min-w-96 mx-auto">
|
||||||
<div className="flex flex-col items-center">
|
<div className="flex flex-col items-center">
|
||||||
{Boolean(error) && !isApiValidationError(error) && (
|
{Boolean(error) && !isApiValidationError(error) && (
|
||||||
<div css={{ marginBottom: 32 }}>
|
<div css={{ marginBottom: 32 }}>
|
||||||
|
@ -29,7 +29,10 @@ const OrganizationProvisionersPage: FC = () => {
|
|||||||
<>
|
<>
|
||||||
<Helmet>
|
<Helmet>
|
||||||
<title>
|
<title>
|
||||||
{pageTitle("Members", organization.display_name || organization.name)}
|
{pageTitle(
|
||||||
|
"Provisioners",
|
||||||
|
organization.display_name || organization.name,
|
||||||
|
)}
|
||||||
</title>
|
</title>
|
||||||
</Helmet>
|
</Helmet>
|
||||||
<OrganizationProvisionersPageView
|
<OrganizationProvisionersPageView
|
||||||
|
Reference in New Issue
Block a user