Handle remove logic when removing the edited relation

packages/strapi-plugin-content-manager/admin/src/components/DraggableAttr/index.js

@@ -10,7 +10,7 @@ import {
   DragSource,
   DropTarget,
 } from 'react-dnd';
-import { flow, upperFirst } from 'lodash';
+import { flow } from 'lodash';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
 
@@ -140,7 +140,7 @@ class DraggableAttr extends React.Component {
             <i className="fa fa-th" aria-hidden="true" />
             <span>{name}</span>
             <ClickOverHint show={isOver && !isDragging} />
-            { !isOver && upperFirst(name) !== label && (
+            { !isOver && name.toLowerCase() !== label.toLowerCase() && (
               <div className={styles.info}>
                 {label}
               </div>

packages/strapi-plugin-content-manager/admin/src/containers/App/actions.js

@@ -18,8 +18,8 @@ import {
   ON_CHANGE_SETTINGS,
   ON_CLICK_ADD_ATTR,
   ON_REMOVE,
-  ON_REMOVE_EDIT_VIEW_ATTR,
   ON_REMOVE_EDIT_VIEW_FIELD_ATTR,
+  ON_REMOVE_EDIT_VIEW_RELATION_ATTR,
   ON_RESET,
   ON_SUBMIT,
   SUBMIT_SUCCEEDED,
@@ -122,17 +122,17 @@ export function onRemove(index, keys) {
   };
 }
 
-export function onRemoveEditViewAttr(index, keys) {
+export function onRemoveEditViewFieldAttr(index, keys) {
   return {
-    type: ON_REMOVE_EDIT_VIEW_ATTR,
+    type: ON_REMOVE_EDIT_VIEW_FIELD_ATTR,
     index,
     keys,
   };
 }
 
-export function onRemoveEditViewFieldAttr(index, keys) {
+export function onRemoveEditViewRelationAttr(index, keys) {
   return {
-    type: ON_REMOVE_EDIT_VIEW_FIELD_ATTR,
+    type: ON_REMOVE_EDIT_VIEW_RELATION_ATTR,
     index,
     keys,
   };

packages/strapi-plugin-content-manager/admin/src/containers/App/constants.js

@@ -16,8 +16,8 @@ export const ON_CHANGE = 'contentManager/App/ON_CHANGE';
 export const ON_CHANGE_SETTINGS = 'contentManager/App/ON_CHANGE_SETTINGS';
 export const ON_CLICK_ADD_ATTR = 'contentManager/App/ON_CLICK_ADD_ATTR';
 export const ON_REMOVE = 'contentManager/App/ON_REMOVE';
-export const ON_REMOVE_EDIT_VIEW_ATTR = 'contentManager/App/ON_REMOVE_EDIT_VIEW_ATTR';
 export const ON_REMOVE_EDIT_VIEW_FIELD_ATTR = 'contentManager/App/ON_REMOVE_EDIT_VIEW_FIELD_ATTR';
+export const ON_REMOVE_EDIT_VIEW_RELATION_ATTR = 'contentManager/App/ON_REMOVE_EDIT_VIEW_RELATION_ATTR';
 export const ON_RESET = 'contentManager/App/ON_RESET';
 export const ON_SUBMIT = 'contentManager/App/ON_SUBMIT';
 export const SUBMIT_SUCCEEDED = 'contentManager/App/SUBMIT_SUCCEEDED';

packages/strapi-plugin-content-manager/admin/src/containers/App/reducer.js

@@ -5,7 +5,7 @@
  */
 
 import { fromJS, List } from 'immutable';
-import { findIndex, get } from 'lodash';
+import { findIndex, get, upperFirst } from 'lodash';
 import Manager from 'utils/Manager';
 import {
   EMPTY_STORE,
@@ -19,7 +19,7 @@ import {
   ON_CHANGE_SETTINGS,
   ON_CLICK_ADD_ATTR,
   ON_REMOVE,
-  ON_REMOVE_EDIT_VIEW_ATTR,
+  ON_REMOVE_EDIT_VIEW_RELATION_ATTR,
   ON_REMOVE_EDIT_VIEW_FIELD_ATTR,
   ON_RESET,
   SUBMIT_SUCCEEDED,
@@ -118,10 +118,6 @@ function appReducer(state = initialState, action) {
             .push(attrToAdd.get('0'));
         }
 
-        return list.delete(action.index);
-      });
-    case ON_REMOVE_EDIT_VIEW_ATTR:
-      return state.updateIn(['modifiedSchema', 'models'].concat(action.keys.split('.')), list => {
         return list.delete(action.index);
       });
     case ON_REMOVE_EDIT_VIEW_FIELD_ATTR:
@@ -184,6 +180,19 @@ function appReducer(state = initialState, action) {
             .insert(rightBoundIndex, `col-md-${attrToRemoveInfos.bootstrapCol}`);
         }
       });
+    case ON_REMOVE_EDIT_VIEW_RELATION_ATTR: {
+      const relationName = state.getIn(['modifiedSchema', 'models', ...action.keys.split('.'), action.index]);
+
+      return state
+        .updateIn(['modifiedSchema', 'models', action.keys.split('.')[0], 'relations', relationName], relation => {
+          return relation
+            .update('description', () => '')
+            .update('label', () => upperFirst(relation.get('alias')));
+        })
+        .updateIn(['modifiedSchema', 'models'].concat(action.keys.split('.')), list => {
+          return list.delete(action.index);
+        });
+    }
     case ON_RESET:
       return state
         .update('modifiedSchema', () => state.get('schema'));

packages/strapi-plugin-content-manager/admin/src/containers/SettingPage/index.js

@@ -23,8 +23,8 @@ import {
   onChangeSettings,
   onClickAddAttr,
   onRemove,
-  onRemoveEditViewAttr,
   onRemoveEditViewFieldAttr,
+  onRemoveEditViewRelationAttr,
   onReset,
   onSubmit,
 } from 'containers/App/actions';
@@ -140,6 +140,12 @@ class SettingPage extends React.PureComponent {
       .join('.');
   }
 
+  getRelationLabel = (attrName) => {
+    const attrLabel = get(this.props.schema, ['models', ...this.getPath().split('.'), 'relations', attrName, 'label'], 'iii');
+    
+    return attrLabel;
+  }
+
   getRelations = () => {
     const relations = get(this.props.schema, 'models.'.concat(this.getPath()).concat('.relations'), {});
     
@@ -258,6 +264,23 @@ class SettingPage extends React.PureComponent {
     this.props.onRemove(index, keys);
   }
 
+  handleRemoveRelation = (index, keys) => {
+    const { settingPage: { relationToEdit } } = this.props;
+    const relationToRemoveName = get(this.props.schema, ['models', ...keys.split('.'), index]);
+    const isRemovingSelectedItem = relationToRemoveName === relationToEdit.alias;
+    const displayedRelations = this.getEditPageDisplayedRelations();
+    const displayedFields = this.getEditPageDisplayedFields();
+
+    this.props.onRemoveEditViewRelationAttr(index, keys);
+
+    if (isRemovingSelectedItem && displayedRelations.length > 1) {
+      const nextIndex = index - 1 > -1 ? index - 1 : index + 1;
+      this.handleClickEditRelation(nextIndex);
+    } else if (displayedFields.length > 0) {
+      this.handleClickEditField(0);
+    } // Else add a field in the other drag and auto select it
+  }
+
   handleReset = (e) => {
     e.preventDefault();
     this.setState({ showWarningCancel: true });
@@ -348,10 +371,10 @@ class SettingPage extends React.PureComponent {
       key={attr}
       keys={`${this.getPath()}.editDisplay.relations`}
       name={attr}
-      label={attr}
+      label={this.getRelationLabel(attr)}
       moveAttr={this.props.moveAttrEditView}
       onClickEdit={this.handleClickEditRelation}
-      onRemove={this.props.onRemoveEditViewAttr}
+      onRemove={this.handleRemoveRelation}
       updateSiblingHoverState={() => {}}
     />
   );
@@ -661,8 +684,8 @@ SettingPage.propTypes = {
   onClickEditListItem: PropTypes.func.isRequired,
   onClickEditRelation: PropTypes.func.isRequired,
   onRemove: PropTypes.func.isRequired,
-  onRemoveEditViewAttr: PropTypes.func.isRequired,
   onRemoveEditViewFieldAttr: PropTypes.func.isRequired,
+  onRemoveEditViewRelationAttr: PropTypes.func.isRequired,
   onReset: PropTypes.func.isRequired,
   onSubmit: PropTypes.func.isRequired,
   schema: PropTypes.object.isRequired,
@@ -682,8 +705,8 @@ const mapDispatchToProps = (dispatch) => (
       onClickEditListItem,
       onClickEditRelation,
       onRemove,
-      onRemoveEditViewAttr,
       onRemoveEditViewFieldAttr,
+      onRemoveEditViewRelationAttr,
       onReset,
       onSubmit,
     },

packages/strapi-plugin-users-permissions/models/User.settings.json

@@ -38,6 +38,10 @@
       "via": "users",
       "plugin": "users-permissions",
       "configurable": false
+    },
+    "products": {
+      "collection": "product",
+      "via": "user"
     }
   }
 }