blob: e381306e10bd19f0cf0074adfed6b7a217054fcb [file] [log] [blame]
talig8e9c0652017-12-20 14:30:43 +02001/*!
2 * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
3 *
4 * Licensed under the Apache License, Version 2.0 (the "License");
5 * you may not use this file except in compliance with the License.
6 * You may obtain a copy of the License at
7 *
8 * http://www.apache.org/licenses/LICENSE-2.0
9 *
10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
13 * or implied. See the License for the specific language governing
14 * permissions and limitations under the License.
15 */
16
17import React from 'react';
18import i18n from 'nfvo-utils/i18n/i18n.js';
Arielka51eac02019-07-07 12:56:11 +030019import { SVGIcon } from 'onap-ui-react';
talig8e9c0652017-12-20 14:30:43 +020020import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js';
21import Tooltip from 'react-bootstrap/lib/Tooltip.js';
22
23const maxContributors = 6;
24
Einav Weiss Keidar7fdf7332018-03-20 14:45:40 +020025function extraUsersTooltip(extraUsers) {
26 return (
27 <Tooltip className="extra-users-tooltip" id="extra-users-tooltip-id">
28 {extraUsers.map(extraUser => (
29 <div key={extraUser.userId} className="extra-user">
30 {extraUser.fullName}
31 </div>
32 ))}
33 </Tooltip>
34 );
talig8e9c0652017-12-20 14:30:43 +020035}
36
Einav Weiss Keidar7fdf7332018-03-20 14:45:40 +020037const User = ({ user, isCurrentUser, dataTestId }) => (
38 <SVGIcon
39 className={`user-view ${isCurrentUser ? 'current-user' : ''}`}
40 name="user"
41 label={user.fullName}
42 labelPosition="right"
43 color="primary"
44 data-test-id={dataTestId}
45 />
talig8e9c0652017-12-20 14:30:43 +020046);
47
Einav Weiss Keidar7fdf7332018-03-20 14:45:40 +020048const Owner = ({ owner, isCurrentUser }) => (
49 <div className="owner-view">
50 <div className="permissions-view-title">{i18n('Owner')}</div>
51 <User user={owner} isCurrentUser={isCurrentUser} dataTestId="owner" />
52 </div>
talig8e9c0652017-12-20 14:30:43 +020053);
54
Einav Weiss Keidar7fdf7332018-03-20 14:45:40 +020055const Contributors = ({
56 contributors,
57 owner,
58 currentUser,
59 onManagePermissions,
60 isManual
61}) => {
62 let extraUsers = contributors.length - maxContributors;
63 return (
64 <div className="contributors-view">
65 <div className="permissions-view-title">{i18n('Contributors')}</div>
66 {contributors
67 .slice(0, maxContributors)
68 .map(contributor => (
69 <User
70 key={contributor.userId}
71 user={contributor}
72 isCurrentUser={
73 contributor.userId === currentUser.userId
74 }
75 dataTestId="contributor"
76 />
77 ))}
78 {extraUsers > 0 && (
79 <OverlayTrigger
80 placement="bottom"
81 overlay={extraUsersTooltip(
82 contributors.slice(maxContributors)
83 )}>
84 <div className="extra-contributors">{`+${extraUsers}`}</div>
85 </OverlayTrigger>
86 )}
87 {currentUser.userId === owner.userId &&
88 !isManual && (
89 <span
90 className="manage-permissions"
91 onClick={onManagePermissions}
92 data-test-id="versions-page-manage-permissions">
93 {i18n('Manage Permissions')}
94 </span>
95 )}
96 </div>
97 );
talig8e9c0652017-12-20 14:30:43 +020098};
99
Einav Weiss Keidar7fdf7332018-03-20 14:45:40 +0200100const PermissionsView = ({
101 owner,
102 contributors,
103 currentUser = {},
104 onManagePermissions,
105 isManual
106}) => (
107 <div className="versions-page-permissions-view-wrapper">
108 <div className="permissions-view-wrapper-title">
109 {i18n('Permissions')}
110 </div>
111 <div className="permissions-view-content">
112 <div className="permissions-view">
113 <Owner
114 owner={owner}
115 isCurrentUser={owner.userId === currentUser.userId}
116 />
117 <Contributors
118 owner={owner}
119 contributors={contributors}
120 currentUser={currentUser}
121 onManagePermissions={onManagePermissions}
122 isManual={isManual}
123 />
124 </div>
125 </div>
126 </div>
talig8e9c0652017-12-20 14:30:43 +0200127);
128
129export default PermissionsView;