Copilot · Community sample

My Day — Personalized Intranet Copilot App

A SharePoint Copilot App (SPFx 1.24 Copilot Component) that renders a personal 'My Day' cockpit inside the Microsoft Copilot canvas — a compact inline card that expands to a full-screen dashboard with agenda, tasks, mail, news, a 'Plan my day' briefing and session-persisted settings.

Copilot componentReactSPFx 1.24.0

Inline My Day card in the Copilot canvas

The idea behind the sample

My Day is a SharePoint Copilot App built as an SPFx 1.24 Copilot Component (not a classic web part). The same React component renders in two display modes inside the Microsoft Copilot canvas: a compact inline card and an immersive full-screen dashboard. Inline shows a time-aware greeting, the next meeting, tasks due today and the top news headline; it can request expansion via requestDisplayModeAsync('fullscreen').

The full-screen experience is a responsive dashboard — agenda timeline, tasks completion ring, important mail with sender face avatars, a news wall, quick actions and a hero weather card. A 'Plan my day' banner opens a read-only, deterministically generated focus briefing (no chat, no real AI/WorkIQ call), and a settings drawer lets the user switch temperature units, edit location and show/hide panels.

Settings are intentionally persisted to the browser session (sessionStorage) to demonstrate how configuration can shape the dashboard live without server-side storage; the layout re-flows dynamically to the number of visible panels. The sample ships with mocked, Microsoft Graph-shaped data behind a swappable IMyDayDataService interface, so a live Graph / SharePoint implementation is a drop-in replacement. Built with the Heft build system, React 18.3.1 and Fluent UI v9 with host-driven light/dark theming.

Make it your own

Start with the author's setup instructions, explore the implementation, and adapt the pattern to your environment. Sample code stays in its original repository, together with its requirements, license and contribution history.

Read the source documentation

A closer look

My Day settings drawer (session-persisted)

My Day full-screen dashboard in dark mode

My Day focused agenda opened directly by the next-meeting starter, with the current sample meeting timeline and a path back to the daily overview

My Day due-today task focus with a completion ring and local demo checkboxes retained across host display-mode changes

My Day read-only focus briefing with prioritized evidence from sample meetings, tasks and mail, without an AI service call or external action

Keep exploring

Overview of the SharePoint Framework — The SharePoint Framework (SPFx) is a page and web part model that provides full support for client-side SharePoint development, easy integration with SharePoint data, and support for open-source tooling.
Microsoft Copilot — Microsoft Copilot combines the power of large language models with your organization's data to help you be more productive.
Use Microsoft Graph in your solution — Microsoft Graph is the gateway to data and intelligence in Microsoft 365, exposing REST APIs and client libraries to access data across Microsoft 365 services.

Keep the ideas flowing

Back to all possibilities