added load more function to mobile view of responsive table to the remaining uses

src/pages/Groups.tsx

@@ -13,6 +13,7 @@ import { or } from "utils/types";
 import PageContainer from "./PageContainer";
 import GroupSettings from "group/GroupSettings";
 import { green } from "@mui/material/colors";
+import { cloneDeep } from "lodash";
 
 const useStyles = makeStyles((theme: Theme) => {
   const isMobile = useMobile()
@@ -163,6 +164,15 @@ export default function GroupsPage() {
         isLoading={loading}
         setSearchText={setSearch}
         onRowClick={handleRowClick}
+        loadMore={()=>{
+          let current = cloneDeep(groups)
+          setLoading(true)
+          groupAPI.listGroups(limit, current.length, order, orderBy, search).then(resp => {
+            setGroups(or(current.concat(resp.data.groups), current))
+          }).finally(() => {
+            setLoading(false)
+          })
+        }}
       />
       <GroupSettings
         // initialGroup={selectedGroup}