@opengeoweb/snackbar 9.15.0 → 9.17.0

package/index.esm.js

@@ -3,8 +3,28 @@ import { useDispatch, useSelector } from 'react-redux';
 import { CustomIconButton, withEggs } from '@opengeoweb/shared';
 import { Snackbar } from '@mui/material';
 import { Close } from '@opengeoweb/theme';
-import { createEntityAdapter, createSlice, createSelector } from '@reduxjs/toolkit';
-import { takeLatest, select, put, delay } from 'redux-saga/effects';
+import 'i18next';
+import { useTranslation } from 'react-i18next';
+import { createEntityAdapter, createSlice, createSelector, createListenerMiddleware } from '@reduxjs/toolkit';
+
+var en = {
+	"snackbar-close": "Close"
+};
+var fi = {
+	"snackbar-close": "ei käännetty"
+};
+var no = {
+	"snackbar-close": "Lukk"
+};
+var nl = {
+	"snackbar-close": "Sluiten"
+};
+var snackbarTranslations = {
+	en: en,
+	fi: fi,
+	no: no,
+	nl: nl
+};
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
@@ -1104,11 +1124,40 @@ function __rest(s, e) {
     return t;
 }
 
+function __awaiter(thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+}
+
 typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
     var e = new Error(message);
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
+/* *
+ * 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 2024 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2024 - Finnish Meteorological Institute (FMI)
+ * */
+const SNACKBAR_NAMESPACE = 'snackbar';
+const useSnackbarTranslation = () => useTranslation(SNACKBAR_NAMESPACE);
+
 const SnackbarWrapper = _a => {
   var {
       children,
@@ -1117,6 +1166,9 @@ const SnackbarWrapper = _a => {
       id
     } = _a,
     props = __rest(_a, ["children", "isOpen", "onCloseSnackbar", "id"]);
+  const {
+    t
+  } = useSnackbarTranslation();
   return jsxs(Fragment, {
     children: [children, jsx(Snackbar, Object.assign({
       "data-testid": "snackbarComponent",
@@ -1127,7 +1179,7 @@ const SnackbarWrapper = _a => {
         mouseEvent: false
       },
       action: jsx(CustomIconButton, Object.assign({
-        "aria-label": "close",
+        "aria-label": t('snackbar-close'),
         "data-testid": "snackbarCloseButton",
         onClick: onCloseSnackbar,
         size: "large",
@@ -1176,9 +1228,9 @@ const slice = createSlice({
     draft,
     // eslint-disable-next-line no-unused-vars
     action) => {},
-    // triggerOpenSnackbarBySaga is triggered by the saga to open the snackbar after the current snackbars have all been closed
+    // triggerOpenSnackbarByListener is triggered by the listener to open the snackbar after the current snackbars have all been closed
     // DO NOT CALL THIS ACTION DIRECTLY!
-    triggerOpenSnackbarBySaga: (draft, action) => {
+    triggerOpenSnackbarByListener: (draft, action) => {
       const {
         snackbarContent
       } = action.payload;
@@ -1234,10 +1286,10 @@ const getFirstSnackbarMessage = createSelector(getCurrentSnackbarMessages, curre
 });
 
 var selectors = /*#__PURE__*/Object.freeze({
-	__proto__: null,
-	getSnackbarStore: getSnackbarStore,
-	getCurrentSnackbarMessages: getCurrentSnackbarMessages,
-	getFirstSnackbarMessage: getFirstSnackbarMessage
+  __proto__: null,
+  getSnackbarStore: getSnackbarStore,
+  getCurrentSnackbarMessages: getCurrentSnackbarMessages,
+  getFirstSnackbarMessage: getFirstSnackbarMessage
 });
 
 /* *
@@ -1258,7 +1310,7 @@ var selectors = /*#__PURE__*/Object.freeze({
  * */
 
 var types = /*#__PURE__*/Object.freeze({
-	__proto__: null
+  __proto__: null
 });
 
 var wellKnownSymbol$1 = wellKnownSymbol$3;
@@ -1367,31 +1419,37 @@ if (NOT_GENERIC || INCORRECT_NAME) {
 }
 
 const hideTime = 4000;
-function* openSnackbarSaga(capturedAction) {
-  const snackbarMessage = capturedAction.payload.message;
-  const currentSnackbarMessages = yield select(getCurrentSnackbarMessages);
-  // If there are currently opened snackbars we need to close these first
-  if (currentSnackbarMessages.length) {
-    yield put(snackbarActions.closeSnackbar());
-  }
-  // Generate a unique id
-  const id = `snackbar${Date.now().toString()}`;
-  yield put(snackbarActions.triggerOpenSnackbarBySaga({
-    snackbarContent: {
-      message: snackbarMessage,
-      id
+const snackbarListener = createListenerMiddleware();
+snackbarListener.startListening({
+  actionCreator: snackbarActions.openSnackbar,
+  effect: ({
+    payload
+  }, listenerApi) => __awaiter(void 0, void 0, void 0, function* () {
+    listenerApi.cancelActiveListeners();
+    const {
+      message: snackbarMessage
+    } = payload;
+    const currentSnackbarMessages = getCurrentSnackbarMessages(listenerApi.getState());
+    // If there are currently opened snackbars we need to close these first
+    if (currentSnackbarMessages.length) {
+      listenerApi.dispatch(snackbarActions.closeSnackbar());
     }
-  }));
-  // If no new snackbar is triggered cancelling this saga, hide the snackbar after X seconds
-  yield delay(hideTime);
-  const currentSnackbarMessagesOpen = yield select(getCurrentSnackbarMessages);
-  if (currentSnackbarMessagesOpen.length) {
-    yield put(snackbarActions.closeSnackbar());
-  }
-}
-function* rootSaga() {
-  yield takeLatest(snackbarActions.openSnackbar.type, openSnackbarSaga);
-}
+    // Generate a unique id
+    const id = `snackbar${Date.now().toString()}`;
+    listenerApi.dispatch(snackbarActions.triggerOpenSnackbarByListener({
+      snackbarContent: {
+        message: snackbarMessage,
+        id
+      }
+    }));
+    // If no new snackbar is triggered cancelling this listener, hide the snackbar after X seconds
+    yield listenerApi.delay(hideTime);
+    const currentSnackbarMessagesOpen = getCurrentSnackbarMessages(listenerApi.getState());
+    if (currentSnackbarMessagesOpen.length) {
+      listenerApi.dispatch(snackbarActions.closeSnackbar());
+    }
+  })
+});
 
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -1414,7 +1472,7 @@ const snackbarModuleConfig = {
   reducersMap: {
     snackbar: reducer
   },
-  sagas: [rootSaga]
+  middlewares: [snackbarListener.middleware]
 };
 
 const SnackbarWrapperConnect = withEggs([snackbarModuleConfig])(props => {
@@ -1431,4 +1489,4 @@ const SnackbarWrapperConnect = withEggs([snackbarModuleConfig])(props => {
   }, props));
 });
 
-export { SnackbarWrapperConnect, snackbarActions, snackbarModuleConfig, reducer as snackbarReducer, rootSaga as snackbarSaga, selectors as snackbarSelectors, types as snackbarTypes };
+export { SnackbarWrapperConnect, hideTime, snackbarActions, snackbarListener, snackbarModuleConfig, reducer as snackbarReducer, selectors as snackbarSelectors, snackbarTranslations, types as snackbarTypes };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/snackbar",
-  "version": "9.15.0",
+  "version": "9.17.0",
   "description": "GeoWeb snackbar library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -14,7 +14,8 @@
     "react-redux": "^8.1.3",
     "@reduxjs/toolkit": "^1.9.7",
     "@redux-eggs/core": "^2.2.0",
-    "redux-saga": "^1.2.3"
+    "i18next": "^23.10.1",
+    "react-i18next": "^13.5.0"
   },
   "peerDependencies": {
     "react": "18"

package/src/lib/components/Providers/Providers.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { Store } from '@reduxjs/toolkit';
+interface SnackbarTranslationsWrapperProps {
+    children?: React.ReactNode;
+}
+export declare const DemoWrapper: React.FC<SnackbarTranslationsWrapperProps>;
+interface ProviderProps {
+    children?: React.ReactNode;
+    store: Store;
+}
+export declare const DemoWrapperConnect: React.FC<ProviderProps>;
+export {};

package/src/lib/components/Snackbar/SnackbarWrapperConnect.spec.d.ts

@@ -1,8 +1 @@
-import * as React from 'react';
-import { Store } from '@reduxjs/toolkit';
-interface TestProviderProps {
-    children?: React.ReactNode;
-    store: Store;
-}
-export declare const TestProvider: React.FC<TestProviderProps>;
 export {};

package/src/lib/index.d.ts

@@ -1,2 +1,4 @@
+import snackbarTranslations from './locales/snackbar.json';
 export * from './components/Snackbar';
 export * from './store';
+export { snackbarTranslations };

package/src/lib/store/index.d.ts

@@ -3,4 +3,4 @@ export * as snackbarSelectors from './selectors';
 export * as snackbarTypes from './types';
 export * from './config';
 export { reducer as snackbarReducer } from './reducer';
-export { rootSaga as snackbarSaga } from './sagas';
+export * from './listener';

package/src/lib/store/listener.d.ts

@@ -0,0 +1,3 @@
+import { SnackbarModuleStore } from './types';
+export declare const hideTime = 4000;
+export declare const snackbarListener: import("@reduxjs/toolkit").ListenerMiddlewareInstance<SnackbarModuleStore, import("@reduxjs/toolkit").ThunkDispatch<SnackbarModuleStore, unknown, import("redux").AnyAction>, unknown>;

package/src/lib/store/reducer.d.ts

@@ -1,11 +1,11 @@
 import { PayloadAction, Draft } from '@reduxjs/toolkit';
-import { OpenSnackbarPayload, SnackbarItem, SnackbarState, TriggerOpenSnackbarBySagaPayload } from './types';
+import { OpenSnackbarPayload, SnackbarItem, SnackbarState, TriggerOpenSnackbarByListenerPayload } from './types';
 export declare const snackbarAdapter: import("@reduxjs/toolkit").EntityAdapter<SnackbarItem>;
 export declare const initialState: SnackbarState;
 export declare const reducer: import("redux").Reducer<SnackbarState, import("redux").AnyAction>;
 export declare const snackbarActions: import("@reduxjs/toolkit").CaseReducerActions<{
     openSnackbar: (draft: Draft<SnackbarState>, action: PayloadAction<OpenSnackbarPayload>) => void;
-    triggerOpenSnackbarBySaga: (draft: Draft<SnackbarState>, action: PayloadAction<TriggerOpenSnackbarBySagaPayload>) => void;
+    triggerOpenSnackbarByListener: (draft: Draft<SnackbarState>, action: PayloadAction<TriggerOpenSnackbarByListenerPayload>) => void;
     closeSnackbar: (draft: Draft<SnackbarState>) => void;
 }, "snackbar">;
-export type SnackbarActions = ReturnType<typeof snackbarActions.openSnackbar> | ReturnType<typeof snackbarActions.triggerOpenSnackbarBySaga> | ReturnType<typeof snackbarActions.closeSnackbar>;
+export type SnackbarActions = ReturnType<typeof snackbarActions.openSnackbar> | ReturnType<typeof snackbarActions.triggerOpenSnackbarByListener> | ReturnType<typeof snackbarActions.closeSnackbar>;

package/src/lib/store/types.d.ts

@@ -10,6 +10,6 @@ export interface SnackbarModuleStore {
 export interface OpenSnackbarPayload {
     message: string;
 }
-export interface TriggerOpenSnackbarBySagaPayload {
+export interface TriggerOpenSnackbarByListenerPayload {
     snackbarContent: SnackbarItem;
 }

package/src/lib/utils/i18n.d.ts

@@ -0,0 +1,5 @@
+import i18n from 'i18next';
+import { UseTranslationResponse } from 'react-i18next';
+export declare const SNACKBAR_NAMESPACE = "snackbar";
+export declare const initSnackbarI18n: () => void;
+export declare const useSnackbarTranslation: () => UseTranslationResponse<typeof SNACKBAR_NAMESPACE, typeof i18n>;

package/src/lib/store/sagas.d.ts

@@ -1,5 +0,0 @@
-import { SagaIterator } from 'redux-saga';
-import { SnackbarActions } from './reducer';
-export declare function openSnackbarSaga(capturedAction: SnackbarActions): SagaIterator;
-export declare function rootSaga(): SagaIterator;
-export default rootSaga;