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.

Sign up for GitHub

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

Jump to bottom

Upgrade react-modern-carousel to SPFx v1.20 & includes other misc changes #5307

Merged
merged 6 commits into from
Oct 21, 2024
Merged

Upgrade react-modern-carousel to SPFx v1.20 & includes other misc changes #5307

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
9090f1f
build: upgrade to SPFx(1.20) & related dependencies to latest
SandeepPS1299 Oct 19, 2024
7aa076e
chore: update property pane strings
SandeepPS1299 Oct 19, 2024
a8b9871
style: added white fade effect to card image for smoother visual tran…
SandeepPS1299 Oct 19, 2024
0d124db
chore: bump package versions and update documentation after SPFx 1.20…
SandeepPS1299 Oct 19, 2024
a68ffc5
Updated sample, devcontainer
hugoabernier Oct 21, 2024
01a95fa
Merge branch 'main' into update-modern-carousel
hugoabernier Oct 21, 2024
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
4 changes: 2 additions & 2 deletions samples/react-modern-carousel/.devcontainer/devcontainer.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "SPFx 1.18.2",
"image": "docker.io/m365pnp/spfx:1.18.2",
"name": "SPFx 1.20.2",
"image": "docker.io/m365pnp/spfx:1.20.2",
"customizations": {
"vscode": {
"extensions": [
Expand Down
4 changes: 2 additions & 2 deletions samples/react-modern-carousel/.yo-rc.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,9 @@
"nodeVersion": "18.18.2",
"sdksVersions": {
"@microsoft/microsoft-graph-client": "3.0.2",
"@microsoft/teams-js": "2.12.0"
"@microsoft/teams-js": "2.24.0"
},
"version": "1.18.2",
"version": "1.20.0",
"libraryName": "award-recognition",
"libraryId": "45e061b8-13f5-423f-bedb-12fc2a44fa89",
"environment": "spo",
Expand Down
39 changes: 20 additions & 19 deletions samples/react-modern-carousel/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,22 +8,22 @@ This SharePoint Framework (SPFx) web part introduces a contemporary carousel com

## Compatibility

| :warning: Important |
|:---------------------------|
| Every SPFx version is optimally compatible with specific versions of Node.js. In order to be able to build this sample, you need to ensure that the version of Node on your workstation matches one of the versions listed in this section. This sample will not work on a different version of Node.|
|Refer to <https://aka.ms/spfx-matrix> for more information on SPFx compatibility. |
| :warning: Important |
| :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Every SPFx version is optimally compatible with specific versions of Node.js. In order to be able to build this sample, you need to ensure that the version of Node on your workstation matches one of the versions listed in this section. This sample will not work on a different version of Node. |
| Refer to <https://aka.ms/spfx-matrix> for more information on SPFx compatibility. |

## Used SharePoint Framework Version

![version](https://img.shields.io/badge/version-1.18.2-green.svg)
![version](https://img.shields.io/badge/version-1.20.0-green.svg)

This sample is optimally compatible with the following environment configuration:

![SPFx 1.18.2](https://img.shields.io/badge/SPFx-1.18.2-green.svg)
![SPFx 1.20.0](https://img.shields.io/badge/SPFx-1.20.0-green.svg)
![Node.js v18 | v16](https://img.shields.io/badge/Node.js-v18%20%7C%20v16-green.svg)
![Compatible with SharePoint Online](https://img.shields.io/badge/SharePoint%20Online-Compatible-green.svg)
![Does not work with SharePoint 2019](https://img.shields.io/badge/SharePoint%20Server%202019-Incompatible-red.svg "SharePoint Server 2019 requires SPFx 1.4.1 or lower")
![Does not work with SharePoint 2016 (Feature Pack 2)](https://img.shields.io/badge/SharePoint%20Server%202016%20(Feature%20Pack%202)-Incompatible-red.svg "SharePoint Server 2016 Feature Pack 2 requires SPFx 1.1")
![Does not work with SharePoint 2016 (Feature Pack 2)](<https://img.shields.io/badge/SharePoint%20Server%202016%20(Feature%20Pack%202)-Incompatible-red.svg> "SharePoint Server 2016 Feature Pack 2 requires SPFx 1.1")
![Local Workbench Unsupported](https://img.shields.io/badge/Local%20Workbench-Unsupported-red.svg "Local workbench is no longer available as of SPFx 1.13 and above")
![Hosted Workbench Compatible](https://img.shields.io/badge/Hosted%20Workbench-Compatible-red.svg)
![Compatible with Remote Containers](https://img.shields.io/badge/Remote%20Containers-Compatible-red.svg)
Expand All @@ -39,27 +39,28 @@ This sample is optimally compatible with the following environment configuration

Create a SharePoint custom list `Award Recognition` in the SPO site with below columns

| Column Name | Type |
| ------- | --------------- |
| Title | OOTB |
| Designation | Text |
| UserImage | Image |
| Column Name | Type |
| ----------- | ----- |
| Title | OOTB |
| Designation | Text |
| UserImage | Image |

## Solution

| Solution | Author(s) |
| ----------- | ------------------------------------------------------- |
| react-modern-carousel| Sandeep P S ( [LinkedIn](https://www.linkedin.com/in/sandeepps1299/) ) / Quadrasystems.net ( [Twitter](https://www.linkedin.com/company/quadrasystems.net-india-pvt-ltd) / [LinkedIn](https://www.linkedin.com/company/quadrasystems.net-india-pvt-ltd) ) |
| Solution | Author(s) |
| --------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| react-modern-carousel | Sandeep P S ( [LinkedIn](https://www.linkedin.com/in/sandeepps1299/) ) / Quadrasystems.net ( [Twitter](https://www.linkedin.com/company/quadrasystems.net-india-pvt-ltd) / [LinkedIn](https://www.linkedin.com/company/quadrasystems.net-india-pvt-ltd) ) |

## Contributors🧑‍💻

- [Sandeep P S](https://github.com/Sandeep-FED)

## Version history

| Version | Date | Comments |
| ------- | ---------------- | --------------- |
| 1.0 | March 16, 2024 | Initial release |
| Version | Date | Comments |
| ------- | ---------------- | ----------------------------------- |
| 1.0 | March 16, 2024 | Initial release |
| 1.1 | October 19, 2024 | Upgrade to SPFx 1.20 & misc changes |

## Minimal Path to Awesome⚡

Expand Down Expand Up @@ -97,7 +98,7 @@ Key features demonstrated by this solution:

## Help

We do not support samples, but we this community is always willing to help, and we want to improve these samples. We use GitHub to track issues, which makes it easy for community members to volunteer their time and help resolve issues.
We do not support samples, but we this community is always willing to help, and we want to improve these samples. We use GitHub to track issues, which makes it easy for community members to volunteer their time and help resolve issues.

If you're having issues building the solution, please run [spfx doctor](https://pnp.github.io/cli-microsoft365/cmd/spfx/spfx-doctor/) from within the solution folder to diagnose incompatibility issues with your environment.

Expand Down
4 changes: 2 additions & 2 deletions samples/react-modern-carousel/assets/sample.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
"This SharePoint Framework (SPFx) web part introduces a contemporary carousel component leveraging Swiper, facilitating seamless traversal through content housed within a SharePoint site. This innovative feature enhances user experience by providing fluid navigation through various pieces of content, thereby adding a touch of elegance and sophistication to the SharePoint environment."
],
"creationDateTime": "2024-03-16",
"updateDateTime": "2024-03-16",
"updateDateTime": "2024-10-10",
"products": [
"SharePoint"
],
Expand All @@ -21,7 +21,7 @@
},
{
"key": "SPFX-VERSION",
"value": "1.18.2"
"value": "1.20.2"
}
],
"thumbnails": [
Expand Down
6 changes: 3 additions & 3 deletions samples/react-modern-carousel/config/package-solution.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,12 @@
"solution": {
"name": "award-recognition-client-side-solution",
"id": "45e061b8-13f5-423f-bedb-12fc2a44fa89",
"version": "1.0.0.0",
"version": "1.1.0.0",
"includeClientSideAssets": true,
"skipFeatureDeployment": true,
"isDomainIsolated": false,
"developer": {
"name": "",
"name": "Sandeep P S",
"websiteUrl": "",
"privacyUrl": "",
"termsOfUseUrl": "",
Expand All @@ -30,7 +30,7 @@
"title": "award-recognition Feature",
"description": "The feature that activates elements of the award-recognition solution.",
"id": "475edc5c-974e-43d2-874b-0262da790739",
"version": "1.0.0.0"
"version": "1.1.0.0"
}
]
},
Expand Down
Loading
Loading