A low-code card built with the Card Designer that uses the new Advance API Features (https://learn.microsoft.com/en-us/sharepoint/dev/spfx/viva/features/card-designer/card-designer-api-support) to display work anniversaries for employees.
It uses the SharePoint REST API and a SharePoint list.
It is designed to be part of a wider 'Work Anniversary' solution utilising a Power Automate flow to send adaptive cards on employee anniversaries however this has not been built yet. The thinking is to use the Microsoft Graph to retrieve the users' 'employeeHireDate' property, ascertain whether the user has an anniversary in the current week, calculate the number of years and add the item to the list. The list would be cleared down at the end of each week.
This is something I will build at a later date.
To deploy the solution as is, follow the steps below:
-
Configure the new Advanced API Features by following the steps in the documentation above.
-
Create a SharePoint list in your Viva Connections home site named 'WorkAnniversaries' with the following columns:
- NoOfYears (Number)
- Employee (Person or Group)
- Employee Name (Single line of text)
- Hire Date (Date)
- Profile Photo URL (Hyperlink)
- WeekCommencing (Date)
Populate the list with some example list items. The 'WeekCommencing' column should be the date on which the current week commences. The card displays all items from the list currently, the idea being a Power Automate flow would clear these down weekly.
-
Add a Card Designer card to your dashboard and configure it as follows:
- Card Size: Medium
- Title: Anniversaries
- Icon: Balloon
- Heading: View upcoming work anniversaries
- Image: Use the image supplied in this repo (anniversaries-card-image)
- Card action: Show the quick view
- Template JSON: Copy and paste the provided template JSON from this repo (ac-quickview-anniversaries-template.json)
- Data source: Call a SharePoint API
- Request URL: lists/GetByTitle('WorkAnniversaries')/items
- Apply the changes to the card and republish your dashboard.
- Clicking on the card should show the quick view and the items from your list.