🛡️ PIM-Manager - Modern Azure Privileged Identity Management Extension

A beautiful, modern Chrome extension for managing Azure Privileged Identity Management (PIM) roles with an intuitive glassmorphism interface and multi-theme support.

✨ Features

🎨 Modern Glassmorphism Design

• 6 Beautiful Themes: Ocean Blue, Forest Green, Sunset Orange, Deep Purple, Midnight Dark, Rose Gold
• Advanced Visual Effects: Backdrop blur, transparency, and smooth gradients
• Micro-Interactions: Ripple effects, hover animations, and smooth transitions
• Responsive Design: Optimized for all screen sizes with modern aesthetics

🚀 Enhanced User Experience

• Theme Selector: Visual preview dropdown with instant theme switching
• Progress Indicators: Real-time loading progress with smooth animations
• Smart Notifications: Enhanced toast system with auto-dismiss and manual close
• Keyboard Navigation: Tab switching (1-4 keys) and theme cycling (Ctrl+T)
• Accessibility: High contrast support and screen reader compatibility

🔐 Core PIM Functionality

• Role Management: Activate, extend, and monitor privileged roles
• Bulk Operations: Activate or extend multiple roles simultaneously
• Expiration Monitoring: Real-time role expiration tracking with alerts
• Justification Support: Automatic justification handling based on PIM policies
• Multi-Tenant: Support for multiple Azure tenants with automatic detection

🌍 Internationalization

• Multi-Language Support: English and French with easy extensibility
• Persistent Preferences: Language and theme choices saved automatically
• Localized Messages: All UI text properly localized with placeholder support

🎯 Quick Start

Installation

1. Download the extension files
2. Open Chrome and navigate to chrome://extensions/
3. Enable "Developer mode"
4. Click "Load unpacked" and select the extension folder
5. Pin the extension to your toolbar

First Use

1. Authentication: Click the refresh button to sign in with your Azure account
2. Theme Selection: Click the theme icon to choose your preferred visual style
3. Language: Toggle between English and French using the language button
4. Notifications: Enable role expiration warnings in the notification panel

🎨 Available Themes

Theme	Description	Best For
🌊 Ocean Blue	Professional blue gradients	Corporate environments
🌲 Forest Green	Nature-inspired green tones	Eco-friendly workspaces
🌅 Sunset Orange	Warm orange gradients	Creative workflows
🔮 Deep Purple	Rich purple tones	Modern interfaces
🌙 Midnight Dark	Dark mode with blue accents	Low-light environments
🌹 Rose Gold	Light theme with warm tones	Elegant presentations

📱 Interface Overview

Main Tabs

• 📋 Eligible: Roles available for activation with duration and justification info
• ✅ Active: Currently active roles with expiration timers and extend options
• ⏰ Expiring: Roles expiring within 30 minutes with urgent actions
• ⚙️ Settings: Authentication, notifications, and application preferences

Smart Features

• Auto-Refresh: Automatic role data updates with background sync
• Progress Tracking: Visual progress bars during role operations
• Error Recovery: Intelligent retry logic with user-friendly error messages
• Performance Metrics: Real-time loading and rendering performance data

🔧 Technical Architecture

File Structure

pim-manager/
├── manifest.json          # Extension configuration
├── popup.html             # Modern UI structure
├── popup.css              # Glassmorphism styles & themes
├── popup.js               # Enhanced frontend logic
├── background.js          # Service worker & PIM API
├── icons/                 # Extension icons
└── _locales/             # Language files

Key Technologies

• Glassmorphism CSS: Advanced backdrop-filter effects
• Chrome Extensions API: Identity, storage, and notifications
• Microsoft Graph API: Azure PIM role management
• Modern JavaScript: ES2022+ with async/await patterns
• Multi-Tenant OAuth: Secure authentication flow

🛠️ Development

Prerequisites

• Chrome 88+ (for backdrop-filter support)
• Node.js 16+ (for development tools)
• Azure tenant with PIM configured
• Valid Azure application registration

Setup

# Clone the repository
git clone https://github.com/your-repo/pim-manager.git
cd pim-manager

# Install development dependencies (optional)
npm install

# Load extension in Chrome
# 1. Open chrome://extensions/
# 2. Enable Developer mode
# 3. Click "Load unpacked"
# 4. Select the project directory

Configuration

Update the CLIENT_ID in background.js with your Azure application ID:

const CONFIG = {
  CLIENT_ID: 'your-azure-app-id-here',
  // ... other config
};

Building Themes

Themes are defined in CSS custom properties. To add a new theme:

:root[data-theme="mytheme"] {
  --bg-primary: linear-gradient(135deg, #color1 0%, #color2 100%);
  --accent-primary: linear-gradient(135deg, #accent1 0%, #accent2 100%);
  /* ... other theme variables */
}

🔐 Security & Permissions

Required Permissions

• Identity: Azure authentication flow
• Storage: Theme and language preferences
• Notifications: Role expiration alerts
• Active Tab: Integration with Azure portal (optional)

Security Features

• Token Management: Secure storage with automatic refresh
• Multi-Tenant Support: Isolated tenant contexts
• Minimal Permissions: Only required scopes requested
• Secure Communication: HTTPS-only API calls

📈 Performance

Optimizations

• Document Fragments: Efficient DOM manipulation
• Lazy Loading: On-demand resource loading
• Caching: Intelligent role definition caching
• Debounced Updates: Optimized refresh intervals

Metrics

• Load Time: < 500ms average role loading
• Rendering: < 100ms for UI updates
• Memory Usage: < 50MB typical consumption
• Battery Impact: Minimal background processing

🐛 Troubleshooting

Common Issues

Extension Not Loading

• Ensure Chrome version 88+
• Check developer mode is enabled
• Verify all files are present
• Review console for errors

Authentication Failures

• Verify Azure app registration
• Check redirect URI configuration
• Ensure proper scopes are configured
• Clear browser cache and retry

Theme Issues

• Disable other extensions that modify CSS
• Check browser support for backdrop-filter
• Try switching themes to isolate issues

Performance Problems

• Disable other extensions temporarily
• Check available system memory
• Clear extension storage data
• Restart Chrome browser

🤝 Contributing

We welcome contributions! Please see our Contributing Guide for details.

Development Workflow

1. Fork the repository
2. Create a feature branch
3. Make your changes with tests
4. Submit a pull request
5. Await code review

Code Style

• Use ES2022+ features
• Follow established patterns
• Add JSDoc comments
• Maintain accessibility standards

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Microsoft Graph Team - For the excellent PIM APIs
• Chrome Extensions Team - For the robust platform
• Design Community - For glassmorphism inspiration
• Contributors - For making this project possible

Made with ❤️ by Layth CHEBBI

Transforming Azure PIM management with modern design and intuitive workflows.