Skip to content

Commit 52f34fd

Browse files
jaaydenhjaaydenh
committed
fix: updates for PR review comments
1 parent 7bec902 commit 52f34fd

File tree

7 files changed

+35
-46
lines changed

7 files changed

+35
-46
lines changed

‎site/src/components/Link/Link.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,12 @@ export const linkVariants = cva(
99
after:hover:content-[''] after:hover:absolute after:hover:left-0 after:hover:w-full after:hover:h-px after:hover:bg-current after:hover:bottom-px
1010
focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-content-link
1111
focus-visible:ring-offset-2 focus-visible:ring-offset-surface-primary focus-visible:rounded-sm
12-
visited:text-content-link pl-0.5`, //pl-[2px] adjusts the underline spacing to align with the icon on the right.
12+
visited:text-content-link pl-0.5`, //pl-0.5 adjusts the underline spacing to align with the icon on the right.
1313
{
1414
variants: {
1515
size: {
1616
lg: "text-sm gap-0.5 [&_svg]:size-icon-sm [&_svg]:p-0.5 leading-6",
17-
sm: "text-xs gap-1 [&_svg]:size-icon-xs [&_svg]:p-px leading-[18px]",
17+
sm: "text-xs gap-1 [&_svg]:size-icon-xs [&_svg]:p-px leading-5",
1818
},
1919
},
2020
defaultVariants: {

‎site/src/components/MultiSelectCombobox/MultiSelectCombobox.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -430,6 +430,12 @@ export const MultiSelectCombobox = forwardRef<
430430
return undefined;
431431
};
432432

433+
useEffect(() => {
434+
if (inputRef.current && inputProps?.id) {
435+
inputRef.current.id = inputProps?.id;
436+
}
437+
}, [inputProps?.id]);
438+
433439
const fixedOptions = selected.filter((s) => s.fixed);
434440

435441
return (

‎site/src/components/Tabs/Tabs.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,9 @@ export const TabLink: FC<TabLinkProps> = ({ value, ...linkProps }) => {
4747
<Link
4848
{...linkProps}
4949
className={cn(
50-
"text-sm text-content-secondary no-underline font-medium py-2 px-3 hover:text-content-primary rounded-md",
50+
`text-sm text-content-secondary no-underline font-medium py-3 px-1 mr-6 hover:text-content-primary rounded-md
51+
focus-visible:ring-offset-1 focus-visible:ring-offset-surface-primary
52+
focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-content-link focus-visible:rounded-sm`,
5153
{
5254
"text-content-primary relative before:absolute before:bg-surface-invert-primary before:left-0 before:w-full before:h-px before:-bottom-px before:content-['']":
5355
isActive,

‎site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/IdpOrgSyncPageView.tsx

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -104,6 +104,7 @@ export const IdpOrgSyncPageView: FC<IdpSyncPageViewProps> = ({
104104
const SYNC_FIELD_ID = "sync-field";
105105
const ORGANIZATION_ASSIGN_DEFAULT_ID = "organization-assign-default";
106106
const IDP_ORGANIZATION_NAME_ID = "idp-organization-name";
107+
const CODER_ORG_ID = "coder-org";
107108

108109
return (
109110
<div className="flex flex-col gap-2">
@@ -183,10 +184,13 @@ export const IdpOrgSyncPageView: FC<IdpSyncPageViewProps> = ({
183184
/>
184185
</div>
185186
<div className="grid items-center gap-1 flex-1">
186-
<Label className="text-sm" htmlFor=":r1d:">
187+
<Label className="text-sm" htmlFor={CODER_ORG_ID}>
187188
Coder organization
188189
</Label>
189190
<MultiSelectCombobox
191+
inputProps={{
192+
id: CODER_ORG_ID,
193+
}}
190194
className="min-w-60 max-w-3xl"
191195
value={coderOrgs}
192196
onChange={setCoderOrgs}
@@ -204,9 +208,8 @@ export const IdpOrgSyncPageView: FC<IdpSyncPageViewProps> = ({
204208
/>
205209
</div>
206210
<div className="grid grid-rows-[28px_auto]">
207-
&nbsp;
211+
<div />
208212
<Button
209-
className="mb-px"
210213
type="submit"
211214
disabled={!idpOrgName || coderOrgs.length === 0}
212215
onClick={async () => {
@@ -233,7 +236,7 @@ export const IdpOrgSyncPageView: FC<IdpSyncPageViewProps> = ({
233236
<IdpMappingTable isEmpty={organizationMappingCount === 0}>
234237
{form.values.mapping &&
235238
Object.entries(form.values.mapping)
236-
.sort()
239+
.sort(([a], [b]) => a.toLowerCase().localeCompare(b.toLowerCase()))
237240
.map(([idpOrg, organizations]) => (
238241
<OrganizationRow
239242
key={idpOrg}

‎site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,7 @@ export const IdpGroupSyncForm = ({
9696
const REGEX_FILTER_ID = "regex-filter";
9797
const AUTO_CREATE_MISSING_GROUPS_ID = "auto-create-missing-groups";
9898
const IDP_GROUP_NAME_ID = "idp-group-name";
99+
const CODER_GROUP_ID = "coder-group";
99100

100101
return (
101102
<form onSubmit={form.handleSubmit}>
@@ -116,7 +117,7 @@ export const IdpGroupSyncForm = ({
116117
<Label className="text-sm" htmlFor={SYNC_FIELD_ID}>
117118
Group sync field
118119
</Label>
119-
<Label className="text-sm" htmlFor={SYNC_FIELD_ID}>
120+
<Label className="text-sm" htmlFor={REGEX_FILTER_ID}>
120121
Regex filter
121122
</Label>
122123
<Input
@@ -188,10 +189,13 @@ export const IdpGroupSyncForm = ({
188189
/>
189190
</div>
190191
<div className="grid items-center gap-1 flex-1">
191-
<Label className="text-sm" htmlFor=":r1d:">
192+
<Label className="text-sm" htmlFor={CODER_GROUP_ID}>
192193
Coder group
193194
</Label>
194195
<MultiSelectCombobox
196+
inputProps={{
197+
id: CODER_GROUP_ID,
198+
}}
195199
className="min-w-60 max-w-3xl"
196200
value={coderGroups}
197201
onChange={setCoderGroups}
@@ -209,9 +213,8 @@ export const IdpGroupSyncForm = ({
209213
/>
210214
</div>
211215
<div className="grid grid-rows-[28px_auto]">
212-
&nbsp;
216+
<div />
213217
<Button
214-
className="mb-px"
215218
type="submit"
216219
disabled={!idpGroupName || coderGroups.length === 0}
217220
onClick={async () => {
@@ -240,7 +243,7 @@ export const IdpGroupSyncForm = ({
240243
<IdpMappingTable type="Group" rowCount={groupMappingCount}>
241244
{groupSyncSettings?.mapping &&
242245
Object.entries(groupSyncSettings.mapping)
243-
.sort()
246+
.sort(([a], [b]) => a.toLowerCase().localeCompare(b.toLowerCase()))
244247
.map(([idpGroup, groups]) => (
245248
<GroupRow
246249
key={idpGroup}
@@ -256,10 +259,10 @@ export const IdpGroupSyncForm = ({
256259
<LegacyGroupSyncHeader />
257260
<IdpMappingTable type="Group" rowCount={legacyGroupMappingCount}>
258261
{Object.entries(groupSyncSettings.legacy_group_name_mapping)
259-
.sort()
262+
.sort(([a], [b]) => a.toLowerCase().localeCompare(b.toLowerCase()))
260263
.map(([idpGroup, groupId]) => (
261264
<GroupRow
262-
key={idpGroup}
265+
key={groupId}
263266
idpGroup={idpGroup}
264267
coderGroup={getGroupNames([groupId])}
265268
onDelete={handleDelete}

‎site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpMappingTable.tsx

Lines changed: 0 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import Skeleton from "@mui/material/Skeleton";
21
import Table from "@mui/material/Table";
32
import TableBody from "@mui/material/TableBody";
43
import TableCell from "@mui/material/TableCell";
@@ -8,10 +7,6 @@ import TableRow from "@mui/material/TableRow";
87
import { ChooseOne, Cond } from "components/Conditionals/ChooseOne";
98
import { EmptyState } from "components/EmptyState/EmptyState";
109
import { Link } from "components/Link/Link";
11-
import {
12-
TableLoaderSkeleton,
13-
TableRowSkeleton,
14-
} from "components/TableLoader/TableLoader";
1510
import type { FC } from "react";
1611
import { docs } from "utils/docs";
1712

@@ -26,8 +21,6 @@ export const IdpMappingTable: FC<IdpMappingTableProps> = ({
2621
rowCount,
2722
children,
2823
}) => {
29-
const isLoading = false;
30-
3124
return (
3225
<div className="flex flex-col w-full gap-2">
3326
<TableContainer>
@@ -43,9 +36,6 @@ export const IdpMappingTable: FC<IdpMappingTableProps> = ({
4336
</TableHead>
4437
<TableBody>
4538
<ChooseOne>
46-
<Cond condition={isLoading}>
47-
<TableLoader />
48-
</Cond>
4939
<Cond condition={rowCount === 0}>
5040
<TableRow>
5141
<TableCell colSpan={999}>
@@ -75,21 +65,3 @@ export const IdpMappingTable: FC<IdpMappingTableProps> = ({
7565
</div>
7666
);
7767
};
78-
79-
const TableLoader = () => {
80-
return (
81-
<TableLoaderSkeleton>
82-
<TableRowSkeleton>
83-
<TableCell>
84-
<Skeleton variant="text" width="25%" />
85-
</TableCell>
86-
<TableCell>
87-
<Skeleton variant="text" width="25%" />
88-
</TableCell>
89-
<TableCell>
90-
<Skeleton variant="text" width="25%" />
91-
</TableCell>
92-
</TableRowSkeleton>
93-
</TableLoaderSkeleton>
94-
);
95-
};

‎site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,7 @@ export const IdpRoleSyncForm = ({
6969

7070
const SYNC_FIELD_ID = "sync-field";
7171
const IDP_ROLE_NAME_ID = "idp-role-name";
72+
const CODER_ROLE_ID = "coder-role";
7273

7374
return (
7475
<form onSubmit={form.handleSubmit}>
@@ -130,10 +131,13 @@ export const IdpRoleSyncForm = ({
130131
/>
131132
</div>
132133
<div className="grid items-center gap-1 flex-1">
133-
<Label className="text-sm" htmlFor=":r1d:">
134+
<Label className="text-sm" htmlFor={CODER_ROLE_ID}>
134135
Coder role
135136
</Label>
136137
<MultiSelectCombobox
138+
inputProps={{
139+
id: CODER_ROLE_ID,
140+
}}
137141
className="min-w-60 max-w-3xl"
138142
value={coderRoles}
139143
onChange={setCoderRoles}
@@ -151,9 +155,8 @@ export const IdpRoleSyncForm = ({
151155
/>
152156
</div>
153157
<div className="grid grid-rows-[28px_auto]">
154-
&nbsp;
158+
<div />
155159
<Button
156-
className="mb-px"
157160
type="submit"
158161
disabled={!idpRoleName || coderRoles.length === 0}
159162
onClick={async () => {
@@ -180,7 +183,7 @@ export const IdpRoleSyncForm = ({
180183
<IdpMappingTable type="Role" rowCount={roleMappingCount}>
181184
{roleSyncSettings?.mapping &&
182185
Object.entries(roleSyncSettings.mapping)
183-
.sort()
186+
.sort(([a], [b]) => a.toLowerCase().localeCompare(b.toLowerCase()))
184187
.map(([idpRole, roles]) => (
185188
<RoleRow
186189
key={idpRole}

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy