Merge pull request #5140 from strapi/fix/select-relations

Fix select relations

examples/getstarted/api/address/models/Address.settings.json

@@ -25,8 +25,10 @@
     "postal_coder": {
       "type": "string"
     },
-    "category": {
-      "model": "category"
+    "categories": {
+      "collection": "category",
+      "via": "addresses",
+      "dominant": true
     },
     "cover": {
       "model": "file",

examples/getstarted/api/category/models/Category.settings.json

@@ -13,6 +13,10 @@
   "attributes": {
     "name": {
       "type": "string"
+    },
+    "addresses": {
+      "via": "categories",
+      "collection": "address"
     }
   }
 }

packages/strapi-plugin-content-manager/admin/src/components/SelectWrapper/index.js

@@ -45,6 +45,7 @@ function SelectWrapper({
   const { signal } = abortController;
   const ref = useRef();
   const startRef = useRef();
+
   startRef.current = state._start;
 
   ref.current = async () => {
@@ -55,6 +56,9 @@ function SelectWrapper({
 
         if (isEmpty(params._q)) {
           delete params._q;
+        } else {
+          delete params._limit;
+          delete params._start;
         }
 
         const data = await request(requestUrl, {
@@ -69,6 +73,7 @@ function SelectWrapper({
 
         if (!isEmpty(params._q)) {
           setOptions(formattedData);
+          setState(prev => ({ ...prev, _start: 0 }));
 
           return;
         }
@@ -97,19 +102,17 @@ function SelectWrapper({
     }
   };
 
-  useEffect(() => {
-    ref.current();
-
-    return () => {
-      abortController.abort();
-    };
-  }, [ref]);
-
   useEffect(() => {
     if (state._q !== '') {
-      ref.current();
+      let timer = setTimeout(() => {
+        ref.current();
+      }, 300);
+
+      return () => clearTimeout(timer);
     }
 
+    ref.current();
+
     return () => {
       abortController.abort();
     };
@@ -140,7 +143,7 @@ function SelectWrapper({
   };
 
   const onMenuScrollToBottom = () => {
-    setState(prevState => ({ ...prevState, _start: prevState._start + 1 }));
+    setState(prevState => ({ ...prevState, _start: prevState._start + 20 }));
   };
 
   const isSingle = [