count subscription users from groups list

Author: raheeliftikhar5

client/packages/lowcoder/src/api/subscriptionApi.ts

@@ -3,7 +3,7 @@ import axios, { AxiosInstance, AxiosRequestConfig, CancelToken } from "axios";
 import { useDispatch, useSelector } from "react-redux";
 import { useEffect, useState} from "react";
 import { calculateFlowCode }  from "./apiUtils";
-import { fetchOrgUsersAction } from "redux/reduxActions/orgActions";
+import { fetchGroupsAction, fetchOrgUsersAction } from "redux/reduxActions/orgActions";
 import { getOrgUsers } from "redux/selectors/orgSelectors";
 import { AppState } from "@lowcoder-ee/redux/reducers";
 import type {
@@ -289,28 +289,4 @@ export const getCustomerPortalSession = async (customerId: string) => {
   }
 };
 
-// Hooks
-
-export const useOrgUserCount = (orgId: string) => {
-  const dispatch = useDispatch();
-  const orgUsers = useSelector((state: AppState) => getOrgUsers(state)); // Use selector to get orgUsers from state
-  const [userCount, setUserCount] = useState<number>(0);
-
-  useEffect(() => {
-    // Dispatch action to fetch organization users
-    if (orgId) {
-      dispatch(fetchOrgUsersAction(orgId));
-    }
-  }, [dispatch, orgId]);
-
-  useEffect(() => {
-    // Update user count when orgUsers state changes
-    if (orgUsers && orgUsers.length > 0) {
-      setUserCount(orgUsers.length);
-    }
-  }, [orgUsers]);
-
-  return userCount;
-};
-
 export default SubscriptionApi;

client/packages/lowcoder/src/util/context/SubscriptionContext.tsx

@@ -1,10 +1,11 @@
-import { createCheckoutLink, createCustomer, getProducts, searchCustomer, useOrgUserCount } from "@lowcoder-ee/api/subscriptionApi";
+import { createCheckoutLink, createCustomer, getProducts, searchCustomer } from "@lowcoder-ee/api/subscriptionApi";
 import { StripeCustomer, SubscriptionProduct, InitSubscriptionProducts, LowcoderSearchCustomer, LowcoderNewCustomer, Subscription } from "@lowcoder-ee/constants/subscriptionConstants";
 import { getDeploymentId } from "@lowcoder-ee/redux/selectors/configSelectors";
 import { getFetchSubscriptionsFinished, getSubscriptions, getSubscriptionsError } from "@lowcoder-ee/redux/selectors/subscriptionSelectors";
 import { getCurrentUser, getUser } from "@lowcoder-ee/redux/selectors/usersSelectors";
 import { createContext, ReactNode, useContext, useEffect, useState } from "react";
 import { useSelector } from "react-redux";
+import { useOrgUserCount } from "../hooks";
 
 export interface SubscriptionContextType {
   products: SubscriptionProduct[];

client/packages/lowcoder/src/util/hooks.ts

@@ -27,8 +27,8 @@ import { ThemeDetail } from "@lowcoder-ee/api/commonSettingApi";
 import { uniq } from "lodash";
 import { constantColors } from "components/colorSelect/colorUtils";
 import { AppState } from "@lowcoder-ee/redux/reducers";
-import { getOrgUsers } from "@lowcoder-ee/redux/selectors/orgSelectors";
-import { fetchOrgUsersAction } from "@lowcoder-ee/redux/reduxActions/orgActions";
+import { getOrgGroups, getOrgUsers } from "@lowcoder-ee/redux/selectors/orgSelectors";
+import { fetchGroupsAction, fetchOrgUsersAction } from "@lowcoder-ee/redux/reduxActions/orgActions";
 
 export const ForceViewModeContext = React.createContext<boolean>(false);
 
@@ -263,22 +263,22 @@ export function useThemeColors(allowGradient?: boolean) {
 
 export const useOrgUserCount = (orgId: string) => {
   const dispatch = useDispatch();
-  const orgUsers = useSelector((state: AppState) => getOrgUsers(state)); // Use selector to get orgUsers from state
+  const orgGroups = useSelector((state: AppState) => getOrgGroups(state)); // Use selector to get orgUsers from state
   const [userCount, setUserCount] = useState<number>(0);
 
   useEffect(() => {
     // Dispatch action to fetch organization users
     if (orgId) {
-      dispatch(fetchOrgUsersAction(orgId));
+      dispatch(fetchGroupsAction(orgId));
     }
   }, [dispatch, orgId]);
 
   useEffect(() => {
     // Update user count when orgUsers state changes
-    if (orgUsers && orgUsers.length > 0) {
-      setUserCount(orgUsers.length);
+    if (orgGroups && orgGroups.length > 0) {
+      setUserCount(orgGroups.length);
     }
-  }, [orgUsers]);
+  }, [orgGroups]);
 
   return userCount;
 };