Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit6c9ccca

Browse files
authored
feat: implement CRUD UI for IDP organization sync settings (#15503)
resolvescoder/internal#205The goal is to create a new page located in deployment settings to allowusers to create and update organization IDP sync settings.- [x] Use shadcn button for export policy button- [x] Disable save button if form is not dirty- [x] Disable "Add IdP organization" button if idp org name or coderorgs are empty- [x] Add footnote label below organization sync field input- [x] Add button to Delete rows in mapping table- [x] Create Multi-select combox box component to select coder org tomap to idp org- [x] Storybook tests- [x] Tooltip for assign default org switch- [x] Display success/error toast on form submission<img width="1181" alt="Screenshot 2024-12-02 at 20 33 07"src="https://github.com/user-attachments/assets/86877d3b-82ec-4ed2-b239-bf8497352a9e">
1 parent3b1131c commit6c9ccca

File tree

39 files changed

+4019
-906
lines changed

39 files changed

+4019
-906
lines changed

‎site/components.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,5 +16,6 @@
1616
"ui":"/components/ui",
1717
"lib":"/lib",
1818
"hooks":"/hooks"
19-
}
19+
},
20+
"iconLibrary":"lucide"
2021
}

‎site/package.json

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,12 @@
5050
"@mui/system":"5.16.7",
5151
"@mui/utils":"5.16.6",
5252
"@mui/x-tree-view":"7.18.0",
53+
"@radix-ui/react-dialog":"1.1.2",
54+
"@radix-ui/react-label":"2.1.0",
55+
"@radix-ui/react-slider":"1.2.1",
5356
"@radix-ui/react-slot":"1.1.0",
57+
"@radix-ui/react-switch":"1.1.1",
58+
"@radix-ui/react-visually-hidden":"1.1.0",
5459
"@tanstack/react-query-devtools":"4.35.3",
5560
"@xterm/addon-canvas":"0.7.0",
5661
"@xterm/addon-fit":"0.10.0",
@@ -67,6 +72,7 @@
6772
"chroma-js":"2.4.2",
6873
"class-variance-authority":"0.7.0",
6974
"clsx":"2.1.1",
75+
"cmdk":"1.0.0",
7076
"color-convert":"2.0.1",
7177
"cron-parser":"4.9.0",
7278
"cronstrue":"2.50.0",
@@ -176,7 +182,11 @@
176182
"vite-plugin-checker":"0.8.0",
177183
"vite-plugin-turbosnap":"1.0.3"
178184
},
179-
"browserslist": ["chrome 110","firefox 111","safari 16.0"],
185+
"browserslist": [
186+
"chrome 110",
187+
"firefox 111",
188+
"safari 16.0"
189+
],
180190
"resolutions": {
181191
"optionator":"0.9.3",
182192
"semver":"7.6.2"

‎site/pnpm-lock.yaml

Lines changed: 1773 additions & 831 deletions
Some generated files are not rendered by default. Learn more aboutcustomizing how changed files appear on GitHub.

‎site/src/api/api.ts

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -712,6 +712,24 @@ class ApiMethods {
712712
returnresponse.data;
713713
};
714714

715+
getOrganizationIdpSyncSettings=
716+
async():Promise<TypesGen.OrganizationSyncSettings>=>{
717+
constresponse=awaitthis.axios.get<TypesGen.OrganizationSyncSettings>(
718+
"/api/v2/settings/idpsync/organization",
719+
);
720+
returnresponse.data;
721+
};
722+
723+
patchOrganizationIdpSyncSettings=async(
724+
data:TypesGen.OrganizationSyncSettings,
725+
)=>{
726+
constresponse=awaitthis.axios.patch<TypesGen.Response>(
727+
"/api/v2/settings/idpsync/organization",
728+
data,
729+
);
730+
returnresponse.data;
731+
};
732+
715733
/**
716734
*@param organization Can be the organization's ID or name
717735
*/

‎site/src/api/queries/idpsync.ts

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import{API}from"api/api";
2+
importtype{OrganizationSyncSettings}from"api/typesGenerated";
3+
importtype{QueryClient}from"react-query";
4+
5+
exportconstgetOrganizationIdpSyncSettingsKey=()=>[
6+
"organizationIdpSyncSettings",
7+
];
8+
9+
exportconstpatchOrganizationSyncSettings=(queryClient:QueryClient)=>{
10+
return{
11+
mutationFn:(request:OrganizationSyncSettings)=>
12+
API.patchOrganizationIdpSyncSettings(request),
13+
onSuccess:async()=>
14+
awaitqueryClient.invalidateQueries(getOrganizationIdpSyncSettingsKey()),
15+
};
16+
};
17+
18+
exportconstorganizationIdpSyncSettings=(isIdpSyncEnabled:boolean)=>{
19+
return{
20+
queryKey:getOrganizationIdpSyncSettingsKey(),
21+
queryFn:()=>API.getOrganizationIdpSyncSettings(),
22+
enabled:isIdpSyncEnabled,
23+
};
24+
};
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
importtype{Meta,StoryObj}from"@storybook/react";
2+
import{Badge}from"./Badge";
3+
4+
constmeta:Meta<typeofBadge>={
5+
title:"components/Badge",
6+
component:Badge,
7+
args:{
8+
children:"Badge",
9+
},
10+
};
11+
12+
exportdefaultmeta;
13+
typeStory=StoryObj<typeofBadge>;
14+
15+
exportconstDefault:Story={};

‎site/src/components/Badge/Badge.tsx

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
/**
2+
* Copied from shadc/ui on 11/13/2024
3+
*@see {@link https://ui.shadcn.com/docs/components/badge}
4+
*/
5+
import{typeVariantProps,cva}from"class-variance-authority";
6+
importtype{FC}from"react";
7+
import{cn}from"utils/cn";
8+
9+
exportconstbadgeVariants=cva(
10+
"inline-flex items-center rounded-md border px-2.5 py-1 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
11+
{
12+
variants:{
13+
variant:{
14+
default:
15+
"border-transparent bg-surface-secondary text-content-secondary shadow hover:bg-surface-tertiary",
16+
},
17+
},
18+
defaultVariants:{
19+
variant:"default",
20+
},
21+
},
22+
);
23+
24+
exportinterfaceBadgeProps
25+
extendsReact.HTMLAttributes<HTMLDivElement>,
26+
VariantProps<typeofbadgeVariants>{}
27+
28+
exportconstBadge:FC<BadgeProps>=({ className, variant, ...props})=>{
29+
return(
30+
<divclassName={cn(badgeVariants({ variant}),className)}{...props}/>
31+
);
32+
};
Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
importtype{Meta,StoryObj}from"@storybook/react";
2+
import{Trash}from"lucide-react";
3+
import{Button}from"./Button";
4+
5+
constmeta:Meta<typeofButton>={
6+
title:"components/Button",
7+
component:Button,
8+
args:{
9+
children:(
10+
<>
11+
<Trash/>
12+
Button
13+
</>
14+
),
15+
},
16+
};
17+
18+
exportdefaultmeta;
19+
typeStory=StoryObj<typeofButton>;
20+
21+
exportconstDefault:Story={};
22+
23+
exportconstOutline:Story={
24+
args:{
25+
variant:"outline",
26+
},
27+
};
28+
29+
exportconstSubtle:Story={
30+
args:{
31+
variant:"subtle",
32+
},
33+
};
34+
35+
exportconstWarning:Story={
36+
args:{
37+
variant:"warning",
38+
},
39+
};
40+
41+
exportconstDefaultDisabled:Story={
42+
args:{
43+
disabled:true,
44+
},
45+
};
46+
47+
exportconstOutlineDisabled:Story={
48+
args:{
49+
variant:"outline",
50+
disabled:true,
51+
},
52+
};
53+
54+
exportconstSubtleDisabled:Story={
55+
args:{
56+
variant:"subtle",
57+
disabled:true,
58+
},
59+
};
60+
61+
exportconstIconButtonDefault:Story={
62+
args:{
63+
variant:"default",
64+
children:<Trash/>,
65+
},
66+
};
67+
68+
exportconstIconButtonOutline:Story={
69+
args:{
70+
variant:"outline",
71+
children:<Trash/>,
72+
},
73+
};
74+
75+
exportconstIconButtonSubtle:Story={
76+
args:{
77+
variant:"subtle",
78+
children:<Trash/>,
79+
},
80+
};
Lines changed: 22 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,19 @@
1+
/**
2+
* Copied from shadc/ui on 11/06/2024
3+
*@see {@link https://ui.shadcn.com/docs/components/button}
4+
*/
15
import{Slot}from"@radix-ui/react-slot";
26
import{typeVariantProps,cva}from"class-variance-authority";
3-
import*asReactfrom"react";
4-
7+
import{typeFC,forwardRef}from"react";
58
import{cn}from"utils/cn";
69

7-
constbuttonVariants=cva(
8-
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 font-semibold border-solid",
10+
exportconstbuttonVariants=cva(
11+
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-content-link disabled:pointer-events-none disabled:text-content-disabled [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 font-semibold border-solid cursor-pointer",
912
{
1013
variants:{
1114
variant:{
1215
default:
13-
"bg-surface-invert-primary text-content-invert hover:bg-surface-invert-secondary",
16+
"bg-surface-invert-primary text-content-invert hover:bg-surface-invert-secondary border-none disabled:bg-surface-secondary",
1417
outline:
1518
"border border-border-default text-content-primary bg-transparent hover:bg-surface-secondary",
1619
subtle:
@@ -19,7 +22,7 @@ const buttonVariants = cva(
1922
"border border-border-error text-content-primary bg-surface-error hover:bg-transparent",
2023
},
2124
size:{
22-
default:"h-10 px-3 py-2",
25+
default:"h-9 px-3 py-2",
2326
sm:"h-8 px-2 text-xs",
2427
},
2528
},
@@ -36,18 +39,16 @@ export interface ButtonProps
3639
asChild?:boolean;
3740
}
3841

39-
constButton=React.forwardRef<HTMLButtonElement,ButtonProps>(
40-
({ className, variant, size, asChild=false, ...props},ref)=>{
41-
constComp=asChild ?Slot :"button";
42-
return(
43-
<Comp
44-
className={cn(buttonVariants({ variant, size, className}))}
45-
ref={ref}
46-
{...props}
47-
/>
48-
);
49-
},
50-
);
51-
Button.displayName="Button";
52-
53-
export{Button,buttonVariants};
42+
exportconstButton:FC<ButtonProps>=forwardRef<
43+
HTMLButtonElement,
44+
ButtonProps
45+
>(({ className, variant, size, asChild=false, ...props},ref)=>{
46+
constComp=asChild ?Slot :"button";
47+
return(
48+
<Comp
49+
className={cn(buttonVariants({ variant, size, className}))}
50+
ref={ref}
51+
{...props}
52+
/>
53+
);
54+
});

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp