padding-top: calc(var(--gridSize) / 2) !important;
}
+.little-padded-right {
+ padding-right: calc(var(--gridSize) / 2) !important;
+}
+
+.little-padded-bottom {
+ padding-bottom: calc(var(--gridSize) / 2) !important;
+}
+
+.little-padded-left {
+ padding-left: calc(var(--gridSize) / 2) !important;
+}
+
.big-padded-top {
padding-top: calc(2 * var(--gridSize));
}
render() {
const cells = this.props.permissions.map(permission => (
- <th className="permission-column" key={permission.key}>
+ <th
+ className="permission-column little-padding-left little-padding-right"
+ key={permission.key}>
<div className="permission-column-inner">
<span className="text-middle">{translate('projects_role', permission.key)}</span>
<HelpTooltip className="spacer-left" overlay={this.renderTooltip(permission)} />
return (
<thead>
<tr>
- <th> </th>
+ <th className="little-padding-left little-padding-right"> </th>
{cells}
- <th className="thin nowrap text-right"> </th>
+ <th className="thin nowrap text-right little-padding-left little-padding-right">
+
+ </th>
</tr>
</thead>
);
{permissions}
- <td className="nowrap thin text-right">
+ <td className="nowrap thin text-right text-top little-padding-left little-padding-right">
<ActionsCell
organization={props.organization}
permissionTemplate={props.template}
: '/permission_templates';
return (
- <td>
+ <td className="little-padding-left little-padding-right">
<Link to={{ pathname, query: { id: template.id } }}>
<strong className="js-name">{template.name}</strong>
</Link>
export default function PermissionCell({ permission: p }: Props) {
return (
- <td className="permission-column" data-permission={p.key}>
+ <td className="permission-column little-padding-left little-padding-right">
<div className="permission-column-inner">
<ul>
{p.withProjectCreator && (
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2020 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
+ */
+import { shallow } from 'enzyme';
+import * as React from 'react';
+import ListItem from '../ListItem';
+
+it('render correctly', () => {
+ expect(shallowRender()).toMatchSnapshot();
+});
+
+function shallowRender() {
+ return shallow(
+ <ListItem
+ key="1"
+ organization={undefined}
+ refresh={async () => {}}
+ template={{
+ id: '1',
+ createdAt: '2020-01-01',
+ name: 'test',
+ defaultFor: [],
+ permissions: []
+ }}
+ topQualifiers={[]}
+ />
+ );
+}
--- /dev/null
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`render correctly 1`] = `
+<tr
+ data-id="1"
+ data-name="test"
+>
+ <NameCell
+ template={
+ Object {
+ "createdAt": "2020-01-01",
+ "defaultFor": Array [],
+ "id": "1",
+ "name": "test",
+ "permissions": Array [],
+ }
+ }
+ />
+ <td
+ className="nowrap thin text-right text-top little-padding-left little-padding-right"
+ >
+ <withRouter(ActionsCell)
+ permissionTemplate={
+ Object {
+ "createdAt": "2020-01-01",
+ "defaultFor": Array [],
+ "id": "1",
+ "name": "test",
+ "permissions": Array [],
+ }
+ }
+ refresh={[Function]}
+ topQualifiers={Array []}
+ />
+ </td>
+</tr>
+`;
}
.permissions-table .permission-column-inner {
- display: inline-block;
width: 100px;
}
return (
<tr>
- <td className="thin nowrap">
+ <td className="thin nowrap text-middle">
<Avatar hash={user.avatar} name={user.name} size={36} />
</td>
<UserListItemIdentity identityProvider={identityProvider} user={user} />
- <td>
+ <td className="thin nowrap text-middle">
<UserScmAccounts scmAccounts={user.scmAccounts || []} />
</td>
- <td>
+ <td className="thin nowrap text-middle">
<DateFromNowHourPrecision date={user.lastConnectionDate} />
</td>
{!organizationsEnabled && (
- <td>
+ <td className="thin nowrap text-middle">
<UserGroups groups={user.groups || []} onUpdateUsers={onUpdateUsers} user={user} />
</td>
)}
- <td>
+ <td className="thin nowrap text-middle">
{user.tokensCount}
<ButtonIcon
className="js-user-tokens spacer-left button-small"
<BulletListIcon />
</ButtonIcon>
</td>
- <td className="thin nowrap text-right">
+ <td className="thin nowrap text-right text-middle">
<UserActions
isCurrentUser={this.props.isCurrentUser}
onUpdateUsers={onUpdateUsers}
export default function UserListItemIdentity({ identityProvider, user }: Props) {
return (
- <td>
+ <td className="text-middle">
<div>
<strong className="js-user-name">{user.name}</strong>
<span className="js-user-login note little-spacer-left">{user.login}</span>
exports[`should render correctly 1`] = `
<tr>
<td
- className="thin nowrap"
+ className="thin nowrap text-middle"
>
<Connect(Avatar)
name="One"
}
}
/>
- <td>
+ <td
+ className="thin nowrap text-middle"
+ >
<UserScmAccounts
scmAccounts={Array []}
/>
</td>
- <td>
+ <td
+ className="thin nowrap text-middle"
+ >
<DateFromNowHourPrecision
date="2019-01-18T15:06:33+0100"
/>
</td>
- <td>
+ <td
+ className="thin nowrap text-middle"
+ >
<UserGroups
groups={Array []}
onUpdateUsers={[MockFunction]}
}
/>
</td>
- <td>
+ <td
+ className="thin nowrap text-middle"
+ >
<ButtonIcon
className="js-user-tokens spacer-left button-small"
onClick={[Function]}
</ButtonIcon>
</td>
<td
- className="thin nowrap text-right"
+ className="thin nowrap text-right text-middle"
>
<UserActions
isCurrentUser={false}
exports[`should render correctly without last connection date 1`] = `
<tr>
<td
- className="thin nowrap"
+ className="thin nowrap text-middle"
>
<Connect(Avatar)
name="One"
}
}
/>
- <td>
+ <td
+ className="thin nowrap text-middle"
+ >
<UserScmAccounts
scmAccounts={Array []}
/>
</td>
- <td>
+ <td
+ className="thin nowrap text-middle"
+ >
<DateFromNowHourPrecision
date="2019-01-18T15:06:33+0100"
/>
</td>
- <td>
+ <td
+ className="thin nowrap text-middle"
+ >
<UserGroups
groups={Array []}
onUpdateUsers={[MockFunction]}
}
/>
</td>
- <td>
+ <td
+ className="thin nowrap text-middle"
+ >
<ButtonIcon
className="js-user-tokens spacer-left button-small"
onClick={[Function]}
</ButtonIcon>
</td>
<td
- className="thin nowrap text-right"
+ className="thin nowrap text-right text-middle"
>
<UserActions
isCurrentUser={false}
`;
exports[`#UserListItemIdentity should render correctly 1`] = `
-<td>
+<td
+ className="text-middle"
+>
<div>
<strong
className="js-user-name"