From 5830ed4a73c8292d9225bca79f23cbb31d401812 Mon Sep 17 00:00:00 2001 From: soupette Date: Thu, 26 Jul 2018 13:10:26 +0200 Subject: [PATCH] Display empty block when no fields in the editPage --- .../admin/src/translations/en.json | 2 + .../admin/src/translations/fr.json | 1 + .../components/EmptyAttributesBlock/index.js | 49 ++++++++++ .../EmptyAttributesBlock}/styles.scss | 4 +- .../admin/src/containers/EditPage/index.js | 91 +++++++++++++------ .../admin/src/translations/en.json | 3 + .../admin/src/translations/fr.json | 3 + .../components/EmptyAttributesView/index.js | 41 --------- .../admin/src/containers/ModelPage/index.js | 4 +- 9 files changed, 125 insertions(+), 73 deletions(-) create mode 100644 packages/strapi-helper-plugin/lib/src/components/EmptyAttributesBlock/index.js rename packages/{strapi-plugin-content-type-builder/admin/src/components/EmptyAttributesView => strapi-helper-plugin/lib/src/components/EmptyAttributesBlock}/styles.scss (80%) delete mode 100644 packages/strapi-plugin-content-type-builder/admin/src/components/EmptyAttributesView/index.js diff --git a/packages/strapi-admin/admin/src/translations/en.json b/packages/strapi-admin/admin/src/translations/en.json index a5e7f718f7..5e5e54c33e 100755 --- a/packages/strapi-admin/admin/src/translations/en.json +++ b/packages/strapi-admin/admin/src/translations/en.json @@ -8,6 +8,8 @@ "app.components.DownloadInfo.download": "Download in progress...", "app.components.DownloadInfo.text": "This could take a minute. Thanks for your patience.", + "app.components.EmptyAttributes.title": "There are no fields yet", + "app.components.HomePage.welcome": "Welcome on board!", "app.components.HomePage.welcome.again": "Welcome ", "app.components.HomePage.cta": "CONFIRM", diff --git a/packages/strapi-admin/admin/src/translations/fr.json b/packages/strapi-admin/admin/src/translations/fr.json index 93cd53f358..3a22276bd5 100755 --- a/packages/strapi-admin/admin/src/translations/fr.json +++ b/packages/strapi-admin/admin/src/translations/fr.json @@ -7,6 +7,7 @@ "app.components.DownloadInfo.download": "Téléchargement en cours...", "app.components.DownloadInfo.text": "Cela peut prendre une minute. Merci de patienter.", + "app.components.EmptyAttributes.title": "Il n'y a pas encore de champ", "app.components.HomePage.welcome": "Bienvenue à bord!", "app.components.HomePage.welcome.again": "Bienvenue ", diff --git a/packages/strapi-helper-plugin/lib/src/components/EmptyAttributesBlock/index.js b/packages/strapi-helper-plugin/lib/src/components/EmptyAttributesBlock/index.js new file mode 100644 index 0000000000..3272310def --- /dev/null +++ b/packages/strapi-helper-plugin/lib/src/components/EmptyAttributesBlock/index.js @@ -0,0 +1,49 @@ +/** +* +* EmptyAttributesBlock +* +*/ + +import React from 'react'; +import PropTypes from 'prop-types'; +import { FormattedMessage } from 'react-intl'; +import Button from 'components/Button'; +import styles from './styles.scss'; + +function EmptyAttributesBlock({ description, label, onClick, title }) { + return ( +
+
+ + {(msg) =>
{msg}
} + + + {(msg) =>
{msg}
} + +
+
+
+
+ ); +} + +EmptyAttributesBlock.defaultProps = { + description: 'app.utils.defaultMessage', + label: 'app.utils.defaultMessage', + onClick: () => {}, + title: 'app.components.EmptyAttributes.title', +}; + +EmptyAttributesBlock.propTypes = { + description: PropTypes.string, + label: PropTypes.string, + onClick: PropTypes.func, + title: PropTypes.string, +}; + +export default EmptyAttributesBlock; \ No newline at end of file diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/EmptyAttributesView/styles.scss b/packages/strapi-helper-plugin/lib/src/components/EmptyAttributesBlock/styles.scss similarity index 80% rename from packages/strapi-plugin-content-type-builder/admin/src/components/EmptyAttributesView/styles.scss rename to packages/strapi-helper-plugin/lib/src/components/EmptyAttributesBlock/styles.scss index f7fd669948..bfcc71f833 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/EmptyAttributesView/styles.scss +++ b/packages/strapi-helper-plugin/lib/src/components/EmptyAttributesBlock/styles.scss @@ -1,8 +1,8 @@ -.emptyAttributesView { /* stylelint-disable */ +.emptyAttributesBlock { /* stylelint-disable */ height: 22.1rem; margin-top: -.1rem; padding-top: 5.8rem; - background-image: url('../../assets/images/background_empty.svg'); + background-image: url('../../assets/images/background-empty-attributes.svg'); background-color: #FFFFFF; background-repeat: repeat; text-align: center; diff --git a/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js b/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js index 65bdf3646d..1521af44b7 100644 --- a/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js +++ b/packages/strapi-plugin-content-manager/admin/src/containers/EditPage/index.js @@ -12,30 +12,25 @@ import { createStructuredSelector } from 'reselect'; import PropTypes from 'prop-types'; import { cloneDeep, findIndex, get, includes, isEmpty, isObject, toNumber, toString, replace } from 'lodash'; import cn from 'classnames'; - // You can find these components in either // ./node_modules/strapi-helper-plugin/lib/src // or strapi/packages/strapi-helper-plugin/lib/src import BackHeader from 'components/BackHeader'; +import EmptyAttributesBlock from 'components/EmptyAttributesBlock'; import LoadingIndicator from 'components/LoadingIndicator'; import PluginHeader from 'components/PluginHeader'; import PopUpWarning from 'components/PopUpWarning'; - // Plugin's components import Edit from 'components/Edit'; import EditRelations from 'components/EditRelations'; - // App selectors import { makeSelectSchema } from 'containers/App/selectors'; - import injectReducer from 'utils/injectReducer'; import injectSaga from 'utils/injectSaga'; import getQueryParameters from 'utils/getQueryParameters'; import { bindLayout } from 'utils/bindLayout'; import inputValidations from 'utils/inputsValidations'; - import { checkFormValidity } from 'utils/formValidations'; - import { changeData, getData, @@ -46,7 +41,6 @@ import { setFormErrors, submit, } from './actions'; - import reducer from './reducer'; import saga from './saga'; import makeSelectEditPage from './selectors'; @@ -239,6 +233,10 @@ export class EditPage extends React.Component { return this.getDisplayedRelations().length > 0; } + hasDisplayedFields = () => { + return get(this.getModel(), ['editDisplay', 'fields'], []).length > 0; + } + isCreating = () => this.props.match.params.id === 'create'; isRelationComponentNull = () => ( @@ -286,6 +284,63 @@ export class EditPage extends React.Component { toggle = () => this.setState(prevState => ({ showWarning: !prevState.showWarning })); + renderEdit = () => { + const { editPage, location: { search } } = this.props; + const source = getQueryParameters(search, 'source'); + const basePath = '/plugins/content-manager/ctm-configurations'; + const pathname = source !== 'content-manager' + ? `${basePath}/plugins/${source}/${this.getModelName()}` + : `${basePath}/${this.getModelName()}`; + + const Wrapper = ({ children }) => ( +
+ {children} +
+ ); + + if (this.showLoaders()) { + return ( + +
+ +
+ + ); + } + + if (!this.hasDisplayedFields()) { + return ( + + this.props.history.push(pathname)} + /> + + ); + } + + return ( + +
+ +
+ + ); + } + render() { const { editPage } = this.props; const { showWarning } = this.state; @@ -312,27 +367,7 @@ export class EditPage extends React.Component { onConfirm={this.handleConfirm} />
-
-
- {this.showLoaders() ? ( - - ) : ( - - )} -
-
+ {this.renderEdit()} {this.hasDisplayedRelations() && (
diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/en.json b/packages/strapi-plugin-content-manager/admin/src/translations/en.json index d45967051d..5ad6f4379e 100755 --- a/packages/strapi-plugin-content-manager/admin/src/translations/en.json +++ b/packages/strapi-plugin-content-manager/admin/src/translations/en.json @@ -37,6 +37,9 @@ "components.DraggableAttr.edit": "Click to edit", + "components.EmptyAttributesBlock.description": "You can change your settings", + "components.EmptyAttributesBlock.button": "Go to settings page", + "components.FiltersPickWrapper.PluginHeader.actions.apply": "Apply", "components.FiltersPickWrapper.PluginHeader.actions.clearAll": "Clear all", "components.FiltersPickWrapper.PluginHeader.description": "Set the conditions to apply to filter the entries", diff --git a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json index d3ba479e8e..94cb7e0368 100755 --- a/packages/strapi-plugin-content-manager/admin/src/translations/fr.json +++ b/packages/strapi-plugin-content-manager/admin/src/translations/fr.json @@ -37,6 +37,9 @@ "components.DraggableAttr.edit": "Clicquez pour modifier", + "components.EmptyAttributesBlock.description": "Vous pouvez modifiez vos paramètres", + "components.EmptyAttributesBlock.button": "Voir la page des configurations", + "components.FiltersPickWrapper.PluginHeader.actions.apply": "Appliquer", "components.FiltersPickWrapper.PluginHeader.actions.clearAll": "Tout supprimer", "components.FiltersPickWrapper.PluginHeader.description": "Définissez les conditions des filtres à appliquer", diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/EmptyAttributesView/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/EmptyAttributesView/index.js deleted file mode 100644 index 1018249101..0000000000 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/EmptyAttributesView/index.js +++ /dev/null @@ -1,41 +0,0 @@ -/** -* -* EmptyAttributesView -* -*/ - -import React from 'react'; -import PropTypes from 'prop-types'; -import { FormattedMessage } from 'react-intl'; -import Button from 'components/Button'; -import styles from './styles.scss'; - -class EmptyAttributesView extends React.Component { // eslint-disable-line react/prefer-stateless-function - render() { - return ( -
-
- - {(title) =>
{title}
} - - - {(description) =>
{description}
} - -
-
-
-
- ); - } -} - -EmptyAttributesView.propTypes = { - onClickAddAttribute: PropTypes.func.isRequired, -}; - -export default EmptyAttributesView; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/ModelPage/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/ModelPage/index.js index 07ea2d1af7..53cbb4c102 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/ModelPage/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/ModelPage/index.js @@ -20,7 +20,7 @@ import { makeSelectContentTypeUpdated } from 'containers/Form/selectors'; import AttributeRow from 'components/AttributeRow'; import ContentHeader from 'components/ContentHeader'; -import EmptyAttributesView from 'components/EmptyAttributesView'; +import EmptyAttributesBlock from 'components/EmptyAttributesBlock'; import Form from 'containers/Form'; import List from 'components/List'; import PluginLeftMenu from 'components/PluginLeftMenu'; @@ -265,7 +265,7 @@ export class ModelPage extends React.Component { // eslint-disable-line react/pr const addButtons = get(storeData.getContentType(), 'name') === this.props.match.params.modelName && size(get(storeData.getContentType(), 'attributes')) > 0 || this.props.modelPage.showButtons; const contentHeaderDescription = this.props.modelPage.model.description || 'content-type-builder.modelPage.contentHeader.emptyDescription.description'; const content = size(this.props.modelPage.model.attributes) === 0 ? - : + :