- {acceptedFile ? (
- <>
-
-
+
-
-
- ) : (
- "Drop CSV file here or click to upload"
- )}
-
- {formatFileSize(acceptedFile.size)}
- {acceptedFile.name}
-
-
-
- {
- event.preventDefault();
- setRemoveHoverColor(REMOVE_HOVER_COLOR_LIGHT);
- }}
- onMouseOut={(event) => {
- event.preventDefault();
- setRemoveHoverColor(DEFAULT_REMOVE_HOVER_COLOR);
- }}
- >
-
- +
+ β’ Enterprise Application: Deploy existing multi-tenant apps from + your tenant. Requires "Multiple organizations" or "Personal Microsoft accounts" in + App Registration settings. +
+ β’ Gallery Template: Deploy pre-configured applications from + Microsoft's Enterprise Application Gallery with standard permissions. +
+ β’ Application Manifest: Deploy custom applications using JSON + manifests. For security, only single-tenant apps (AzureADMyOrg) are supported. +
+
+
+ {!appIdInfo.isLoading &&
+ !appIdInfo?.data?.applicationId && (
+
+ The Application ID is not valid. Please check your configuration.
+
+ )
+ }
+
+ {showResults && (
+
+ {deviceCodeInfo && authInProgress ? (
+
+ Device Code Authentication
+
+ To sign in, use a web browser to open the page {deviceCodeInfo.verification_uri} and enter the code {deviceCodeInfo.user_code} to authenticate.
+
+
+ Code expires in {Math.round(deviceCodeInfo.expires_in / 60)} minutes
+
+
+ ) : tokens.accessToken ? (
+
+ Authentication Successful
+
+ You've successfully refreshed your token using device code flow.
+
+ {tokens.tenantId && (
+
+ Tenant ID: {tokens.tenantId}
+
+ )}
+
+ ) : authError ? (
+
+ Authentication Error: {authError.errorCode}
+ {authError.errorMessage}
+
+ Time: {authError.timestamp}
+
+
+
+
+
+ ) : null}
+
+ )}
+
+ );
+};
+
+export default CIPPDeviceCodeButton;
\ No newline at end of file
diff --git a/src/components/CippComponents/CIPPM365OAuthButton.jsx b/src/components/CippComponents/CIPPM365OAuthButton.jsx
new file mode 100644
index 000000000000..88e517a2139d
--- /dev/null
+++ b/src/components/CippComponents/CIPPM365OAuthButton.jsx
@@ -0,0 +1,683 @@
+import { useState, useEffect } from "react";
+import { Alert, Button, Typography, CircularProgress, Box } from "@mui/material";
+import { ApiGetCall } from "../../api/ApiCall";
+import { CippCopyToClipBoard } from "./CippCopyToClipboard";
+
+export const CIPPM365OAuthButton = ({
+ onAuthSuccess,
+ onAuthError,
+ buttonText = "Login with Microsoft",
+ showResults = true,
+ showSuccessAlert = true,
+ scope = "https://graph.microsoft.com/.default offline_access profile openid",
+ useDeviceCode = false,
+ applicationId = null,
+ autoStartDeviceLogon = false,
+ validateServiceAccount = true,
+}) => {
+ const [authInProgress, setAuthInProgress] = useState(false);
+ const [authError, setAuthError] = useState(null);
+ const [deviceCodeInfo, setDeviceCodeInfo] = useState(null);
+ const [codeRetrievalInProgress, setCodeRetrievalInProgress] = useState(false);
+ const [isServiceAccount, setIsServiceAccount] = useState(true);
+ const [tokens, setTokens] = useState({
+ accessToken: null,
+ refreshToken: null,
+ accessTokenExpiresOn: null,
+ refreshTokenExpiresOn: null,
+ username: null,
+ tenantId: null,
+ onmicrosoftDomain: null,
+ });
+
+ const appIdInfo = ApiGetCall({
+ url: `/api/ExecListAppId`,
+ waiting: true,
+ });
+
+ useEffect(() => {
+ appIdInfo.refetch();
+ }, []);
+
+ const handleCloseError = () => {
+ setAuthError(null);
+ };
+
+ const checkIsServiceAccount = (username) => {
+ if (!username || !validateServiceAccount) return true; // If no username or validation disabled, don't show warning
+
+ const lowerUsername = username.toLowerCase();
+ return lowerUsername.includes("service") || lowerUsername.includes("cipp");
+ };
+
+ // Function to retrieve device code
+ const retrieveDeviceCode = async () => {
+ setCodeRetrievalInProgress(true);
+ setAuthError(null);
+
+ // Refetch appId to ensure we have the latest
+ await appIdInfo.refetch();
+
+ try {
+ // Get the application ID to use
+ const appId =
+ applicationId || appIdInfo?.data?.applicationId || "1b730954-1685-4b74-9bfd-dac224a7b894"; // Default to MS Graph Explorer app ID
+
+ // Request device code from our API endpoint
+ const deviceCodeResponse = await fetch(
+ `/api/ExecDeviceCodeLogon?operation=getDeviceCode&clientId=${appId}&scope=${encodeURIComponent(
+ scope
+ )}`
+ );
+ const deviceCodeData = await deviceCodeResponse.json();
+
+ if (deviceCodeResponse.ok && deviceCodeData.user_code) {
+ // Store device code info
+ setDeviceCodeInfo(deviceCodeData);
+ } else {
+ // Error getting device code
+ setAuthError({
+ errorCode: deviceCodeData.error || "device_code_error",
+ errorMessage: deviceCodeData.error_description || "Failed to get device code",
+ timestamp: new Date().toISOString(),
+ });
+ }
+ } catch (error) {
+ setAuthError({
+ errorCode: "device_code_error",
+ errorMessage: error.message || "An error occurred retrieving device code",
+ timestamp: new Date().toISOString(),
+ });
+ } finally {
+ setCodeRetrievalInProgress(false);
+ }
+ };
+
+ // Device code authentication function - opens popup and starts polling
+ const handleDeviceCodeAuthentication = async () => {
+ // Refetch appId to ensure we have the latest
+ await appIdInfo.refetch();
+
+ if (!deviceCodeInfo) {
+ // If we don't have a device code yet, retrieve it first
+ await retrieveDeviceCode();
+ return;
+ }
+
+ setAuthInProgress(true);
+ setTokens({
+ accessToken: null,
+ refreshToken: null,
+ accessTokenExpiresOn: null,
+ refreshTokenExpiresOn: null,
+ username: null,
+ tenantId: null,
+ onmicrosoftDomain: null,
+ });
+
+ try {
+ // Get the application ID to use - refetch already happened at the start of this function
+ const appId =
+ applicationId || appIdInfo?.data?.applicationId || "1b730954-1685-4b74-9bfd-dac224a7b894"; // Default to MS Graph Explorer app ID
+
+ // Open popup to device login page
+ const width = 500;
+ const height = 600;
+ const left = window.screen.width / 2 - width / 2;
+ const top = window.screen.height / 2 - height / 2;
+
+ const popup = window.open(
+ "https://microsoft.com/devicelogin",
+ "deviceLoginPopup",
+ `width=${width},height=${height},left=${left},top=${top}`
+ );
+
+ // Start polling for token
+ const pollInterval = deviceCodeInfo.interval || 5;
+ const expiresIn = deviceCodeInfo.expires_in || 900;
+ const startTime = Date.now();
+
+ const pollForToken = async () => {
+ // Check if we've exceeded the expiration time
+ if (Date.now() - startTime >= expiresIn * 1000) {
+ if (popup && !popup.closed) {
+ popup.close();
+ }
+ setAuthError({
+ errorCode: "timeout",
+ errorMessage: "Device code authentication timed out",
+ timestamp: new Date().toISOString(),
+ });
+ setAuthInProgress(false);
+ return;
+ }
+
+ try {
+ // Poll for token using our API endpoint
+ const tokenResponse = await fetch(
+ `/api/ExecDeviceCodeLogon?operation=checkToken&clientId=${appId}&deviceCode=${deviceCodeInfo.device_code}`
+ );
+ const tokenData = await tokenResponse.json();
+
+ if (tokenResponse.ok && tokenData.status === "success") {
+ // Successfully got token
+ if (popup && !popup.closed) {
+ popup.close();
+ }
+ handleTokenResponse(tokenData);
+ } else if (
+ tokenData.error === "authorization_pending" ||
+ tokenData.status === "pending"
+ ) {
+ // User hasn't completed authentication yet, continue polling
+ setTimeout(pollForToken, pollInterval * 1000);
+ } else if (tokenData.error === "slow_down") {
+ // Server asking us to slow down polling
+ setTimeout(pollForToken, (pollInterval + 5) * 1000);
+ } else {
+ // Other error
+ if (popup && !popup.closed) {
+ popup.close();
+ }
+ setAuthError({
+ errorCode: tokenData.error || "token_error",
+ errorMessage: tokenData.error_description || "Failed to get token",
+ timestamp: new Date().toISOString(),
+ });
+ setAuthInProgress(false);
+ }
+ } catch (error) {
+ setTimeout(pollForToken, pollInterval * 1000);
+ }
+ };
+
+ // Start polling
+ setTimeout(pollForToken, pollInterval * 1000);
+ } catch (error) {
+ setAuthError({
+ errorCode: "device_code_error",
+ errorMessage: error.message || "An error occurred during device code authentication",
+ timestamp: new Date().toISOString(),
+ });
+ setAuthInProgress(false);
+ }
+ };
+
+ // Process token response (common for both auth methods)
+ const handleTokenResponse = (tokenData) => {
+ // Extract token information
+ const accessTokenExpiresOn = new Date(Date.now() + tokenData.expires_in * 1000);
+ // Refresh tokens typically last for 90 days, but this can vary
+ const refreshTokenExpiresOn = new Date(Date.now() + 90 * 24 * 60 * 60 * 1000);
+
+ // Extract information from ID token if available
+ let username = "unknown user";
+ let tenantId = "unknown tenant";
+ let onmicrosoftDomain = null;
+
+ if (tokenData.id_token) {
+ try {
+ const idTokenPayload = JSON.parse(atob(tokenData.id_token.split(".")[1]));
+
+ username =
+ idTokenPayload.preferred_username ||
+ idTokenPayload.email ||
+ idTokenPayload.upn ||
+ idTokenPayload.name ||
+ "unknown user";
+
+ if (idTokenPayload.tid) {
+ tenantId = idTokenPayload.tid;
+ }
+
+ if (username && username.includes("@") && username.includes(".onmicrosoft.com")) {
+ onmicrosoftDomain = username.split("@")[1];
+ } else if (idTokenPayload.iss) {
+ const issuerMatch = idTokenPayload.iss.match(/https:\/\/sts\.windows\.net\/([^/]+)\//);
+ if (issuerMatch && issuerMatch[1]) {
+ }
+ }
+ setIsServiceAccount(checkIsServiceAccount(username));
+ } catch (error) {}
+ }
+
+ // Create token result object
+ const tokenResult = {
+ accessToken: tokenData.access_token,
+ refreshToken: tokenData.refresh_token,
+ accessTokenExpiresOn: accessTokenExpiresOn,
+ refreshTokenExpiresOn: refreshTokenExpiresOn,
+ username: username,
+ tenantId: tenantId,
+ onmicrosoftDomain: onmicrosoftDomain,
+ };
+
+ setTokens(tokenResult);
+ setDeviceCodeInfo(null);
+
+ if (onAuthSuccess) onAuthSuccess(tokenResult);
+
+ // Update UI state
+ setAuthInProgress(false);
+ setIsServiceAccount(checkIsServiceAccount(username));
+ };
+
+ // MSAL-like authentication function
+ const handleMsalAuthentication = async () => {
+ // Clear previous authentication state when starting a new authentication
+ setAuthInProgress(true);
+ setAuthError(null);
+ setTokens({
+ accessToken: null,
+ refreshToken: null,
+ accessTokenExpiresOn: null,
+ refreshTokenExpiresOn: null,
+ username: null,
+ tenantId: null,
+ onmicrosoftDomain: null,
+ });
+
+ // Refetch app ID info to ensure we have the latest
+ await appIdInfo.refetch();
+
+ // Get the application ID to use - now we're sure to have the latest after the await
+ const appId = applicationId || appIdInfo?.data?.applicationId;
+
+ // Generate MSAL-like authentication parameters
+ const msalConfig = {
+ auth: {
+ clientId: appId,
+ authority: `https://login.microsoftonline.com/common`,
+ redirectUri: `${window.location.origin}/authredirect`,
+ },
+ };
+
+ // Define the request object similar to MSAL
+ const loginRequest = {
+ scopes: [scope],
+ };
+
+ // Generate PKCE code verifier and challenge
+ const generateCodeVerifier = () => {
+ const array = new Uint8Array(32);
+ window.crypto.getRandomValues(array);
+ return Array.from(array, (byte) => ("0" + (byte & 0xff).toString(16)).slice(-2)).join("");
+ };
+
+ const codeVerifier = generateCodeVerifier();
+ const codeChallenge = codeVerifier;
+ const state = Math.random().toString(36).substring(2, 15);
+ const authUrl =
+ `https://login.microsoftonline.com/common/oauth2/v2.0/authorize?` +
+ `client_id=${appId}` +
+ `&response_type=code` +
+ `&redirect_uri=${encodeURIComponent(window.location.origin)}/authredirect` +
+ `&scope=${encodeURIComponent(scope)}` +
+ `&code_challenge=${codeChallenge}` +
+ `&code_challenge_method=plain` +
+ `&state=${state}` +
+ `&prompt=select_account`;
+
+ // Open popup for authentication
+ const width = 500;
+ const height = 600;
+ const left = window.screen.width / 2 - width / 2;
+ const top = window.screen.height / 2 - height / 2;
+
+ const popup = window.open(
+ authUrl,
+ "msalAuthPopup",
+ `width=${width},height=${height},left=${left},top=${top}`
+ );
+
+ // Function to actually exchange the authorization code for tokens
+ const handleAuthorizationCode = async (code, receivedState) => {
+ // Verify the state parameter matches what we sent (security check)
+ if (receivedState !== state) {
+ const errorMessage = "State mismatch in auth response - possible CSRF attack";
+ const error = {
+ errorCode: "state_mismatch",
+ errorMessage: errorMessage,
+ timestamp: new Date().toISOString(),
+ };
+ setAuthError(error);
+ if (onAuthError) onAuthError(error);
+ setAuthInProgress(false);
+ return;
+ }
+ try {
+ // Prepare the token request
+ const tokenRequest = {
+ grant_type: "authorization_code",
+ client_id: appId,
+ code: code,
+ redirect_uri: `${window.location.origin}/authredirect`,
+ code_verifier: codeVerifier,
+ };
+
+ // Make the token request through our API proxy to avoid origin header issues
+ const tokenResponse = await fetch(`/api/ExecTokenExchange`, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify({
+ tokenRequest,
+ tokenUrl: "https://login.microsoftonline.com/common/oauth2/v2.0/token",
+ tenantId: appId, // Pass the tenant ID to retrieve the correct client secret
+ }),
+ });
+
+ // Parse the token response
+ const tokenData = await tokenResponse.json();
+
+ // Check if the response contains an error
+ if (tokenData.error) {
+ const error = {
+ errorCode: tokenData.error || "token_error",
+ errorMessage:
+ tokenData.error_description || "Failed to exchange authorization code for tokens",
+ timestamp: new Date().toISOString(),
+ };
+ setAuthError(error);
+ if (onAuthError) onAuthError(error);
+ setAuthInProgress(false);
+ return;
+ }
+
+ if (tokenResponse.ok) {
+ // If we have a refresh token, store it
+ if (tokenData.refresh_token) {
+ try {
+ // Extract tid from access_token jwt base64
+ const accessTokenParts = tokenData.access_token.split(".");
+ const accessTokenPayload = JSON.parse(atob(accessTokenParts[1] || ""));
+ tokenData.tid = accessTokenPayload.tid;
+ const refreshResponse = await fetch(`/api/ExecUpdateRefreshToken`, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify({
+ tenantId: tokenData.tid,
+ refreshtoken: tokenData.refresh_token,
+ tenantMode: tokenData.tenantMode,
+ allowPartnerTenantManagement: tokenData.allowPartnerTenantManagement,
+ }),
+ });
+
+ if (!refreshResponse.ok) {
+ console.warn("Failed to store refresh token, but continuing with authentication");
+ }
+ } catch (error) {
+ console.error("Failed to store refresh token:", error);
+ }
+ }
+
+ handleTokenResponse(tokenData);
+ } else {
+ // Handle token error - display in error box instead of throwing
+ const error = {
+ errorCode: tokenData.error || "token_error",
+ errorMessage:
+ tokenData.error_description || "Failed to exchange authorization code for tokens",
+ timestamp: new Date().toISOString(),
+ };
+ setAuthError(error);
+ if (onAuthError) onAuthError(error);
+ }
+ } catch (error) {
+ const errorObj = {
+ errorCode: "token_exchange_error",
+ errorMessage: error.message || "Failed to exchange authorization code for tokens",
+ timestamp: new Date().toISOString(),
+ };
+ setAuthError(errorObj);
+ if (onAuthError) onAuthError(errorObj);
+ } finally {
+ // Close the popup window if it's still open
+ if (popup && !popup.closed) {
+ popup.close();
+ }
+
+ // Update UI state
+ setAuthInProgress(false);
+ }
+ };
+
+ // Monitor for the redirect with the authorization code
+ // This is what MSAL does internally
+ const checkPopupLocation = setInterval(() => {
+ if (!popup || popup.closed) {
+ clearInterval(checkPopupLocation);
+
+ // If authentication is still in progress when popup closes, it's an error
+ if (authInProgress) {
+ const errorMessage = "Authentication was cancelled. Please try again.";
+ const error = {
+ errorCode: "user_cancelled",
+ errorMessage: errorMessage,
+ timestamp: new Date().toISOString(),
+ };
+ setAuthError(error);
+ if (onAuthError) onAuthError(error);
+
+ // Ensure we're not showing any previous success state
+ setTokens({
+ accessToken: null,
+ refreshToken: null,
+ accessTokenExpiresOn: null,
+ refreshTokenExpiresOn: null,
+ username: null,
+ tenantId: null,
+ onmicrosoftDomain: null,
+ });
+ }
+
+ setAuthInProgress(false);
+ return;
+ }
+
+ try {
+ // Try to access the popup location to check for the authorization code
+ const currentUrl = popup.location.href;
+
+ // Check if the URL contains a code parameter (authorization code)
+ if (currentUrl.includes("code=") && currentUrl.includes("state=")) {
+ clearInterval(checkPopupLocation);
+ // Parse the URL to extract the code and state
+ const urlParams = new URLSearchParams(popup.location.search);
+ const code = urlParams.get("code");
+ const receivedState = urlParams.get("state");
+
+ // Process the authorization code
+ handleAuthorizationCode(code, receivedState);
+ }
+
+ // Check for error in the URL
+ if (currentUrl.includes("error=")) {
+ clearInterval(checkPopupLocation);
+ // Parse the URL to extract the error details
+ const urlParams = new URLSearchParams(popup.location.search);
+ const errorCode = urlParams.get("error");
+ const errorDescription = urlParams.get("error_description");
+
+ // Set the error state
+ const error = {
+ errorCode: errorCode,
+ errorMessage: errorDescription || "Unknown authentication error",
+ timestamp: new Date().toISOString(),
+ };
+ setAuthError(error);
+ if (onAuthError) onAuthError(error);
+
+ // Close the popup
+ popup.close();
+ setAuthInProgress(false);
+ }
+ } catch (error) {
+ // This will throw an error when the popup is on a different domain
+ // due to cross-origin restrictions, which is normal during auth flow
+ // Just continue monitoring
+ }
+ }, 500);
+
+ // Also monitor for popup closing as a fallback
+ };
+
+ // Auto-start device code retrieval if requested
+ useEffect(() => {
+ if (
+ useDeviceCode &&
+ autoStartDeviceLogon &&
+ !codeRetrievalInProgress &&
+ !deviceCodeInfo &&
+ !tokens.accessToken &&
+ appIdInfo?.data
+ ) {
+ retrieveDeviceCode();
+ }
+ }, [
+ useDeviceCode,
+ autoStartDeviceLogon,
+ codeRetrievalInProgress,
+ deviceCodeInfo,
+ tokens.accessToken,
+ appIdInfo?.data,
+ ]);
+
+ return (
+
+ {!applicationId &&
+ !appIdInfo.isLoading &&
+ appIdInfo?.data && // Only check if data is available
+ !/^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}$/.test(
+ appIdInfo?.data?.applicationId
+ ) && (
+
+ The Application ID is not valid. Please check your configuration.
+
+ )}
+
+ {showResults && (
+
+ {deviceCodeInfo ? (
+
+ Application Creation
+
+ {authInProgress ? (
+ <>
+ When asked to log onto an account, please use a{" "}
+ CIPP Service Account. Enter this code to authenticate:{" "}
+
+ ) : (
+ <>
+ Click the button below to authenticate. When asked to log onto an account,
+ please use a CIPP Service Account. You will need to enter this
+ code:{" "}
+
+ )}
+
+
+ {authInProgress ? (
+ <>
+ If the popup was blocked or you closed it, you can also go to{" "}
+ microsoft.com/devicelogin manually and enter the code shown
+ above.
+
+ ) : (
+ <>
+ When you click the button below, a popup will open to{" "}
+ microsoft.com/devicelogin where you'll enter this code.
+
+ )}
+
+
+ Code expires in {Math.round(deviceCodeInfo.expires_in / 60)} minutes
+
+
+ ) : tokens.accessToken ? (
+ <>
+ {showSuccessAlert ? (
+
+ Authentication Successful
+
+ You've successfully refreshed your token. The account you're using for
+ authentication is: {tokens.username}
+
+
+ Tenant ID: {tokens.tenantId}
+ {tokens.onmicrosoftDomain && (
+ <>
+ {" "}
+ | Domain: {tokens.onmicrosoftDomain}
+
+ )}
+
+
+ Refresh token expires: {tokens.refreshTokenExpiresOn?.toLocaleString()}
+
+
+ ) : null}
+
+ {!isServiceAccount && (
+
+ Service Account Required
+
+ CIPP requires a service account for authentication. The account you're using (
+ {tokens.username}) does not appear to be a service account.
+
+
+ Please redo authentication using an account with "service" or "cipp" in the
+ username.
+
+
+ )}
+
+ ) : authError ? (
+
+
+ Authentication Error: {authError.errorCode}
+
+ {authError.errorMessage}
+
+ Time: {authError.timestamp}
+
+
+
+
+
+ ) : null}
+
+ )}
+
+
+ );
+};
diff --git a/src/components/CippComponents/CertificateCredentialRemovalForm.jsx b/src/components/CippComponents/CertificateCredentialRemovalForm.jsx
new file mode 100644
index 000000000000..9b499297ed59
--- /dev/null
+++ b/src/components/CippComponents/CertificateCredentialRemovalForm.jsx
@@ -0,0 +1,23 @@
+import { CippFormComponent } from "./CippFormComponent.jsx";
+
+export const CertificateCredentialRemovalForm = ({ formHook, row }) => {
+ return (
+
+
+
+
+
- handleAddRow("applicationPermissions", currentAppPermission)
- }
- >
-
-
-
- handleAddRow("delegatedPermissions", currentDelegatedPermission)
+ handleAddRow("applicationPermissions", currentAppPermission)
}
>
-
+
);
};
@@ -715,7 +723,8 @@ const CippAppPermissionBuilder = ({
-
+
-
+
+
+
+ {/* Tenant Selector */}
+
+
+
+
+
+
+
+
+
+ This is a community contribution and is not covered under a vendor sponsorship.
+ Please join our Discord community for assistance with this MSP App.
+
+
+
+
+
+
+
+
+ {selectedTenants?.map((tenant, index) => (
+
+
+ ))}
+
+
+ {/* For "syncro" */}
+
+ {selectedTenants?.map((tenant, index) => (
+
+
+ ))}
+
+
+ {/* For "huntress" */}
+
+
+
+ {selectedTenants?.map((tenant, index) => (
+
+
+ ))}
+
+
+ {/* For "automate" */}
+
+
+
+ {selectedTenants?.map((tenant, index) => (
+
+
+ ))}
+ {selectedTenants?.map((tenant, index) => (
+
+
+ ))}
+
+
+ {/* For "cwcommand" */}
+
+ {selectedTenants?.map((tenant, index) => (
+
+
+ ))}
+
+
+ {/* Assign To Options */}
+
+
+
+
+
+
+
+
+ {/* WinGet App Section */}
+
+
+
+
+
+
+
+
+ ({
+ value: item,
+ label: `${item.applicationName} - ${item.packagename}`,
+ }))
+ : []
+ }
+ multiple={false}
+ formControl={formControl}
+ disabled={winGetSearchResults.isLoading}
+ isFetching={winGetSearchResults.isLoading}
+ />
+
+
+
+
+
+
+
+
+ {/* Install Options */}
+
+
+
+ {/* Assign To Options */}
+
+
+
+
+
+
+
+
+ {/* Chocolatey App Section */}
+
+
+
+
+
+
+
+
+ ({
+ value: item,
+ label: `${item.applicationName} - ${item.packagename}`,
+ }))
+ : []
+ }
+ multiple={false}
+ formControl={formControl}
+ isFetching={ChocosearchResults.isLoading}
+ />
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* Install Options */}
+
+
+
+ {/* Assign To Options */}
+
+
+
+
+
+
+
+
+ {/* Office App Section */}
+
+
+
+
+
+
+ ({
+ value: tag,
+ label: `${language} (${tag})`,
+ }))}
+ multiple={true}
+ formControl={formControl}
+ validators={{ required: "Please select at least one language" }}
+ />
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Provide a custom Office Configuration XML. When using custom XML, all other
+ Office configuration options above will be ignored. See{" "}
+
+ Office Customization Tool
+ {" "}
+ to generate XML.
+
+
+
+
+ {/* Assign To Options */}
+
+
+
+
+
+
+
+ );
+};
diff --git a/src/components/CippComponents/CippAuditLogDetails.jsx b/src/components/CippComponents/CippAuditLogDetails.jsx
new file mode 100644
index 000000000000..b5a3077a0da6
--- /dev/null
+++ b/src/components/CippComponents/CippAuditLogDetails.jsx
@@ -0,0 +1,359 @@
+import { useEffect } from "react";
+import { getCippTranslation } from "/src/utils/get-cipp-translation";
+import { getCippFormatting } from "/src/utils/get-cipp-formatting";
+import CippGeoLocation from "/src/components/CippComponents/CippGeoLocation";
+import { Tooltip, CircularProgress, Stack } from "@mui/material";
+import { useGuidResolver } from "/src/hooks/use-guid-resolver";
+import { CippPropertyListCard } from "/src/components/CippCards/CippPropertyListCard";
+
+const CippAuditLogDetails = ({ row }) => {
+ const {
+ guidMapping,
+ upnMapping,
+ isLoadingGuids,
+ resolveGuids,
+ isGuid,
+ replaceGuidsAndUpnsInString,
+ } = useGuidResolver();
+
+ // Use effect for initial scan to resolve GUIDs and special UPNs
+ useEffect(() => {
+ if (row) {
+ // Scan the main row data
+ resolveGuids(row);
+
+ // Scan audit data if present
+ if (row.auditData) {
+ resolveGuids(row.auditData);
+ }
+ }
+ }, [row?.id, resolveGuids]); // Dependencies for when to resolve GUIDs
+
+ // Function to replace GUIDs and special UPNs in strings with resolved names
+ const replaceGuidsInString = (str) => {
+ if (typeof str !== "string") return str;
+
+ // Use the hook's helper function to replace both GUIDs and special UPNs
+ const { result, hasResolvedNames } = replaceGuidsAndUpnsInString(str);
+
+ // If we have resolved names, return a tooltip showing original and resolved
+ if (hasResolvedNames) {
+ return (
+
+ {result}
+
+ );
+ }
+
+ // Check for GUIDs and special UPNs to see if we should show loading state
+ const guidRegex = /[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}/gi;
+ const partnerUpnRegex = /user_([0-9a-f]{32})@([^@]+\.onmicrosoft\.com)/gi;
+
+ let hasGuids = guidRegex.test(str);
+
+ // Reset regex state and check for partner UPNs
+ partnerUpnRegex.lastIndex = 0;
+ let hasUpns = false;
+ let match;
+
+ // Need to extract and check if the GUIDs from UPNs are in the pending state
+ while ((match = partnerUpnRegex.exec(str)) !== null) {
+ const hexId = match[1];
+ if (hexId && hexId.length === 32) {
+ hasUpns = true;
+ break; // At least one UPN pattern found
+ }
+ }
+
+ // If we have unresolved GUIDs or UPNs and are currently loading
+ if ((hasGuids || hasUpns) && isLoadingGuids) {
+ return (
+
+ {guidMapping[guidValue]}
+
+ );
+ }
+
+ // Special handling for partner UPN format (user_@partnertenant.onmicrosoft.com)
+ const partnerUpnRegex = /^user_([0-9a-f]{32})@([^@]+\.onmicrosoft\.com)$/i;
+ const upnMatch = typeof guidValue === "string" ? guidValue.match(partnerUpnRegex) : null;
+
+ if (upnMatch) {
+ const hexId = upnMatch[1];
+ if (hexId && hexId.length === 32) {
+ const guid = [
+ hexId.slice(0, 8),
+ hexId.slice(8, 12),
+ hexId.slice(12, 16),
+ hexId.slice(16, 20),
+ hexId.slice(20, 32),
+ ].join("-");
+
+ // For partner UPN format, use the actual UPN if available, otherwise fall back to display name
+ if (upnMapping && upnMapping[guid]) {
+ return (
+
+ {upnMapping[guid]}
+
+ );
+ } else if (guidMapping[guid]) {
+ return (
+
+ {guidMapping[guid]}
+
+ );
+ }
+ }
+ }
+
+ // Loading state
+ if (isLoadingGuids) {
+ return (
+
+ {guidValue}
+
+ );
+ };
+
+ // Recursively render nested objects and arrays with GUID expansion
+ const renderNestedValue = (value) => {
+ if (Array.isArray(value)) {
+ // Handle arrays
+ return renderArrayValue(value);
+ } else if (typeof value === "object" && value !== null) {
+ // Handle objects
+ return renderObjectValue(value);
+ }
+ return getCippFormatting(value, "nested");
+ };
+
+ // Render array values with GUID expansion
+ const renderArrayValue = (arrayValue) => {
+ if (arrayValue.length === 0) return "[]";
+
+ // If it's a simple array, show it formatted
+ if (arrayValue.length <= 5 && arrayValue.every((item) => typeof item !== "object")) {
+ return (
+
+
+ );
+};
+
+export default CippAuditLogDetails;
diff --git a/src/components/CippComponents/CippAuditLogSearchDrawer.jsx b/src/components/CippComponents/CippAuditLogSearchDrawer.jsx
new file mode 100644
index 000000000000..93628842b386
--- /dev/null
+++ b/src/components/CippComponents/CippAuditLogSearchDrawer.jsx
@@ -0,0 +1,471 @@
+import { useState, useEffect } from "react";
+import { Button, Stack, Box } from "@mui/material";
+import { Add } from "@mui/icons-material";
+import { useForm } from "react-hook-form";
+import { CippOffCanvas } from "./CippOffCanvas";
+import { ApiPostCall, ApiGetCallWithPagination } from "../../api/ApiCall";
+import CippFormComponent from "./CippFormComponent";
+import { CippApiResults } from "./CippApiResults";
+import { useSettings } from "/src/hooks/use-settings";
+
+export const CippAuditLogSearchDrawer = ({
+ buttonText = "New Search",
+ relatedQueryKeys = ["AuditLogSearches"],
+}) => {
+ const [drawerVisible, setDrawerVisible] = useState(false);
+ const currentTenantDomain = useSettings().currentTenant;
+
+ // Fetch tenant list to get full tenant details
+ const tenantList = ApiGetCallWithPagination({
+ url: "/api/ListTenants",
+ queryKey: "ListTenants-FormnotAllTenants",
+ data: { AllTenantSelector: false },
+ });
+
+ // Find the current tenant from the list using the domain name - handle pagination data structure
+ const allTenants = tenantList.data?.pages?.flatMap((page) => page.Results || page) || [];
+ const currentTenant = allTenants.find(
+ (tenant) => tenant.defaultDomainName === currentTenantDomain
+ );
+
+ // Create default values with current tenant prefilled
+ const defaultValues = {
+ TenantFilter: currentTenant
+ ? {
+ label: `${currentTenant.displayName} (${currentTenant.defaultDomainName})`,
+ value: currentTenant.defaultDomainName,
+ }
+ : null,
+ };
+
+ const formControl = useForm({
+ defaultValues,
+ });
+
+ // Update form defaults when tenant data is loaded
+ useEffect(() => {
+ if (currentTenant) {
+ const newDefaultValues = {
+ TenantFilter: {
+ label: `${currentTenant.displayName} (${currentTenant.defaultDomainName})`,
+ value: currentTenant.defaultDomainName,
+ },
+ };
+ formControl.reset(newDefaultValues);
+ }
+ }, [currentTenant, formControl]);
+
+ const createSearchApi = ApiPostCall({
+ datafromUrl: false,
+ relatedQueryKeys,
+ });
+
+ const handleCloseDrawer = () => {
+ setDrawerVisible(false);
+ if (currentTenant) {
+ const resetValues = {
+ TenantFilter: {
+ label: `${currentTenant.displayName} (${currentTenant.defaultDomainName})`,
+ value: currentTenant.defaultDomainName,
+ },
+ };
+ formControl.reset(resetValues);
+ } else {
+ formControl.reset();
+ }
+ };
+
+ const handleCreateSearch = async (data) => {
+ const formattedData = { ...data };
+
+ // Extract value from TenantFilter autocomplete object
+ if (formattedData.TenantFilter?.value) {
+ formattedData.TenantFilter = formattedData.TenantFilter.value;
+ }
+
+ // Handle KeywordFilter - extract values from array and join with spaces
+ if (Array.isArray(formattedData.KeywordFilter)) {
+ const keywords = formattedData.KeywordFilter.map((item) =>
+ typeof item === "object" ? item.value : item
+ ).filter(Boolean);
+ formattedData.KeywordFilter = keywords.join(" ");
+ }
+
+ // Extract values from RecordTypeFilters array
+ if (Array.isArray(formattedData.RecordTypeFilters)) {
+ formattedData.RecordTypeFilters = formattedData.RecordTypeFilters.map((item) =>
+ typeof item === "object" ? item.value : item
+ );
+ }
+
+ // Extract values from ServiceFilters array
+ if (Array.isArray(formattedData.ServiceFilters)) {
+ formattedData.ServiceFilters = formattedData.ServiceFilters.map((item) =>
+ typeof item === "object" ? item.value : item
+ );
+ }
+
+ // Extract values from OperationsFilters array
+ if (Array.isArray(formattedData.OperationsFilters)) {
+ formattedData.OperationsFilters = formattedData.OperationsFilters.map((item) =>
+ typeof item === "object" ? item.value : item
+ );
+ }
+
+ // Extract values from UserPrincipalNameFilters array
+ if (Array.isArray(formattedData.UserPrincipalNameFilters)) {
+ formattedData.UserPrincipalNameFilters = formattedData.UserPrincipalNameFilters.map((item) =>
+ typeof item === "object" ? item.value : item
+ );
+ }
+
+ // Extract values from IPAddressFilters array
+ if (Array.isArray(formattedData.IPAddressFilters)) {
+ formattedData.IPAddressFilters = formattedData.IPAddressFilters.map((item) =>
+ typeof item === "object" ? item.value : item
+ );
+ }
+
+ // Extract values from ObjectIdFilters array
+ if (Array.isArray(formattedData.ObjectIdFilters)) {
+ formattedData.ObjectIdFilters = formattedData.ObjectIdFilters.map((item) =>
+ typeof item === "object" ? item.value : item
+ );
+ }
+
+ // Extract values from AdministrativeUnitFilters array
+ if (Array.isArray(formattedData.AdministrativeUnitFilters)) {
+ formattedData.AdministrativeUnitFilters = formattedData.AdministrativeUnitFilters.map(
+ (item) => (typeof item === "object" ? item.value : item)
+ );
+ }
+
+ // Remove empty arrays to avoid sending unnecessary data
+ Object.keys(formattedData).forEach((key) => {
+ if (Array.isArray(formattedData[key]) && formattedData[key].length === 0) {
+ delete formattedData[key];
+ }
+ if (
+ formattedData[key] === "" ||
+ formattedData[key] === null ||
+ formattedData[key] === undefined
+ ) {
+ delete formattedData[key];
+ }
+ });
+
+ try {
+ await createSearchApi.mutateAsync({
+ url: "/api/ExecAuditLogSearch",
+ data: formattedData,
+ });
+ } catch (error) {
+ console.error("Error creating search:", error);
+ }
+ };
+
+ // Create Search Form Fields
+ const createSearchFields = [
+ {
+ type: "textField",
+ name: "DisplayName",
+ label: "Search Name",
+ required: true,
+ validators: { required: "Search name is required" },
+ disableVariables: true,
+ },
+ {
+ type: "autoComplete",
+ name: "TenantFilter",
+ label: "Tenant",
+ multiple: false,
+ creatable: false,
+ api: {
+ url: "/api/ListTenants?AllTenantSelector=false",
+ labelField: (option) => `${option.displayName} (${option.defaultDomainName})`,
+ valueField: "defaultDomainName",
+ queryKey: "ListTenants-FormnotAllTenants",
+ excludeTenantFilter: true,
+ },
+ validators: { validate: (value) => !!value?.value || "Please select a tenant" },
+ required: true,
+ },
+ {
+ type: "datePicker",
+ name: "StartTime",
+ label: "Start Date & Time",
+ dateTimeType: "datetime-local",
+ validators: { required: "Start time is required" },
+ required: true,
+ },
+ {
+ type: "datePicker",
+ name: "EndTime",
+ label: "End Date & Time",
+ dateTimeType: "datetime-local",
+ validators: { required: "End time is required" },
+ required: true,
+ },
+ {
+ type: "autoComplete",
+ name: "ServiceFilters",
+ label: "Services",
+ multiple: true,
+ creatable: false,
+ options: [
+ { label: "Azure Active Directory", value: "AzureActiveDirectory" },
+ { label: "Dynamics 365", value: "CRM" },
+ { label: "Exchange Online", value: "Exchange" },
+ { label: "Microsoft Flow", value: "MicrosoftFlow" },
+ { label: "Microsoft Teams", value: "MicrosoftTeams" },
+ { label: "OneDrive for Business", value: "OneDrive" },
+ { label: "Power BI", value: "PowerBI" },
+ { label: "Security & Compliance", value: "ThreatIntelligence" },
+ { label: "SharePoint Online", value: "SharePoint" },
+ { label: "Yammer", value: "Yammer" },
+ ],
+ validators: {
+ validate: (values) => values?.length > 0 || "Please select at least one service",
+ },
+ },
+ {
+ type: "autoComplete",
+ name: "RecordTypeFilters",
+ label: "Record Types",
+ multiple: true,
+ creatable: false,
+ options: [
+ { label: "Azure Active Directory", value: "azureActiveDirectory" },
+ { label: "Azure AD Account Logon", value: "azureActiveDirectoryAccountLogon" },
+ { label: "Azure AD STS Logon", value: "azureActiveDirectoryStsLogon" },
+ { label: "Compliance DLP Endpoint", value: "complianceDLPEndpoint" },
+ { label: "Compliance DLP Exchange", value: "complianceDLPExchange" },
+ { label: "Compliance DLP SharePoint", value: "complianceDLPSharePoint" },
+ { label: "Data Governance", value: "dataGovernance" },
+ { label: "Exchange Admin", value: "exchangeAdmin" },
+ { label: "Exchange Item", value: "exchangeItem" },
+ { label: "Exchange Item Group", value: "exchangeItemGroup" },
+ { label: "Information Worker Protection", value: "informationWorkerProtection" },
+ { label: "Label Content Explorer", value: "labelContentExplorer" },
+ { label: "Microsoft Flow", value: "microsoftFlow" },
+ { label: "Microsoft Forms", value: "microsoftForms" },
+ { label: "Microsoft Stream", value: "microsoftStream" },
+ { label: "Microsoft Teams", value: "microsoftTeams" },
+ { label: "Microsoft Teams Admin", value: "microsoftTeamsAdmin" },
+ { label: "Microsoft Teams Analytics", value: "microsoftTeamsAnalytics" },
+ { label: "Microsoft Teams Device", value: "microsoftTeamsDevice" },
+ { label: "Microsoft Teams Shifts", value: "microsoftTeamsShifts" },
+ { label: "MIP Label", value: "mipLabel" },
+ { label: "OneDrive", value: "oneDrive" },
+ { label: "Power Apps App", value: "powerAppsApp" },
+ { label: "Power Apps Plan", value: "powerAppsPlan" },
+ { label: "Power BI Audit", value: "powerBIAudit" },
+ { label: "Power BI DLP", value: "powerBIDlp" },
+ { label: "Security & Compliance Alerts", value: "securityComplianceAlerts" },
+ { label: "Security & Compliance Insights", value: "securityComplianceInsights" },
+ { label: "Security & Compliance RBAC", value: "securityComplianceRBAC" },
+ { label: "SharePoint", value: "sharePoint" },
+ { label: "SharePoint File Operation", value: "sharePointFileOperation" },
+ { label: "SharePoint List Operation", value: "sharePointListOperation" },
+ { label: "SharePoint Sharing Operation", value: "sharePointSharingOperation" },
+ { label: "Threat Intelligence", value: "threatIntelligence" },
+ { label: "Threat Intelligence ATP Content", value: "threatIntelligenceAtpContent" },
+ { label: "Threat Intelligence URL", value: "threatIntelligenceUrl" },
+ { label: "Workplace Analytics", value: "workplaceAnalytics" },
+ ],
+ },
+ {
+ type: "autoComplete",
+ name: "KeywordFilter",
+ label: "Keywords",
+ multiple: true,
+ creatable: true,
+ freeSolo: true,
+ placeholder: "Enter keywords to search for",
+ options: [],
+ },
+ {
+ type: "autoComplete",
+ name: "OperationsFilters",
+ label: "Operations",
+ multiple: true,
+ creatable: true,
+ placeholder: "Enter or select operations",
+ options: [
+ // Authentication & User Operations
+ { label: "User Logged In", value: "UserLoggedIn" },
+ { label: "Mailbox Login", value: "mailboxlogin" },
+
+ // User Management Operations
+ { label: "Add User", value: "add user." },
+ { label: "Update User", value: "update user." },
+ { label: "Delete User", value: "delete user." },
+ { label: "Reset User Password", value: "reset user password." },
+ { label: "Change User Password", value: "change user password." },
+ { label: "Change User License", value: "change user license." },
+
+ // Group Management Operations
+ { label: "Add Group", value: "add group." },
+ { label: "Update Group", value: "update group." },
+ { label: "Delete Group", value: "delete group." },
+ { label: "Add Member to Group", value: "add member to group." },
+ { label: "Remove Member from Group", value: "remove member from group." },
+
+ // Mailbox Operations
+ { label: "New Mailbox", value: "New-Mailbox" },
+ { label: "Set Mailbox", value: "Set-Mailbox" },
+ { label: "Add Mailbox Permission", value: "add-mailboxpermission" },
+ { label: "Remove Mailbox Permission", value: "remove-mailboxpermission" },
+ { label: "Mail Items Accessed", value: "mailitemsaccessed" },
+
+ // Email Operations
+ { label: "Send Message", value: "send" },
+ { label: "Send As", value: "sendas" },
+ { label: "Send On Behalf", value: "sendonbehalf" },
+ { label: "Create Item", value: "create" },
+ { label: "Update Message", value: "update" },
+ { label: "Copy Messages", value: "copy" },
+ { label: "Move Messages", value: "move" },
+ { label: "Move to Deleted Items", value: "movetodeleteditems" },
+ { label: "Soft Delete", value: "softdelete" },
+ { label: "Hard Delete", value: "harddelete" },
+
+ // Inbox Rules
+ { label: "New Inbox Rule", value: "new-inboxrule" },
+ { label: "Set Inbox Rule", value: "set-inboxrule" },
+ { label: "Update Inbox Rules", value: "updateinboxrules" },
+
+ // Folder Operations
+ { label: "Add Folder Permissions", value: "addfolderpermissions" },
+ { label: "Remove Folder Permissions", value: "removefolderpermissions" },
+ { label: "Update Folder Permissions", value: "updatefolderpermissions" },
+ { label: "Update Calendar Delegation", value: "updatecalendardelegation" },
+
+ // SharePoint/OneDrive Operations (Common ones)
+ { label: "File Accessed", value: "FileAccessed" },
+ { label: "File Modified", value: "FileModified" },
+ { label: "File Deleted", value: "FileDeleted" },
+ { label: "File Downloaded", value: "FileDownloaded" },
+ { label: "File Uploaded", value: "FileUploaded" },
+ { label: "Sharing Set", value: "SharingSet" },
+ { label: "Anonymous Link Created", value: "AnonymousLinkCreated" },
+
+ // Role and Permission Operations
+ { label: "Add Member to Role", value: "add member to role." },
+ { label: "Remove Member from Role", value: "remove member from role." },
+ { label: "Add Service Principal", value: "add service principal." },
+ { label: "Remove Service Principal", value: "remove service principal." },
+
+ // Company and Domain Operations
+ { label: "Add Domain to Company", value: "add domain to company." },
+ { label: "Remove Domain from Company", value: "remove domain from company." },
+ { label: "Verify Domain", value: "verify domain." },
+ { label: "Set Company Information", value: "set company information." },
+
+ // Security Operations
+ { label: "Disable Strong Authentication", value: "Disable Strong Authentication." },
+ { label: "Apply Record Label", value: "applyrecordlabel" },
+ { label: "Update STS Refresh Token", value: "Update StsRefreshTokenValidFrom Timestamp." },
+ ],
+ },
+ {
+ type: "autoComplete",
+ name: "UserPrincipalNameFilters",
+ label: "User Principal Names",
+ multiple: true,
+ creatable: true,
+ freeSolo: true,
+ placeholder: "Enter user principal names",
+ options: [],
+ },
+ {
+ type: "autoComplete",
+ name: "IPAddressFilters",
+ label: "IP Addresses",
+ multiple: true,
+ creatable: true,
+ freeSolo: true,
+ placeholder: "Enter IP addresses",
+ options: [],
+ },
+ {
+ type: "autoComplete",
+ name: "ObjectIdFilters",
+ label: "Object IDs",
+ multiple: true,
+ creatable: true,
+ freeSolo: true,
+ placeholder: "Enter object IDs",
+ options: [],
+ },
+ {
+ type: "autoComplete",
+ name: "AdministrativeUnitFilters",
+ label: "Administrative Units",
+ multiple: true,
+ creatable: true,
+ placeholder: "Enter administrative units",
+ api: {
+ url: "/api/ListGraphRequest",
+ queryKey: "AdministrativeUnits",
+ data: {
+ Endpoint: "directoryObjects/microsoft.graph.administrativeUnit",
+ $select: "id,displayName",
+ },
+ dataKey: "Results",
+ labelField: "displayName",
+ valueField: "id",
+ addedField: {
+ id: "id",
+ displayName: "displayName",
+ },
+ showRefresh: true,
+ },
+ },
+ {
+ type: "switch",
+ name: "ProcessLogs",
+ label: "Process Logs for Alerts",
+ helperText: "Enable to store this search for alert processing",
+ },
+ ];
+
+ return (
+ <>
+
+
+
+
+
+ }
+ >
+
+
+ {createSearchFields.map((field, index) => (
+
+
+ ))}
+
+
+
+
+ );
+};
diff --git a/src/components/CippComponents/CippAutocomplete.jsx b/src/components/CippComponents/CippAutocomplete.jsx
index 4edb340549ba..9ed0e358d594 100644
--- a/src/components/CippComponents/CippAutocomplete.jsx
+++ b/src/components/CippComponents/CippAutocomplete.jsx
@@ -6,7 +6,7 @@ import {
TextField,
IconButton,
} from "@mui/material";
-import { useEffect, useState, useMemo, useCallback } from "react";
+import { useEffect, useState, useMemo, useCallback, useRef } from "react";
import { useSettings } from "../../hooks/use-settings";
import { getCippError } from "../../utils/get-cipp-error";
import { ApiGetCallWithPagination } from "../../api/ApiCall";
@@ -71,11 +71,15 @@ export const CippAutoComplete = (props) => {
removeOptions = [],
sortOptions = false,
preselectedValue,
+ groupBy,
+ renderGroup,
...other
} = props;
const [usedOptions, setUsedOptions] = useState(options);
const [getRequestInfo, setGetRequestInfo] = useState({ url: "", waiting: false, queryKey: "" });
+ const hasPreselectedRef = useRef(false);
+ const autocompleteRef = useRef(null); // Ref for focusing input after selection
const filter = createFilterOptions({
stringify: (option) => JSON.stringify(option),
});
@@ -158,7 +162,11 @@ export const CippAutoComplete = (props) => {
label:
typeof api?.labelField === "function"
? api.labelField(option)
- : option[api?.labelField],
+ : option[api?.labelField]
+ ? option[api?.labelField]
+ : option[api?.altLabelField] ||
+ option[api?.valueField] ||
+ "No label found - Are you missing a labelField?",
value:
typeof api?.valueField === "function"
? api.valueField(option)
@@ -201,19 +209,51 @@ export const CippAutoComplete = (props) => {
return finalOptions;
}, [api, usedOptions, options, removeOptions, sortOptions]);
- // Dedicated effect for handling preselected value
+ // Dedicated effect for handling preselected value or auto-select first item - only runs once
useEffect(() => {
- if (preselectedValue && !defaultValue && !value && memoizedOptions.length > 0) {
- const preselectedOption = memoizedOptions.find((option) => option.value === preselectedValue);
+ if (memoizedOptions.length > 0 && !hasPreselectedRef.current) {
+ // Check if we should skip preselection due to existing defaultValue
+ const hasDefaultValue =
+ defaultValue && (Array.isArray(defaultValue) ? defaultValue.length > 0 : true);
- if (preselectedOption) {
- const newValue = multiple ? [preselectedOption] : preselectedOption;
- if (onChange) {
- onChange(newValue, newValue?.addedFields);
+ if (!hasDefaultValue) {
+ // For multiple mode, check if value is empty array or null/undefined
+ // For single mode, check if value is null/undefined
+ const shouldPreselect = multiple
+ ? !value || (Array.isArray(value) && value.length === 0)
+ : !value;
+
+ if (shouldPreselect) {
+ let preselectedOption;
+
+ // Handle explicit preselected value
+ if (preselectedValue) {
+ preselectedOption = memoizedOptions.find((option) => option.value === preselectedValue);
+ }
+ // Handle auto-select first item from API
+ else if (api?.autoSelectFirstItem && memoizedOptions.length > 0) {
+ preselectedOption = memoizedOptions[0];
+ }
+
+ if (preselectedOption) {
+ const newValue = multiple ? [preselectedOption] : preselectedOption;
+ hasPreselectedRef.current = true; // Mark that we've preselected
+ if (onChange) {
+ onChange(newValue, newValue?.addedFields);
+ }
+ }
}
}
}
- }, [preselectedValue, defaultValue, value, memoizedOptions, multiple, onChange]);
+ }, [
+ preselectedValue,
+ defaultValue,
+ value,
+ memoizedOptions,
+ multiple,
+ onChange,
+ api?.autoSelectFirstItem,
+ ]);
// Create a stable key that only changes when necessary inputs change
const stableKey = useMemo(() => {
@@ -237,6 +277,7 @@ export const CippAutoComplete = (props) => {
return (
{
value: item?.label ? item.value : item,
};
if (onCreateOption) {
- onCreateOption(item, item?.addedFields);
+ item = onCreateOption(item, item?.addedFields);
}
}
return item;
@@ -311,7 +352,7 @@ export const CippAutoComplete = (props) => {
value: newValue?.label ? newValue.value : newValue,
};
if (onCreateOption) {
- onCreateOption(newValue, newValue?.addedFields);
+ newValue = onCreateOption(newValue, newValue?.addedFields);
}
}
if (!newValue?.value || newValue.value === "error") {
@@ -321,17 +362,51 @@ export const CippAutoComplete = (props) => {
if (onChange) {
onChange(newValue, newValue?.addedFields);
}
+
+ // In multiple mode, refocus the input after selection to allow continuous adding
+ if (multiple && newValue && autocompleteRef.current) {
+ // Use setTimeout to ensure the selection is processed first
+ setTimeout(() => {
+ const input = autocompleteRef.current?.querySelector("input");
+ if (input) {
+ input.focus();
+ }
+ }, 0);
+ }
}}
options={memoizedOptions}
getOptionLabel={useCallback(
- (option) =>
- option
- ? option.label === null
+ (option) => {
+ if (!option) return "";
+ // For static options (non-API), the option should already have a label
+ if (!api && option.label !== undefined) {
+ return option.label === null ? "" : String(option.label);
+ }
+ // For API options, use the existing logic
+ if (api) {
+ return option.label === null
? ""
- : option.label || "Label not found - Are you missing a labelField?"
- : "",
- []
+ : option.label || "Label not found - Are you missing a labelField?";
+ }
+ // Fallback for any edge cases
+ return option.label || option.value || "";
+ },
+ [api]
)}
+ onKeyDown={(event) => {
+ // Handle Tab key to select highlighted option
+ if (event.key === "Tab" && !event.shiftKey) {
+ // Check if there's a highlighted option
+ const listbox = document.querySelector('[role="listbox"]');
+ const highlightedOption = listbox?.querySelector('[data-focus="true"], .Mui-focused');
+
+ if (highlightedOption && listbox?.style.display !== "none") {
+ event.preventDefault();
+ // Trigger a click on the highlighted option
+ highlightedOption.click();
+ }
+ }
+ }}
sx={sx}
renderInput={(params) => (
@@ -354,6 +429,8 @@ export const CippAutoComplete = (props) => {
)}
)}
+ groupBy={groupBy}
+ renderGroup={renderGroup}
{...other}
/>
);
diff --git a/src/components/CippComponents/CippAutopilotProfileDrawer.jsx b/src/components/CippComponents/CippAutopilotProfileDrawer.jsx
new file mode 100644
index 000000000000..f5b48ae54040
--- /dev/null
+++ b/src/components/CippComponents/CippAutopilotProfileDrawer.jsx
@@ -0,0 +1,255 @@
+import React, { useState, useEffect } from "react";
+import { Divider, Button } from "@mui/material";
+import { Grid } from "@mui/system";
+import { useForm, useWatch, useFormState } from "react-hook-form";
+import { AccountCircle } from "@mui/icons-material";
+import { CippOffCanvas } from "./CippOffCanvas";
+import CippFormComponent from "./CippFormComponent";
+import { CippFormTenantSelector } from "./CippFormTenantSelector";
+import { CippApiResults } from "./CippApiResults";
+import languageList from "/src/data/languageList.json";
+import { ApiPostCall } from "../../api/ApiCall";
+
+export const CippAutopilotProfileDrawer = ({
+ buttonText = "Add Profile",
+ requiredPermissions = [],
+ PermissionButton = Button,
+}) => {
+ const [drawerVisible, setDrawerVisible] = useState(false);
+ const formControl = useForm({
+ mode: "onChange",
+ defaultValues: {
+ DisplayName: "",
+ Description: "",
+ DeviceNameTemplate: "",
+ languages: null,
+ CollectHash: false,
+ Assignto: true,
+ DeploymentMode: false,
+ HideTerms: true,
+ HidePrivacy: true,
+ HideChangeAccount: true,
+ NotLocalAdmin: true,
+ allowWhiteglove: true,
+ Autokeyboard: true,
+ },
+ });
+
+ const createProfile = ApiPostCall({
+ urlFromData: true,
+ relatedQueryKeys: ["Autopilot Profiles*"],
+ });
+
+ // Watch the deployment mode to conditionally disable white glove
+ const deploymentMode = useWatch({
+ control: formControl.control,
+ name: "DeploymentMode",
+ });
+
+ // Watch form state for validation
+ const { isValid, isDirty } = useFormState({
+ control: formControl.control,
+ });
+
+ // Automatically disable white glove when self-deploying mode (shared) is enabled
+ useEffect(() => {
+ if (deploymentMode === true) {
+ // Self-deploying mode is enabled (shared mode), disable white glove
+ formControl.setValue("allowWhiteglove", false);
+ }
+ }, [deploymentMode, formControl]);
+
+ const handleSubmit = () => {
+ const formData = formControl.getValues();
+ // Always set HideChangeAccount to true regardless of form state
+ formData.HideChangeAccount = true;
+ createProfile.mutate({
+ url: "/api/AddAutopilotConfig",
+ data: formData,
+ relatedQueryKeys: ["Autopilot Profiles*"],
+ });
+ };
+
+ const handleCloseDrawer = () => {
+ setDrawerVisible(false);
+ formControl.reset();
+ };
+
+ return (
+ <>
+ setDrawerVisible(true)}
+ startIcon={
+
+
+ }
+ >
+ {
- setSelectedApp([
- ...selectedApp,
- servicePrincipals?.Results?.find(
- (sp) => sp.appId === currentSelectedSp.value
- ),
- ]);
- formControl.setValue("servicePrincipal", null);
+ // Only add if not deprecated
+ if (!isDeprecatedSp) {
+ setSelectedApp([
+ ...selectedApp,
+ servicePrincipals?.Results?.find(
+ (sp) => sp.appId === currentSelectedSp.value
+ ),
+ ]);
+ formControl.setValue("servicePrincipal", null);
+ }
}}
>
+ }
+ >
+
+
+ );
+ }
+
+ return str;
+ };
+
+ // Convert data to property items format for CippPropertyListCard
+ const convertToPropertyItems = (data, excludeAuditData = false) => {
+ if (!data) return [];
+
+ return Object.entries(data)
+ .map(([key, value]) => {
+ // Skip certain blacklisted fields
+ const blacklist = ["selectedOption", "GUID", "ID", "id", "noSubmitButton"];
+ if (blacklist.includes(key)) return null;
+
+ // Exclude auditData from main log items if specified
+ if (excludeAuditData && key === "auditData") return null;
+
+ let displayValue;
+ // Handle different value types
+ if (typeof value === "string" && isGuid(value)) {
+ // Handle pure GUID strings
+ displayValue = renderGuidValue(value);
+ } else if (
+ typeof value === "string" &&
+ value.match(/^user_[0-9a-f]{32}@[^@]+\.onmicrosoft\.com$/i)
+ ) {
+ // Handle special partner UPN format as direct values
+ displayValue = renderGuidValue(value);
+ } else if (
+ key.toLowerCase().includes("clientip") &&
+ value &&
+ value !== null &&
+ isValidIpAddress(value)
+ ) {
+ // Handle IP addresses (with optional ports) using CippGeoLocation
+ // Check for various IP field names: clientIp, ClientIP, IP, etc.
+ const cleanIp = extractIpForGeolocation(value);
+ displayValue = (
+
+
+ );
+ } else if (typeof value === "string") {
+ // Handle strings that might contain embedded GUIDs
+ // First apply GUID replacement to get the processed string
+ const guidProcessedValue = replaceGuidsInString(value);
+
+ // If GUID replacement returned a React element (with tooltips), use it directly
+ if (typeof guidProcessedValue === "object" && guidProcessedValue?.type) {
+ displayValue = guidProcessedValue;
+ } else {
+ // Otherwise, apply getCippFormatting to the GUID-processed string
+ // This preserves key-based formatting while including GUID replacements
+ displayValue = getCippFormatting(guidProcessedValue, key);
+ }
+ } else if (typeof value === "object" && value !== null) {
+ // Handle nested objects and arrays - expand GUIDs within them
+ displayValue = renderNestedValue(value);
+ } else {
+ // Handle regular values
+ displayValue = getCippFormatting(value, key);
+ }
+
+ return {
+ label: getCippTranslation(key),
+ value: displayValue,
+ };
+ })
+ .filter(Boolean);
+ };
+
+ // Render GUID values with proper resolution states
+ const renderGuidValue = (guidValue) => {
+ // Handle standard GUIDs directly
+ if (guidMapping[guidValue]) {
+ return (
+
+
+ );
+ }
+
+ // Fallback for unresolved values
+ return (
+
+ {arrayValue.map((item, index) => (
+
+ );
+ }
+
+ // For complex arrays, use the formatted version which might include table buttons
+ return getCippFormatting(arrayValue, "array");
+ };
+
+ // Render object values with GUID expansion
+ const renderObjectValue = (objectValue) => {
+ const entries = Object.entries(objectValue);
+
+ // If it's a simple object with few properties, show them inline
+ if (entries.length <= 3 && entries.every(([, val]) => typeof val !== "object")) {
+ return (
+
+ {typeof item === "string" && isGuid(item)
+ ? renderGuidValue(item)
+ : typeof item === "string"
+ ? replaceGuidsInString(item)
+ : getCippFormatting(item, `item-${index}`)}
+
+ ))}
+
+ {entries.map(([objKey, objVal]) => (
+
+ );
+ }
+
+ // For complex objects, use the formatted version which might include table buttons
+ return getCippFormatting(objectValue, "object");
+ };
+
+ // Helper function to validate IP addresses (with optional ports)
+ const isValidIpAddress = (ip) => {
+ if (typeof ip !== "string") return false;
+
+ // Extract IP part if there's a port (split by last colon for IPv6 compatibility)
+ let ipPart = ip;
+ let portPart = null;
+
+ // Check for IPv4:port format
+ const ipv4PortMatch = ip.match(/^(.+):(\d+)$/);
+ if (ipv4PortMatch) {
+ ipPart = ipv4PortMatch[1];
+ portPart = ipv4PortMatch[2];
+ }
+
+ // IPv4 regex
+ const ipv4Regex =
+ /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
+
+ // IPv6 regex (simplified) - note: IPv6 with ports use [::]:port format, handled separately
+ const ipv6Regex = /^(?:[0-9a-fA-F]{1,4}:){7}[0-9a-fA-F]{1,4}$|^::1$|^::$/;
+
+ // Check for IPv6 with port [::]:port format
+ const ipv6PortMatch = ip.match(/^\[(.+)\]:(\d+)$/);
+ if (ipv6PortMatch) {
+ ipPart = ipv6PortMatch[1];
+ portPart = ipv6PortMatch[2];
+ }
+
+ // Validate port number if present
+ if (portPart !== null) {
+ const port = parseInt(portPart, 10);
+ if (port < 1 || port > 65535) return false;
+ }
+
+ return ipv4Regex.test(ipPart) || ipv6Regex.test(ipPart);
+ };
+
+ // Extract clean IP address from IP:port combinations for geolocation
+ const extractIpForGeolocation = (ipWithPort) => {
+ if (typeof ipWithPort !== "string") return ipWithPort;
+
+ // IPv4:port format
+ const ipv4PortMatch = ipWithPort.match(/^(.+):(\d+)$/);
+ if (ipv4PortMatch) {
+ return ipv4PortMatch[1];
+ }
+
+ // IPv6 with port [::]:port format
+ const ipv6PortMatch = ipWithPort.match(/^\[(.+)\]:(\d+)$/);
+ if (ipv6PortMatch) {
+ return ipv6PortMatch[1];
+ }
+
+ // Return as-is if no port detected
+ return ipWithPort;
+ };
+
+ const mainLogItems = convertToPropertyItems(row, true); // Exclude auditData from main items
+ const auditDataItems = row?.auditData ? convertToPropertyItems(row.auditData) : [];
+
+ return (
+
+ {getCippTranslation(objKey)}:{" "}
+ {typeof objVal === "string" && isGuid(objVal)
+ ? renderGuidValue(objVal)
+ : typeof objVal === "string"
+ ? replaceGuidsInString(objVal)
+ : getCippFormatting(objVal, objKey)}
+
+ ))}
+
+
+
+
+
-
+ !disableVariables ? (
+
+ (
+
+
- (
- field.onChange(value)}
- />
- )}
- />
-
-
+ (
+ field.onChange(value)}
+ />
+ )}
+ />
+
+ {get(errors, convertedName, {})?.message && (
+
+ {get(errors, convertedName, {})?.message}
+
+ )}
+ {helperText && (
+
+ {helperText}
+
+ )}
+
);
- case "richText":
+ case "richText": {
+ const editorInstanceRef = React.useRef(null);
+ const lastSetValue = React.useRef(null);
+
return (
<>
@@ -303,30 +419,56 @@ export const CippFormComponent = (props) => {
name={convertedName}
control={formControl.control}
rules={validators}
- render={({ field }) => (
- <>
- {label}
- {
- field.onChange(editor.getHTML());
- }}
- label={label}
- renderControls={() => (
-
-
- )}
- />
-
- )}
+ render={({ field }) => {
+ const { value, onChange, ref } = field;
+
+ // Update content when value changes externally
+ React.useEffect(() => {
+ if (
+ editorInstanceRef.current &&
+ typeof value === "string" &&
+ value !== lastSetValue.current
+ ) {
+ editorInstanceRef.current.commands.setContent(value || "", false);
+ lastSetValue.current = value;
+ }
+ }, [value]);
+
+ return (
+ <>
+ {label}
+ {
+ editorInstanceRef.current = editor;
+ // Set initial content when editor is created
+ if (typeof value === "string") {
+ editor.commands.setContent(value || "", false);
+ lastSetValue.current = value;
+ }
+ }}
+ onUpdate={({ editor }) => {
+ const newValue = editor.getHTML();
+ lastSetValue.current = newValue;
+ onChange(newValue);
+ }}
+ label={label}
+ renderControls={() => (
+
+
+ )}
+ />
+
+ );
+ }}
/>
+ (
+
+
+ {label}
+
+ document.getElementById(`file-input-${convertedName}`).click()}
+ >
+
+ {field.value ? field.value.name : "Click to upload file or drag and drop"}
+
+ {field.value && (
+
+ Size: {(field.value.size / 1024).toFixed(2)} KB
+
+ )}
+
+ {
+ const file = e.target.files[0];
+ field.onChange(file);
+ if (other.onChange) {
+ other.onChange(file);
+ }
+ }}
+ />
+
+ )}
+ />
+
+
+
+
{label && {label} }
- append({ Key: "", Value: "" })} variant="outlined">
+ append(getInitialValue())} variant="outlined" size="small">
-
+
- {fields.map((field, index) => (
-
- (
- (
- remove(index)} aria-label="remove item">
-
-
-
-
- ))}
-
+ {fields.map((field, index) =>
+ mode === "simple" ? renderSimpleField(field, index) : renderKeyValueField(field, index)
+ )}
+
);
};
diff --git a/src/components/CippComponents/CippFormLicenseSelector.jsx b/src/components/CippComponents/CippFormLicenseSelector.jsx
index 0f8e1a6b867b..1bd640850857 100644
--- a/src/components/CippComponents/CippFormLicenseSelector.jsx
+++ b/src/components/CippComponents/CippFormLicenseSelector.jsx
@@ -1,4 +1,3 @@
-import React from "react";
import { CippFormComponent } from "./CippFormComponent";
import { getCippLicenseTranslation } from "../../utils/get-cipp-license-translation";
import { useSettings } from "../../hooks/use-settings";
diff --git a/src/components/CippComponents/CippFormTenantSelector.jsx b/src/components/CippComponents/CippFormTenantSelector.jsx
index dbde6a84b073..0ce271515d29 100644
--- a/src/components/CippComponents/CippFormTenantSelector.jsx
+++ b/src/components/CippComponents/CippFormTenantSelector.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
import { CippFormComponent } from "./CippFormComponent";
import { useSettings } from "../../hooks/use-settings";
import { GroupHeader, GroupItems } from "../CippComponents/CippAutocompleteGrouping";
@@ -15,7 +15,8 @@ export const CippFormTenantSelector = ({
disableClearable = true,
preselectedEnabled = false,
removeOptions = [],
- includeGroups = false, // New parameter
+ includeGroups = false,
+ includeOffboardingDefaults = false,
...other
}) => {
const validators = () => {
@@ -28,10 +29,30 @@ export const CippFormTenantSelector = ({
};
const currentTenant = useSettings()?.currentTenant;
+ // Build the API URL with query parameters to support tenant specific offboarding config
+ const buildApiUrl = () => {
+ const baseUrl = allTenants ? "/api/ListTenants?AllTenantSelector=true" : "/api/ListTenants";
+ const params = new URLSearchParams();
+
+ if (allTenants) {
+ params.append("AllTenantSelector", "true");
+ }
+
+ if (includeOffboardingDefaults) {
+ params.append("IncludeOffboardingDefaults", "true");
+ }
+
+ return params.toString()
+ ? `${baseUrl.split("?")[0]}?${params.toString()}`
+ : baseUrl.split("?")[0];
+ };
+
// Fetch tenant list
const tenantList = ApiGetCall({
- url: allTenants ? "/api/ListTenants?AllTenantSelector=true" : "/api/ListTenants",
- queryKey: allTenants ? "ListTenants-FormAllTenantSelector" : "ListTenants-FormnotAllTenants",
+ url: buildApiUrl(),
+ queryKey: allTenants
+ ? `ListTenants-FormAllTenantSelector${includeOffboardingDefaults ? "-WithOffboarding" : ""}`
+ : `ListTenants-FormnotAllTenants${includeOffboardingDefaults ? "-WithOffboarding" : ""}`,
});
// Fetch tenant group list if includeGroups is true
@@ -46,28 +67,34 @@ export const CippFormTenantSelector = ({
useEffect(() => {
if (tenantList.isSuccess && (!includeGroups || tenantGroupList.isSuccess)) {
- const tenantData = tenantList.data.map((tenant) => ({
- value: tenant[valueField],
- label: `${tenant.displayName} (${tenant.defaultDomainName})`,
- type: "Tenant",
- addedFields: {
- defaultDomainName: tenant.defaultDomainName,
- displayName: tenant.displayName,
- customerId: tenant.customerId,
- },
- }));
-
- const groupData = includeGroups
- ? tenantGroupList?.data?.Results?.map((group) => ({
- value: group.Id,
- label: group.Name,
- type: "Group",
+ const tenantData = Array.isArray(tenantList.data)
+ ? tenantList.data.map((tenant) => ({
+ value: tenant[valueField],
+ label: `${tenant.displayName} (${tenant.defaultDomainName})`,
+ type: "Tenant",
+ addedFields: {
+ defaultDomainName: tenant.defaultDomainName,
+ displayName: tenant.displayName,
+ customerId: tenant.customerId,
+ ...(includeOffboardingDefaults && {
+ offboardingDefaults: tenant.offboardingDefaults,
+ }),
+ },
}))
: [];
+ const groupData =
+ includeGroups && Array.isArray(tenantGroupList?.data?.Results)
+ ? tenantGroupList.data.Results.map((group) => ({
+ value: group.Id,
+ label: group.Name,
+ type: "Group",
+ }))
+ : [];
+
setOptions([...tenantData, ...groupData]);
}
- }, [tenantList.isSuccess, tenantGroupList.isSuccess, includeGroups]);
+ }, [tenantList.isSuccess, tenantGroupList.isSuccess, includeGroups, includeOffboardingDefaults]);
return (
-
+ {resourcePerms.applicationPermissions.map((perm, idx) => {
+ const description =
+ getPermissionDescription(resourceId, perm.id, "application") ||
+ perm.description ||
+ "No description available";
+ return (
+
-
+ {resourcePerms.delegatedPermissions.map((perm, idx) => {
+ const description =
+ getPermissionDescription(resourceId, perm.id, "delegated") ||
+ perm.description ||
+ "No description available";
+ return (
+
-
+ {resourcePerms.applicationPermissions.map((perm, idx) => {
+ const description =
+ getPermissionDescription(resourceId, perm.id, "application") ||
+ perm.description ||
+ "No description available";
+ return (
+
-
+ {resourcePerms.delegatedPermissions.map((perm, idx) => {
+ const description =
+ getPermissionDescription(resourceId, perm.id, "delegated") ||
+ perm.description ||
+ "No description available";
+ return (
+
-
+ {appPermissions.map((permission, idx) => {
+ const permDetails = getPermissionDetails(permission.id, "Role");
+ return (
+
-
+ {delegatedPermissions.map((permission, idx) => {
+ const permDetails = getPermissionDetails(permission.id, "Scope");
+ return (
+
-
+ {applicationManifest.signInAudience && (
+
Current groupType: {formControl.watch("groupType")}
+
{!hidePageType && <>{formPageType} - }
{title}
+ {titleButton && titleButton}
)}
diff --git a/src/components/CippFormPages/CippFormSkeleton.jsx b/src/components/CippFormPages/CippFormSkeleton.jsx
index 086b6b09c378..5fba2ef46370 100644
--- a/src/components/CippFormPages/CippFormSkeleton.jsx
+++ b/src/components/CippFormPages/CippFormSkeleton.jsx
@@ -1,4 +1,6 @@
-import { Box, Grid, Skeleton } from "@mui/material";
+import { Box, Skeleton } from "@mui/material";
+
+import { Grid } from "@mui/system";
const CippFormSkeleton = ({ layout }) => {
return (
@@ -6,7 +8,7 @@ const CippFormSkeleton = ({ layout }) => {
{layout.map((columns, rowIndex) => (
{Array.from({ length: columns }).map((_, columnIndex) => (
-
+
))}
diff --git a/src/components/CippFormPages/CippInviteGuest.jsx b/src/components/CippFormPages/CippInviteGuest.jsx
index 4c687c811083..7d62d071da0b 100644
--- a/src/components/CippFormPages/CippInviteGuest.jsx
+++ b/src/components/CippFormPages/CippInviteGuest.jsx
@@ -1,11 +1,12 @@
-import { Grid } from "@mui/material";
+import "@mui/material";
+import { Grid } from "@mui/system";
import CippFormComponent from "/src/components/CippComponents/CippFormComponent";
const CippInviteUser = (props) => {
const { formControl, userSettingsDefaults } = props;
return (
-
+
{
formControl={formControl}
/>
-
+
{
formControl={formControl}
/>
-
+
{
formControl={formControl}
/>
-
+
{
if (Array.isArray(obj)) {
@@ -37,7 +42,29 @@ const cleanObject = (obj) => {
}
};
-const renderListItems = (data, onItemClick) => {
+// Function to check if a string is a GUID
+const isGuid = (str) => {
+ if (typeof str !== "string") return false;
+ const guidRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i;
+ return guidRegex.test(str);
+};
+
+// Function to recursively scan an object for GUIDs
+const findGuids = (obj, guidsSet = new Set()) => {
+ if (!obj) return guidsSet;
+
+ if (typeof obj === "string" && isGuid(obj)) {
+ guidsSet.add(obj);
+ } else if (Array.isArray(obj)) {
+ obj.forEach((item) => findGuids(item, guidsSet));
+ } else if (typeof obj === "object") {
+ Object.values(obj).forEach((value) => findGuids(value, guidsSet));
+ }
+
+ return guidsSet;
+};
+
+const renderListItems = (data, onItemClick, guidMapping = {}, isLoadingGuids = false) => {
return Object.entries(data).map(([key, value]) => {
if (Array.isArray(value)) {
return (
@@ -64,6 +91,31 @@ const renderListItems = (data, onItemClick) => {
}
/>
);
+ } else if (typeof value === "string" && isGuid(value) && guidMapping[value]) {
+ return (
+
+
+
+ }
+ />
+ );
} else {
return (
{guidMapping[value]}
+
+ }
+ />
+ );
+ } else if (typeof value === "string" && isGuid(value) && isLoadingGuids) {
+ return (
+
+ {guidMapping[omaSetting.value]}
+
+ (GUID)
+
+
+
+ {guidMapping[value]}
+
+ (GUID)
+
+
+
+ {guidMapping[optionValue]}
+
+ (GUID)
+
+
+
+ {guidMapping[value]}
+
+ (GUID)
+
+
+
+ }
+ />
+ );
+ } else if (typeof value === "string" && isGuid(value) && isLoadingGuids) {
+ items.push(
+ Allowed Tenants
diff --git a/src/components/CippSettings/CippDnsSettings.jsx b/src/components/CippSettings/CippDnsSettings.jsx index 525fde070cca..847c0451bf87 100644 --- a/src/components/CippSettings/CippDnsSettings.jsx +++ b/src/components/CippSettings/CippDnsSettings.jsx @@ -24,11 +24,11 @@ const CippDnsSettings = () => { const DnsButtons = () => { const resolvers = ["Google", "Cloudflare", "Quad9"]; - return resolvers.map((resolver) => ( + return resolvers.map((resolver, index) => (-
+ {items.map(({ standard, category }) => {
+ const isSelected = !!selectedStandards[standard.name];
+
+ const isNewStandard = (dateAdded) => {
+ if (!dateAdded) return false;
+ const currentDate = new Date();
+ const addedDate = new Date(dateAdded);
+ return differenceInDays(currentDate, addedDate) <= 30;
+ };
+
+ const handleToggle = () => {
+ handleToggleSingleStandard(standard.name);
+ };
+
+ return (
+
-
+
- + CIPP has the ability to send alerts to your PSA, Webhook or Email. You can configure + these settings under > Tenant Administration > Alert Configuration. + +
-
+
- + If you imported baselines, or want to set tenants to your own baseline, you should + check out our standards under these settings under > Tenant Administration > + Standards. + +
-
+
- + If you want to use our integrations, you should set these up under > CIPP > + Integrations. Some examples are CSP integrations, Password Pusher, PSA, and more. + +
-
+
- + Adding more users to CIPP? you can do this via CIPP > Advanced > Super Admin. + +
-
+
- + You can deploy Windows Applications too, directly using intune. We have Chocolately, + WinGet, and RMM apps under > Intune > Applications. Some examples are CSP + integrations, Password Pusher, PSA, and more. + +
-
+
- + Tenants can be grouped, and you can implement custom variables for your tenants under + WinGet, and RMM apps under Tenant Administrator > Administration > Tenants. + +
-
+
- + Have an enterprise app you want to deploy? Check out our tools{" "} + section. This menu also contains useful things such as our geo-ip lookup, and more. + +
-
+
- + CIPP Templates by CyberDrain contain several example standards, including low, + medium, and high priority standards + +
- + JoeyV's Conditional Access Baseline contains a Microsoft approved baseline for + Conditional Access, following the Microsoft best practices. + +
- + OpenIntuneBaseline contains Intune templates, the baseline is a community driven + baseline for Intune, based on CIS, NIST, and more benchmarks. It's considered the + leading baseline for Intune. + +
- {content}
+ {content}
Loading...
;
+ }
+
return (
<>
@@ -71,7 +254,7 @@ const Page = () => {
title="General Settings"
propertyItems={[
{
- label: "Default new user usage location",
+ label: "Default usage location for users",
value: (
-
+ {result.warnings.map((warning, index) => (
+
-
+
+ {warning} + +
+ ))}
+
-
+ {result.errors.map((error, index) => (
+
-
+
{error} +
+ ))}
+
Loading...
;
- }
+ const contact = contactInfo.data;
+ const address = contact.addresses?.[0] || {};
+ const phones = contact.phones || [];
+
+ // Use Map for O(1) phone lookup
+ const phoneMap = new Map(phones.map((p) => [p.type, p.number]));
+
+ return {
+ displayName: contact.displayName || "",
+ firstName: contact.givenName || "",
+ lastName: contact.surname || "",
+ email: contact.mail || "",
+ hidefromGAL: contact.hidefromGAL || false,
+ streetAddress: address.street || "",
+ postalCode: address.postalCode || "",
+ city: address.city || "",
+ state: address.state || "",
+ country: address.countryOrRegion ? countryLookup.get(address.countryOrRegion) || "" : "",
+ companyName: contact.companyName || "",
+ mobilePhone: phoneMap.get("mobile") || "",
+ businessPhone: phoneMap.get("business") || "",
+ jobTitle: contact.jobTitle || "",
+ website: contact.website || "",
+ mailTip: contact.mailTip || "",
+ };
+ }, [contactInfo.isSuccess, contactInfo.data]);
+
+ // Use callback to prevent unnecessary re-renders
+ const resetForm = useCallback(() => {
+ if (processedContactData) {
+ formControl.reset(processedContactData);
+ }
+ }, [processedContactData, formControl]);
+
+ useEffect(() => {
+ resetForm();
+ }, [resetForm]);
+
+ // Memoize custom data formatter
+ const customDataFormatter = useCallback(
+ (values) => {
+ const contact = Array.isArray(contactInfo.data) ? contactInfo.data[0] : contactInfo.data;
+ return {
+ tenantID: tenantDomain,
+ ContactID: contact?.id,
+ DisplayName: values.displayName,
+ hidefromGAL: values.hidefromGAL,
+ email: values.email,
+ FirstName: values.firstName,
+ LastName: values.lastName,
+ Title: values.jobTitle,
+ StreetAddress: values.streetAddress,
+ PostalCode: values.postalCode,
+ City: values.city,
+ State: values.state,
+ CountryOrRegion: values.country?.value || values.country,
+ Company: values.companyName,
+ mobilePhone: values.mobilePhone,
+ phone: values.businessPhone,
+ website: values.website,
+ mailTip: values.mailTip,
+ };
+ },
+ [tenantDomain, contactInfo.data]
+ );
+
+ const contact = Array.isArray(contactInfo.data) ? contactInfo.data[0] : contactInfo.data;
return (
-
+
+ Removing the Admin and User Access it applies to emails. +
-
+
- Anti-phishing +
- Anti-spam +
- Anti-malware +
- Safe Attachments +
-
- );
-};
-
-Page.getLayout = (page) => {pageTitle}
-This is a placeholder page for the deploy transport rule section.
-
-
- );
-};
-
-Page.getLayout = (page) => {pageTitle}
-This no longer exists.
-{JSON.stringify(formControl.watch(), null, 2)}
+
+ {JSON.stringify(formControl.watch(), null, 2)}
+
+
-
- );
-};
-
-Page.getLayout = (page) => {pageTitle}
-This is a placeholder page for the deploy ca policies section.
-