improvement: revise access restricted banner and refactor/update relevant locations

frontend/src/pages/secret-scanning/SettingsPage/components/ProjectScanningConfigTab/ProjectScanningConfigTab.tsx

@@ -1,6 +1,6 @@
 import { faBan } from "@fortawesome/free-solid-svg-icons";
 
-import { ContentLoader, EmptyState } from "@app/components/v2";
+import { AccessRestrictedBanner, ContentLoader, EmptyState } from "@app/components/v2";
 import { useSubscription, useWorkspace } from "@app/context";
 import { useGetSecretScanningConfig } from "@app/hooks/api/secretScanningV2";
 
@@ -16,16 +16,14 @@ export const ProjectScanningConfigTab = () => {
 
   if (!subscription.secretScanning) {
     return (
-      <div className="flex h-full w-full items-center justify-center px-20">
-        <EmptyState
-          className="rounded-md text-center"
-          icon={faBan}
-          title={
-            <span>
+      <div className="mt-60 flex h-full w-full items-center justify-center px-20">
+        <AccessRestrictedBanner
+          body={
+            <>
               Your current plan doesn&apos;t support Secret Scanning.
               <br /> Please contact Infisical Support or reach out through our Slack channel for
               assistance.
-            </span>
+            </>
           }
         />
       </div>