Azure Pulse View

A real-time monitoring dashboard for Azure infrastructure. Track resource health, usage metrics, and alerts from a single unified view.

---

Overview

Azure Pulse View is a monitoring dashboard that surfaces Azure resource data in a clean, interactive UI. Built with React, TypeScript, and Supabase, it pulls infrastructure metrics and displays them through charts and status panels, giving you visibility into your cloud environment without digging through the Azure portal.

---

Features

Feature	Description
📊 Live Metrics Dashboard	Recharts-powered visualizations for resource usage, availability, and trends
🔔 Alert Tracking	View and manage active alerts across resources in one place
🗂 Resource Overview	Grouped views of Azure resources with status indicators
🔐 Auth + Row-Level Access	Supabase auth with per-user data isolation
🌗 Theme Support	Light/dark mode via next-themes

---

Tech Stack

Frontend     → React 18 + TypeScript
Build Tool   → Vite
Styling      → Tailwind CSS + shadcn/ui (Radix UI)
State        → Redux Toolkit + React Query
Backend      → Supabase (PostgreSQL + Auth + Realtime)
Charts       → Recharts
Routing      → React Router v6
Validation   → Zod + React Hook Form
Testing      → Vitest + Playwright

---

Prerequisites

• Node.js >= 18
• A Supabase account and project
• An Azure account with a service principal that has Reader access to your subscription

Setup

1. Clone the repo and install dependencies

   npm install

2. Copy the environment example and fill in your values

   cp .env.example .env

3. Set your Azure credentials as Supabase Edge Function secrets in your Supabase dashboard under Project Settings > Edge Functions > Secrets. See supabase-secrets.example for the required keys.

4. Start the development server

   npm run dev

---

Team

Gummadi Likith and Chiday Pravin Sai

---