Add enterprise upgrade modals when adding a network device (#961)

DefGuard · Jan 19, 2025 · 49ffa0c · 49ffa0c
1 parent feef3f3
commit 49ffa0c
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 0 deletions.
diff --git a/web/src/pages/devices/modals/AddStandaloneDeviceModal/steps/SetupCliStep/SetupCliStep.tsx b/web/src/pages/devices/modals/AddStandaloneDeviceModal/steps/SetupCliStep/SetupCliStep.tsx
@@ -10,7 +10,9 @@ import {
 } from '../../../../../../shared/defguard-ui/components/Layout/Button/types';
 import { MessageBox } from '../../../../../../shared/defguard-ui/components/Layout/MessageBox/MessageBox';
 import { MessageBoxType } from '../../../../../../shared/defguard-ui/components/Layout/MessageBox/types';
+import { useAppStore } from '../../../../../../shared/hooks/store/useAppStore';
 import { useAuthStore } from '../../../../../../shared/hooks/store/useAuthStore';
+import { useEnterpriseUpgradeStore } from '../../../../../../shared/hooks/store/useEnterpriseUpgradeStore';
 import useApi from '../../../../../../shared/hooks/useApi';
 import { useToaster } from '../../../../../../shared/hooks/useToaster';
 import { QueryKeys } from '../../../../../../shared/queries';
@@ -43,6 +45,10 @@ export const SetupCliStep = () => {
     standaloneDevice: { createCliDevice },
   } = useApi();
 
+  const showUpgradeToast = useEnterpriseUpgradeStore((s) => s.show);
+  const { getAppInfo } = useApi();
+  const setAppStore = useAppStore((s) => s.setState, shallow);
+
   const { mutateAsync } = useMutation({
     mutationFn: createCliDevice,
     onSuccess: () => {
@@ -51,6 +57,14 @@ export const SetupCliStep = () => {
         [QueryKeys.FETCH_USER_PROFILE, currentUserId],
         [QueryKeys.FETCH_STANDALONE_DEVICE_LIST],
       ]);
+      void getAppInfo().then((response) => {
+        setAppStore({
+          appInfo: response,
+        });
+        if (response.license_info.any_limit_exceeded) {
+          showUpgradeToast();
+        }
+      });
     },
     onError: (e) => {
       toast.error(LL.modals.addStandaloneDevice.toasts.creationFailed());

diff --git a/...c/pages/devices/modals/AddStandaloneDeviceModal/steps/SetupManualStep/SetupManualStep.tsx b/...c/pages/devices/modals/AddStandaloneDeviceModal/steps/SetupManualStep/SetupManualStep.tsx
@@ -10,7 +10,9 @@ import {
   ButtonSize,
   ButtonStyleVariant,
 } from '../../../../../../shared/defguard-ui/components/Layout/Button/types';
+import { useAppStore } from '../../../../../../shared/hooks/store/useAppStore';
 import { useAuthStore } from '../../../../../../shared/hooks/store/useAuthStore';
+import { useEnterpriseUpgradeStore } from '../../../../../../shared/hooks/store/useEnterpriseUpgradeStore';
 import useApi from '../../../../../../shared/hooks/useApi';
 import { QueryKeys } from '../../../../../../shared/queries';
 import { generateWGKeys } from '../../../../../../shared/utils/generateWGKeys';
@@ -47,13 +49,25 @@ export const SetupManualStep = () => {
     standaloneDevice: { createManualDevice: createDevice },
   } = useApi();
 
+  const showUpgradeToast = useEnterpriseUpgradeStore((s) => s.show);
+  const { getAppInfo } = useApi();
+  const setAppStore = useAppStore((s) => s.setState, shallow);
+
   const { mutateAsync } = useMutation({
     mutationFn: createDevice,
     onSuccess: () => {
       invalidateMultipleQueries(queryClient, [
         [QueryKeys.FETCH_USER_PROFILE, currentUserId],
         [QueryKeys.FETCH_STANDALONE_DEVICE_LIST],
       ]);
+      void getAppInfo().then((response) => {
+        setAppStore({
+          appInfo: response,
+        });
+        if (response.license_info.any_limit_exceeded) {
+          showUpgradeToast();
+        }
+      });
     },
   });