Edit route for context menu

frontend/app/components/context-menus/wp-context-menu/wp-context-menu.controller.ts

@@ -34,7 +34,7 @@ function wpContextMenuController(
   WorkPackageContextMenuHelper,
   WorkPackageService,
   WorkPackagesTableService,
-  inplaceEditAll,
+  wpEditModeState,
   I18n,
   $window,
   PERMITTED_CONTEXT_MENU_ACTIONS
@@ -100,7 +100,7 @@ function wpContextMenuController(
       workPackageId: selected[0].id
     };
 
-    inplaceEditAll.start();
+    wpEditModeState.start();
     $state.transitionTo('work-packages.show', params);
   }
 

frontend/app/components/routing/ui-router.config.ts

@@ -26,6 +26,7 @@
 // See doc/COPYRIGHT.rdoc for more details.
 // ++
 
+import {WorkPackageEditModeStateService} from "../wp-edit/wp-edit-mode-state.service";
 angular
   .module('openproject')
   .config(($stateProvider, $urlRouterProvider, $urlMatcherFactoryProvider) => {
@@ -103,8 +104,8 @@ angular
           projects: {value: null, squash: true}
         },
 
-        onEnter: ($state, $stateParams, inplaceEditAll) => {
+        onEnter: ($state, $stateParams, wpEditModeState:WorkPackageEditModeStateService) => {
-          inplaceEditAll.start();
+          wpEditModeState.start();
           $state.go('work-packages.list.details.overview', $stateParams);
         }
       })
@@ -140,6 +141,14 @@ angular
           angular.element('body').removeClass('action-show');
         }
       })
+      .state('work-packages.show.edit', {
+        url: '/edit',
+        reloadOnSearch: false,
+        onEnter: ($state, $stateParams, wpEditModeState:WorkPackageEditModeStateService) => {
+          wpEditModeState.start();
+          $state.go('work-packages.show', $stateParams);
+        }
+      })
       .state('work-packages.show.activity', panels.activity)
       .state('work-packages.show.activity.details', panels.activityDetails)
       .state('work-packages.show.relations', panels.relations)

frontend/app/components/wp-edit/wp-edit-mode-state.service.ts

@@ -48,18 +48,18 @@ export class WorkPackageEditModeStateService {
     });
   }
 
-  public start() {
+  public start():boolean {
-    if (!this.active) {
+    if (!this.active && !!this.form) {
       this.form.toggleEditMode(true);
-      this._active = true;
     }
+    return this._active = true;
   }
 
   public cancel() {
-    if (this.active) {
+    if (this.active && !!this.form) {
       this.form.toggleEditMode(false);
-      this._active = false;
     }
+    return this._active = false;
   }
   
   public save() {
@@ -75,6 +75,8 @@ export class WorkPackageEditModeStateService {
   public register(form: WorkPackageEditFormController) {
     this.form = form;
 
+    // Activate form when it registers after the
+    // edit mode has been requested.
     if (this._active) {
       form.toggleEditMode(true);
     }