A web-based version of the IntuneHydrationKit PowerShell module that enables IT administrators to bootstrap Microsoft Intune tenants with best-practice configurations through an intuitive browser interface.

• Streamlined 4-Step Wizard: Guided configuration process from tenant setup to execution
• MSAL Authentication: Secure authentication with Microsoft Entra ID
• Cloud Support: The web app currently supports Global (Commercial); use the PowerShell module for US Government, Germany, and China tenants
• Local Templates: 182+ pre-built templates bundled with the app (no external dependencies)
• Template Catalog: Browse every importable item and inspect the import-ready JSON payloads at /templates
• Safety First: Built-in safeguards prevent accidental deletions
• Real-time Progress: Live updates during policy deployment with pause/resume/cancel controls
• Comprehensive Coverage: Deploy 47 groups, 29 filters, 10 compliance policies, 10 app protection policies, 20 conditional access policies, and more
• Optimized Performance: Pre-fetch optimization reduces API calls by 90% for App Protection operations
• Execution Control: Pause, resume, or cancel operations mid-execution

• Framework: Next.js 15 (App Router)
• Language: TypeScript (strict mode)
• Authentication: MSAL React (@azure/msal-react)
• UI Components: shadcn/ui (Radix UI + Tailwind CSS)
• State Management: React Context + TanStack Query
• Styling: Tailwind CSS with dark mode support
• Icons: Lucide React
• Notifications: Sonner

• Node.js 18.17 or later
• npm 9.0 or later
• Microsoft Entra ID (Azure AD) tenant
• Entra ID app registration with required permissions

📋 Requested Microsoft Graph Permissions

These scopes are required to read policies, assignments, groups, filters, and related Intune objects.

Delegated Permissions:

• DeviceManagementConfiguration.ReadWrite.All
• DeviceManagementServiceConfig.ReadWrite.All
• DeviceManagementManagedDevices.ReadWrite.All
• DeviceManagementScripts.ReadWrite.All
• DeviceManagementApps.ReadWrite.All
• Group.ReadWrite.All
• Policy.Read.All
• Policy.ReadWrite.ConditionalAccess
• Application.Read.All
• Directory.ReadWrite.All
• LicenseAssignment.Read.All
• Organization.Read.All

Note: Admin consent is required for these permissions.

git clone https://github.com/jorgeasaurus/IntuneHydrationKit-WebApp.git
cd IntuneHydrationKit-WebApp

npm install

Create a .env.local file in the root directory:

cp .env.local.example .env.local

Edit .env.local with your values:

NEXT_PUBLIC_MSAL_CLIENT_ID=your-client-id-here
NEXT_PUBLIC_MSAL_AUTHORITY=https://login.microsoftonline.com/common
NEXT_PUBLIC_MSAL_REDIRECT_URI=http://localhost:3000
NEXT_PUBLIC_CLOUD_ENVIRONMENT=global

1. Go to Azure Portal > Entra ID > App registrations
2. Create a new registration:
   • Name: Intune Hydration Kit Web
   • Supported account types: Choose appropriate option
   • Redirect URI: Web - http://localhost:3000
3. Copy the Application (client) ID to NEXT_PUBLIC_MSAL_CLIENT_ID
4. Go to API permissions > Add the required Graph API permissions listed above
5. Click Grant admin consent for your tenant

npm run dev

Open http://localhost:3000 in your browser.

Wizard Simplification

• Reduced wizard from 5 steps to 4 by removing OpenIntuneBaseline configuration
• All templates now load instantly from local public/IntuneTemplates/ directory
• No external GitHub API dependencies for template loading

App Protection Policies

• Updated to 10 App Protection policies (added 2 BYOD baseline templates)
• Implemented pre-fetch optimization reducing API calls by 90%
• Added PowerShell module parity for policy creation
• Fixed platform detection for iOS vs Android policies

Execution Improvements

• Added execution lock to prevent duplicate runs in React Strict Mode
• Implemented pause/resume/cancel controls
• Added success items display in results summary
• Cache versioning for automatic invalidation on template updates

UI Enhancements

• Added application favicon
• Improved mobile responsiveness
• Enhanced dark mode support
• Real-time task status updates

• npm run dev - Start development server
• npm run dev:turbo - Start development server with Turbopack
• npm run build - Build for production
• npm run start - Start production server
• npm run lint - Run ESLint
• npm run type-check - Run TypeScript type checking

├── app/                      # Next.js App Router pages
│   ├── layout.tsx           # Root layout with providers
│   ├── page.tsx             # Landing page
│   ├── wizard/              # 4-step configuration wizard
│   ├── dashboard/           # Real-time execution dashboard
│   └── results/             # Execution results and reporting
├── components/
│   ├── ui/                  # shadcn/ui components
│   ├── auth/                # Authentication components
│   ├── wizard/              # Wizard step components
│   ├── dashboard/           # Dashboard components (progress, task list, controls)
│   └── providers/           # React providers
├── lib/
│   ├── auth/                # MSAL configuration
│   ├── graph/               # Graph API client & operations
│   ├── hydration/           # Task execution engine
│   ├── templates/           # Template loader (local files)
│   └── utils/               # Utility functions
├── public/
│   └── IntuneTemplates/     # 183+ bundled policy templates
├── types/                   # TypeScript type definitions
├── hooks/                   # Custom React hooks
└── templates/               # Template metadata

• Next.js 15 project setup with TypeScript
• MSAL authentication flow
• 4-step wizard with streamlined workflow
• shadcn/ui component library
• Graph API client wrapper with retry logic

• Local template system (183+ templates)
• Task execution engine with queue management
• Graph API service functions for all policy types
• Pre-flight validation
• Error handling and retry logic with exponential backoff
• Real-time progress tracking

• Real-time execution dashboard
• Pause/Resume/Cancel controls
• Task status indicators
• Execution results and summary page
• Dark mode support
• Mobile-responsive design

• Session storage caching with version control
• App Protection policy pre-fetch optimization (90% API reduction)
• Duplicate execution prevention
• PowerShell module parity for App Protection policies
• Success items display in results
• Execution lock pattern for React Strict Mode compatibility

• TypeScript strict mode compliance
• Build optimization
• Deployment documentation in this README
• End-to-end testing
• Production deployment to intunehydrationkit.com
• Final documentation review

The application guides you through a streamlined 4-step process:

• Enter your Tenant ID and optional display name
• Use the Global (Commercial) cloud environment in the web app
• Authenticate with Microsoft Entra ID

• Create: Deploy new configurations (skips if already exists)
• Delete: Remove configurations created by this tool (with safety checks)
• Preview: See what would be deployed without making changes

Select which policy categories to deploy:

• Dynamic Groups (47 items) - Device categorization groups
• Device Filters (29 items) - Assignment filters for targeting
• Compliance Policies (10 items) - Platform-specific compliance rules
• App Protection (10 items) - MAM policies for iOS and Android
• Conditional Access (20 items) - Zero Trust access policies
• Enrollment Profiles (3 items) - Autopilot and DEP profiles

• Review all selections
• View estimated object count
• Confirm understanding of tenant modifications
• Start execution

The web app currently supports the following Microsoft cloud environment:

• global - Commercial cloud (default)

For sovereign and government clouds, use the IntuneHydrationKit PowerShell module:

• usgov - US Government (GCC High)
• usgovdod - US Government (DoD)
• germany - Germany cloud
• china - China (21Vianet)

1. Create - Deploy new configurations (skips existing objects)
2. Preview - Show what would happen without making changes
3. Delete - Remove configurations created by this tool (only deletes items with hydration marker)

• Access tokens are stored in sessionStorage (never in localStorage)
• All Graph API calls use HTTPS
• Content Security Policy headers configured
• No sensitive data logging
• Session timeout after 1 hour of inactivity

• Local Storage: All 183+ templates load from public/IntuneTemplates/ in <100ms
• Session Caching: Templates cached with automatic version invalidation
• No Network Dependency: No GitHub API calls during template loading

• Pre-fetch Optimization: App Protection operations reduced from 10 API calls to 1 (90% reduction)
• Smart Caching: Policies cached in execution context and synchronized after create/delete
• Rate Limiting Protection: 2-second delay between tasks + exponential backoff on 429 errors

• Duplicate Prevention: Execution lock prevents React Strict Mode double-invocation
• Error Recovery: Comprehensive error handling with retry logic (max 3 attempts)
• Graceful Degradation: Failed tasks don't block subsequent operations

This application requires a platform that supports Next.js SSR/SSG and cannot be deployed to GitHub Pages.

1. Vercel ⭐ (Recommended)

   • Zero-configuration deployment
   • Automatic HTTPS and global CDN
   • Perfect Next.js optimization
   • Free tier available
   • Deploy: vercel --prod

2. Azure Static Web Apps ⭐

   • Microsoft ecosystem integration
   • Seamless Entra ID integration
   • Built-in authentication providers
   • Free tier available

3. Netlify

   • Alternative to Vercel
   • Easy deployment
   • Good Next.js support
   • Free tier available

4. Self-Hosted (Docker)

   • Full control
   • On-premises deployment
   • Air-gapped environments
   • Infrastructure costs only

# Install Vercel CLI
npm install -g vercel

# Deploy
vercel

# Configure environment variables in Vercel Dashboard
# Deploy to production
vercel --prod

Important: After deployment, update your Entra ID app registration with the production redirect URI.

Make sure you've signed in through the landing page before accessing the wizard.

Ensure your redirect URI in Entra ID matches exactly with NEXT_PUBLIC_MSAL_REDIRECT_URI.

Verify that:

1. All required Graph API permissions are added to your app registration
2. Admin consent has been granted
3. You're signed in with an account that has Intune Admin or Global Admin role

This project is under active development. Contributions are welcome!

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Submit a pull request

MIT License - See LICENSE file for details

• IntuneHydrationKit PowerShell Module
• OpenIntuneBaseline

For issues and questions:

• Create an issue on GitHub
• Check the PowerShell module documentation
• Review Microsoft Graph API documentation

Note: This is a web interface for the IntuneHydrationKit. Power users can continue using the PowerShell module for automation scenarios.