Skip to content

Commit 30d66cf

Browse files
committed
using org names in urls
1 parent 9a76e76 commit 30d66cf

File tree

29 files changed

+312
-231
lines changed

29 files changed

+312
-231
lines changed
Lines changed: 8 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,19 @@
11
import React from 'react';
2+
23
import Breadcrumb from 'components/Breadcrumbs/Breadcrumb';
34

45
const getLinkData = (userSlug, organizationSlug, organizationName) => ({
5-
urlObject: {
6-
pathname: '/organizations/user',
7-
query: { userSlug, organizationSlug: organizationSlug, organizationName: organizationName },
8-
},
9-
asPath: `/organizations/${organizationSlug}/users/${userSlug}`,
10-
});
6+
urlObject: {
7+
pathname: '/organizations/user',
8+
query: { userSlug, organizationSlug, organizationName },
9+
},
10+
asPath: `/organizations/${organizationName}/users/${userSlug}`,
11+
});
1112

1213
const UserBreadcrumb = ({ userSlug, organizationSlug, organizationName, loading }) => {
1314
const linkData = getLinkData(userSlug, organizationSlug, organizationName);
1415

15-
return (
16-
<Breadcrumb
17-
header="User"
18-
title={userSlug}
19-
loading={loading}
20-
{... linkData}
21-
/>
22-
);
16+
return <Breadcrumb header="User" title={userSlug} loading={loading} {...linkData} />;
2317
};
2418

2519
export default UserBreadcrumb;

src/components/Organizations/GroupMembers/index.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ import { StyledGroupMembers } from './Styles';
3434
export const getLinkData = (userSlug, organizationSlug, organizationName) => ({
3535
urlObject: {
3636
pathname: '/organizations/user',
37-
query: { userSlug, organizationSlug: organizationSlug, organizationName: organizationName },
37+
query: { userSlug, organizationSlug, organizationName },
3838
},
3939
asPath: `/organizations/${organizationSlug}/users/${userSlug}`,
4040
});
@@ -138,7 +138,7 @@ const GroupMembers = ({
138138
width: '30%',
139139
key: 'email',
140140
render: ({ user }) => {
141-
const linkData = getLinkData(user.email, organizationId, organizationName);
141+
const linkData = getLinkData(user.email, organizationName, organizationId);
142142
return (
143143
<div className="email">
144144
<Link href={linkData.urlObject} as={linkData.asPath}>
@@ -160,7 +160,7 @@ const GroupMembers = ({
160160
width: '15%',
161161
key: 'actions',
162162
render: ({ user, role }) => {
163-
const linkData = getLinkData(user.email, organizationId, organizationName);
163+
const linkData = getLinkData(user.email, organizationName, organizationId);
164164
return (
165165
<TableActions>
166166
<Tooltip overlayClassName="orgTooltip" placement="bottom" title="Edit role">
@@ -233,8 +233,8 @@ const GroupMembers = ({
233233
<ProjectGroupLink
234234
className="link"
235235
projectGroupSlug={project.name}
236-
organizationSlug={organizationId}
237-
organizationName={organizationName}
236+
organizationSlug={organizationName}
237+
organizationId={organizationId}
238238
key={id}
239239
>
240240
{name}
@@ -260,8 +260,8 @@ const GroupMembers = ({
260260
<ProjectGroupLink
261261
className="link"
262262
projectGroupSlug={project.name}
263-
organizationSlug={organizationId}
264-
organizationName={organizationName}
263+
organizationSlug={organizationName}
264+
organizationId={organizationId}
265265
key={project.id}
266266
>
267267
<EyeOutlined className="view" />

src/components/Organizations/Groups/index.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -65,8 +65,8 @@ const Groups = ({ groups = [], organizationId, organizationName, ableToAddGroup,
6565
return (
6666
<OrgGroupsLink
6767
groupSlug={i.name}
68-
organizationSlug={organizationId}
69-
organizationName={organizationName}
68+
organizationSlug={organizationName}
69+
organizationId={organizationId}
7070
key={i.id}
7171
>
7272
<span>
@@ -121,8 +121,8 @@ const Groups = ({ groups = [], organizationId, organizationName, ableToAddGroup,
121121
<OrgGroupsLink
122122
className="link"
123123
groupSlug={i.name}
124-
organizationSlug={organizationId}
125-
organizationName={organizationName}
124+
organizationSlug={organizationName}
125+
organizationId={organizationId}
126126
key={i.id}
127127
>
128128
<EditOutlined className="edit" />
Lines changed: 50 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
11
import React from 'react';
22

3-
import { BellOutlined, GlobalOutlined, ReadOutlined, SettingOutlined, GroupOutlined, TeamOutlined } from '@ant-design/icons';
3+
import {
4+
BellOutlined,
5+
GlobalOutlined,
6+
GroupOutlined,
7+
ReadOutlined,
8+
SettingOutlined,
9+
TeamOutlined,
10+
} from '@ant-design/icons';
411
import OrgGroupsLink from 'components/link/Organizations/Groups';
512
import OrgManageLink from 'components/link/Organizations/Manage';
613
import OrgNotificationsLink from 'components/link/Organizations/Notifications';
@@ -10,46 +17,48 @@ import OrgUsersLink from 'components/link/Organizations/Users';
1017

1118
import { StyledNavigation } from './StyledNavTabs';
1219

13-
const OrgNavTabs = ({ activeTab, organization }) => (
14-
<StyledNavigation>
15-
<li className={`overview ${activeTab == 'overview' ? 'active' : ''} linkContainer`}>
16-
<OrganizationLink organizationName={organization.name} organizationSlug={organization.id} className="navLink">
17-
<ReadOutlined className="icon" />
18-
<span className="destination">Organization Overview</span>
19-
</OrganizationLink>
20-
</li>
21-
<li className={`groups ${activeTab == 'groups' ? 'active' : ''} linkContainer`}>
22-
<OrgGroupsLink organizationSlug={organization.id} organizationName={organization.name} className="navLink">
23-
<GroupOutlined className="icon" />
24-
<span className="destination">Groups</span>
25-
</OrgGroupsLink>
26-
</li>
27-
<li className={`users ${activeTab == 'users' ? 'active' : ''} linkContainer`}>
28-
<OrgUsersLink organizationSlug={organization.id} organizationName={organization.name} className="navLink">
29-
<TeamOutlined className="icon" />
30-
<span className="destination">Users</span>
31-
</OrgUsersLink>
32-
</li>
33-
<li className={`projects ${activeTab == 'projects' ? 'active' : ''} linkContainer`}>
34-
<OrgProjectsLink organizationSlug={organization.id} organizationName={organization.name} className="navLink">
35-
<GlobalOutlined className="icon" />
36-
<span className="destination">Projects</span>
37-
</OrgProjectsLink>
38-
</li>
39-
<li className={`notifications ${activeTab == 'notifications' ? 'active' : ''} linkContainer`}>
40-
<OrgNotificationsLink organizationSlug={organization.id} organizationName={organization.name} className="navLink">
41-
<BellOutlined className="icon" />
42-
<span className="destination">Notifications</span>
43-
</OrgNotificationsLink>
44-
</li>
20+
const OrgNavTabs = ({ activeTab, organization }) => {
21+
return (
22+
<StyledNavigation>
23+
<li className={`overview ${activeTab == 'overview' ? 'active' : ''} linkContainer`}>
24+
<OrganizationLink organizationSlug={organization.name} organizationId={organization.id} className="navLink">
25+
<ReadOutlined className="icon" />
26+
<span className="destination">Organization Overview</span>
27+
</OrganizationLink>
28+
</li>
29+
<li className={`groups ${activeTab == 'groups' ? 'active' : ''} linkContainer`}>
30+
<OrgGroupsLink organizationSlug={organization.name} organizationId={organization.id} className="navLink">
31+
<GroupOutlined className="icon" />
32+
<span className="destination">Groups</span>
33+
</OrgGroupsLink>
34+
</li>
35+
<li className={`users ${activeTab == 'users' ? 'active' : ''} linkContainer`}>
36+
<OrgUsersLink organizationSlug={organization.name} organizationId={organization.id} className="navLink">
37+
<TeamOutlined className="icon" />
38+
<span className="destination">Users</span>
39+
</OrgUsersLink>
40+
</li>
41+
<li className={`projects ${activeTab == 'projects' ? 'active' : ''} linkContainer`}>
42+
<OrgProjectsLink organizationSlug={organization.name} organizationId={organization.id} className="navLink">
43+
<GlobalOutlined className="icon" />
44+
<span className="destination">Projects</span>
45+
</OrgProjectsLink>
46+
</li>
47+
<li className={`notifications ${activeTab == 'notifications' ? 'active' : ''} linkContainer`}>
48+
<OrgNotificationsLink organizationSlug={organization.name} organizationId={organization.id} className="navLink">
49+
<BellOutlined className="icon" />
50+
<span className="destination">Notifications</span>
51+
</OrgNotificationsLink>
52+
</li>
4553

46-
<li className={`manage ${activeTab == 'manage' ? 'active' : ''} linkContainer`}>
47-
<OrgManageLink organizationSlug={organization.id} organizationName={organization.name} className="navLink">
48-
<SettingOutlined className="icon" />
49-
<span className="destination">Manage</span>
50-
</OrgManageLink>
51-
</li>
52-
</StyledNavigation>
53-
);
54+
<li className={`manage ${activeTab == 'manage' ? 'active' : ''} linkContainer`}>
55+
<OrgManageLink organizationSlug={organization.name} organizationId={organization.id} className="navLink">
56+
<SettingOutlined className="icon" />
57+
<span className="destination">Manage</span>
58+
</OrgManageLink>
59+
</li>
60+
</StyledNavigation>
61+
);
62+
};
5463

5564
export default OrgNavTabs;

src/components/Organizations/Organization/index.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -60,9 +60,9 @@ const Organization = ({ organization, refetch }) => {
6060
const link = {
6161
urlObject: {
6262
pathname: `/organizations/${pluralName}`,
63-
query: { organizationSlug: organization.id },
63+
query: { organizationSlug: organization.id, organizationName: organization.name },
6464
},
65-
asPath: `/organizations/${organization.id}/${pluralName}`,
65+
asPath: `/organizations/${organization.name}/${pluralName}`,
6666
};
6767

6868
return (
@@ -124,7 +124,7 @@ const Organization = ({ organization, refetch }) => {
124124
<Mutation mutation={UPDATE_ORGANIZATION_FRIENDLY_NAME} onError={e => console.error(e)}>
125125
{(updateOrgFriendlyName, { error, data, called }) => {
126126
if (error) {
127-
return <div className='error'>{error.message}</div>;
127+
return <div className="error">{error.message}</div>;
128128
}
129129
if (data) {
130130
refetch().then(() => {
@@ -274,7 +274,7 @@ const Organization = ({ organization, refetch }) => {
274274
</div>
275275
</div>
276276
))}
277-
<OrgManageLink organizationSlug={organization.id} organizationName={organization.name}>
277+
<OrgManageLink organizationSlug={organization.name} organizationId={organization.id}>
278278
<ManageBtn>
279279
<EyeOutlined className="icon" /> Manage
280280
</ManageBtn>

src/components/Organizations/Organizations/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ const Organizations = ({ organizations = [] }: { organizations: IOrganization[]
5555
</Box>
5656
)}
5757
{filteredOrganizations.map(organization => (
58-
<OrganizationLink organizationSlug={organization.id} organizationName={organization.name} key={organization.id}>
58+
<OrganizationLink organizationSlug={organization.name} organizationId={organization.id} key={organization.id}>
5959
<Box className="box">
6060
<Organization>
6161
<h4>

src/components/Organizations/ProjectGroupMembers/index.js

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ const REMOVE_GROUP_FROM_PROJECT = gql`
2222
/**
2323
* The primary list of members.
2424
*/
25-
const ProjectGroupMembers = ({ groups = [], organizationId, organizationName, projectName, orgGroups, refresh }) => {
25+
const ProjectGroupMembers = ({ groups = [], organizationId, organizationSlug, projectName, orgGroups, refresh }) => {
2626
const [searchInput, setSearchInput] = useState('');
2727

2828
const [showDefaults, setShowDefaults] = useState(false);
@@ -70,11 +70,7 @@ const ProjectGroupMembers = ({ groups = [], organizationId, organizationName, pr
7070
{filteredMembers.map(group => (
7171
<div className="data-row" key={group.id}>
7272
<div className="name">
73-
<OrgGroupsLink
74-
groupSlug={group.name}
75-
organizationSlug={organizationId}
76-
organizationName={organizationName}
77-
>
73+
<OrgGroupsLink groupSlug={group.name} organizationId={organizationId} organizationSlug={organizationSlug}>
7874
{group.name}
7975
</OrgGroupsLink>
8076
</div>
@@ -92,8 +88,8 @@ const ProjectGroupMembers = ({ groups = [], organizationId, organizationName, pr
9288
<>
9389
<OrgGroupsLink
9490
groupSlug={group.name}
95-
organizationSlug={organizationId}
96-
organizationName={organizationName}
91+
organizationSlug={organizationSlug}
92+
organizationId={organizationId}
9793
>
9894
<EyeOutlined />
9995
</OrgGroupsLink>

src/components/Organizations/ProjectNotifications/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const REMOVE_NOTIFICATION_FROM_PROJECT = gql`
2828
/**
2929
* The primary list of members.
3030
*/
31-
const ProjectNotifications = ({ notifications = [], organizationId, projectName, organization, refresh }) => {
31+
const ProjectNotifications = ({ notifications = [], organizationSlug ,organizationId, projectName, organization, refresh }) => {
3232
const [searchInput, setSearchInput] = useState('');
3333

3434
const filteredMembers = notifications.filter(key => {
@@ -72,7 +72,7 @@ const ProjectNotifications = ({ notifications = [], organizationId, projectName,
7272
<TableActions>
7373
<Tooltip overlayClassName="orgTooltip" title="Edit" placement="bottom">
7474
<>
75-
<OrgNotificationsLink organizationSlug={organizationId} className="link">
75+
<OrgNotificationsLink organizationSlug={organizationSlug} className="link">
7676
<EditOutlined className="edit" />
7777
</OrgNotificationsLink>
7878
</>

src/components/Organizations/Projects/index.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,8 @@ const OrgProjects = ({ projects = [], organizationId, organizationName, refresh,
4040
<>
4141
<ProjectGroupLink
4242
projectGroupSlug={project.name}
43-
organizationSlug={organizationId}
44-
organizationName={organizationName}
43+
organizationSlug={organizationName}
44+
organizationId={organizationId}
4545
key={project.id}
4646
>
4747
{project.name}
@@ -80,8 +80,8 @@ const OrgProjects = ({ projects = [], organizationId, organizationName, refresh,
8080
<ProjectGroupLink
8181
className="link"
8282
projectGroupSlug={project.name}
83-
organizationSlug={organizationId}
84-
organizationName={organizationName}
83+
organizationSlug={organizationName}
84+
organizationId={organizationId}
8585
key={project.id}
8686
>
8787
<EditOutlined className="edit" />

src/components/Organizations/User/index.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -53,9 +53,9 @@ type User = {
5353
export const getLinkData = (userSlug: string, organizationSlug: string, organizationName: string) => ({
5454
urlObject: {
5555
pathname: '/organizations/users',
56-
query: { user: userSlug, organizationSlug: organizationSlug, organizationName: organizationName },
56+
query: { user: userSlug, organizationSlug, organizationName },
5757
},
58-
asPath: `/organizations/${organizationSlug}/users/${userSlug}`,
58+
asPath: `/organizations/${organizationName}/users/${userSlug}`,
5959
});
6060

6161
const DELETE_USER_FROM_GROUP = gql`
@@ -111,9 +111,9 @@ const User: FC<UserProps> = ({ user, organizationName, organizationId, refetch }
111111
const groupLinkData = (groupSlug: string, organizationSlug: string, organizationName: string) => ({
112112
urlObject: {
113113
pathname: '/organizations/group',
114-
query: { groupName: groupSlug, organizationSlug: organizationSlug, organizationName: organizationName },
114+
query: { groupName: groupSlug, organizationSlug, organizationName },
115115
},
116-
asPath: `/organizations/${organizationSlug}/groups/${groupSlug}`,
116+
asPath: `/organizations/${organizationName}/groups/${groupSlug}`,
117117
});
118118

119119
const UserColumns = [
@@ -282,7 +282,7 @@ const User: FC<UserProps> = ({ user, organizationName, organizationId, refetch }
282282
>
283283
{(removeUserFromGroup, { called, error, data }) => {
284284
if (error) {
285-
return <div className='error'>{error.message}</div>;
285+
return <div className="error">{error.message}</div>;
286286
}
287287
if (data) {
288288
refetch();

0 commit comments

Comments
 (0)