@opengeoweb/taf 1.3.0 → 2.1.3

package/taf.umd.js

@@ -228,20 +228,20 @@
      * Copyright 2021 - Finnish Meteorological Institute (FMI)
      * */
     var FORMAT_DAYS_HOURS = 'DDHH';
-    var FORMAT_DAYS_HOURS_MINUTS = 'DDHHmm'; // formatters
+    var FORMAT_DAYS_HOURS_MINUTES = 'DDHHmm'; // formatters
 
     var formatValidToString = function formatValidToString(valid) {
       // Ensure end of valid period if midnight is shown as 24 and not 00
       var endHours = moment__default["default"].utc(valid.end).format('kk');
       var endDate = endHours === '24' ? moment__default["default"].utc(valid.end).add(-1, 'day').format('DD') : moment__default["default"].utc(valid.end).format('DD');
-      return valid.end ? moment__default["default"].utc(valid.start).format(FORMAT_DAYS_HOURS) + "/" + endDate + endHours : moment__default["default"].utc(valid.start).format(FORMAT_DAYS_HOURS_MINUTS);
+      return valid.end ? moment__default["default"].utc(valid.start).format(FORMAT_DAYS_HOURS) + "/" + endDate + endHours : moment__default["default"].utc(valid.start).format(FORMAT_DAYS_HOURS_MINUTES);
     };
 
     var getSections = function getSections(value, format) {
       return {
         day: parseInt(value.substring(0, 2), 10),
         hour: parseInt(value.substring(2, 4), 10),
-        min: format === FORMAT_DAYS_HOURS_MINUTS ? parseInt(value.substring(4), 10) : 0
+        min: format === FORMAT_DAYS_HOURS_MINUTES ? parseInt(value.substring(4), 10) : 0
       };
     };
 
@@ -271,7 +271,7 @@
       var tafStartMoment = moment__default["default"].utc(tafStart);
       var tafEndMoment = moment__default["default"].utc(tafEnd);
       var startEnd = trimmedValue.split('/');
-      var format = trimmedValue.indexOf('/') === -1 ? FORMAT_DAYS_HOURS_MINUTS : FORMAT_DAYS_HOURS;
+      var format = trimmedValue.indexOf('/') === -1 ? FORMAT_DAYS_HOURS_MINUTES : FORMAT_DAYS_HOURS;
       var startSections = getSections(startEnd[0], format);
       var start = getValidityTimeStamp('start', startSections, tafStartMoment, tafEndMoment).format('YYYY-MM-DDTHH:mm:ss[Z]'); // If we only have start value - return that otherwise, also get end time
 
@@ -296,7 +296,8 @@
     var invalidValidityPeriodMessage = 'Invalid validity period, validity end time has to be after validity start time';
     var invalidValidityEndTimeMessage = 'Invalid validity end time, change group validity must lie within the TAF validity period';
     var invalidChangeValidInterFieldMessage = 'Invalid validity period, expected DDHH/DDHH for BECMG and TEMPO or DDHHmm for FM';
-    var invalidBECMGDurationValidInterFieldMessage = 'Invalid validity period, for BECMG only validity periods with a duration of 1, 2, 3 or 4 hours are allowed'; // Validations
+    var invalidBECMGDurationValidInterFieldMessage = 'Invalid validity period, for BECMG only validity periods with a duration of 1, 2, 3 or 4 hours are allowed';
+    var invalidChangeGroupOverlapsWithFM = 'The valid time of a change group cannot overlap with the valid time of a following FM group. This change group should end before or at the hour of the start of the FM group'; // Validations
     // Ensure all individual sections are correct (DD HH mm etc)
 
     var validateValidSections = function validateValidSections(sections, isStartEnd) {
@@ -320,7 +321,7 @@
       var tafStartMoment = moment__default["default"].utc(tafStart);
       var tafEndMoment = moment__default["default"].utc(tafEnd);
       var startEnd = value.split('/');
-      var format = value.indexOf('/') === -1 ? FORMAT_DAYS_HOURS_MINUTS : FORMAT_DAYS_HOURS;
+      var format = value.indexOf('/') === -1 ? FORMAT_DAYS_HOURS_MINUTES : FORMAT_DAYS_HOURS;
       var validateMsg = []; // Validate start time
 
       var startSections = getSections(startEnd[0], format); // Validate individual sections for start
@@ -398,7 +399,7 @@
         var tafStartMoment = moment__default["default"].utc(tafStart);
         var tafEndMoment = moment__default["default"].utc(tafEnd);
         var startEnd = trimmedValue.split('/');
-        var format = trimmedValue.indexOf('/') === -1 ? FORMAT_DAYS_HOURS_MINUTS : FORMAT_DAYS_HOURS; // Validate start time
+        var format = trimmedValue.indexOf('/') === -1 ? FORMAT_DAYS_HOURS_MINUTES : FORMAT_DAYS_HOURS; // Validate start time
 
         var startSections = getSections(startEnd[0], format);
         var startTimestamp = getValidityTimeStamp('start', startSections, tafStartMoment, tafEndMoment);
@@ -418,17 +419,17 @@
     var invalidPreviousChangeGroupIsBeforeMessage = 'Valid time should be after previous valid time';
     var invalidPreviousChangeGroupOrderMessage = "When valid times are equal, the change/probability order should be: " + validProbChangeOrder.join(', ');
     var invalidPreviousChangeGroupHasSameValue = "When valid times are equal, probability/change can't have the same value as previous row value";
-    var validatePreviousChangeGroup = function validatePreviousChangeGroup(currentChangeGroup, nextChangeGroup, tafStart, tafEnd) {
+    var validatePreviousChangeGroup = function validatePreviousChangeGroup(currentChangeGroup, previousChangeGroup, tafStart, tafEnd) {
       // extract the needed values from changeGroups
       var valid = currentChangeGroup.valid,
           _a = currentChangeGroup.change,
           change = _a === void 0 ? '' : _a,
           _b = currentChangeGroup.probability,
           probability = _b === void 0 ? '' : _b;
-      var previousValid = nextChangeGroup.valid,
-          _c = nextChangeGroup.change,
+      var previousValid = previousChangeGroup.valid,
+          _c = previousChangeGroup.change,
           previousChange = _c === void 0 ? '' : _c,
-          _d = nextChangeGroup.probability,
+          _d = previousChangeGroup.probability,
           previousProbability = _d === void 0 ? '' : _d; // get the parsed values
 
       var validValue = parseValidToObject(valid, tafStart, tafEnd);
@@ -462,6 +463,27 @@
         }
       }
 
+      return true;
+    }; // validate overlapping validity when one of the following changegroups is FM
+
+    var validateOverlapWithFM = function validateOverlapWithFM(currentChangeGroup, nextChangeGroups, tafStart, tafEnd) {
+      var valid = currentChangeGroup.valid;
+      if (!valid || !nextChangeGroups.length) return true;
+      var validValue = parseValidToObject(valid, tafStart, tafEnd);
+      var currentRowEndTime = moment__default["default"](validValue.end);
+      var firstFMChangeGroup = nextChangeGroups.find(function (nextChangeGroup) {
+        return nextChangeGroup.change.trim() === 'FM';
+      });
+
+      if (firstFMChangeGroup && firstFMChangeGroup.valid) {
+        var FMValidValue = parseValidToObject(firstFMChangeGroup.valid, tafStart, tafEnd);
+        var FMStartTime = moment__default["default"](FMValidValue.start);
+
+        if (currentRowEndTime.isAfter(FMStartTime)) {
+          return invalidChangeGroupOverlapsWithFM;
+        }
+      }
+
       return true;
     };
 
@@ -1395,8 +1417,12 @@
     var invalidWindDirectionStepMessage = 'Invalid wind direction, the direction must be rounded to the nearest step of 10 degrees';
     var invalidWindSpeedMessage = 'Invalid wind speed, expected a speed equal to 2 digits or P99';
     var invalidWindGustsMessage = 'Invalid wind gusts, expected gusts equal to 2 digits or P99';
-    var invalidWindGustSpeedCombinationMessage = 'Invalid wind, wind gusts must at least be 10 knots greater than the wind speed';
-    var invalidGustForWindP99Message = 'Invalid wind speed and gust combination, if wind is P99, gusts can only be empty or P99'; // validations
+    var invalidWindGustSpeedCombinationMessage = 'Invalid wind gusts, gusts must at least be 10 knots greater than the wind speed';
+    var invalidWindGustSpeedBelow15Message = 'Invalid wind gusts, gusts are only allowed for a minimum wind speed of 15 knots';
+    var invalidGustForWindP99Message = 'Invalid wind speed and gust combination, if wind is P99, gusts can only be empty or P99';
+    var invalidWindSpeedForDirectionZeroMessage = 'Invalid wind speed, if direction is 000, speed can only be 00';
+    var invalidWindSpeedForDirectionNonZeroMessage = 'Invalid wind speed, if direction is not 000, speed can not be 00';
+    var invalidWindVRBWindDirectionMessage = 'Invalid wind direction, VRB can only be used in combination with windspeeds smaller than 4 or in combination with gusts and showers'; // validations
 
     var validateDirection = function validateDirection(value) {
       // if not a number
@@ -1444,8 +1470,29 @@
       return value === 'KT' || value === '' || invalidWindMessage;
     };
 
-    var validateWindInterSection = function validateWindInterSection(speed, gust) {
-      if (gust === '' || gust === 'P99') {
+    var validateWindInterSection = function validateWindInterSection(speed, gust, direction, weather1Value, weather2Value, weather3Value) {
+      if (direction === '000' && speed !== '00') {
+        return invalidWindSpeedForDirectionZeroMessage;
+      }
+
+      if (direction !== '000' && speed === '00') {
+        return invalidWindSpeedForDirectionNonZeroMessage;
+      }
+
+      if (direction === 'VRB' && (speed === 'P99' || parseInt(speed, 10) > 3)) {
+        // Only allow VRB for speeds smaller than 4 or in combination with gusts and showers (SH, TS, SQ)
+        var allowedWeatherPhenom = ['SH', 'TS', 'SQ'];
+        if (gust === '' || !allowedWeatherPhenom.some(function (allowedPhenom) {
+          return weather1Value.includes(allowedPhenom);
+        }) && !allowedWeatherPhenom.some(function (allowedPhenom) {
+          return weather2Value.includes(allowedPhenom);
+        }) && !allowedWeatherPhenom.some(function (allowedPhenom) {
+          return weather3Value.includes(allowedPhenom);
+        })) return invalidWindVRBWindDirectionMessage;
+      } // Validate gust
+
+
+      if (gust === '') {
         return true;
       }
 
@@ -1453,24 +1500,35 @@
         return invalidGustForWindP99Message;
       }
 
-      return parseInt(gust, 10) - parseInt(speed, 10) >= 10 || invalidWindGustSpeedCombinationMessage;
+      if (parseInt(speed, 10) < 15) {
+        return invalidWindGustSpeedBelow15Message;
+      }
+
+      if (gust !== 'P99' && parseInt(gust, 10) - parseInt(speed, 10) < 10) {
+        return invalidWindGustSpeedCombinationMessage;
+      }
+
+      return true;
     }; // Main validation function
 
 
-    var validateWindField = function validateWindField(value) {
-      var trimmedValue = value.trim();
+    var validateWindField = function validateWindField(value, weatherfield1, weatherfield2, weatherfield3) {
+      var trimmedWindValue = value.trim();
+      var trimmedWeather1Value = weatherfield1.trim();
+      var trimmedWeather2Value = weatherfield2.trim();
+      var trimmedWeather3Value = weatherfield3.trim();
 
-      if (!trimmedValue.length) {
+      if (!trimmedWindValue.length) {
         return true;
       } // Validate length and ensure it doesn't contain any other characters than numbers and VRB P KT and G
 
 
-      if (trimmedValue.length < 5 || trimmedValue.length > 12 || !trimmedValue.match(/^[0-9VRBPGKT]+$/)) {
+      if (trimmedWindValue.length < 5 || trimmedWindValue.length > 12 || !trimmedWindValue.match(/^[0-9VRBPGKT]+$/)) {
         return invalidWindMessage;
       } // First validate individual sections
 
 
-      var windValidationIndv = extractValidateWindSections(trimmedValue, true);
+      var windValidationIndv = extractValidateWindSections(trimmedWindValue, true);
 
       if (windValidationIndv.validations.length !== 0) {
         return windValidationIndv.validations.find(function (error) {
@@ -1479,7 +1537,7 @@
       } // Then do any intersection validation
 
 
-      return validateWindInterSection(windValidationIndv.speed, windValidationIndv.gust);
+      return validateWindInterSection(windValidationIndv.speed, windValidationIndv.gust, windValidationIndv.direction, trimmedWeather1Value, trimmedWeather2Value, trimmedWeather3Value);
     };
 
     var formatSingleCloud = function formatSingleCloud(value) {
@@ -1528,10 +1586,10 @@
     var parseSingleCloud = function parseSingleCloud(value) {
       if (!value) return null;
       var trimmedCloud = value.trim();
-      var cloudType = trimmedCloud.substr(6, 3);
+      var cloudType = trimmedCloud.substring(6, 9);
       return __assign({
-        coverage: trimmedCloud.substr(0, 3),
-        height: parseInt(trimmedCloud.substr(3, 3), 10)
+        coverage: trimmedCloud.substring(0, 3),
+        height: parseInt(trimmedCloud.substring(3, 6), 10)
       }, cloudType && {
         type: cloudType
       });
@@ -1549,20 +1607,22 @@
           switch (key) {
             case 'cloud1':
               {
-                if (isVerticalVisibility(clouds[key])) {
+                var trimmedValue = clouds[key].trim();
+
+                if (isVerticalVisibility(trimmedValue)) {
                   // Parse Vertical Visibility
                   return __assign(__assign({}, list), (_a = {}, _a[key] = {
-                    verticalVisibility: parseInt(clouds[key].substr(2, 3), 10)
+                    verticalVisibility: parseInt(trimmedValue.substring(2, 5), 10)
                   }, _a));
                 }
 
-                if (clouds[key] === 'NSC') {
+                if (trimmedValue === 'NSC') {
                   // Parse No Significant Clouds
-                  return __assign(__assign({}, list), (_b = {}, _b[key] = clouds[key], _b));
+                  return __assign(__assign({}, list), (_b = {}, _b[key] = trimmedValue, _b));
                 } // Parse Cloud
 
 
-                return __assign(__assign({}, list), (_c = {}, _c[key] = parseSingleCloud(clouds[key]), _c));
+                return __assign(__assign({}, list), (_c = {}, _c[key] = parseSingleCloud(trimmedValue), _c));
               }
 
             default:
@@ -1590,16 +1650,19 @@
     var invalidCloudHeightStepsMessage = 'Invalid cloud height, a height above 050 must be rounded to the nearest 1000ft';
     var invalidCLoudTypeMessage = 'Invalid cloud type, expected CB or TCU';
     var invalidHeightTypeCombinationMessage = 'Invalid cloud input, when cloud height is 050 or higher, CB or TCU is required';
-    var invalidVerticalVisibilityMessage = 'Invalid vertical visibility, expected VV<value> with value consisting of 3 digits between 000 and 010';
+    var invalidVerticalVisibilityMessage = 'Invalid vertical visibility, expected VV<value> with value consisting of 3 digits';
+    var invalidVerticalVisibilityHeightMessage = 'Invalid vertical visibility, visibility should lie between 001 and 010';
+    var invalidVerticalVisibilityHeightFGMessage = 'Invalid vertical visibility, in case of fog visibility should lie between 001 and 005';
     var invalidCloudHeightComparedToPreviousMessage = 'Invalid cloud height, height must be greater than previous cloud group height';
-    var invalidCloud2CoverageTypeCombinationMessage = 'Invalid cloud input, cloud type is required when coverage is FEW';
+    var invalidCloud2CoverageTypeCombinationMessage = 'Invalid cloud input, for the second cloud group (excluding any significant convective cloud groups with CB/TCU) a coverage of FEW is not allowed';
     var invalidCloud2WithVerticalVisibilityMessage = 'Invalid cloud input, cloud type is required when Vertical Visibility is given';
-    var invalidCloud3CoverageTypeCombinationMessage = 'Invalid cloud input, cloud type is required when coverage is FEW or SCT';
+    var invalidCloud3CoverageTypeCombinationMessage = 'Invalid cloud input, for the third cloud group (excluding any significant convective cloud groups with CB/TCU) a coverage of FEW or SCT is not allowed';
     var invalidCloudWithVerticalVisibilityMessage = 'Invalid cloud input, third or fourth cloud group is not allowed when Vertical Visibility is given';
     var invalidCloudWithPreviousEmptyCloud = 'Invalid cloud input, value is not allowed when previous cloud group is empty';
     var invalidCloudWithNSCMessage = 'Invalid cloud input, other cloud groups are not allowed when No Significant Clouds is given';
-    var invalidCloud4WithPreviousType = 'Invalid cloud input, value is not allowed when previous cloud group has a type';
-    var invalidCloudCAVOKMessage = 'Invalid cloud input, when CAVOK is used, cloud groups must be empty'; // validations
+    var invalidCloudWithPreviousType = 'Invalid cloud input, only one significant convective cloud group with CB/TCU is allowed';
+    var invalidCloudCAVOKMessage = 'Invalid cloud input, when CAVOK is used, cloud groups must be empty';
+    var invalidCloud4TypeMissingMessage = 'Invalid cloud input for fourth group, CB or TCU required if no other significant convective cloud group present'; // validations
 
     var isLengthValid = function isLengthValid(value) {
       var onlyDigitsOrSpecificLetters = RegExp(/^[0-9FEWSCTBKNOVU]+$/);
@@ -1646,25 +1709,32 @@
     };
 
     var isVerticalVisibility = function isVerticalVisibility(value) {
-      return value.substr(0, 2) === 'VV';
+      return value.substring(0, 2) === 'VV';
     };
 
-    var isVerticalVisibilityValid = function isVerticalVisibilityValid(value) {
+    var isVerticalVisibilityValid = function isVerticalVisibilityValid(value, weather1, weather2, weather3) {
       // validate if its a number
       if (!value.match(/^[0-9]+$/)) {
-        return false;
+        return invalidVerticalVisibilityMessage;
       } // check if its 3 digits
 
 
       if (value.length !== 3) {
-        return false;
-      } // value should not be above 10
-
+        return invalidVerticalVisibilityMessage;
+      }
 
       var intValue = parseInt(value, 10);
 
-      if (intValue > 10) {
-        return false;
+      if (weather1 !== 'FG' && weather2 !== 'FG' && weather3 !== 'FG') {
+        // value should not be above 10
+        if (intValue < 1 || intValue > 10) {
+          return invalidVerticalVisibilityHeightMessage;
+        }
+      } else if (intValue < 1 || intValue > 5) {
+        // Apply Dutch rule as national exception
+        // In case of fog (FG) the vertical visibility can only be between VV001 up to and including VV005
+        // HEIGHT_VV is: (001-(1)-005). Deze maxima zijn officiële Nederlandse afwijkingen van de WMO/ICAO regelgeving
+        return invalidVerticalVisibilityHeightFGMessage;
       }
 
       return true;
@@ -1681,14 +1751,14 @@
       } // Validate coverage
 
 
-      var coverage = value.substr(0, 3);
+      var coverage = value.substring(0, 3);
 
       if (!isCoverageValid(coverage)) {
         errorMessages.push(invalidCloudCoverageMessage);
       } // Validate height
 
 
-      var height = value.substr(3, 3);
+      var height = value.substring(3, 6);
       var isValidHeight = isHeightValid(height);
 
       if (isValidHeight !== true) {
@@ -1697,7 +1767,7 @@
       } // Validate type
 
 
-      var type = value.substr(6, 3);
+      var type = value.substring(6, 9);
 
       if (!isTypeValid(type)) {
         errorMessages.push(invalidCLoudTypeMessage);
@@ -1716,56 +1786,66 @@
       };
     };
 
-    var validateFirstCloud = function validateFirstCloud(value, visibilityValue) {
-      var trimmedValue = value.trim(); // Field can be left empty
+    var validateFirstCloud = function validateFirstCloud(value, visibilityValue, weatherfield1, weatherfield2, weatherfield3) {
+      var trimmedValueFirstCloud = value.trim();
+      var trimmedValueVisibility = visibilityValue.trim();
+      var trimmedWeather1Value = weatherfield1.trim();
+      var trimmedWeather2Value = weatherfield2.trim();
+      var trimmedWeather3Value = weatherfield3.trim(); // Field can be left empty
 
-      if (!trimmedValue.length) {
+      if (!trimmedValueFirstCloud.length) {
         return true;
       }
 
-      if (trimmedValue && visibilityValue === 'CAVOK') {
+      if (trimmedValueFirstCloud && trimmedValueVisibility === 'CAVOK') {
         return invalidCloudCAVOKMessage;
       } // Check for No Signicant Clouds
 
 
-      if (trimmedValue === 'NSC') {
+      if (trimmedValueFirstCloud === 'NSC') {
         return true;
       } // Validate Vertical Visibility
 
 
-      if (isVerticalVisibility(trimmedValue)) {
+      if (isVerticalVisibility(trimmedValueFirstCloud)) {
         if ( // Validate length of 5
-        trimmedValue.length !== 5 || // Ensure it only contains digits or VV
-        !trimmedValue.match(/^[0-9V]+$/)) {
+        trimmedValueFirstCloud.length !== 5 || // Ensure it only contains digits or VV
+        !trimmedValueFirstCloud.match(/^[0-9V]+$/)) {
           return invalidVerticalVisibilityMessage;
         }
 
-        var verticalVisibilityValue = trimmedValue.substr(2, 3);
-
-        if (!isVerticalVisibilityValid(verticalVisibilityValue)) {
-          return invalidVerticalVisibilityMessage;
-        }
-
-        return true;
+        var verticalVisibilityValue = trimmedValueFirstCloud.substring(2, 5);
+        return isVerticalVisibilityValid(verticalVisibilityValue, trimmedWeather1Value, trimmedWeather2Value, trimmedWeather3Value);
       }
 
       var errorMessages = sharedCloudValidations({
-        value: trimmedValue,
+        value: trimmedValueFirstCloud,
         canBeNSC: true
       }).errorMessages; // Return first error if any
 
       return errorMessages.length ? errorMessages[0] : true;
     };
     var validateSecondCloud = function validateSecondCloud(firstCloudValue, secondCloudValue, visibilityValue) {
-      var trimmedValue = secondCloudValue.trim(); // Field can be left empty
+      var trimmedValueFirstCloud = firstCloudValue.trim();
+      var trimmedValueSecondCloud = secondCloudValue.trim(); // Field can be left empty
 
-      if (!trimmedValue.length) {
+      if (!trimmedValueSecondCloud.length) {
         return true;
+      } // If Cloud1 is NSC, Cloud2 has to be empty
+
+
+      if (trimmedValueFirstCloud === 'NSC' && trimmedValueSecondCloud !== '') {
+        return invalidCloudWithNSCMessage;
+      } // If Cloud1 is empty Cloud2 should be empty
+
+
+      if (trimmedValueFirstCloud === '') {
+        return invalidCloudWithPreviousEmptyCloud;
       } // Generic validations
 
 
       var _a = sharedCloudValidations({
-        value: trimmedValue
+        value: trimmedValueSecondCloud
       }),
           coverage = _a.coverage,
           height = _a.height,
@@ -1775,32 +1855,32 @@
 
       if (errorMessages.length) {
         return errorMessages[0];
-      } // Cloud2 specific validations
-      // Without type, coverage can not be FEW
+      } // Cloud2 specific validations - only to be applied when cloud1 does not contain type CB/TCU
 
 
-      if (type === '' && coverage === 'FEW') {
-        return invalidCloud2CoverageTypeCombinationMessage;
+      var typeCloud1 = trimmedValueFirstCloud.substring(6, 9);
+
+      if (typeCloud1 !== 'CB' && typeCloud1 !== 'TCU') {
+        // Without a type specified in cloud group 1, this group counts as #2 and coverage can not be FEW
+        if (type === '' && coverage === 'FEW') {
+          return invalidCloud2CoverageTypeCombinationMessage;
+        }
       } // If Cloud1 is not valid, skip further validation of Cloud2
+      // No need to pass the weatherfields as their content does not influence what happens below
 
 
-      if (validateFirstCloud(firstCloudValue, visibilityValue) !== true) {
+      if (validateFirstCloud(trimmedValueFirstCloud, visibilityValue, '', '', '') !== true) {
         return true;
-      } // If Cloud1 is NSC, Cloud2 has to be empty
-
+      } // If Cloud1 contains a type, Cloud2 cannot contain a type
 
-      if (firstCloudValue === 'NSC' && trimmedValue !== '') {
-        return invalidCloudWithNSCMessage;
-      } // If Cloud1 is empty Cloud2 should be empty
 
-
-      if (firstCloudValue === '') {
-        return invalidCloudWithPreviousEmptyCloud;
+      if (type !== '' && typeCloud1 !== '') {
+        return invalidCloudWithPreviousType;
       } // Cloud2 height has to be greater than Cloud1 height
 
 
-      if (!isVerticalVisibility(firstCloudValue)) {
-        var cloud1Height = firstCloudValue.substr(3, 3);
+      if (!isVerticalVisibility(trimmedValueFirstCloud)) {
+        var cloud1Height = trimmedValueFirstCloud.substring(3, 6);
 
         if (height <= cloud1Height) {
           return invalidCloudHeightComparedToPreviousMessage;
@@ -1808,22 +1888,34 @@
       } // If Cloud1 contains Vertical Visibility then Cloud2 type is required
 
 
-      if (isVerticalVisibility(firstCloudValue) && type === '') {
+      if (isVerticalVisibility(trimmedValueFirstCloud) && type === '') {
         return invalidCloud2WithVerticalVisibilityMessage;
       }
 
       return true;
     };
     var validateThirdCloud = function validateThirdCloud(firstCloudValue, secondCloudValue, thirdCloudValue, visibilityValue) {
-      var trimmedValue = thirdCloudValue.trim(); // Field can be left empty
+      var trimmedValueFirstCloud = firstCloudValue.trim();
+      var trimmedValueSecondCloud = secondCloudValue.trim();
+      var trimmedValueThirdCloud = thirdCloudValue.trim(); // Field can be left empty
 
-      if (!trimmedValue.length) {
+      if (!trimmedValueThirdCloud.length) {
         return true;
+      } // If Cloud1 is NSC, Cloud3 has to be empty
+
+
+      if (trimmedValueFirstCloud === 'NSC' && trimmedValueThirdCloud !== '') {
+        return invalidCloudWithNSCMessage;
+      } // If Cloud1 or Cloud2 is empty Cloud3 should be empty
+
+
+      if (trimmedValueFirstCloud === '' || trimmedValueSecondCloud === '') {
+        return invalidCloudWithPreviousEmptyCloud;
       } // Generic validations
 
 
       var _a = sharedCloudValidations({
-        value: trimmedValue
+        value: trimmedValueThirdCloud
       }),
           coverage = _a.coverage,
           height = _a.height,
@@ -1834,45 +1926,45 @@
       if (errorMessages.length) {
         return errorMessages[0];
       } // Cloud3 specific validations
-      // Without type, coverage can not be FEW or SCT
+      // Without a type specified in cloud group 1 or 2, this group counts as #3 and coverage can not be FEW or SCT
 
 
-      if (type === '' && (coverage === 'FEW' || coverage === 'SCT')) {
-        return invalidCloud3CoverageTypeCombinationMessage;
+      var typeCloud1 = trimmedValueFirstCloud.substring(6, 9);
+      var typeCloud2 = trimmedValueSecondCloud.substring(6, 9);
+
+      if (typeCloud1 !== 'CB' && typeCloud1 !== 'TCU' && typeCloud2 !== 'CB' && typeCloud2 !== 'TCU') {
+        if (type === '' && (coverage === 'FEW' || coverage === 'SCT')) {
+          return invalidCloud3CoverageTypeCombinationMessage;
+        }
+      } else if (type === '' && coverage === 'FEW') {
+        // In case we do have a CB/TCU group in one of the previous clouf groups. This cloudgroup should be evaluated as if it was the second group
+        return invalidCloud2CoverageTypeCombinationMessage;
       } // If Cloud1 is not valid, skip further validation of Cloud3
+      // No need to pass the weatherfields as their content does not influence what happens below
+      // Since in case of VV the third field should be empty anyways
 
 
-      if (validateFirstCloud(firstCloudValue, visibilityValue) !== true) {
+      if (validateFirstCloud(trimmedValueFirstCloud, visibilityValue, '', '', '') !== true) {
         return true;
-      } // If Cloud1 is empty Cloud3 should be empty
-
-
-      if (firstCloudValue === '') {
-        return invalidCloudWithPreviousEmptyCloud;
       } // If Cloud1 contains Vertical Visibility then Cloud3 should be empty
 
 
-      if (isVerticalVisibility(firstCloudValue)) {
+      if (isVerticalVisibility(trimmedValueFirstCloud)) {
         return invalidCloudWithVerticalVisibilityMessage;
-      } // If Cloud1 is NSC, Cloud3 has to be empty
-
-
-      if (firstCloudValue === 'NSC' && trimmedValue !== '') {
-        return invalidCloudWithNSCMessage;
       } // If Cloud2 is not valid, skip further validation of Cloud3
 
 
-      if (validateSecondCloud(firstCloudValue, secondCloudValue, visibilityValue) !== true) {
+      if (validateSecondCloud(trimmedValueFirstCloud, trimmedValueSecondCloud, visibilityValue) !== true) {
         return true;
-      } // If Cloud2 is empty Cloud3 should be empty
+      } // If one of the previous groups contains a type, Cloud3 cannot contain a type
 
 
-      if (secondCloudValue === '') {
-        return invalidCloudWithPreviousEmptyCloud;
+      if (type !== '' && (typeCloud1 !== '' || typeCloud2 !== '')) {
+        return invalidCloudWithPreviousType;
       } // Cloud3 height has to be greater than Cloud2 height
 
 
-      var cloud2Height = secondCloudValue.substr(3, 3);
+      var cloud2Height = trimmedValueSecondCloud.substring(3, 6);
 
       if (height <= cloud2Height) {
         return invalidCloudHeightComparedToPreviousMessage;
@@ -1881,17 +1973,31 @@
       return true;
     };
     var validateFourthCloud = function validateFourthCloud(firstCloudValue, secondCloudValue, thirdCloudValue, fourthCloudValue, visibilityValue) {
-      var trimmedValue = fourthCloudValue.trim(); // Field can be left empty
+      var trimmedValueFirstCloud = firstCloudValue.trim();
+      var trimmedValueSecondCloud = secondCloudValue.trim();
+      var trimmedValueThirdCloud = thirdCloudValue.trim();
+      var trimmedValueFourthCloud = fourthCloudValue.trim(); // Field can be left empty
 
-      if (!trimmedValue.length) {
+      if (!trimmedValueFourthCloud.length) {
         return true;
+      } // If Cloud1 is NSC, Cloud4 has to be empty
+
+
+      if (trimmedValueFirstCloud === 'NSC' && trimmedValueFourthCloud !== '') {
+        return invalidCloudWithNSCMessage;
+      } // If Cloud 1, 2 or 3 is empty Cloud4 should be empty
+
+
+      if (trimmedValueFirstCloud === '' || trimmedValueSecondCloud === '' || trimmedValueThirdCloud === '') {
+        return invalidCloudWithPreviousEmptyCloud;
       } // Generic validations
 
 
       var _a = sharedCloudValidations({
-        value: trimmedValue
+        value: trimmedValueFourthCloud
       }),
           height = _a.height,
+          coverage = _a.coverage,
           type = _a.type,
           errorMessages = _a.errorMessages; // Return generic errors if any
 
@@ -1899,50 +2005,48 @@
       if (errorMessages.length) {
         return errorMessages[0];
       } // Cloud4 specific validations
-      // Type is required
+      // If none of the previous cloud groups contains a type, the fourth group must contain a type if not empty
+
 
+      var typeCloud1 = trimmedValueFirstCloud.substring(6, 9);
+      var typeCloud2 = trimmedValueSecondCloud.substring(6, 9);
+      var typeCloud3 = trimmedValueThirdCloud.substring(6, 9);
 
-      if (type === '') {
-        return invalidCLoudTypeMessage;
+      if (typeCloud1 !== 'CB' && typeCloud1 !== 'TCU' && typeCloud2 !== 'CB' && typeCloud2 !== 'TCU' && typeCloud3 !== 'CB' && typeCloud3 !== 'TCU') {
+        if (type === '') {
+          return invalidCloud4TypeMissingMessage;
+        }
+      } else if (coverage === 'FEW' || coverage === 'SCT') {
+        // We have a CB/TCU group in one of the previous cloud groups. This group should be evaluated as if it was the third group
+        return invalidCloud3CoverageTypeCombinationMessage;
       } // If Cloud1 is not valid, skip further validation of Cloud4
+      // No need to pass the weatherfields as their content does not influence what happens below
+      // Since in case of VV the fourth field should be empty anyways
 
 
-      if (validateFirstCloud(firstCloudValue, visibilityValue) !== true) {
+      if (validateFirstCloud(trimmedValueFirstCloud, visibilityValue, '', '', '') !== true) {
         return true;
       } // If Cloud1 contains Vertical Visibility then Cloud4 should be empty
 
 
-      if (isVerticalVisibility(firstCloudValue)) {
+      if (isVerticalVisibility(trimmedValueFirstCloud)) {
         return invalidCloudWithVerticalVisibilityMessage;
-      } // If Cloud1 is NSC, Cloud4 has to be empty
-
-
-      if (firstCloudValue === 'NSC' && trimmedValue !== '') {
-        return invalidCloudWithNSCMessage;
-      } // If Cloud 1, 2 or 3 is empty Cloud4 should be empty
-
-
-      if (firstCloudValue === '' || secondCloudValue === '' || thirdCloudValue === '') {
-        return invalidCloudWithPreviousEmptyCloud;
       } // If Cloud3 is not valid, skip further validation of Cloud4
 
 
-      if (validateThirdCloud(firstCloudValue, secondCloudValue, thirdCloudValue, visibilityValue) !== true) {
+      if (validateThirdCloud(trimmedValueFirstCloud, trimmedValueSecondCloud, trimmedValueThirdCloud, visibilityValue) !== true) {
         return true;
-      } // If Cloud3 contains a type, Cloud4 should be empty
+      } // If one of the previous groups contains a type, Cloud4 cannot contain a type
 
 
-      var cloud3Type = thirdCloudValue.substr(6, 3);
-
-      if (cloud3Type !== '') {
-        return invalidCloud4WithPreviousType;
+      if (type !== '' && (typeCloud1 !== '' || typeCloud2 !== '' || typeCloud3 !== '')) {
+        return invalidCloudWithPreviousType;
       } // Cloud4 height has to be greater than Cloud3 height
 
 
-      var cloud3Height = thirdCloudValue.substr(3, 3);
+      var cloud3Height = trimmedValueThirdCloud.substring(3, 6);
 
       if (height <= cloud3Height) {
-        // Because of the type validations this is automatically enforced for Cloud4, so impossible to end up here but leaving the check in just in case
         return invalidCloudHeightComparedToPreviousMessage;
       }
 
@@ -2351,12 +2455,25 @@
       if (action === 'CORRECT') return 'This TAF is a correction';
       return 'Cancel TAF';
     };
-    var getConfirmationDialogContent = function getConfirmationDialogContent(action) {
-      if (action === 'DISCARD') return 'Are you sure you would like to discard this TAF? Any changes made will be lost';
-      if (action === 'PUBLISH') return 'Are you sure you want to publish this TAF?';
-      if (action === 'AMEND') return 'Do you want to publish it?';
-      if (action === 'CORRECT') return 'Do you want to publish it?';
-      return 'Are you sure you want to cancel this TAF?';
+    var getConfirmationDialogContent = function getConfirmationDialogContent(action, isFormDirty) {
+      if (isFormDirty === void 0) {
+        isFormDirty = true;
+      }
+
+      switch (action) {
+        case 'DISCARD':
+          return 'Are you sure you would like to discard this TAF? Any changes made will be lost';
+
+        case 'PUBLISH':
+          return 'Are you sure you want to publish this TAF?';
+
+        case 'AMEND':
+        case 'CORRECT':
+          return isFormDirty ? 'Do you want to publish it?' : 'Are you sure you want to publish the TAF? You did not make any changes!';
+
+        default:
+          return 'Are you sure you want to cancel this TAF?';
+      }
     };
     var getConfirmationDialogButtonLabel = function getConfirmationDialogButtonLabel(action) {
       switch (action) {
@@ -2433,7 +2550,7 @@
           borderRadius: '3px'
         },
         addButton: {
-          marginRight: '38px'
+          marginRight: '48px'
         },
         lifecycleButtons: {
           marginTop: '40px',
@@ -2448,6 +2565,9 @@
         backdrop: {
           zIndex: 1500,
           color: '#fff'
+        },
+        emptyButtonContainer: {
+          minWidth: 96
         }
       };
     });
@@ -2691,8 +2811,10 @@
           field = _f === void 0 ? null : _f,
           _g = _a.dragHandle,
           dragHandle = _g === void 0 ? null : _g,
-          props = __rest(_a, ["isChangeGroup", "disabled", "index", "lastRow", "onRemoveChangeGroup", "field", "dragHandle"]);
+          onAddChangeGroup = _a.onAddChangeGroup,
+          props = __rest(_a, ["isChangeGroup", "disabled", "index", "lastRow", "onRemoveChangeGroup", "field", "dragHandle", "onAddChangeGroup"]);
 
+      var classes = useStyles$9();
       var namePrefix = !isChangeGroup ? 'baseForecast' : "changeGroups[" + index + "]";
       var fieldNames = getFieldNames(isChangeGroup, index);
 
@@ -2769,16 +2891,43 @@
         return true;
       }, [index, isChangeGroup, getValues]);
 
-      var getFieldFromNextRow = function getFieldFromNextRow(fieldname) {
-        if (fieldname === void 0) {
-          fieldname = 'valid';
+      var getFieldFromRow = function getFieldFromRow(fieldname, rowIndex) {
+        var indexedFieldName = "changeGroups[" + rowIndex + "]." + fieldname;
+        var rowValue = getValues(indexedFieldName);
+        return rowValue ? [indexedFieldName] : [];
+      };
+
+      var getValidFieldFromNextRow = function getValidFieldFromNextRow() {
+        return getFieldFromRow('valid', index + 1);
+      };
+
+      var validateNextRows = React__default["default"].useCallback(function () {
+        if (isChangeGroup) {
+          var _a = getValues(),
+              validDateEnd = _a.validDateEnd,
+              validDateStart = _a.validDateStart,
+              changeGroups = _a.changeGroups;
+
+          var currentChangeGroup = changeGroups[index];
+          var nextChangeGroups = changeGroups.slice(index + 1);
+          return validateOverlapWithFM(currentChangeGroup, nextChangeGroups, validDateStart, validDateEnd);
         }
 
-        var nextValidFieldName = "changeGroups[" + (index + 1) + "]." + fieldname;
-        var nextRowValidValue = getValues(nextValidFieldName);
-        return nextRowValidValue ? [nextValidFieldName] : [];
+        return true;
+      }, [index, isChangeGroup, getValues]);
+
+      var getPreviousValidFields = function getPreviousValidFields(rowIndex) {
+        var changeGroups = getValues().changeGroups;
+        var previousChangeGroups = changeGroups.slice(0, rowIndex);
+        var validFields = previousChangeGroups.map(function (_element, index) {
+          return getFieldFromRow('valid', index)[0];
+        });
+        return validFields;
       };
 
+      var addChangeGroup = React__default["default"].useCallback(function () {
+        onAddChangeGroup(index);
+      }, [onAddChangeGroup, index]);
       return /*#__PURE__*/React__default["default"].createElement(core.Grid, __assign({
         "data-testid": "row-" + namePrefix,
         container: true,
@@ -2822,7 +2971,7 @@
         }],
         onBlur: function onBlur() {
           if (isChangeGroup) {
-            var nextValidFieldName = getFieldFromNextRow();
+            var nextValidFieldName = getValidFieldFromNextRow();
             trigger(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], __read(subFields)), __read(mainOptionalFields)), __read(mainFields)), __read(nextValidFieldName)));
           }
         }
@@ -2852,8 +3001,9 @@
         }],
         onBlur: function onBlur() {
           if (isChangeGroup) {
-            var nextValidFieldName = getFieldFromNextRow();
-            trigger(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], __read(subFields)), __read(mainOptionalFields)), __read(mainFields)), __read(nextValidFieldName)));
+            var nextValidFieldName = getValidFieldFromNextRow();
+            var previousValidFieldNames = getPreviousValidFields(index);
+            trigger(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], __read(subFields)), __read(mainOptionalFields)), __read(mainFields)), __read(nextValidFieldName)), __read(previousValidFieldNames)));
           }
         }
       })), /*#__PURE__*/React__default["default"].createElement(TafFormTextField, {
@@ -2871,13 +3021,15 @@
             validateValidChangeGroupInterField: function validateValidChangeGroupInterField$1(value) {
               return isChangeGroup ? validateValidChangeGroupInterField(value, getValues(fieldNames.change), getValues('validDateStart'), getValues('validDateEnd')) : true;
             },
-            validatePreviousRow: validatePreviousRow
+            validatePreviousRow: validatePreviousRow,
+            validateNextRows: validateNextRows
           }
         },
         onBlur: function onBlur() {
           if (isChangeGroup) {
-            var nextValidFieldName = getFieldFromNextRow();
-            trigger(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], __read(subFields)), __read(mainOptionalFields)), __read(mainFields)), __read(nextValidFieldName)));
+            var nextValidFieldName = getValidFieldFromNextRow();
+            var previousValidFieldNames = getPreviousValidFields(index);
+            trigger(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], __read(subFields)), __read(mainOptionalFields)), __read(mainFields)), __read(nextValidFieldName)), __read(previousValidFieldNames)));
           }
         }
       }), /*#__PURE__*/React__default["default"].createElement(TafFormTextField, {
@@ -2891,7 +3043,9 @@
               return _validateRequiredMainFields(value, 'Wind');
             },
             validateRequiredSub: validateRequiredSub,
-            validateWindField: validateWindField
+            validateWindField: function validateWindField$1(value) {
+              return validateWindField(value, getValues(fieldNames.weather1), getValues(fieldNames.weather2), getValues(fieldNames.weather3));
+            }
           }
         },
         onBlur: function onBlur() {
@@ -2940,7 +3094,7 @@
         },
         onBlur: function onBlur() {
           var fields = isChangeGroup ? __spreadArray(__spreadArray([], __read(subFields)), __read(mainFields)) : [];
-          return trigger(__spreadArray(__spreadArray([], __read(fields)), [fieldNames.weather2, fieldNames.weather3]));
+          return trigger(__spreadArray(__spreadArray([], __read(fields)), [fieldNames.weather2, fieldNames.weather3, fieldNames.wind, fieldNames.cloud1]));
         }
       }), /*#__PURE__*/React__default["default"].createElement(TafFormTextField, {
         label: "Weather",
@@ -2956,7 +3110,7 @@
         },
         onBlur: function onBlur() {
           var fields = isChangeGroup ? __spreadArray(__spreadArray([], __read(subFields)), __read(mainFields)) : [];
-          return trigger(__spreadArray(__spreadArray([], __read(fields)), [fieldNames.weather3]));
+          return trigger(__spreadArray(__spreadArray([], __read(fields)), [fieldNames.weather3, fieldNames.wind, fieldNames.cloud1]));
         }
       }), /*#__PURE__*/React__default["default"].createElement(TafFormTextField, {
         label: "Weather",
@@ -2969,6 +3123,9 @@
               return validateThirdWeatherField(getValues(fieldNames.weather1), getValues(fieldNames.weather2), value, getValues(fieldNames.visibility));
             }
           }
+        },
+        onBlur: function onBlur() {
+          return trigger([fieldNames.wind, fieldNames.cloud1]);
         }
       }), /*#__PURE__*/React__default["default"].createElement(TafFormTextField, {
         label: "Cloud",
@@ -2982,7 +3139,7 @@
             },
             validateRequiredSub: validateRequiredSub,
             validateFirstCloud: function validateFirstCloud$1(value) {
-              return validateFirstCloud(value, getValues(fieldNames.visibility));
+              return validateFirstCloud(value, getValues(fieldNames.visibility), getValues(fieldNames.weather1), getValues(fieldNames.weather2), getValues(fieldNames.weather3));
             }
           }
         },
@@ -3033,19 +3190,27 @@
           }
         }
       }), (!isChangeGroup || disabled) && /*#__PURE__*/React__default["default"].createElement(core.Grid, {
+        className: classes.emptyButtonContainer,
         item: true,
         xs: true
-      }), isChangeGroup && !disabled && /*#__PURE__*/React__default["default"].createElement(core.Grid, {
-        item: true,
-        xs: true
-      }, /*#__PURE__*/React__default["default"].createElement(core.IconButton, __assign({
+      }, !disabled && /*#__PURE__*/React__default["default"].createElement(core.IconButton, {
+        "aria-label": "add",
+        "data-testid": "add-changeGroup",
+        onClick: addChangeGroup
+      }, /*#__PURE__*/React__default["default"].createElement(icons.Add, null))), isChangeGroup && !disabled && /*#__PURE__*/React__default["default"].createElement(core.Grid, {
+        item: true
+      }, /*#__PURE__*/React__default["default"].createElement(core.IconButton, {
+        "aria-label": "add",
+        "data-testid": "add-changeGroup",
+        onClick: addChangeGroup
+      }, /*#__PURE__*/React__default["default"].createElement(icons.Add, null)), /*#__PURE__*/React__default["default"].createElement(core.IconButton, __assign({
         "aria-label": "delete",
         "data-testid": "remove-changeGroup",
         onClick: function onClick() {
           return onRemoveChangeGroup(index);
         }
       }, lastRow ? {
-        tabIndex: '-1'
+        tabIndex: -1
       } : {}), /*#__PURE__*/React__default["default"].createElement(icons.Delete, null))));
     });
 
@@ -3547,7 +3712,7 @@
       var showConfirmDialog = function showConfirmDialog(action) {
         return confirmDialog({
           title: getConfirmationDialogTitle(action),
-          description: getConfirmationDialogContent(action),
+          description: getConfirmationDialogContent(action, isFormDirty),
           confirmLabel: getConfirmationDialogButtonLabel(action)
         });
       };
@@ -3596,32 +3761,61 @@
         name: 'changeGroups'
       }),
           fields = _h.fields,
-          append = _h.append,
+          insert = _h.insert,
           remove = _h.remove,
           move = _h.move;
 
-      var lastTotalFields = shared.usePrevious(fields.length);
-
       var _j = useDragOrder(trigger, move, onFormBlur),
           onChangeOrder = _j.onChangeOrder,
           onStartDrag = _j.onStartDrag,
           activeDraggingIndex = _j.activeDraggingIndex;
 
       var onRemoverow = function onRemoverow(index) {
-        remove(index);
+        confirmDialog({
+          title: 'Delete row',
+          description: 'Are you sure you want to delete this row?',
+          confirmLabel: 'Yes'
+        }).then(function () {
+          remove(index);
+          trigger(); // trigger all fields validation
+
+          onFormBlur();
+        });
+      }; // TODO: https://gitlab.com/opengeoweb/opengeoweb/-/issues/726 insert (react-hook-form) does not work well with focus (only last row will get focus), so added this dirty solution. This can be fixed in a better way in react-hook-form v7
+
+
+      var focusFirstInput = function focusFirstInput(rowIndex) {
+        var nextRowFirstInput = document.querySelector("[name=\"changeGroups[" + rowIndex + "].probability\"]");
+
+        if (nextRowFirstInput) {
+          nextRowFirstInput.focus();
+        }
       };
 
-      var onAddRow = function onAddRow() {
-        append(emptyChangegroup, true);
+      var onAddRow = function onAddRow(rowIndex) {
+        if (rowIndex === void 0) {
+          rowIndex = -1;
+        }
+
+        var newRowIndex = rowIndex + 1;
+        insert(newRowIndex, emptyChangegroup, false); // adding rows and validation don't work well combined, with always skipping validation of fields of rows above the one the inserted row. A setTimeout prevents this issue
+
+        setTimeout(function () {
+          focusFirstInput(newRowIndex);
+          trigger(); // trigger all fields validation
+        }, 0);
       };
 
       React__default["default"].useEffect(function () {
-        if (isFormDirty && fields.length !== lastTotalFields) {
-          onFormBlur();
-          trigger(); // trigger all field validation,
+        if (!isDisabled) {
+          // trigger validation on all changegroup validity times after initial load since they could be outside the new validity period
+          var validFields = fields.map(function (_field, index) {
+            return "changeGroups[" + index + "].valid";
+          });
+          trigger(validFields);
         } // eslint-disable-next-line react-hooks/exhaustive-deps
 
-      }, [fields.length, isFormDirty]);
+      }, []);
       return /*#__PURE__*/React__default["default"].createElement("form", {
         onSubmit: handleSubmit(onSubmit),
         onBlur: onFormBlur
@@ -3637,7 +3831,8 @@
           "data-testid": "tafform-tac-message-line"
         }, line);
       })), /*#__PURE__*/React__default["default"].createElement(TafFormRow, {
-        disabled: isDisabled
+        disabled: isDisabled,
+        onAddChangeGroup: onAddRow
       }), /*#__PURE__*/React__default["default"].createElement(reactSortablejs.ReactSortable, {
         tag: "div",
         list: fields,
@@ -3661,6 +3856,7 @@
           lastRow: fields.length === index + 1,
           disabled: isDisabled,
           onRemoveChangeGroup: onRemoverow,
+          onAddChangeGroup: onAddRow,
           isChangeGroup: true,
           dragHandle: /*#__PURE__*/React__default["default"].createElement(DragHandle, {
             isDisabled: fields.length === 1 || isDisabled,
@@ -3668,20 +3864,10 @@
             index: index
           })
         });
-      })), !isDisabled && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(core.Grid, {
-        container: true,
-        item: true,
-        xs: 12,
-        justify: "flex-end"
-      }, /*#__PURE__*/React__default["default"].createElement(core.IconButton, {
-        "aria-label": "add",
-        "data-testid": "add-changeGroup",
-        onClick: onAddRow,
-        className: classes.addButton
-      }, /*#__PURE__*/React__default["default"].createElement(icons.Add, null))), /*#__PURE__*/React__default["default"].createElement(TafFormButtons, {
+      })), !isDisabled && /*#__PURE__*/React__default["default"].createElement(TafFormButtons, {
         tafAction: tafAction,
         onTafFormButtonPress: onTafButtonPress
-      })), hiddenInputFields.map(function (field) {
+      }), hiddenInputFields.map(function (field) {
         return /*#__PURE__*/React__default["default"].createElement(formFields.ReactHookFormHiddenInput, {
           name: field,
           key: field
@@ -4713,8 +4899,8 @@
       return /*#__PURE__*/React__default["default"].createElement(shared.ConfirmationServiceProvider, null, /*#__PURE__*/React__default["default"].createElement(TafWrapper, null));
     };
 
-    var createApi = function createApi(url, appUrl, auth, setAuth, authTokenUrl) {
-      var axiosInstance = api.createApiInstance(url, appUrl, auth, setAuth, authTokenUrl);
+    var createApi = function createApi(url, appUrl, auth, setAuth, authTokenUrl, authClientId) {
+      var axiosInstance = api.createApiInstance(url, appUrl, auth, setAuth, authTokenUrl, authClientId);
       return {
         // api data
         getTafList: function getTafList() {