Friday, December 31, 2021

Rebuild dev skills 2021 for M365

 After been out for some years working with community (MVP 2010 to 2017) but stopped (work and some how burn out reasons) this year have the boost to upgrade my skills and return on contributions. 

Thank you all and always take your time and reward will always arrive, just put focus on the deliveries and improve your self.

Below would like to share my list of contributions for 2021: 

SharePoint Framework React Controls

  • dragDropFiles



https://github.com/pnp/sp-dev-fx-controls-react


SharePoint Framework Client Side Web Part

  • OneDrive finder + article


  • Follow Document

https://github.com/pnp/sp-dev-fx-webparts


SharePoint Framework Extensions

  • Follow Document

https://github.com/pnp/sp-dev-fx-extensions


Viva Connection ACEs

  • follow documents ace


https://github.com/pnp/sp-dev-fx-aces


List Formatting

  • tic tac toe format
  • teams call format
  • Search Tag format
  • Tree format
  • date update format
  • Image Slider format
  • Date column compress
  • Clipboard format
  • Menu Tiles format
  • Teams group chat
Below screenshot of all format included in my demo site


(all samples are in PR state)

https://github.com/pnp/List-Formatting

Microsoft Graph Toolkit

  • mgt-file-upload

https://github.com/microsoftgraph/microsoft-graph-toolkit

https://github.com/microsoftgraph/microsoft-graph-toolkit/releases/tag/v2.3.0


And off course 

Microsoft 365 PnP Weekly РEpisode 139 РAndr̩ Lage



#Microsoft365Dev #PnP #SPFx #AdaptiveCard #ACEs #MSFTViva #MicrosoftGraphToolkit #MicrosoftGraph #m365


Hope you enjoy this article and happy new year. 😃

André L

Friday, July 02, 2021

Giving new life to Follow documents in SharePoint Online and Teams sample

Hi all, 

Yes I'm not posting for a long time for multiple reasons also with a shift of information navigation regarding access the latest DEV information and features of Microsoft/Office 365 where GitHub has been the real king and Master. This made me question the real need of personal blogs to community blogs with sample learning that PnP makes a real boost on the learning process and in this area wanted to learn/contribute with my own samples specifically the "Follow Document"  sample.

I had this idea when wanted to follow closely some key documents and remember that the Classic pages have a option "Follow Document" where you could select the document to follow, but from the usability point of view was very limited and wanted to give him a boost and transform the initial to became more Workspace integrated and more productive, not only list of followed documents but give additional follow actions that you could easily interactive with your colleagues. 

Here example on how to access to you "Follow Documents" using the classic view and OneDrive option List of follow documents, to be honest not the most productive, sorry...


 

This solution sample has the goal to easily identify/follow user key documents from all Tenant and easily access them in Modern Pages and Microsoft Teams. This solution uses the Out of Box Social feature "Follow Document" with combination of MSGraph Queries, extension for Microsoft Teams and Microsoft Graph Toolkit File-List and File to retrieve and display associated documents.
This solution is split in 2 different projects, the extension sample allow to manage the follow/unfollow documents and the Web Part sample to interact and integrate with Microsoft Teams the document with additional actions described below.

Follow Document Extension Sample

Available features:

  • Follow documents (individually or multiple at same time)
  • Manage followed documents (Follow/unfollow)
  • List of all followed documents and option to unfollow if needed

Usage of following Technologies:

  • Usage of Social Feature "Follow" documents and associated REST "social.following"
  • Usage of MGT (Microsoft Graph Toolkit) FileList and File.
    • Using of Template and File builder from List feature.

Follow Document Web Part Sample

Available features:
  • Display Follow Documents as Document Card Grid.
  • Click on icon redirects to Document.
  • Click on Site name redirects to Site.
  • Team icon, Form to send message with html to Teams using adaptive cards.
  • Folder Icon redirects to Library where document is located.
  • Filled Start allow user to unfollow document.
  • Info icon open the Properties of Document with capability to edit.
  • Document with search icon allow to preview Document in Side Panel.
  • Search by Filename.
  • Grouping by Site.
  • Microsoft Team integration with personal/Tab App that allow user focus on key Documents.
Usage of following Technologies:
  • Usage of Social Feature "Follow" documents and associated REST "social.following"
  • Usage of Graph queries using Graph explorer
  • Usage of adaptive cards
  • Microsoft Teams integration with following option [TeamsTab, TeamsPersonalApp]

Follow Document Web Part

https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-follow-document

Follow Document Extension

https://github.com/pnp/sp-dev-fx-extensions/tree/main/samples/react-command-follow-document 

Preview of the Follow Document SPFX sample

Follow Document PnP Presentation video 

Follow Document - PnP Community presentation video sample (44:26)

Presentation PowerPoint

Bellow the PowerPoint used in the PnP presentation Sample with detail of technologies

 


This is a sample and needs to be improve specially in possible errors that i was not able to detect "Sample was made in 1 week at night".

Hope you like this simple article, 
André Lage