Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merging in PR #157 #158

Merged
merged 5 commits into from
Oct 11, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
352 changes: 352 additions & 0 deletions samples/InputCard-StatusMessage/.eslintrc.js

Large diffs are not rendered by default.

34 changes: 34 additions & 0 deletions samples/InputCard-StatusMessage/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
# Logs
logs
*.log
npm-debug.log*

# Dependency directories
node_modules

# Build generated files
dist
lib
release
solution
temp
*.sppkg
.heft

# Coverage directory used by tools like istanbul
coverage

# OSX
.DS_Store

# Visual Studio files
.ntvs_analysis.dat
.vs
bin
obj

# Resx Generated Code
*.resx.ts

# Styles Generated Code
*.scss.ts
16 changes: 16 additions & 0 deletions samples/InputCard-StatusMessage/.npmignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
!dist
config

gulpfile.js

release
src
temp

tsconfig.json
tslint.json

*.log

.yo-rc.json
.vscode
23 changes: 23 additions & 0 deletions samples/InputCard-StatusMessage/.vscode/launch.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
{
"version": "0.2.0",
"configurations": [
{
"name": "Hosted workbench",
"type": "msedge",
"request": "launch",
"url": "https://{tenantDomain}/_layouts/workbench.aspx",
"webRoot": "${workspaceRoot}",
"sourceMaps": true,
"sourceMapPathOverrides": {
"webpack:///.././src/*": "${webRoot}/src/*",
"webpack:///../../../src/*": "${webRoot}/src/*",
"webpack:///../../../../src/*": "${webRoot}/src/*",
"webpack:///../../../../../src/*": "${webRoot}/src/*"
},
"runtimeArgs": [
"--remote-debugging-port=9222",
"-incognito"
]
}
]
}
13 changes: 13 additions & 0 deletions samples/InputCard-StatusMessage/.vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
// Place your settings in this file to overwrite default and user settings.
{
// Configure glob patterns for excluding files and folders in the file explorer.
"files.exclude": {
"**/.git": true,
"**/.DS_Store": true,
"**/bower_components": true,
"**/coverage": true,
"**/lib-amd": true,
"src/**/*.scss.ts": true
},
"typescript.tsdk": ".\\node_modules\\typescript\\lib"
}
22 changes: 22 additions & 0 deletions samples/InputCard-StatusMessage/.yo-rc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{
"@microsoft/generator-sharepoint": {
"plusBeta": false,
"isCreatingSolution": true,
"nodeVersion": "14.18.2",
"sdksVersions": {
"@microsoft/microsoft-graph-client": "3.0.2",
"@microsoft/teams-js": "2.12.0"
},
"version": "1.18.0",
"libraryName": "input-card-status-message",
"libraryId": "5bd0d1dc-2938-4def-ba1b-4f75ec95116d",
"environment": "spo",
"packageManager": "npm",
"solutionName": "input-card-status-message",
"solutionShortDescription": "input-card-status-message description",
"skipFeatureDeployment": true,
"isDomainIsolated": false,
"componentType": "adaptiveCardExtension",
"aceTemplateType": "Generic"
}
}
83 changes: 83 additions & 0 deletions samples/InputCard-StatusMessage/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
# InputCard-StatusMessage

## Summary

This Adaptive Card Extension let you set your presence status message directly from the card view.

Default view of the card:

![DefaultView](./assets/DefaultView.png)

Validation message:

![ValidationMessage](./assets/ValidationMessage.png)

Demo:

![Demo](./assets/StatusMessageGif.gif)


## Used SharePoint Framework Version

![version](https://img.shields.io/badge/version-1.18.0-green.svg)
![Node.js LTS 18.x](https://img.shields.io/badge/Node.js-LTS%2018.x-green.svg)
![SharePoint Online](https://img.shields.io/badge/SharePoint-Online-yellow.svg)

## Applies to

- [SharePoint Framework](https://aka.ms/spfx)
- [Microsoft 365 tenant](https://docs.microsoft.com/en-us/sharepoint/dev/spfx/set-up-your-developer-tenant)

> Get your own free development tenant by subscribing to [Microsoft 365 developer program](http://aka.ms/o365devprogram)

## Prerequisites

> `Presence.ReadWrite` permission to be approved after uploading the package

## Solution

| Solution | Author(s) |
| ----------- | ------------------------------------------------------- |
| InputCard-StatusMessage | [Aimery Thomas](https://github.com/a1mery), [@aimery_thomas](https://twitter.com/aimery_thomas) |

## Version history

| Version | Date | Comments |
| ------- | ---------------- | --------------- |
| 1.0 | October 07, 2023 | Initial release |

## Disclaimer

**THIS CODE IS PROVIDED _AS IS_ WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**

---

## Minimal Path to Awesome

- Clone this repository
- Ensure that you are at the solution folder
- in the command-line run:
- **npm install**
- **gulp bundle --ship**
- **gulp package-solution --ship**
- Deploy the package (input-card-status-message.sppkg) to the tenant app catalogue.
- The solution needs following Microsoft Graph API permissions. Approve the API access requests in the SharePoint admin center.

| Permissions |
|---------------------------|
| Presence.ReadWrite |

- Add the ACE **Set Status Message** to the Dashboard.

## Features

This sample demonstrates how to use new SPFx v1.18 ACE feature to add text input in the card and use it to set presence status message.

## References

- [Getting started with SharePoint Framework](https://docs.microsoft.com/en-us/sharepoint/dev/spfx/set-up-your-developer-tenant)
- [Building for Microsoft teams](https://docs.microsoft.com/en-us/sharepoint/dev/spfx/build-for-teams-overview)
- [Use Microsoft Graph in your solution](https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/using-microsoft-graph-apis)
- [Publish SharePoint Framework applications to the Marketplace](https://docs.microsoft.com/en-us/sharepoint/dev/spfx/publish-to-marketplace-overview)
- [Microsoft 365 Patterns and Practices](https://aka.ms/m365pnp) - Guidance, tooling, samples and open-source controls for your Microsoft 365 development
- [BasicCard-StatusMessage](https://github.com/pnp/sp-dev-fx-aces/tree/main/samples/BasicCard-StatusMessage#basiccard-statusmessage)
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
52 changes: 52 additions & 0 deletions samples/InputCard-StatusMessage/assets/sample.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
[{
"name": "pnp-sp-fx-aces-status-message",
"source": "pnp",
"title": "Status Message Adaptive Card Extension",
"shortDescription": "This sample shows how to build an ACE with a card view to let users to set their presence status message.",
"url": "https://github.com/pnp/sp-dev-fx-aces/tree/main/samples/InputCard-StatusMessage",
"longDescription": [
"This sample shows how to build an ACE with a card view to let users to set their presence status message."
],
"creationDateTime": "2023-10-10",
"updateDateTime": "2023-10-10",
"products": [
"SharePoint",
"Viva"
],
"metadata": [{
"key": "CLIENT-SIDE-DEV",
"value": "React"
},
{
"key": "SPFX-VERSION",
"value": "1.18.0"
}
],
"thumbnails": [{
"type": "image",
"order": 100,
"url": "https://raw.githubusercontent.com/pnp/sp-dev-fx-aces/main/samples/InputCard-StatusMessage/assets/StatusMessageGif.gif",
"alt": "Preview"
}],
"authors": [{
"gitHubAccount": "a1mery",
"pictureUrl": "https://github.com/a1mery.png",
"name": "Aimery Thomas",
"twitter": "aimery_thomas"
}],
"references": [{
"name": "Viva Connections Extensibility guidance",
"description": "Adaptive Card Extensions are client-side components that run in the context of a SharePoint page.",
"url": "https://aka.ms/viva/connections/extensibility"
},
{
"name": "Adaptive Card Documentation",
"description": "Detailed documentation on Adaptive Cards including the Adaptive Card designer.",
"url": "https://adaptivecards.io/"
}, {
"name": "Adaptive Card Extension Design Guidance",
"description": "Design guidance for laying out Adaptive Card Extensions.",
"url": "https://docs.microsoft.com/en-us/sharepoint/dev/spfx/viva/design/design-intro"
}
]
}]
18 changes: 18 additions & 0 deletions samples/InputCard-StatusMessage/config/config.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/config.2.0.schema.json",
"version": "2.0",
"bundles": {
"set-status-message-adaptive-card-extension": {
"components": [
{
"entrypoint": "./lib/adaptiveCardExtensions/setStatusMessage/SetStatusMessageAdaptiveCardExtension.js",
"manifest": "./src/adaptiveCardExtensions/setStatusMessage/SetStatusMessageAdaptiveCardExtension.manifest.json"
}
]
}
},
"externals": {},
"localizedResources": {
"SetStatusMessageAdaptiveCardExtensionStrings": "lib/adaptiveCardExtensions/setStatusMessage/loc/{locale}.js"
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/deploy-azure-storage.schema.json",
"workingDir": "./release/assets/",
"account": "<!-- STORAGE ACCOUNT NAME -->",
"container": "input-card-status-message",
"accessKey": "<!-- ACCESS KEY -->"
}
46 changes: 46 additions & 0 deletions samples/InputCard-StatusMessage/config/package-solution.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
"solution": {
"name": "input-card-status-message-client-side-solution",
"id": "5bd0d1dc-2938-4def-ba1b-4f75ec95116d",
"version": "1.0.0.0",
"includeClientSideAssets": true,
"skipFeatureDeployment": true,
"isDomainIsolated": false,
"webApiPermissionRequests": [
{
"resource": "Microsoft Graph",
"scope": "Presence.ReadWrite"
}
],
"developer": {
"name": "Aimery Thomas",
"websiteUrl": "https://athsharepoint.com/",
"privacyUrl": "",
"termsOfUseUrl": "",
"mpnId": "Undefined-1.18.0"
},
"metadata": {
"shortDescription": {
"default": "input-card-status-message description"
},
"longDescription": {
"default": "input-card-status-message description"
},
"screenshotPaths": [],
"videoUrl": "",
"categories": []
},
"features": [
{
"title": "input-card-status-message Feature",
"description": "The feature that activates elements of the input-card-status-message solution.",
"id": "7acfe746-7889-40a1-bd5a-e60b20edb579",
"version": "1.0.0.0"
}
]
},
"paths": {
"zippedPackage": "solution/input-card-status-message.sppkg"
}
}
3 changes: 3 additions & 0 deletions samples/InputCard-StatusMessage/config/sass.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/core-build/sass.schema.json"
}
6 changes: 6 additions & 0 deletions samples/InputCard-StatusMessage/config/serve.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/spfx-serve.schema.json",
"port": 4321,
"https": true,
"initialPage": "https://{tenantDomain}/_layouts/workbench.aspx"
}
4 changes: 4 additions & 0 deletions samples/InputCard-StatusMessage/config/write-manifests.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/write-manifests.schema.json",
"cdnBasePath": "<!-- PATH TO CDN -->"
}
16 changes: 16 additions & 0 deletions samples/InputCard-StatusMessage/gulpfile.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
'use strict';

const build = require('@microsoft/sp-build-web');

build.addSuppression(`Warning - [sass] The local CSS class 'ms-Grid' is not camelCase and will not be type-safe.`);

var getTasks = build.rig.getTasks;
build.rig.getTasks = function () {
var result = getTasks.call(build.rig);

result.set('serve', result.get('serve-deprecated'));

return result;
};

build.initialize(require('gulp'));
Loading