@dile/lib 0.0.1

package/.vscode/settings.json

@@ -0,0 +1,22 @@
+{
+  "workbench.colorCustomizations": {
+    "activityBar.activeBackground": "#fbed80",
+    "activityBar.background": "#fbed80",
+    "activityBar.foreground": "#15202b",
+    "activityBar.inactiveForeground": "#15202b99",
+    "activityBarBadge.background": "#06b9a5",
+    "activityBarBadge.foreground": "#15202b",
+    "commandCenter.border": "#15202b99",
+    "sash.hoverBorder": "#fbed80",
+    "statusBar.background": "#f9e64f",
+    "statusBar.foreground": "#15202b",
+    "statusBarItem.hoverBackground": "#f7df1e",
+    "statusBarItem.remoteBackground": "#f9e64f",
+    "statusBarItem.remoteForeground": "#15202b",
+    "titleBar.activeBackground": "#f9e64f",
+    "titleBar.activeForeground": "#15202b",
+    "titleBar.inactiveBackground": "#f9e64f99",
+    "titleBar.inactiveForeground": "#15202b99"
+  },
+  "peacock.color": "#f9e64f"
+}

package/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "@dile/lib",
+  "version": "0.0.1",
+  "description": "App libraries and helpers",
+  "main": "index.js",
+  "scripts": {
+    "test": "test"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "lib",
+    "app"
+  ],
+  "author": "Midesweb",
+  "license": "MIT",
+  "dependencies": {
+    "@reduxjs/toolkit": "^2.5.1"
+  }
+}

package/src/lib/feedback-mixin.js

@@ -0,0 +1,20 @@
+import { store } from '../redux/store';
+import { positiveFeedback, negativeFeedback, neutralFeedback, startLoading, stopLoading } from '../redux/app-slice';
+
+export const FeedbackMixin = (Superclass) => class extends Superclass {
+  positiveFeedback(msg) { 
+    store.dispatch(positiveFeedback(msg));
+  }
+  negativeFeedback(msg) {
+    store.dispatch(negativeFeedback(msg));
+  }
+  neutralFeedback(msg) {
+    store.dispatch(neutralFeedback(msg));
+  }
+  startLoading() {
+    store.dispatch(startLoading());
+  }
+  stopLoading() {
+    store.dispatch(stopLoading());
+  }
+}

package/src/lib/state-mixin.js

@@ -0,0 +1,26 @@
+import { store } from '../redux/store';
+
+export const StateMixin = (superclass) => class extends superclass {
+
+  connectedCallback() {
+    super.connectedCallback();
+    this._unsuscribe = store.subscribe(() => {
+      const state = this.getState();
+      this.stateChanged(state);
+    });
+    this.stateChanged(this.getState());
+  }
+
+  disconnectedCallback() {
+    this._unsuscribe();
+    super.disconnectedCallback();
+  }
+
+  stateChanged(state) {
+    // Redefinir este método para cachear el estado que necesite el componente 
+  }
+
+  getState() {
+    return store.getState();
+  }
+}

package/src/redux/app-slice.js

@@ -0,0 +1,43 @@
+import { createSlice } from '@reduxjs/toolkit';
+
+export const appSlice = createSlice({
+  name: 'app',
+  initialState: {
+    feedback: null,
+    loading: false,
+  },
+  reducers: {
+    positiveFeedback(state, action) {
+      state.feedback = {
+        status: 'success',
+        msg: action.payload,
+      }
+    },
+    negativeFeedback(state, action) {
+      state.feedback = {
+        status: 'error',
+        msg: action.payload,
+      }
+    },
+    neutralFeedback(state, action) {
+      state.feedback = {
+        status: 'neutral',
+        msg: action.payload,
+      }
+    },
+    startLoading(state)  {
+      state.loading = true;
+    },
+    stopLoading(state) {
+      state.loading = false;
+    }
+  }
+});
+
+export const {
+  negativeFeedback,
+  positiveFeedback,
+  neutralFeedback,
+  startLoading,
+  stopLoading,
+} = appSlice.actions;

package/src/redux/store.js

@@ -0,0 +1,10 @@
+import { configureStore } from '@reduxjs/toolkit';
+import { appSlice } from './app-slice';
+import { userSlice } from './user-slice';
+
+export const store = configureStore({
+  reducer: {
+    app: appSlice.reducer,
+    user: userSlice.reducer,
+  }
+});

package/src/redux/user-slice.js

@@ -0,0 +1,31 @@
+import { createSlice } from '@reduxjs/toolkit';
+
+export const userSlice = createSlice({
+  name: 'user',
+  initialState: {
+    userData: null,
+    token: '',
+    isLoggedIn: false,
+    isInitialized: false,
+  },
+  reducers: {
+    storeUser(state, action) {
+      state.userData = action.payload;
+      state.isLoggedIn = true;
+      state.isInitialized = true;
+    },
+    removeUser(state) {
+      state.userData = null;
+      state.isLoggedIn = false;
+      state.token = '';
+    },
+    storeToken(state, action) {
+      state.token = action.payload;
+    },
+    setInitialized(state) {
+      state.isInitialized = true;
+    }
+  }
+})
+
+export const { storeUser, removeUser, storeToken, setInitialized } = userSlice.actions;