diff --git a/packages/strapi-admin/admin/src/components/PluginCard/index.js b/packages/strapi-admin/admin/src/components/PluginCard/index.js
new file mode 100644
index 0000000000..628201d2c1
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/PluginCard/index.js
@@ -0,0 +1,47 @@
+/**
+*
+* PluginCard
+*
+*/
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import cn from 'classnames';
+import styles from './styles.scss';
+
+function PluginCard({ isAlreadyInstalled, plugin, showSupportUsButton }) {
+ return (
+
+
+
+ {plugin.name}
+
+
+
+
+
{isAlreadyInstalled} {showSupportUsButton}
+
+
+ );
+}
+
+PluginCard.defaultProps = {
+ isAlreadyInstalled: false,
+ plugin: {
+ description: '',
+ id: '',
+ icon: '',
+ name: '',
+ price: 0,
+ ratings: 5,
+ },
+ showSupportUsButton: false,
+};
+
+PluginCard.propTypes = {
+ isAlreadyInstalled: PropTypes.bool,
+ plugin: PropTypes.object,
+ showSupportUsButton: PropTypes.bool,
+};
+
+export default PluginCard;
diff --git a/packages/strapi-admin/admin/src/components/PluginCard/styles.scss b/packages/strapi-admin/admin/src/components/PluginCard/styles.scss
new file mode 100644
index 0000000000..40f7b2a9c2
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/PluginCard/styles.scss
@@ -0,0 +1,27 @@
+.cardDescription {
+
+}
+
+.cardFooter {
+
+}
+
+.cardPrice {
+
+}
+
+.cardScreenshot {
+
+}
+
+.cardTitle {
+
+}
+
+.pluginCard {
+
+}
+
+.wrapper {
+
+}
diff --git a/packages/strapi-admin/admin/src/containers/InstallPluginPage/fakeData.json b/packages/strapi-admin/admin/src/containers/InstallPluginPage/fakeData.json
index d72dd586c9..4b53d9f6c2 100644
--- a/packages/strapi-admin/admin/src/containers/InstallPluginPage/fakeData.json
+++ b/packages/strapi-admin/admin/src/containers/InstallPluginPage/fakeData.json
@@ -5,28 +5,32 @@
"id": "content-manager",
"icon": "plug",
"name": "Content Manager",
- "price": 0
+ "price": 0,
+ "ratings": 3
},
{
"description": "content-type-builder.plugin.description",
"id": "content-type-builder",
"icon": "brush",
"name": "content type builder",
- "price": 0
+ "price": 0,
+ "ratings": 4.4
},
{
"description": "settings-manager.plugin.description",
"id": "settings-manager",
"icon": "wrench",
"name": "settings manager",
- "price": 0
+ "price": 0,
+ "ratings": 2.5
},
{
"description": "users-permissions.plugin.description",
"id": "users-permissions",
"icon": "users",
"name": "Auth & Permissions",
- "price": 0
+ "price": 0,
+ "ratings": 3.6
}
]
}
diff --git a/packages/strapi-admin/admin/src/containers/InstallPluginPage/index.js b/packages/strapi-admin/admin/src/containers/InstallPluginPage/index.js
index f6b217b7b6..0cb662823a 100644
--- a/packages/strapi-admin/admin/src/containers/InstallPluginPage/index.js
+++ b/packages/strapi-admin/admin/src/containers/InstallPluginPage/index.js
@@ -11,9 +11,11 @@ import { Helmet } from 'react-helmet';
import { FormattedMessage } from 'react-intl';
import { bindActionCreators, compose } from 'redux';
import cn from 'classnames';
+import { get, isUndefined, map } from 'lodash';
// Design
import Input from 'components/Input';
+import PluginCard from 'components/PluginCard';
import PluginHeader from 'components/PluginHeader';
import injectSaga from 'utils/injectSaga';
@@ -55,7 +57,7 @@ export class InstallPluginPage extends React.Component { // eslint-disable-line
description={{ id: 'app.components.InstallPluginPage.description' }}
actions={[]}
/>
-
+
+
+ {map(this.props.availablePlugins, (plugin) => (
+
+ ))}
+
);
@@ -78,6 +90,7 @@ InstallPluginPage.contextTypes = {
};
InstallPluginPage.propTypes = {
+ availablePlugins: PropTypes.array.isRequired,
didFetchPlugins: PropTypes.bool.isRequired,
getPlugins: PropTypes.func.isRequired,
onChange: PropTypes.func.isRequired,
diff --git a/packages/strapi-admin/admin/src/containers/InstallPluginPage/reducer.js b/packages/strapi-admin/admin/src/containers/InstallPluginPage/reducer.js
index 4d7b188139..379f6a3a89 100644
--- a/packages/strapi-admin/admin/src/containers/InstallPluginPage/reducer.js
+++ b/packages/strapi-admin/admin/src/containers/InstallPluginPage/reducer.js
@@ -21,7 +21,7 @@ function installPluginPageReducer(state = initialState, action) {
case GET_PLUGINS_SUCCEEDED:
return state
.set('didFetchPlugins', true)
- .set('plugins', List(action.availablePlugins));
+ .set('availablePlugins', List(action.availablePlugins));
case ON_CHANGE:
return state.updateIn(action.keys, () => action.value);
default:
diff --git a/packages/strapi-admin/admin/src/containers/InstallPluginPage/saga.js b/packages/strapi-admin/admin/src/containers/InstallPluginPage/saga.js
index 3120c27c9a..d738102b8a 100644
--- a/packages/strapi-admin/admin/src/containers/InstallPluginPage/saga.js
+++ b/packages/strapi-admin/admin/src/containers/InstallPluginPage/saga.js
@@ -24,6 +24,7 @@ export function* pluginsGet() {
icon: '',
name: 'buy a t-shirt',
price: 30,
+ ratings: 5,
};
yield put(getPluginsSucceeded(availablePlugins.concat([supportUs])));
diff --git a/packages/strapi-admin/admin/src/containers/InstallPluginPage/styles.scss b/packages/strapi-admin/admin/src/containers/InstallPluginPage/styles.scss
index 65508e7681..7ecc188bb0 100644
--- a/packages/strapi-admin/admin/src/containers/InstallPluginPage/styles.scss
+++ b/packages/strapi-admin/admin/src/containers/InstallPluginPage/styles.scss
@@ -2,5 +2,22 @@
padding: 18px 30px !important;
> div:first-child {
max-height: 33px;
+ margin-bottom: 48px;
+ }
+}
+
+.inputContainer {
+ padding-top: 7px;
+ background-color: #fff;
+ > div {
+ > div {
+ margin-bottom: 0!important;
+ }
+ > div:nth-child(3) {
+ display: none;
+ }
+ > label {
+ display: none!important;
+ }
}
}
diff --git a/packages/strapi-plugin-users-permissions/services/UsersPermissions.js b/packages/strapi-plugin-users-permissions/services/UsersPermissions.js
index a7d4aa119b..6005c36f91 100644
--- a/packages/strapi-plugin-users-permissions/services/UsersPermissions.js
+++ b/packages/strapi-plugin-users-permissions/services/UsersPermissions.js
@@ -48,6 +48,7 @@ module.exports = {
},
getActions: () => {
+ console.log(strapi);
const generateActions = (data) => (
Object.keys(data).reduce((acc, key) => {
acc[key] = { enabled: false, policy: '' };