Shadcn.io is not affiliated with official shadcn/ui
React Connected Integrations Settings Block
Animated React connected integrations settings page for Next.js with OAuth app connections, status indicators, connect and disconnect actions, and last-synced timestamps built with shadcn/ui, Tailwind CSS, and framer-motion
Manage third-party integrations with this React and Next.js settings block. View connected OAuth apps with live status indicators, connect new services with a single click, disconnect apps with confirmation, and see last-synced timestamps. Built with TypeScript, shadcn/ui Button and Badge, Tailwind CSS, and framer-motion staggered animations.
React Connected Integrations Settings Block preview
Installation
Related Components
API Keys
Create, revoke, and manage API keys
Security Settings
Password, 2FA, and session management
Team Members
Invite, manage roles, and remove members
Notification Settings
Email, push, and SMS notification preferences
Billing Settings
Plan, payment method, and invoices
Profile Settings
Name, email, bio, and avatar management
FAQ
Was this page helpful?
Sign in to leave feedback.
React Incident Escalation Policy Settings Block
Animated React incident escalation policy settings page for Next.js with multi-tier escalation levels, contact assignments, auto-escalation timers, and severity configuration using shadcn/ui, Tailwind CSS, and framer-motion
React IP Allowlist Management Settings Block
Animated React IP allowlist and blocklist settings page for Next.js with CIDR range entries, labels, expiry dates, enable toggle, and rule management built with shadcn/ui, Tailwind CSS, and framer-motion