honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

updated container and moved assets

This commit is contained in:
Hugo Bernier 2022-02-24 03:03:19 -05:00
parent 2572588021
commit 8ccfbd0e99
6 changed files with 22145 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
samples/react-functional-component-with-data-fetch/.devcontainer/devcontainer.json
View File

@ -1,7 +1,7 @@
// For more information on how to run this SPFx project in a VS Code Remote Container, please visit https://aka.ms/spfx-devcontainer // For more information on how to run this SPFx project in a VS Code Remote Container, please visit https://aka.ms/spfx-devcontainer
{ {
"name": "SPFx 1.13.1", "name": "SPFx 1.14.0",
"image": "docker.io/m365pnp/spfx:1.13.1", "image": "docker.io/m365pnp/spfx:1.14.0",
// Set *default* container specific settings.json values on container create. // Set *default* container specific settings.json values on container create.
"settings": {}, "settings": {},
// Add the IDs of extensions you want installed when the container is created. // Add the IDs of extensions you want installed when the container is created.

4
samples/react-functional-component-with-data-fetch/README.md
View File

@ -4,7 +4,7 @@
This web part demonstrates building a React functional component that uses data from a remote service, in this case the Microsoft Graph, using the React Hooks feature. The example web part renders a list of the user's Teams and, optionally, the channels in each Team. This web part demonstrates building a React functional component that uses data from a remote service, in this case the Microsoft Graph, using the React Hooks feature. The example web part renders a list of the user's Teams and, optionally, the channels in each Team.
![Screenshot](Screenshot.png "Screenshot - Teams Tracker web part") ![Screenshot](assets/Screenshot.png "Screenshot - Teams Tracker web part")
## Compatibility ## Compatibility
@ -56,7 +56,7 @@ Version|Date|Comments
The purpose of this web part is to demonstrate building a React functional component that includes state and data fetched from a remote service. This is achieved using the recent React Hooks feature. The resulting code is cleaner and easier to follow than using a JavaScript/TypeScript class derived from React.Component. The example web part renders a list of the user's Teams and, if enabled, a list of the Teams channels for each Team with a link to the channel. The purpose of this web part is to demonstrate building a React functional component that includes state and data fetched from a remote service. This is achieved using the recent React Hooks feature. The resulting code is cleaner and easier to follow than using a JavaScript/TypeScript class derived from React.Component. The example web part renders a list of the user's Teams and, if enabled, a list of the Teams channels for each Team with a link to the channel.
![Screenshot](ShowChannels.png "Screenshot - Teams Tracker web part with Teams channels displayed") ![Screenshot](assets/ShowChannels.png "Screenshot - Teams Tracker web part with Teams channels displayed")
This is an extension of the approach used in the [React-Functional-Component](https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-functional-component) and [React-Functional-Stateful-Component](https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-functional-stateful-component) samples. This is an extension of the approach used in the [React-Functional-Component](https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-functional-component) and [React-Functional-Stateful-Component](https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-functional-stateful-component) samples.

0
samples/react-functional-component-with-data-fetch/Screenshot.png → samples/react-functional-component-with-data-fetch/assets/Screenshot.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 40 KiB

0
samples/react-functional-component-with-data-fetch/ShowChannels.png → samples/react-functional-component-with-data-fetch/assets/ShowChannels.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 52 KiB

After

Width:  |  Height:  |  Size: 52 KiB

6
samples/react-functional-component-with-data-fetch/assets/sample.json
View File

@ -9,7 +9,7 @@
"This web part demonstrates building a React functional component that uses data from a remote service, in this case the Microsoft Graph, using the recently introduced React Hooks feature. The example web part renders a list of the user\u0027s Teams and, optionally, the channels in each Team." "This web part demonstrates building a React functional component that uses data from a remote service, in this case the Microsoft Graph, using the recently introduced React Hooks feature. The example web part renders a list of the user\u0027s Teams and, optionally, the channels in each Team."
], ],
"creationDateTime": "2019-06-14", "creationDateTime": "2019-06-14",
"updateDateTime": "2022-02-15", "updateDateTime": "2022-02-21",
"products": [ "products": [
"SharePoint" "SharePoint"
], ],
@ -20,14 +20,14 @@
}, },
{ {
"key": "SPFX-VERSION", "key": "SPFX-VERSION",
"value": "1.13.1" "value": "1.14.0"
} }
], ],
"thumbnails": [ "thumbnails": [
{ {
"type": "image", "type": "image",
"order": 100, "order": 100,
"url": "https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-functional-component-with-data-fetch/Screenshot.png", "url": "https://github.com/pnp/sp-dev-fx-webparts/raw/main/samples/react-functional-component-with-data-fetch/assets/Screenshot.png",
"alt": "React Functional Component web part with data fetch" "alt": "React Functional Component web part with data fetch"
} }
], ],

22138
samples/react-functional-component-with-data-fetch/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff