Merge pull request #25 from FrameMuse/fix-minor-bugs

Fix minor bugs & other minor improvements

package.json

@@ -31,7 +31,8 @@
     "watch": "ncc build src/index.ts -w",
     "compile": "npm run build && npm run start && npm run post-fix",
     "help": "ncc",
-    "test": "",
+    "test": "react-scripts test",
+    "test:coverage": "react-scripts test --coverage *.ts",
     "post-fix": "eslint out --fix"
   },
   "repository": {
@@ -51,4 +52,4 @@
     "url": "https://github.com/FrameMuse/react-modal-global/issues"
   },
   "homepage": "https://github.com/FrameMuse/react-modal-global#readme"
-}
+}

src/controller.ts

@@ -25,20 +25,19 @@ import { serialize } from "./utils"
 const DEFAULT_STATE: ModalContainerState = {
   active: false,
   queue: [],
-  forkedQueue: [],
+  forkedQueue: []
 }
 const DEFAULT_PARAMS: ModalParams = {
   id: 0,
   closable: true,
   weak: false,
-  fork: false,
+  fork: false
 }
 
 function dispatch<P = unknown>(setStateAction: SetStateAction<ModalContainerState<P>>) {
   const lastContainer = [...containers].at(-1)
   if (lastContainer == null) {
     console.warn("ModalError: no containers were mounted.")
-
     return
   }
 
@@ -85,30 +84,20 @@ export class ModalController {
       return
     }
 
-
     dispatch<P>(state => {
-      // Make that we need it
-      if (!modalWindow.params?.weak) {
-        // Skip adding to queue if there is already the same window
-        if (state.queue.length > 0) {
-          const lastWindow = state.queue[state.queue.length - 1]
-          if ((serialize(lastWindow.params) === serialize(modalWindow.params)) && lastWindow.component === modalWindow.component) {
-            return {
-              ...state,
-              active: true,
-              queue: [modalWindow]
-            }
+      // Skip adding to queue if the window is already in the beginning of the queue.
+      if (!modalWindow.params?.weak && state.queue.length > 0) {
+        const lastWindow = state.queue[state.queue.length - 1]
+
+        const areParamsEqual = serialize(modalWindow.params) === serialize(lastWindow.params)
+        const areComponentsEqual = modalWindow.component === lastWindow.component
+        if (areParamsEqual && areComponentsEqual) {
+          return {
+            ...state,
+            active: true
           }
         }
       }
-      // Replace stale window
-      if (state.active === false && state.queue.length === 1) {
-        return {
-          ...state,
-          active: true,
-          queue: [modalWindow]
-        }
-      }
 
       return {
         ...state,
@@ -117,25 +106,25 @@ export class ModalController {
       }
     })
   }
-  private remove<P>(modalWindow: ModalWindow<P>) {
-    if (modalWindow.params.fork) {
+  private remove<P>(modalWindowToRemove: ModalWindow<P>) {
+    if (modalWindowToRemove.params.fork) {
       dispatch(state => {
-        const forkedQueue = state.forkedQueue.filter(mw => mw !== modalWindow)
+        const forkedQueue = state.forkedQueue.filter(mw => mw !== modalWindowToRemove)
         return { ...state, forkedQueue }
       })
       return
     }
 
     dispatch(state => {
-      const filteredQueue = state.queue.filter(mw => mw !== modalWindow)
-      const isFilteredQueueEmpty = filteredQueue.length === 0
-      if (!modalWindow.params.weak) {
-        // Hide modal without removing if it's the last window
-        if (isFilteredQueueEmpty) {
-          return { ...state, active: false }
-        }
+      const newQueue = state.queue.filter(modalWindow => modalWindow !== modalWindowToRemove)
+      const isNewQueueEmpty = newQueue.length === 0
+
+      // Hide modal without removing if it's the last window if it's not weak.
+      if (isNewQueueEmpty && !modalWindowToRemove.params.weak) {
+        return { ...state, active: false }
       }
-      return { ...state, queue: filteredQueue, active: !isFilteredQueueEmpty }
+
+      return { ...state, queue: newQueue, active: !isNewQueueEmpty }
     })
   }
   private fork<P>(modalWindow: ModalWindow<P>) {

src/hooks.ts

@@ -22,7 +22,7 @@ import { modalContext } from "./context"
 
 export function useModalContext() {
   const context = useContext(modalContext)
-  if (!context) throw new Error("ModalError: Out of Modal context")
+  if (!context) throw new Error("ModalError: useModalContext must be used within a modalContext")
 
   return context
 }

src/utils.ts

@@ -18,15 +18,6 @@ copies or substantial portions of the Software.
 
 import { SyntheticEvent } from "react"
 
-/**
- *
- * @returns `class1 class2`
- */
-export function classMerge(...classNames: Array<string | null | undefined>): string {
-  const space = " "
-  return classNames.filter(Boolean).join(space)
-}
-
 /**
  * Join modifiers with origin class
  * @returns `"origin-class origin-class--modifier"`
@@ -76,13 +67,3 @@ export function stopPropagation(callback?: Function | null) {
     callback?.()
   }
 }
-
-export function inputValue(callback: Function) {
-  return (event: SyntheticEvent<HTMLInputElement | HTMLTextAreaElement>) => {
-    callback(event.currentTarget.value)
-  }
-}
-
-export function isDictionary(object: unknown): object is Record<keyof never, unknown> {
-  return object instanceof Object && object.constructor === Object
-}