Skip to content

Subscription user count to include admins & developers #1286

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Nov 8, 2024
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions client/packages/lowcoder/src/api/apiResponses.ts
Original file line number Diff line number Diff line change
@@ -12,6 +12,13 @@ export interface GenericApiResponse<T> {
data: T;
}

export interface FetchGroupApiResponse<T> extends GenericApiResponse<T> {
totalAdmins: number,
totalAdminsAndDevelopers: number,
totalDevelopersOnly: number,
totalOtherMembers: number,
}

// NO_DATASOURCES_FOUND, 1000, "Unable to find {0} with id {1}"
// INVALID_PARAMTER, 4000, "Invalid parameter {0} provided in the input"
// PLUGIN_NOT_INSTALLED, 4001, "Plugin {0} not installed"
26 changes: 1 addition & 25 deletions client/packages/lowcoder/src/api/subscriptionApi.ts
Original file line number Diff line number Diff line change
@@ -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;
Original file line number Diff line number Diff line change
@@ -28,15 +28,17 @@ const initialState: OrgReduxState = {
orgCreateStatus: "init",
apiUsage: 0,
lastMonthApiUsage: 0,
orgUserStats: {},
};

const orgReducer = createImmerReducer(initialState, {
[ReduxActionTypes.FETCH_ORG_GROUPS_SUCCESS]: (
state: OrgReduxState,
action: ReduxAction<{ orgGroups: OrgGroup[] }>
action: ReduxAction<{ orgGroups: OrgGroup[], orgUserStats: Record<string, number> }>
): OrgReduxState => ({
...state,
orgGroups: action.payload.orgGroups,
orgUserStats: action.payload.orgUserStats,
fetchOrgGroupsFinished: true,
}),
[ReduxActionErrorTypes.FETCH_ORG_GROUPS_ERROR]: (state: OrgReduxState): OrgReduxState => ({
@@ -137,6 +139,7 @@ export interface OrgReduxState {
orgCreateStatus: ApiRequestStatus;
apiUsage: number;
lastMonthApiUsage: number;
orgUserStats: Record<string, number>;
}

export default orgReducer;
10 changes: 8 additions & 2 deletions client/packages/lowcoder/src/redux/sagas/orgSagas.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { messageInstance } from "lowcoder-design/src/components/GlobalInstances";

import { ApiResponse, GenericApiResponse } from "api/apiResponses";
import { ApiResponse, FetchGroupApiResponse, GenericApiResponse } from "api/apiResponses";
import OrgApi, { CreateOrgResponse, GroupUsersResponse, OrgAPIUsageResponse, OrgUsersResponse } from "api/orgApi";
import { AxiosResponse } from "axios";
import { OrgGroup } from "constants/orgConstants";
@@ -49,14 +49,20 @@ export function* updateGroupSaga(action: ReduxAction<UpdateGroupActionPayload>)

export function* fetchGroupsSaga(action: ReduxAction<{ orgId: string }>) {
try {
const response: AxiosResponse<GenericApiResponse<OrgGroup[]>> = yield call(OrgApi.fetchGroup);
const response: AxiosResponse<FetchGroupApiResponse<OrgGroup[]>> = yield call(OrgApi.fetchGroup);
const isValidResponse: boolean = validateResponse(response);
if (isValidResponse) {
const groups = response.data.data;
yield put({
type: ReduxActionTypes.FETCH_ORG_GROUPS_SUCCESS,
payload: {
orgGroups: groups,
orgUserStats: {
totalAdmins: response.data.totalAdmins,
totalAdminsAndDevelopers: response.data.totalAdminsAndDevelopers,
totalDevelopersOnly: response.data.totalDevelopersOnly,
totalOtherMembers: response.data.totalOtherMembers,
}
},
});
}
4 changes: 4 additions & 0 deletions client/packages/lowcoder/src/redux/selectors/orgSelectors.ts
Original file line number Diff line number Diff line change
@@ -8,6 +8,10 @@ export const getOrgGroups = (state: AppState) => {
return state.ui.org.orgGroups;
};

export const getOrgUserStats = (state: AppState) => {
return state.ui.org.orgUserStats;
};

export const getFetchOrgGroupsFinished = (state: AppState) => {
return state.ui.org.fetchOrgGroupsFinished;
};
Original file line number Diff line number Diff line change
@@ -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[];
16 changes: 8 additions & 8 deletions client/packages/lowcoder/src/util/hooks.ts
Original file line number Diff line number Diff line change
@@ -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 { getOrgUserStats } from "@lowcoder-ee/redux/selectors/orgSelectors";
import { fetchGroupsAction } from "@lowcoder-ee/redux/reduxActions/orgActions";

export const ForceViewModeContext = React.createContext<boolean>(false);

@@ -188,7 +188,7 @@ export function useMergeCompStyles(
const preventAppStylesOverwriting = appSettingsComp?.getView()?.preventAppStylesOverwriting;
const { preventStyleOverwriting, appliedThemeId } = props;

const styleKeys = Object.keys(props).filter(key => key.toLowerCase().endsWith('style' || 'styles'));
const styleKeys = Object.keys(props).filter(key => key.toLowerCase().endsWith('style') || key.toLowerCase().endsWith('styles'));
const styleProps: Record<string, any> = {};
styleKeys.forEach((key: string) => {
styleProps[key] = (props as any)[key];
@@ -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 orgUserStats = useSelector((state: AppState) => getOrgUserStats(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 (Object.values(orgUserStats).length && orgUserStats.hasOwnProperty('totalAdminsAndDevelopers')) {
setUserCount(orgUserStats.totalAdminsAndDevelopers);
}
}, [orgUsers]);
}, [orgUserStats]);

return userCount;
};