Posts

Building an Iframe-Based Gallery Control in Power Apps (PCF)

Image
  Functional Overview From a functional perspective, the control does three main things: Loads a web resource inside an iframe Sends data to the iframe to render a gallery Listens to user actions from the iframe and exposes them as outputs What the User Sees A gallery rendered inside an iframe Data-driven columns and rows Actions like: Selecting records Editing a single record Deleting one or many records with a reason Copying a record All UI logic lives inside the iframe. The PCF control acts as a bridge between Power Apps and that UI. Key Inputs and Outputs Inputs (from Power Apps) The control expects JSON-based inputs: webResourceUrl – URL of the HTML/JS gallery columnsJson – Column definitions dataJson – Records to display deleteReasonJson – Allowed delete reasons These are passed as strings and parsed at runtime. Outputs (to Power Apps) The control exposes two outputs: selectedRecordJson actionType Togeth...

Text PCF Control

Image
  Functional Overview The TextControl is a highly customizable PCF (PowerApps Component Framework) control for Dynamics 365 / Power Apps that allows users to display text with advanced styling and behavior options. Key Functional Features: Dynamic Text Display: Users can input any text dynamically using the inputText property. Customizable Styling: Font style ( normal , italic , etc.) Font weight ( normal , bold , etc.) Font size and family Text color and background color Optional Animations: Blinking text effect Horizontal scrolling/moving text with support for left-to-right or right-to-left directions Notification Badge: Option to show a small notification marker next to the text, customizable via notificationText . Safe Defaults & Robustness: All style and behavior inputs have default values to prevent UI breakage. Flags are safely coerced from strings to booleans to avoid runtime errors. Technical Implementat...

Contact Detail Dashboard PCF Control

Image
  Building a Dynamic Contact Detail Dashboard in Power Apps with Chart.js Overview The Contact Detail Control is a Power Apps Component Framework (PCF) solution designed to make customer relationship data visual, interactive, and easy to explore. Instead of static contact lists, it transforms Dataverse data into a dynamic dashboard where users can search, analyze, and view insights at a glance. Using Chart.js for visualizations, this control helps organizations make faster, data-driven decisions by presenting customer and related record information in an intuitive interface. From a business perspective, the control improves productivity and visibility by consolidating information that typically requires multiple screens or reports. Users can instantly view contacts by city or job title, explore related records such as opportunities or activities, and see distribution charts that reveal actionable patterns in CRM data — all within one screen. Building a Dynamic Contact Detail...

Contacts PCF Control

Image
Building a Dynamic Contacts Dashboard in Power Apps Using PCF and Chart.js Overview Power Apps Component Framework (PCF) allows developers to create custom, interactive components for model-driven apps. One common use case is displaying and analyzing contact data. The SelectContactsControl PCF control provides a searchable contacts list , detailed contact view, and interactive charts using Chart.js. Why Use PCF for a Contacts Dashboard? PCF offers several advantages over standard form components: Highly interactive and responsive Customizable in look and feel Direct access to Dataverse Web API for live data Reusable across multiple apps Supports modern JavaScript frameworks and libraries like Chart.js With SelectContactsControl , we combine a searchable contact list with dynamic charts to create a modern, user-friendly dashboard . Key Features Search Contacts – Real-time filtering by name or email. Contact Details – Click on a contact to see details includ...

Birthday Anniversary Control PCF in Power Platform.

Image
Birthday Anniversary Control   Technology Stack:   - Power Apps Component Framework (PCF)   - React (TypeScript)   Purpose   This PCF control renders a React-based EventCard that shows the next Birthday and Work Anniversary for a user, calculated from input dates. It also allows users to download . ics calendar files to add these events to their personal calendars.   Functional Overview   Responsibilities:   - Reads input values: dateOfBirth and joiningDate   - Passes them as props to the EventCard React component   - Renders content using createRoot from React 18   - No output or two-way data binding   - Cleanup logic is currently empty   React Component: EventCard   Props:   Name   Type   Description   dateOfBirth   Date   User’s date of birth   joiningDate   Date   User’s joining date   Core Features   - getNextOccurrence : Calculates the next occurrenc...