@opengeoweb/taf 4.0.0 → 4.2.0

package/index.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('@mui/material'), require('react-hook-form'), require('react-sortablejs'), require('lodash'), require('@opengeoweb/authentication'), require('@opengeoweb/form-fields'), require('@opengeoweb/shared'), require('moment'), require('@opengeoweb/theme'), require('react-dom'), require('@opengeoweb/api'), require('@mui/material/LinearProgress'), require('@mui/material/Box')) :
-    typeof define === 'function' && define.amd ? define(['exports', 'react', '@mui/material', 'react-hook-form', 'react-sortablejs', 'lodash', '@opengeoweb/authentication', '@opengeoweb/form-fields', '@opengeoweb/shared', 'moment', '@opengeoweb/theme', 'react-dom', '@opengeoweb/api', '@mui/material/LinearProgress', '@mui/material/Box'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Taf = {}, global.React, global.material, global.reactHookForm, global.reactSortablejs, global.lodash, global.authentication, global.formFields, global.shared, global.moment, global.theme, global.ReactDOM, global.api, global.LinearProgress, global.Box));
-})(this, (function (exports, React, material, reactHookForm, reactSortablejs, lodash, authentication, formFields, shared, moment, theme, ReactDOM, api, LinearProgress, Box) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('@mui/material'), require('react-hook-form'), require('react-redux'), require('react-sortablejs'), require('lodash'), require('@opengeoweb/authentication'), require('@opengeoweb/form-fields'), require('@opengeoweb/shared'), require('@opengeoweb/core'), require('moment'), require('@opengeoweb/theme'), require('react-dom'), require('@opengeoweb/api'), require('@mui/material/LinearProgress'), require('@mui/material/Box')) :
+    typeof define === 'function' && define.amd ? define(['exports', 'react', '@mui/material', 'react-hook-form', 'react-redux', 'react-sortablejs', 'lodash', '@opengeoweb/authentication', '@opengeoweb/form-fields', '@opengeoweb/shared', '@opengeoweb/core', 'moment', '@opengeoweb/theme', 'react-dom', '@opengeoweb/api', '@mui/material/LinearProgress', '@mui/material/Box'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Taf = {}, global.React, global.material, global.reactHookForm, global.reactRedux, global.reactSortablejs, global.lodash, global.authentication, global.formFields, global.shared, global.core, global.moment, global.theme, global.ReactDOM, global.api, global.LinearProgress, global.Box));
+})(this, (function (exports, React, material, reactHookForm, reactRedux, reactSortablejs, lodash, authentication, formFields, shared, core, moment, theme, ReactDOM, api, LinearProgress, Box) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -2316,7 +2316,11 @@
     var tacHasError = function tacHasError(tac) {
       return tac === TAC_MISSING_DATA || tac === TAC_NOT_AVAILABLE || tac === TAC_RETRIEVING_DATA || tac === TAC_FAILED;
     };
-    var useTACGenerator = function useTACGenerator(taf, requestTAC) {
+    var useTACGenerator = function useTACGenerator(taf, requestTAC, getJSON) {
+      if (getJSON === void 0) {
+        getJSON = false;
+      }
+
       var _a = __read(React__default["default"].useState(!taf || taf.status === 'NEW' ? TAC_NOT_AVAILABLE : TAC_RETRIEVING_DATA), 2),
           TAC = _a[0],
           setTAC = _a[1];
@@ -2340,7 +2344,7 @@
 
           controller.current = new AbortController();
           setTAC(TAC_RETRIEVING_DATA);
-          requestTAC(tafToPost, controller.current.signal).then(function (result) {
+          requestTAC(tafToPost, getJSON, controller.current.signal).then(function (result) {
             if (isMounted.current) {
               setTAC(result.data);
             }
@@ -2352,7 +2356,7 @@
         } else {
           setTAC(TAC_MISSING_DATA);
         }
-      }, [isMounted, requestTAC]);
+      }, [isMounted, requestTAC, getJSON]);
       React__default["default"].useEffect(function () {
         if (taf && taf.status !== 'NEW') {
           retrieveTAC(taf);
@@ -3960,6 +3964,9 @@
 
     var noop = function noop() {};
 
+    var getSnackbarMessage$2 = function getSnackbarMessage(isChecked, location) {
+      return "You are now " + (isChecked ? '' : 'no longer ') + "the editor for TAF " + location;
+    };
     var TafForm = /*#__PURE__*/React__default["default"].memo(function (_a) {
       var tafFromBackend = _a.tafFromBackend,
           _b = _a.onFormAction,
@@ -3985,6 +3992,7 @@
       var originalTaf = tafFromBackend.taf,
           editor = tafFromBackend.editor;
       var auth = authentication.useAuthenticationContext().auth;
+      var dispatch = reactRedux.useDispatch();
       var isEditor = editor === (auth === null || auth === void 0 ? void 0 : auth.username) || false;
       var isDefaultDisabled = getIsFormDefaultDisabled(originalTaf.status);
       var confirmDialog = shared.useConfirmationDialog();
@@ -4092,6 +4100,12 @@
         setTafAction(action);
       };
 
+      var showSnackbar = React__default["default"].useCallback(function (message) {
+        dispatch(core.snackbarActions.openSnackbar({
+          message: message
+        }));
+      }, [dispatch]);
+
       var setIsEditor = function setIsEditor(checked) {
         return __awaiter(void 0, void 0, void 0, function () {
           var editor, didSucceed;
@@ -4132,6 +4146,11 @@
 
               case 3:
                 didSucceed = _a.sent();
+
+                if (didSucceed) {
+                  showSnackbar(getSnackbarMessage$2(checked, originalTaf.location));
+                }
+
                 return [2
                 /*return*/
                 , didSucceed];
@@ -4435,8 +4454,8 @@
           alignItems: 'center',
           position: 'absolute',
           top: {
-            xs: '20px',
-            sm: '0px'
+            xs: '34px',
+            sm: '-3px'
           },
           right: {
             xs: 'calc(50% -  70px)',
@@ -4461,11 +4480,15 @@
         sx: {
           fontSize: '20px',
           fontWeight: 500,
-          height: '24px'
+          height: '24px',
+          display: 'flex',
+          alignItems: 'center'
         }
       }, "TAC"), /*#__PURE__*/React__default["default"].createElement(material.Typography, {
         sx: {
-          fontSize: '14px',
+          fontSize: '12px',
+          lineHeight: 1.67,
+          letterSpacing: '0.21px',
           margin: '8px 0px'
         },
         "data-testid": "form-tac-message"
@@ -4591,7 +4614,7 @@
         sx: __assign({
           textAlign: 'center',
           fontWeight: 500,
-          paddingTop: '6px',
+          paddingTop: '4px',
           textTransform: 'capitalize'
         }, sx)
       }, title);
@@ -4657,17 +4680,32 @@
       return locationSettings[location];
     };
     var sortTafsOnLocation = function sortTafsOnLocation(tafList, locationOrder) {
+      if (tafList === void 0) {
+        tafList = [];
+      }
+
       if (locationOrder === void 0) {
         locationOrder = tafSettings.locationOrder;
       }
 
-      if (!tafList) return [];
       return __spreadArray([], __read(tafList)).sort(function (_a, _b) {
         var tafA = _a.taf;
         var tafB = _b.taf;
         return locationOrder.indexOf(tafA.location) < locationOrder.indexOf(tafB.location) ? -1 : 1;
       });
     };
+    var sortTafsOnIssueDate = function sortTafsOnIssueDate(tafList) {
+      if (tafList === void 0) {
+        tafList = [];
+      }
+
+      return __spreadArray([], __read(tafList)).sort(function (_a, _b) {
+        var tafA = _a.taf;
+        var tafB = _b.taf;
+        if (tafA.issueDate < tafB.issueDate || tafA.issueDate && !tafB.issueDate) return -1;
+        return 1;
+      });
+    };
     var getBaseTime = function getBaseTime(baseTime, location) {
       var currentBaseTime = moment__default["default"].utc(baseTime);
       var activityPeriod = getLocationSetting(location).activity_period;
@@ -4695,7 +4733,8 @@
       return 'UPCOMING';
     };
     var sortTafTimeSlots = function sortTafTimeSlots(tafList) {
-      var sortedListOnLocation = sortTafsOnLocation(tafList);
+      var sortedListOnIssueDate = sortTafsOnIssueDate(tafList);
+      var sortedListOnLocation = sortTafsOnLocation(sortedListOnIssueDate);
       return sortedListOnLocation.reduce(function (sortedTafList, tafFromBackend) {
         var taf = tafFromBackend.taf;
         var timeSlot = getTafTimeSlot(taf.baseTime, taf.location, taf.status);
@@ -4735,6 +4774,29 @@
         changeGroups: changeGroups
       });
     };
+    var getNewTafLocationIndex = function getNewTafLocationIndex(tafLocations, previousTafLocationUUID) {
+      var newActiveIndexForDraft = tafLocations.findIndex(function (location) {
+        var _a;
+
+        return ((_a = location === null || location === void 0 ? void 0 : location.taf) === null || _a === void 0 ? void 0 : _a.previousId) === previousTafLocationUUID;
+      });
+
+      if (newActiveIndexForDraft !== -1) {
+        return newActiveIndexForDraft;
+      }
+
+      var newActiveIndexForPublished = tafLocations.findIndex(function (location) {
+        var _a;
+
+        return ((_a = location === null || location === void 0 ? void 0 : location.taf) === null || _a === void 0 ? void 0 : _a.uuid) === previousTafLocationUUID;
+      });
+
+      if (newActiveIndexForPublished !== -1) {
+        return newActiveIndexForPublished;
+      }
+
+      return 0;
+    };
 
     /* *
      * Licensed under the Apache License, Version 2.0 (the "License");
@@ -4869,6 +4931,61 @@
      * Copyright 2022 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
      * Copyright 2022 - Finnish Meteorological Institute (FMI)
      * */
+    var AdverseWeatherTACMessage = function AdverseWeatherTACMessage(_a) {
+      var TAC = _a.TAC,
+          isActive = _a.isActive;
+      return /*#__PURE__*/React__default["default"].createElement(Box__default["default"], {
+        "data-testid": "adverse-weather-tac",
+        sx: {
+          fontSize: '12px',
+          lineHeight: '16px',
+          letterSpacing: '0.4px',
+          color: 'geowebColors.captions.captionStatus.rgba'
+        }
+      }, TAC.tac.map(function (line, index) {
+        return /*#__PURE__*/React__default["default"].createElement(Box__default["default"], {
+          key: line.toString() + index.toString(),
+          component: "span",
+          sx: {
+            display: 'inline-block'
+          }
+        }, line.map(function (word, index) {
+          return /*#__PURE__*/React__default["default"].createElement(Box__default["default"], {
+            key: word.text + index.toString(),
+            component: "span",
+            sx: __assign(__assign({
+              display: 'inline',
+              boxDecorationBreak: 'clone',
+              WebkitBoxDecorationBreak: 'clone'
+            }, isActive && {
+              backgroundColor: 'geowebColors.functional.warningHighlight.rgba'
+            }), word.type === 'adverse' && {
+              color: 'geowebColors.captions.captionError.rgba'
+            })
+          }, word.text === '=' ? "" + word.text : " " + word.text);
+        }));
+      }));
+    };
+
+    /* *
+     * Licensed under the Apache License, Version 2.0 (the "License");
+     * you may not use this file except in compliance with the License.
+     * You may obtain a copy of the License at
+     *
+     *     http://www.apache.org/licenses/LICENSE-2.0
+     *
+     * Unless required by applicable law or agreed to in writing, software
+     * distributed under the License is distributed on an "AS IS" BASIS,
+     * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     * See the License for the specific language governing permissions and
+     * limitations under the License.
+     *
+     * Copyright 2022 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+     * Copyright 2022 - Finnish Meteorological Institute (FMI)
+     * */
+    var getSnackbarMessage$1 = function getSnackbarMessage(location, locationLabel) {
+      return "TAF " + location + " " + locationLabel + " was imported successfully";
+    };
 
     var TacContainer = function TacContainer(_a) {
       var taf = _a.taf,
@@ -4877,8 +4994,9 @@
           _c = _a.isFormDisabled,
           isFormDisabled = _c === void 0 ? false : _c;
       var api$1 = api.useApiContext().api;
+      var dispatch = reactRedux.useDispatch();
 
-      var _d = __read(useTACGenerator(taf, api$1.getTAC), 2),
+      var _d = __read(useTACGenerator(taf, api$1.getTAC, true), 2),
           TAC = _d[0],
           retrieveTAC = _d[1];
 
@@ -4894,6 +5012,11 @@
           setValue = _e.setValue;
 
       var updateTAC = useTafModuleContext().updateTAC;
+      var showSnackbar = React__default["default"].useCallback(function (message) {
+        dispatch(core.snackbarActions.openSnackbar({
+          message: message
+        }));
+      }, [dispatch]);
 
       var handleExport = function handleExport() {
         var currentTaf = getValues();
@@ -4908,6 +5031,7 @@
           trigger(); // trigger all fields validation
         }, 0);
         updateTAC(convertTafValuesToObject(newTaf));
+        showSnackbar(getSnackbarMessage$1(location, locationLabel));
       };
 
       React__default["default"].useEffect(function () {
@@ -4977,23 +5101,18 @@
           letterSpacing: '0.4px',
           color: 'geowebColors.captions.captionStatus.rgba'
         }
-      }, TAC.split('\n').map(function (line) {
-        return /*#__PURE__*/React__default["default"].createElement(material.Box, {
-          component: "span",
-          key: line,
-          sx: {
-            display: 'inline-block'
-          }
-        }, /*#__PURE__*/React__default["default"].createElement(material.Box, {
-          component: "span",
-          sx: __assign({
-            display: 'inline',
-            boxDecorationBreak: 'clone',
-            WebkitBoxDecorationBreak: 'clone'
-          }, isActive && {
-            backgroundColor: 'geowebColors.functional.warningHighlight.rgba'
-          })
-        }, line));
+      }, typeof TAC === 'string' ? /*#__PURE__*/React__default["default"].createElement(material.Box, {
+        component: "span",
+        sx: __assign({
+          display: 'inline',
+          boxDecorationBreak: 'clone',
+          WebkitBoxDecorationBreak: 'clone'
+        }, isActive && {
+          backgroundColor: 'geowebColors.functional.warningHighlight.rgba'
+        })
+      }, TAC) : /*#__PURE__*/React__default["default"].createElement(AdverseWeatherTACMessage, {
+        TAC: TAC,
+        isActive: isActive
       })));
     };
 
@@ -5140,8 +5259,8 @@
             sm: 'none'
           },
           position: 'absolute',
-          right: '8px',
-          top: '48px'
+          right: '4px',
+          top: '82px'
         }
       }, /*#__PURE__*/React__namespace.createElement(theme.ListItem, null)), /*#__PURE__*/React__namespace.createElement(material.Dialog, {
         open: isOpen,
@@ -5592,7 +5711,10 @@
         shouldClose: true
       }), /*#__PURE__*/React__default["default"].createElement(material.Box, {
         sx: {
-          marginTop: '10px',
+          marginTop: {
+            xs: '44px',
+            sm: '10px'
+          },
           padding: 1
         }
       }, /*#__PURE__*/React__default["default"].createElement(TafForm, {
@@ -5659,7 +5781,10 @@
         "data-testid": "updateTafBtn",
         onClick: onUpdateTaf,
         sx: {
-          marginRight: 1,
+          marginRight: {
+            xs: 2,
+            sm: 1
+          },
           marginLeft: 1
         }
       }, /*#__PURE__*/React__default["default"].createElement(theme.Cached, null))));
@@ -5670,6 +5795,51 @@
       description: "It's not possible to autosave this TAF due to the presence of issue(s). Are you sure you want to close this TAF? Any changes made will be lost.",
       confirmLabel: 'Exit without saving'
     };
+    var getTafMessagePrefix = function getTafMessagePrefix(_a, newStatus) {
+      var location = _a.location,
+          validDateStart = _a.validDateStart,
+          messageType = _a.messageType;
+      var formattedDate = formatBaseTime(moment__default["default"].utc(validDateStart));
+      return "TAF " + location + " " + formattedDate + " " + messageType + " was " + newStatus + " successfully";
+    };
+    var getSnackbarMessage = function getSnackbarMessage(tafFromFrontEnd, isAutoSaved) {
+      if (isAutoSaved === void 0) {
+        isAutoSaved = false;
+      }
+
+      var changeStatusTo = tafFromFrontEnd.changeStatusTo,
+          taf = tafFromFrontEnd.taf;
+
+      if (isAutoSaved) {
+        return 'All changes have been saved automatically';
+      }
+
+      switch (changeStatusTo) {
+        case 'DRAFT':
+          return 'Saved as draft';
+
+        case 'DRAFT_AMENDED':
+          return 'Saved as draft amended';
+
+        case 'DRAFT_CORRECTED':
+          return 'Saved as draft correction';
+
+        case 'PUBLISHED':
+          return getTafMessagePrefix(taf, 'published');
+
+        case 'CANCELLED':
+          return getTafMessagePrefix(taf, 'cancelled');
+
+        case 'CORRECTED':
+          return getTafMessagePrefix(taf, 'corrected');
+
+        case 'AMENDED':
+          return getTafMessagePrefix(taf, 'amended');
+
+        default:
+          return getTafMessagePrefix(taf, 'saved');
+      }
+    };
 
     var TafLayout = function TafLayout(_a) {
       var _b = _a.tafList,
@@ -5678,6 +5848,7 @@
           onUpdateTaf = _c === void 0 ? function () {} : _c,
           lastUpdateTime = _a.lastUpdateTime;
       var api$1 = api.useApiContext().api;
+      var dispatch = reactRedux.useDispatch();
       var confirmDialog = shared.useConfirmationDialog();
 
       var _d = useIssuesPane(),
@@ -5730,7 +5901,17 @@
           error = _q[0],
           setError = _q[1];
 
-      var postTaf = function postTaf(data) {
+      var showSnackbar = React__default["default"].useCallback(function (message) {
+        dispatch(core.snackbarActions.openSnackbar({
+          message: message
+        }));
+      }, [dispatch]);
+
+      var postTaf = function postTaf(data, isAutoSaved) {
+        if (isAutoSaved === void 0) {
+          isAutoSaved = false;
+        }
+
         return __awaiter(void 0, void 0, void 0, function () {
           var error_1;
           return __generator(this, function (_a) {
@@ -5744,8 +5925,9 @@
                 , postTafRequest(data)];
 
               case 1:
-                _a.sent(); // callback
+                _a.sent();
 
+                showSnackbar(getSnackbarMessage(data, isAutoSaved)); // callback
 
                 onUpdateTaf();
                 return [3
@@ -5831,7 +6013,7 @@
                 , postTaf({
                   taf: taf,
                   changeStatusTo: fromActionToStatus(tafActionToDraftAction(tafAction))
-                })];
+                }, true)];
 
               case 3:
                 _a.sent();
@@ -5885,18 +6067,16 @@
       };
 
       React__default["default"].useEffect(function () {
+        var _a, _b;
+
         var newSortedTafs = sortTafTimeSlots(tafList);
         var updatedLocations = timeSlot === 'ACTIVE' ? newSortedTafs.current : newSortedTafs.upcoming;
         updateSortedTafs(sortTafTimeSlots(tafList));
         setLocations(updatedLocations); // update active index
 
-        var newActiveIndex = updatedLocations.findIndex(function (location) {
-          var _a, _b, _c;
-
-          return ((_a = location === null || location === void 0 ? void 0 : location.taf) === null || _a === void 0 ? void 0 : _a.previousId) === ((_c = (_b = locations[activeTafIndex]) === null || _b === void 0 ? void 0 : _b.taf) === null || _c === void 0 ? void 0 : _c.uuid);
-        });
-        var newIndex = newActiveIndex !== -1 ? newActiveIndex : activeTafIndex;
-        setActiveTafIndex(newIndex); // eslint-disable-next-line react-hooks/exhaustive-deps
+        var previousActiveLocationUUID = (_b = (_a = locations[activeTafIndex]) === null || _a === void 0 ? void 0 : _a.taf) === null || _b === void 0 ? void 0 : _b.uuid;
+        var newTafLocationIndex = getNewTafLocationIndex(updatedLocations, previousActiveLocationUUID);
+        setActiveTafIndex(newTafLocationIndex); // eslint-disable-next-line react-hooks/exhaustive-deps
       }, [tafList, setLocations]);
       React__default["default"].useEffect(function () {
         setError(postError);
@@ -5913,7 +6093,7 @@
         setError(patchError);
       }, [patchError]);
 
-      if (!tafList) {
+      if (!tafList || !tafList.length) {
         return null;
       }
 
@@ -6170,10 +6350,14 @@
         postTaf: function postTaf(formData) {
           return axiosInstance.post('/taf', __assign({}, formData));
         },
-        getTAC: function getTAC(tafData, signal) {
-          return axiosInstance.post.apply(axiosInstance, __spreadArray(['/taf2tac'], __read(__spreadArray([__assign({}, tafData)], __read(signal ? [{
+        getTAC: function getTAC(tafData, getJSON, signal) {
+          return axiosInstance.post('/taf2tac', tafData, __assign(__assign({}, signal ? {
             signal: signal
-          }] : [])))));
+          } : {}), {
+            headers: {
+              Accept: getJSON ? 'application/json' : 'text/plain'
+            }
+          }));
         },
         patchTaf: function patchTaf(formData) {
           return axiosInstance.patch('/taf', __assign({}, formData));
@@ -6181,30 +6365,12 @@
       };
     };
 
-    var createApi$1 = function createApi(url, appUrl, auth, setAuth, authTokenUrl, authClientId) {
-      var axiosInstance = api.createApiInstance(url, appUrl, auth, setAuth, authTokenUrl, authClientId);
+    var createApi$1 = function createApi(props) {
+      var axiosInstance = api.createApiInstance(props);
       return getApiRoutes$1(axiosInstance);
     };
 
-    /* *
-     * Licensed under the Apache License, Version 2.0 (the "License");
-     * you may not use this file except in compliance with the License.
-     * You may obtain a copy of the License at
-     *
-     *     http://www.apache.org/licenses/LICENSE-2.0
-     *
-     * Unless required by applicable law or agreed to in writing, software
-     * distributed under the License is distributed on an "AS IS" BASIS,
-     * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-     * See the License for the specific language governing permissions and
-     * limitations under the License.
-     *
-     * Copyright 2022 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
-     * Copyright 2022 - Finnish Meteorological Institute (FMI)
-     * */
-
     var MOCK_USERNAME = 'user.name';
-
     var currentDate = moment__default["default"].utc().format('YYYY-MM-DD');
     var tomorrowDate = moment__default["default"].utc().add(1, 'day').format('YYYY-MM-DD');
     var airportPeriod = 6;
@@ -7003,7 +7169,6 @@
       taf: {
         uuid: '954905487',
         previousId: '5f9583fjdf45ff4330f337925',
-        issueDate: currentDate + "T14:00:00Z",
         baseTime: currentDate + "T12:00:00Z",
         validDateStart: currentDate + "T14:00:00Z",
         validDateEnd: tomorrowDate + "T18:00:00Z",
@@ -7063,7 +7228,6 @@
       editor: null,
       taf: __assign(__assign({}, fakeDraftAmendmentTaf.taf), {
         location: 'EHRD',
-        issueDate: "2022-01-06T14:00:00Z",
         baseTime: "2022-01-06T12:00:00Z",
         validDateStart: "2022-01-06T14:00:00Z",
         validDateEnd: "2022-01-07T18:00:00Z",
@@ -7144,12 +7308,45 @@
     });
 
     var fakeTafTac = 'TAF EHAM 0812/0918 20020G35KT 0500 SN BKN040\nBECMG 0814/0816 0700 BKN001=';
+    var fakeTafTacJson = {
+      tac: [[{
+        text: 'TAF'
+      }, {
+        text: 'EHAM'
+      }, {
+        text: '0812/0918'
+      }, {
+        text: '20020G35KT',
+        type: 'adverse'
+      }, {
+        text: '0500',
+        type: 'adverse'
+      }, {
+        text: 'SN',
+        type: 'adverse'
+      }, {
+        text: 'BKN040'
+      }], [{
+        text: 'BECMG'
+      }, {
+        text: '0814/0816'
+      }, {
+        text: '0700',
+        type: 'adverse'
+      }, {
+        text: 'BKN001',
+        type: 'adverse'
+      }, {
+        text: '='
+      }]]
+    };
 
     var fakeUpdatedTafList = __spreadArray([], __read(fakeTafList));
 
     var setFakeUpdatedList = function setFakeUpdatedList(newList) {
       fakeUpdatedTafList = newList;
     };
+
     var getFakeUpdatedList = function getFakeUpdatedList() {
       return fakeUpdatedTafList;
     };
@@ -7172,12 +7369,16 @@
           console.log('form has been posted with following values:', _postTaf.taf);
           return axiosInstance.post('/taf', _postTaf);
         },
-        getTAC: function getTAC(taf, signal) {
-          return axiosInstance.post.apply(axiosInstance, __spreadArray(['/taf2tac'], __read(__spreadArray([__assign({}, taf)], __read(signal ? [{
+        getTAC: function getTAC(taf, getJSON, signal) {
+          return axiosInstance.post('/taf2tac', taf, __assign(__assign({}, signal ? {
             signal: signal
-          }] : []))))).then(function () {
+          } : {}), {
+            headers: {
+              Accept: getJSON ? 'application/json' : 'text/plain'
+            }
+          })).then(function () {
             return {
-              data: fakeTafTac
+              data: getJSON ? fakeTafTacJson : fakeTafTac
             };
           });
         },
@@ -7242,13 +7443,15 @@
           onSetAuth = _a.onSetAuth,
           onPreventCloseView = _a.onPreventCloseView;
       return config ? /*#__PURE__*/React__namespace.createElement(api.ApiProvider, {
-        baseURL: config.baseUrl,
-        appURL: config.appUrl,
+        config: {
+          baseURL: config.baseURL,
+          appURL: config.baseURL,
+          authTokenURL: config.authTokenURL,
+          authClientId: config.authClientId
+        },
         auth: auth,
         onSetAuth: onSetAuth,
-        createApi: createApi$1,
-        authTokenUrl: config.authTokenUrl,
-        authClientId: config.authClientId
+        createApi: createApi$1
       }, /*#__PURE__*/React__namespace.createElement(shared.ErrorBoundary, null, /*#__PURE__*/React__namespace.createElement(Wrapper, {
         onPreventCloseView: onPreventCloseView
       }))) : null;

package/lib/TafDemo.stories.d.ts

@@ -3,5 +3,21 @@ declare const _default: {
     title: string;
 };
 export default _default;
-export declare const TafModuleLightTheme: () => React.ReactElement;
-export declare const TafModuleDarkTheme: () => React.ReactElement;
+export declare const TafModuleLightTheme: {
+    (): React.ReactElement;
+    parameters: {
+        zeplinLink: {
+            name: string;
+            link: string;
+        }[];
+    };
+};
+export declare const TafModuleDarkTheme: {
+    (): React.ReactElement;
+    parameters: {
+        zeplinLink: {
+            name: string;
+            link: string;
+        }[];
+    };
+};

package/lib/components/ComponentsLookUp/ComponentsLookUp.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ApiUrls, Credentials } from '@opengeoweb/api';
+import { ApiModule, ApiUrls } from '@opengeoweb/api';
 export declare const tafScreenPreset: {
     id: string;
     title: string;
@@ -23,12 +23,10 @@ export interface ComponentsLookUpPayload {
     title?: string;
     initialProps: Record<string, never>;
 }
-declare type ApiModuleProps = {
+interface ApiModuleProps extends ApiModule {
     config: ApiUrls;
-    auth: Credentials;
-    onSetAuth: (credentias: Credentials) => void;
     onPreventCloseView?: (shouldPreventClose: boolean) => void;
-};
+}
 export declare const TafApiWrapper: React.FC<ApiModuleProps>;
 export declare const componentsLookUp: (payload: ComponentsLookUpPayload, { config, auth, onSetAuth }: ApiModuleProps, ConnectedModuleWrapper?: any) => React.ReactElement;
 export {};