diff --git a/frontend/src/pages/secret-scanning/SecretScanningFindingsPage/components/SecretScanningFindingsSection.tsx b/frontend/src/pages/secret-scanning/SecretScanningFindingsPage/components/SecretScanningFindingsSection.tsx
index 9aaf719b9..82ea049f9 100644
--- a/frontend/src/pages/secret-scanning/SecretScanningFindingsPage/components/SecretScanningFindingsSection.tsx
+++ b/frontend/src/pages/secret-scanning/SecretScanningFindingsPage/components/SecretScanningFindingsSection.tsx
@@ -1,7 +1,7 @@
import { faArrowUpRightFromSquare, faBookOpen } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { Spinner } from "@app/components/v2";
+import { ContentLoader } from "@app/components/v2";
import { useWorkspace } from "@app/context";
import { useListSecretScanningFindings } from "@app/hooks/api/secretScanningV2";
@@ -17,12 +17,7 @@ export const SecretScanningFindingsSection = () => {
}
);
- if (isFindingsPending)
- return (
-
-
-
- );
+ if (isFindingsPending) return ;
return (
diff --git a/frontend/src/pages/secret-scanning/SettingsPage/SettingsPage.tsx b/frontend/src/pages/secret-scanning/SettingsPage/SettingsPage.tsx
index ba061dd15..333479984 100644
--- a/frontend/src/pages/secret-scanning/SettingsPage/SettingsPage.tsx
+++ b/frontend/src/pages/secret-scanning/SettingsPage/SettingsPage.tsx
@@ -1,16 +1,54 @@
+import { useEffect } from "react";
import { Helmet } from "react-helmet";
import { useTranslation } from "react-i18next";
+import { faLock } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { UpgradePlanModal } from "@app/components/license/UpgradePlanModal";
import { ProjectPermissionCan } from "@app/components/permissions";
import { PageHeader, Tab, TabList, TabPanel, Tabs } from "@app/components/v2";
-import { ProjectPermissionSub } from "@app/context";
+import { ProjectPermissionSub, useSubscription } from "@app/context";
import { ProjectPermissionSecretScanningConfigActions } from "@app/context/ProjectPermissionContext/types";
+import { usePopUp } from "@app/hooks";
import { ProjectScanningConfigTab } from "./components/ProjectScanningConfigTab";
export const SettingsPage = () => {
const { t } = useTranslation();
+ const { subscription } = useSubscription();
+
+ const { popUp, handlePopUpOpen, handlePopUpToggle } = usePopUp(["upgradePlan"] as const);
+
+ useEffect(() => {
+ if (!subscription.secretScanning) {
+ handlePopUpOpen("upgradePlan");
+ }
+ }, [subscription.secretScanning]);
+
+ if (!subscription.secretScanning) {
+ return (
+ <>
+
+
+
+
+
+
+
Access Restricted
+
Upgrade your plan to access Secret Scanning
+
+
+
+
handlePopUpToggle("upgradePlan", isOpen)}
+ text="Secret Scanning is not available on your current plan."
+ />
+ >
+ );
+ }
+
return (