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

Commit824b581

Browse files
committed
Add Storybook for groups page
This ensures it is using the right endpoint for the add member dropdown.
1 parent60e165c commit824b581

File tree

5 files changed

+146
-7
lines changed

5 files changed

+146
-7
lines changed

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

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ export const groups = (organization: string) => {
2121
}satisfiesUseQueryOptions<Group[]>;
2222
};
2323

24-
constgetGroupQueryKey=(organization:string,groupName:string)=>[
24+
exportconstgetGroupQueryKey=(organization:string,groupName:string)=>[
2525
"organization",
2626
organization,
2727
"group",
@@ -77,9 +77,15 @@ export function groupsForUser(organization: string, userId: string) {
7777
}asconstsatisfiesUseQueryOptions<Group[],unknown,readonlyGroup[]>;
7878
}
7979

80+
exportconstgroupPermissionsKey=(groupId:string)=>[
81+
"group",
82+
groupId,
83+
"permissions",
84+
];
85+
8086
exportconstgroupPermissions=(groupId:string)=>{
8187
return{
82-
queryKey:["group",groupId,"permissions"],
88+
queryKey:groupPermissionsKey(groupId),
8389
queryFn:()=>
8490
API.checkAuthorization({
8591
checks:{

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

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,10 +47,16 @@ export const deleteOrganization = (queryClient: QueryClient) => {
4747
};
4848
};
4949

50+
exportconstorganizationMembersKey=(id:string)=>[
51+
"organization",
52+
id,
53+
"members",
54+
];
55+
5056
exportconstorganizationMembers=(id:string)=>{
5157
return{
5258
queryFn:()=>API.getOrganizationMembers(id),
53-
queryKey:["organization",id,"members"],
59+
queryKey:organizationMembersKey(id),
5460
};
5561
};
5662

‎site/src/components/UserAutocomplete/UserAutocomplete.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ export const UserAutocomplete: FC<UserAutocompleteProps> = (props) => {
4141

4242
constusersQuery=useQuery({
4343
...users({
44-
q:filter!==undefined ?prepareQuery(encodeURI(filter)) :"",
44+
q:prepareQuery(encodeURI(filter??"")),
4545
limit:25,
4646
}),
4747
enabled:filter!==undefined,
Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
importtype{Meta,StoryObj}from"@storybook/react";
2+
import{userEvent,within}from"@storybook/test";
3+
import{getGroupQueryKey,groupPermissionsKey}from"api/queries/groups";
4+
import{organizationMembersKey}from"api/queries/organizations";
5+
import{reactRouterParameters}from"storybook-addon-remix-react-router";
6+
import{
7+
MockDefaultOrganization,
8+
MockGroup,
9+
MockOrganizationMember,
10+
MockOrganizationMember2,
11+
}from"testHelpers/entities";
12+
importGroupPagefrom"./GroupPage";
13+
14+
constmeta:Meta<typeofGroupPage>={
15+
title:"pages/OrganizationGroupsPage/GroupPage",
16+
component:GroupPage,
17+
parameters:{
18+
reactRouter:reactRouterParameters({
19+
location:{
20+
pathParams:{
21+
organization:MockDefaultOrganization.name,
22+
groupName:MockGroup.name,
23+
},
24+
},
25+
routing:{path:"/organizations/:organization/groups/:groupName"},
26+
}),
27+
},
28+
};
29+
30+
constgroupQuery=(data:unknown)=>({
31+
key:getGroupQueryKey(MockDefaultOrganization.name,MockGroup.name),
32+
data,
33+
});
34+
35+
constpermissionsQuery=(data:unknown,id?:string)=>({
36+
key:groupPermissionsKey(id??MockGroup.id),
37+
data,
38+
});
39+
40+
constmembersQuery=(data:unknown)=>({
41+
key:organizationMembersKey(MockDefaultOrganization.id),
42+
data,
43+
});
44+
45+
exportdefaultmeta;
46+
typeStory=StoryObj<typeofGroupPage>;
47+
48+
exportconstLoadingGroup:Story={
49+
parameters:{
50+
queries:[groupQuery(null),permissionsQuery({})],
51+
},
52+
};
53+
54+
// Will show a 404 because the query is not mocked.
55+
exportconstGroupError:Story={
56+
parameters:{
57+
queries:[permissionsQuery({})],
58+
},
59+
};
60+
61+
exportconstLoadingPermissions:Story={
62+
parameters:{
63+
queries:[groupQuery(MockGroup),permissionsQuery(null)],
64+
},
65+
};
66+
67+
exportconstNoUpdatePermission:Story={
68+
parameters:{
69+
queries:[
70+
groupQuery(MockGroup),
71+
permissionsQuery({canUpdateGroup:false}),
72+
],
73+
},
74+
};
75+
76+
exportconstEveryoneGroup:Story={
77+
parameters:{
78+
queries:[
79+
groupQuery({
80+
...MockGroup,
81+
// The everyone group has the same ID as the organization.
82+
id:MockDefaultOrganization.id,
83+
}),
84+
permissionsQuery({canUpdateGroup:true},MockDefaultOrganization.id),
85+
],
86+
},
87+
};
88+
89+
// Will show a 404 because the query is not mocked.
90+
exportconstMembersError:Story={
91+
parameters:{
92+
queries:[
93+
groupQuery(MockGroup),
94+
permissionsQuery({canUpdateGroup:true}),
95+
],
96+
},
97+
play:async({ canvasElement})=>{
98+
constcanvas=within(canvasElement);
99+
awaituserEvent.click(canvas.getByRole("button",{name:"Open"}));
100+
},
101+
};
102+
103+
exportconstNoMembers:Story={
104+
parameters:{
105+
queries:[
106+
groupQuery(MockGroup),
107+
permissionsQuery({canUpdateGroup:true}),
108+
membersQuery([]),
109+
],
110+
},
111+
play:async({ canvasElement})=>{
112+
constcanvas=within(canvasElement);
113+
awaituserEvent.click(canvas.getByRole("button",{name:"Open"}));
114+
},
115+
};
116+
117+
exportconstFiltersByMembers:Story={
118+
parameters:{
119+
queries:[
120+
groupQuery(MockGroup),
121+
permissionsQuery({canUpdateGroup:true}),
122+
membersQuery([MockOrganizationMember,MockOrganizationMember2]),
123+
],
124+
},
125+
play:async({ canvasElement})=>{
126+
constcanvas=within(canvasElement);
127+
awaituserEvent.click(canvas.getByRole("button",{name:"Open"}));
128+
},
129+
};

‎site/src/pages/ManagementSettingsPage/GroupsPage/GroupPage.tsx

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -62,9 +62,7 @@ export const GroupPage: FC = () => {
6262
constgroupQuery=useQuery(group(organization,groupName));
6363
constgroupData=groupQuery.data;
6464
const{data:permissions}=useQuery(
65-
groupData!==undefined
66-
?groupPermissions(groupData.id)
67-
:{enabled:false},
65+
groupData ?groupPermissions(groupData.id) :{enabled:false},
6866
);
6967
constaddMemberMutation=useMutation(addMember(queryClient));
7068
constremoveMemberMutation=useMutation(removeMember(queryClient));

0 commit comments

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