Overview

This web part was built just before Covid-19 hit and it was used a way for employees and their managers and leadership to recognize and celebrate each other for their hard work and contributions. It was a way to keep teams connected and engaged during a time when many people were working outside the office and to recognize and celebrate each other for their hard work and contributions.

Recognitions were pulled from a SharePoint list that contained the details of the recognition along with the company values that the recognition was based on. This allowed the web part to be configured to display the recognitions in different ways based on the company values.

Technical Details

Architecture

• Frontend: React, TypeScript, Styled Components, SharePoint Framework (SPFx), Fluent UI React
• Deployment: SharePoint Online
• APIs: SharePoint REST API

Features

Highly Configurable Display Options

The web part had many configuration options in the property pane that allowed the page editor to configure the web part to display the recognitions in different ways.

• Layout: Vertical List or Cards
• Maximum number of items to display
• Query or Criteria to display recognitions
• Toggle to show or hide company value icon/badges

Conclusion

After building this web part for internal use, we realized how popular it was and how our clients could use it on their intranets. We then refactored it so it was a more generic web part that wasn’t as specific to our company values and could be used for any client in any industry. Companies ended requesting it for their SharePoint sites after the Covid-19 pandemic forced many companies to have more remote work and this was a great way to keep their teams connected and engaged.