bridge: put targetValue into statement only on save

This moves the mutation of the statementState to only after successful
persistence (and round trip) to the server, allowing us to attempt a
retry in the future.
Consequently, the originalStatement state became obsolete and could be
removed.
Detection of changed state (by user input) happens by comparison between
targetValue and the contents of statementModule.
applyStringDataValue would not need to be an actual store action (maybe
it is even somewhat confusing) and it can move out when implementing the
different patch strategies.

One downside of state update after successful save only: As actions are
not tracked in vue dev tools[0], this makes for poor visibility of what
is going on - the "mutations" are performed only on a copy of the
statements state before submitting the change, which is not visible in
the otherwise very helpful browser extension.

I'm unsure about the value of the applyStringDataValue integration tests
as they don't integrate a lot.

[0] vuejs/devtools-v6#179

Bug: T238662
Change-Id: Id0a9f656ee06f15fb814e6ecd724b934c50bf6ad

Author: wiese

client/data-bridge/dist/data-bridge.common.js

@@ -13544,18 +13544,6 @@ function (_Mutations) {
     value: function setStatements(payload) {
       external_commonjs_vue2_commonjs2_vue2_amd_vue2_root_vue2_default.a.set(this.state, payload.entityId, clone(payload.statements));
     }
-  }, {
-    key: "setDataValue",
-    value: function setDataValue(payload) {
-      var snak = payload.path.resolveSnakInStatement(this.state);
-      external_commonjs_vue2_commonjs2_vue2_amd_vue2_root_vue2_default.a.set(snak, 'datavalue', payload.value);
-    }
-  }, {
-    key: "setSnakType",
-    value: function setSnakType(payload) {
-      var snak = payload.path.resolveSnakInStatement(this.state);
-      snak.snaktype = payload.value;
-    }
   }]);
 
   return StatementMutations;
@@ -13580,6 +13568,7 @@ var SnakActionErrors;
 
 
 
+
 var actions_StatementActions =
 /*#__PURE__*/
 function (_Actions) {
@@ -13601,12 +13590,13 @@ function (_Actions) {
       return Promise.resolve();
     }
   }, {
-    key: "setStringDataValue",
-    value: function setStringDataValue(payloadDataValue) {
+    key: "applyStringDataValue",
+    value: function applyStringDataValue(payloadDataValue) {
       var _this = this;
 
       return new Promise(function (resolve) {
-        var snak = payloadDataValue.path.resolveSnakInStatement(_this.state);
+        var state = clone(_this.state);
+        var snak = payloadDataValue.path.resolveSnakInStatement(state);
 
         if (snak === null) {
           throw new Error(storeActionErrors_SnakActionErrors.NO_SNAK_FOUND);
@@ -13618,19 +13608,11 @@ function (_Actions) {
 
         if (typeof payloadDataValue.value.value !== 'string') {
           throw new Error(storeActionErrors_SnakActionErrors.WRONG_PAYLOAD_VALUE_TYPE);
-        } // TODO put more validation here
-
-
-        var payloadSnakType = {
-          path: payloadDataValue.path,
-          value: 'value'
-        };
-
-        _this.commit('setSnakType', payloadSnakType);
-
-        _this.commit('setDataValue', payloadDataValue);
+        }
 
-        resolve();
+        snak.snaktype = 'value';
+        snak.datavalue = payloadDataValue.value;
+        resolve(state);
       });
     }
   }]);
@@ -13813,12 +13795,12 @@ function (_Actions) {
     }
   }, {
     key: "entitySave",
-    value: function entitySave() {
+    value: function entitySave(statements) {
       var _this2 = this;
 
       var entityRevision = new EntityRevision_EntityRevision({
         id: this.state.id,
-        statements: this.statementsModule.state[this.state.id]
+        statements: statements
       }, this.state.baseRevision);
       return this.store.$services.get('writingEntityRepository').saveEntity(entityRevision).then(function (entityRevision) {
         return _this2.dispatch('entityWrite', entityRevision);
@@ -13970,7 +13952,7 @@ function (_Actions) {
       var _postEntityLoad = _asyncToGenerator(
       /*#__PURE__*/
       regeneratorRuntime.mark(function _callee2() {
-        var state, path, originalStatement;
+        var state, path;
         return regeneratorRuntime.wrap(function _callee2$(_context2) {
           while (1) {
             switch (_context2.prev = _context2.next) {
@@ -13982,10 +13964,9 @@ function (_Actions) {
 
               case 4:
                 if (this.getters.applicationStatus !== definitions_ApplicationStatus.ERROR) {
-                  originalStatement = state[NS_STATEMENTS][path.entityId][path.propertyId][path.index];
-                  this.commit('setOriginalStatement', originalStatement);
                   this.commit('setTargetValue', // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                  originalStatement.mainsnak.datavalue);
+                  state[NS_STATEMENTS][path.entityId][path.propertyId][path.index] // TODO use getter
+                  .mainsnak.datavalue);
                   this.commit('setApplicationStatus', definitions_ApplicationStatus.READY);
                 }
 
@@ -14083,8 +14064,6 @@ function (_Actions) {
   }, {
     key: "setTargetValue",
     value: function setTargetValue(dataValue) {
-      var _this3 = this;
-
       if (this.state.applicationStatus !== definitions_ApplicationStatus.READY) {
         this.commit('addApplicationErrors', [{
           type: ErrorTypes.APPLICATION_LOGIC_ERROR,
@@ -14096,46 +14075,85 @@ function (_Actions) {
       }
 
       this.commit('setTargetValue', dataValue);
-      var state = this.state;
-      var path = new MainSnakPath_MainSnakPath(state[NS_ENTITY].id, state.targetProperty, 0);
-      return this.statementModule.dispatch('setStringDataValue', {
-        path: path,
-        value: dataValue
-      }).catch(function (error) {
-        _this3.commit('addApplicationErrors', [{
-          type: ErrorTypes.APPLICATION_LOGIC_ERROR,
-          info: error
-        }]);
-
-        throw error;
-      });
+      return Promise.resolve();
     }
   }, {
     key: "saveBridge",
-    value: function saveBridge() {
-      var _this4 = this;
+    value: function () {
+      var _saveBridge = _asyncToGenerator(
+      /*#__PURE__*/
+      regeneratorRuntime.mark(function _callee3() {
+        var _this3 = this;
 
-      if (this.state.applicationStatus !== definitions_ApplicationStatus.READY) {
-        this.commit('addApplicationErrors', [{
-          type: ErrorTypes.APPLICATION_LOGIC_ERROR,
-          info: {
-            stack: new Error().stack
+        var state, entityId, path, statements;
+        return regeneratorRuntime.wrap(function _callee3$(_context3) {
+          while (1) {
+            switch (_context3.prev = _context3.next) {
+              case 0:
+                if (!(this.state.applicationStatus !== definitions_ApplicationStatus.READY)) {
+                  _context3.next = 3;
+                  break;
+                }
+
+                this.commit('addApplicationErrors', [{
+                  type: ErrorTypes.APPLICATION_LOGIC_ERROR,
+                  info: {
+                    stack: new Error().stack
+                  }
+                }]);
+                return _context3.abrupt("return", Promise.reject(null));
+
+              case 3:
+                state = this.state;
+                entityId = state[NS_ENTITY].id;
+                path = new MainSnakPath_MainSnakPath(entityId, state.targetProperty, 0);
+                _context3.prev = 6;
+                _context3.next = 9;
+                return this.statementModule.dispatch('applyStringDataValue', {
+                  path: path,
+                  value: state.targetValue
+                });
+
+              case 9:
+                statements = _context3.sent;
+                _context3.next = 16;
+                break;
+
+              case 12:
+                _context3.prev = 12;
+                _context3.t0 = _context3["catch"](6);
+                this.commit('addApplicationErrors', [{
+                  type: ErrorTypes.APPLICATION_LOGIC_ERROR,
+                  info: _context3.t0
+                }]);
+                throw _context3.t0;
+
+              case 16:
+                return _context3.abrupt("return", this.entityModule.dispatch('entitySave', statements[entityId]).catch(function (error) {
+                  _this3.commit('addApplicationErrors', [{
+                    type: ErrorTypes.SAVING_FAILED,
+                    info: error
+                  }]);
+
+                  throw error;
+                }).then(function () {
+                  return _this3.dispatch('postEntityLoad');
+                }));
+
+              case 17:
+              case "end":
+                return _context3.stop();
+            }
           }
-        }]);
-        return Promise.reject(null);
-      }
+        }, _callee3, this, [[6, 12]]);
+      }));
 
-      return this.entityModule.dispatch('entitySave').catch(function (error) {
-        _this4.commit('addApplicationErrors', [{
-          type: ErrorTypes.SAVING_FAILED,
-          info: error
-        }]);
+      function saveBridge() {
+        return _saveBridge.apply(this, arguments);
+      }
 
-        throw error;
-      }).then(function () {
-        return _this4.dispatch('postEntityLoad');
-      });
-    }
+      return saveBridge;
+    }()
   }, {
     key: "addError",
     value: function addError(errors) {
@@ -14209,22 +14227,22 @@ function (_Getters) {
       return statements.references ? statements.references : [];
     }
   }, {
-    key: "isTargetStatementModified",
+    key: "isTargetValueModified",
     get: function get() {
       if (this.state.applicationStatus !== definitions_ApplicationStatus.READY) {
         return false;
       }
 
       var initState = this.state;
       var entityId = initState[NS_ENTITY].id;
-      return !deep_equal_default()(this.state.originalStatement, initState[NS_STATEMENTS][entityId][this.state.targetProperty][0], {
+      return !deep_equal_default()(this.state.targetValue, initState[NS_STATEMENTS][entityId][this.state.targetProperty][0].mainsnak.datavalue, {
         strict: true
       });
     }
   }, {
     key: "canSave",
     get: function get() {
-      return this.state.editDecision !== null && this.getters.isTargetStatementModified;
+      return this.state.editDecision !== null && this.getters.isTargetValueModified;
     }
   }, {
     key: "applicationStatus",
@@ -14316,11 +14334,6 @@ function (_Mutations) {
     value: function setTargetLabel(label) {
       this.state.targetLabel = label;
     }
-  }, {
-    key: "setOriginalStatement",
-    value: function setOriginalStatement(revision) {
-      this.state.originalStatement = clone(revision);
-    }
   }, {
     key: "addApplicationErrors",
     value: function addApplicationErrors(errors) {
@@ -14370,7 +14383,6 @@ var state_BaseState = function BaseState() {
   this.editFlow = '';
   this.entityTitle = '';
   this.originalHref = '';
-  this.originalStatement = null;
   this.pageTitle = '';
   this.targetLabel = null;
   this.targetProperty = '';

client/data-bridge/src/store/Application.ts

@@ -6,7 +6,6 @@ import { ValidApplicationStatus } from '@/definitions/ApplicationStatus';
 import Term from '@/datamodel/Term';
 import { WikibaseRepoConfiguration } from '@/definitions/data-access/WikibaseRepoConfigRepository';
 import DataValue from '@/datamodel/DataValue';
-import Statement from '@/datamodel/Statement';
 import ApplicationError from '@/definitions/ApplicationError';
 import EditDecision from '@/definitions/EditDecision';
 import { StatementState } from '@/store/statements';
@@ -19,7 +18,6 @@ interface Application {
 	editFlow: string;
 	entityTitle: string;
 	originalHref: string;
-	originalStatement: Statement|null;
 	pageTitle: string;
 	targetLabel: Term|null;
 	targetProperty: string;

client/data-bridge/src/store/actions.ts

@@ -105,16 +105,11 @@ RootActions
 
 		await this.dispatch( 'validateEntityState', path );
 		if ( this.getters.applicationStatus !== ApplicationStatus.ERROR ) {
-			const originalStatement = state[ NS_STATEMENTS ][ path.entityId ][ path.propertyId ][ path.index ];
-
-			this.commit(
-				'setOriginalStatement',
-				originalStatement,
-			);
 			this.commit(
 				'setTargetValue',
 				// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-				originalStatement.mainsnak.datavalue!,
+				state[ NS_STATEMENTS ][ path.entityId ][ path.propertyId ][ path.index ] // TODO use getter
+					.mainsnak.datavalue!,
 			);
 
 			this.commit(
@@ -201,36 +196,41 @@ RootActions
 
 		this.commit( 'setTargetValue', dataValue );
 
+		return Promise.resolve();
+	}
+
+	public async saveBridge(): Promise<void> {
+		if ( this.state.applicationStatus !== ApplicationStatus.READY ) {
+			this.commit( 'addApplicationErrors', [ {
+				type: ErrorTypes.APPLICATION_LOGIC_ERROR,
+				info: { stack: ( new Error() ).stack },
+			} ] );
+			return Promise.reject( null );
+		}
+
 		const state = this.state as InitializedApplicationState;
+		const entityId = state[ NS_ENTITY ].id;
 		const path = new MainSnakPath(
-			state[ NS_ENTITY ].id,
+			entityId,
 			state.targetProperty,
 			0,
 		);
 
-		return this.statementModule.dispatch( 'setStringDataValue',
-			{
+		let statements;
+		try {
+			statements = await this.statementModule.dispatch( 'applyStringDataValue', {
 				path,
-				value: dataValue,
-			} ).catch( ( error: Error ) => {
+				value: state.targetValue!, // eslint-disable-line @typescript-eslint/no-non-null-assertion
+			} );
+		} catch ( error ) {
 			this.commit( 'addApplicationErrors', [ {
 				type: ErrorTypes.APPLICATION_LOGIC_ERROR,
 				info: error,
 			} ] );
 			throw error;
-		} );
-	}
-
-	public saveBridge(): Promise<void> {
-		if ( this.state.applicationStatus !== ApplicationStatus.READY ) {
-			this.commit( 'addApplicationErrors', [ {
-				type: ErrorTypes.APPLICATION_LOGIC_ERROR,
-				info: { stack: ( new Error() ).stack },
-			} ] );
-			return Promise.reject( null );
 		}
 
-		return this.entityModule.dispatch( 'entitySave' )
+		return this.entityModule.dispatch( 'entitySave', statements[ entityId ] )
 			.catch( ( error: Error ) => {
 				this.commit( 'addApplicationErrors', [ { type: ErrorTypes.SAVING_FAILED, info: error } ] );
 				throw error;

client/data-bridge/src/store/entity/actions.ts

@@ -5,6 +5,7 @@ import { EntityState } from '@/store/entity';
 import { Actions, Context, Getters } from 'vuex-smart-module';
 import { EntityMutations } from '@/store/entity/mutations';
 import { statementModule } from '@/store/statements';
+import StatementMap from '@/datamodel/StatementMap';
 
 export class EntityActions extends Actions<EntityState, Getters<EntityState>, EntityMutations, EntityActions> {
 	private store!: Store<Application>;
@@ -23,11 +24,13 @@ export class EntityActions extends Actions<EntityState, Getters<EntityState>, En
 			.then( ( entityRevision: EntityRevision ) => this.dispatch( 'entityWrite', entityRevision ) );
 	}
 
-	public entitySave(): Promise<void> {
+	public entitySave(
+		statements: StatementMap,
+	): Promise<void> {
 		const entityRevision = new EntityRevision(
 			{
 				id: this.state.id,
-				statements: this.statementsModule.state[ this.state.id ],
+				statements,
 			},
 			this.state.baseRevision,
 		);