fix: do pagination in fleet free with correct query params (#24494) (#…

…24525)

cherry-pick for #24494

changes/23404-pagination

@@ -0,0 +1 @@
+- Fixes a bug with pagination in the profiles and scripts lists.

frontend/pages/ManageControlsPage/OSSettings/cards/CustomSettings/CustomSettings.tsx

@@ -118,17 +118,16 @@ const CustomSettings = ({
   };
 
   // pagination controls
-  const path = PATHS.CONTROLS_CUSTOM_SETTINGS.concat(
-    `?team_id=${currentTeamId}`
-  );
+  const path = PATHS.CONTROLS_CUSTOM_SETTINGS;
+  const queryString = isPremiumTier ? `?team_id=${currentTeamId}&` : "?";
 
   const onPrevPage = useCallback(() => {
-    router.push(path.concat(`&page=${currentPage - 1}`));
-  }, [router, path, currentPage]);
+    router.push(path.concat(`${queryString}page=${currentPage - 1}`));
+  }, [router, path, currentPage, queryString]);
 
   const onNextPage = useCallback(() => {
-    router.push(path.concat(`&page=${currentPage + 1}`));
-  }, [router, path, currentPage]);
+    router.push(path.concat(`${queryString}page=${currentPage + 1}`));
+  }, [router, path, currentPage, queryString]);
 
   const onClickDelete = (profile: IMdmProfile) => {
     selectedProfile.current = profile;

frontend/pages/ManageControlsPage/Scripts/Scripts.tsx

@@ -34,6 +34,7 @@ interface IScriptsProps {
 }
 
 const Scripts = ({ router, currentPage, teamIdForApi }: IScriptsProps) => {
+  const { isPremiumTier } = useContext(AppContext);
   const [showDeleteScriptModal, setShowDeleteScriptModal] = useState(false);
   const [showScriptDetailsModal, setShowScriptDetailsModal] = useState(false);
   const [goBackToScriptDetails, setGoBackToScriptDetails] = useState(false); // Used for onCancel in delete modal
@@ -69,13 +70,14 @@ const Scripts = ({ router, currentPage, teamIdForApi }: IScriptsProps) => {
   );
 
   // pagination controls
-  const path = PATHS.CONTROLS_SCRIPTS.concat(`?team_id=${teamIdForApi}`);
+  const path = PATHS.CONTROLS_SCRIPTS;
+  const queryString = isPremiumTier ? `?team_id=${teamIdForApi}&` : "?";
   const onPrevPage = useCallback(() => {
-    router.push(path.concat(`&page=${currentPage - 1}`));
-  }, [router, path, currentPage]);
+    router.push(path.concat(`${queryString}page=${currentPage - 1}`));
+  }, [router, path, currentPage, queryString]);
   const onNextPage = useCallback(() => {
-    router.push(path.concat(`&page=${currentPage + 1}`));
-  }, [router, path, currentPage]);
+    router.push(path.concat(`${queryString}page=${currentPage + 1}`));
+  }, [router, path, currentPage, queryString]);
 
   const { config } = useContext(AppContext);
   if (!config) return null;