🐛 fix: onClear closes modals (closes #644)

SnailyCAD · Apr 26, 2022 · fd1ab85 · fd1ab85
1 parent efc8d42
commit fd1ab85
Show file tree

Hide file tree

Showing 3 changed files with 223 additions and 90 deletions.
diff --git a/packages/client/package.json b/packages/client/package.json
@@ -16,9 +16,9 @@
     "test": "yarn vitest run"
   },
   "dependencies": {
-    "@casper124578/use-socket.io": "4.0.0",
-    "@casper124578/useful": "^1.5.6",
-    "@headlessui/react": "^1.5.0",
+    "@casper124578/use-socket.io": "4.1.0",
+    "@casper124578/useful": "^1.6.0",
+    "@headlessui/react": "^1.6.0",
     "@radix-ui/react-accordion": "^0.1.6",
     "@radix-ui/react-context-menu": "^0.1.6",
     "@radix-ui/react-dropdown-menu": "^0.1.6",
@@ -46,7 +46,7 @@
     "nookies": "^2.5.2",
     "pretty-bytes": "^6.0.0",
     "react": "^17.0.2",
-    "react-bootstrap-icons": "^1.8.1",
+    "react-bootstrap-icons": "^1.8.2",
     "react-colorful": "^5.5.1",
     "react-cool-onclickoutside": "^1.7.0",
     "react-cropper": "^2.1.8",
@@ -60,10 +60,10 @@
     "react-sortablejs": "^6.1.1",
     "react-table": "^7.7.0",
     "react-use": "^17.3.2",
-    "slate": "^0.77.0",
+    "slate": "^0.77.2",
     "slate-history": "^0.66.0",
-    "slate-react": "^0.77.0",
-    "socket.io-client": "^4.4.1",
+    "slate-react": "^0.77.4",
+    "socket.io-client": "^4.5.0",
     "sortablejs": "^1.15.0",
     "type-fest": "^2.12.2",
     "uuid": "^8.3.2",
@@ -74,16 +74,16 @@
     "@types/leaflet": "^1.7.9",
     "@types/react": "^17.0.43",
     "@types/react-dom": "^17.0.14",
-    "@types/react-table": "^7.7.10",
+    "@types/react-table": "^7.7.11",
     "@types/sortablejs": "^1.10.7",
     "@types/uuid": "^8.3.4",
-    "autoprefixer": "^10.4.4",
+    "autoprefixer": "^10.4.5",
     "postcss": "^8.4.12",
     "rimraf": "^3.0.2",
-    "sass": "^1.50.0",
+    "sass": "^1.51.0",
     "tailwindcss": "^3.0.24",
     "typescript": "^4.6.3",
-    "vite": "^2.9.5",
-    "vitest": "^0.9.3"
+    "vite": "^2.9.6",
+    "vitest": "^0.10.0"
   }
 }
diff --git a/packages/client/src/components/form/Select.tsx b/packages/client/src/components/form/Select.tsx
@@ -35,32 +35,32 @@ interface Props<Value extends SelectValue = SelectValue<any>>
 export function Select({ name, onChange, ...rest }: Props) {
   const { user } = useAuth();
   const common = useTranslations("Common");
+  const { canBeClosed } = useModal();
+
   const value =
     typeof rest.value === "string" ? rest.values.find((v) => v.value === rest.value) : rest.value;
-  const { canBeClosed } = useModal();
 
   const useDarkTheme =
     user?.isDarkTheme &&
     typeof window !== "undefined" &&
     window.document.body.classList.contains("dark");
 
+  const theme = useDarkTheme ? { backgroundColor: "rgb(39, 40, 43)", color: "white" } : {};
   const fixedClearable =
     Array.isArray(value) && value.some((v) => typeof v.isFixed !== "undefined");
-  const theme = useDarkTheme ? { backgroundColor: "rgb(39, 40, 43)", color: "white" } : {};
-  const fixedOptions = React.useMemo(
-    () => (Array.isArray(value) ? value.filter((v) => v.isFixed) : []),
-    [value],
-  );
 
   function handleChange(changedValue: SelectValue | null, actionMeta: ActionMeta<any>) {
+    const fixedOptions = Array.isArray(value) ? value.filter((v) => v.isFixed) : [];
+
     if (["pop-value", "remove-value"].includes(actionMeta.action) && changedValue?.isFixed) {
       return;
     }
 
     if (actionMeta.action === "clear" && Array.isArray(value)) {
-      return onChange({
+      onChange({
         target: { name, value: rest.isMulti ? fixedOptions : changedValue?.value ?? null },
       });
+      return;
     }
 
     onChange({