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

Merge pull request #2462 from pnp/revert-2447-main 

Revert "Updated react-page-hierarchy & react-teams-membership-updater to spfx 1.14"
This commit is contained in:
Hugo Bernier 2022-03-28 02:31:24 -04:00 committed by GitHub
parent bf7890e7d6 3ca18fcc5c
commit 45de690676
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
30 changed files with 11698 additions and 20861 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
samples/react-pages-hierarchy/.editorconfig Normal file
View File

@ -0,0 +1,25 @@
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# editorconfig.org
root = true
[*]
# change these settings to your own preference
indent_style = space
indent_size = 2
# we recommend you to keep these unchanged
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false
[{package,bower}.json]
indent_style = space
indent_size = 2

2
samples/react-pages-hierarchy/.gitignore vendored
View File

@ -30,5 +30,3 @@ obj
# Styles Generated Code # Styles Generated Code
*.scss.ts *.scss.ts
release

16
samples/react-pages-hierarchy/.npmignore
View File

@ -1,16 +0,0 @@
!dist
config
gulpfile.js
release
src
temp
tsconfig.json
tslint.json
*.log
.yo-rc.json
.vscode

2
samples/react-pages-hierarchy/.yo-rc.json
View File

@ -2,7 +2,7 @@
"@microsoft/generator-sharepoint": { "@microsoft/generator-sharepoint": {
"isCreatingSolution": true, "isCreatingSolution": true,
"environment": "spo", "environment": "spo",
"version": "1.14.0", "version": "1.10.0",
"libraryName": "react-pages-hierarchy", "libraryName": "react-pages-hierarchy",
"libraryId": "89758fb6-85e2-4e2b-ac88-4f4e7e5f60cb", "libraryId": "89758fb6-85e2-4e2b-ac88-4f4e7e5f60cb",
"packageManager": "npm", "packageManager": "npm",

5
samples/react-pages-hierarchy/README.md
View File

@ -24,8 +24,8 @@ This web part allows users to create a faux page hierarchy in their pages librar
## Compatibility ## Compatibility
![SPFx 1.14](https://img.shields.io/badge/SPFx-1.14.0-green.svg) ![SPFx 1.10](https://img.shields.io/badge/SPFx-1.10.0-green.svg)
![Node.js v14](https://img.shields.io/badge/Node.js-v14-green.svg) ![Node.js v10 | v8](https://img.shields.io/badge/Node.js-v10%20%7C%20v8-green.svg)
![Compatible with SharePoint Online](https://img.shields.io/badge/SharePoint%20Online-Compatible-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) ![Does not work with SharePoint 2019](https://img.shields.io/badge/SharePoint%20Server%202019-Incompatible-red.svg)
![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")
@ -54,7 +54,6 @@ react-pages-hierarchy|[Bo George](https://github.com/bogeorge) ([@bo_george](htt
Version|Date|Comments Version|Date|Comments
-------|----|-------- -------|----|--------
1.0|April 30, 2020|Initial release 1.0|April 30, 2020|Initial release
1.2|March 24, 2022|Updated to SPFX v1.14 and PnP packages to v3
## Minimal Path to Awesome ## Minimal Path to Awesome

4
samples/react-pages-hierarchy/config/copy-assets.json Normal file
View File

@ -0,0 +1,4 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/copy-assets.schema.json",
"deployCdnPath": "temp/deploy"
}

2
samples/react-pages-hierarchy/config/deploy-azure-storage.json
View File

@ -1,6 +1,6 @@
{ {
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/deploy-azure-storage.schema.json", "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/deploy-azure-storage.schema.json",
"workingDir": "./release/assets/", "workingDir": "./temp/deploy/",
"account": "<!-- STORAGE ACCOUNT NAME -->", "account": "<!-- STORAGE ACCOUNT NAME -->",
"container": "react-pages-hierarchy", "container": "react-pages-hierarchy",
"accessKey": "<!-- ACCESS KEY -->" "accessKey": "<!-- ACCESS KEY -->"

39
samples/react-pages-hierarchy/config/package-solution.json
View File

@ -3,44 +3,9 @@
"solution": { "solution": {
"name": "react-pages-hierarchy", "name": "react-pages-hierarchy",
"id": "89758fb6-85e2-4e2b-ac88-4f4e7e5f60cb", "id": "89758fb6-85e2-4e2b-ac88-4f4e7e5f60cb",
"title": "Pages Hierarchy", "version": "1.0.1.0",
"version": "1.0.2.0",
"includeClientSideAssets": true, "includeClientSideAssets": true,
"isDomainIsolated": false, "isDomainIsolated": false
"developer": {
"name": "Bo George",
"privacyUrl": "",
"termsOfUseUrl": "",
"websiteUrl": "https://github.com/bogeorge",
"mpnId": "Undefined-1.14.0"
},
"metadata": {
"shortDescription": {
"default": "This web part allows users to create a faux page hierarchy in their pages library and use it for page-to-page navigation"
},
"longDescription": {
"default": "This web part allows users to create a faux page hierarchy in their pages library and use it for page-to-page navigation. It will ask you to create a page parent property on first use which is then used by the web part to either show a breadcrumb of the current pages ancestors or buttons for the pages children."
},
"screenshotPaths": [
"https://github.com/pnp/sp-dev-fx-webparts/blob/main/samples/react-pages-hierarchy/assets/PagesHierarchy.gif"
],
"videoUrl": "",
"categories": []
},
"features": [
{
"title": "Breadcrumbs",
"description": "Displays breadcrumbs to the current page",
"id": "ce42762f-a823-4f12-80b2-b708cdebfaa4",
"version": "1.0.2.0"
},
{
"title": "Child Pages",
"description": "Displays a list of child pages",
"id": "ce42762f-a823-4f12-80b2-b708cdebfaa5",
"version": "1.0.2.0"
}
]
}, },
"paths": { "paths": {
"zippedPackage": "solution/react-pages-hierarchy.sppkg" "zippedPackage": "solution/react-pages-hierarchy.sppkg"

2
samples/react-pages-hierarchy/config/serve.json
View File

@ -2,7 +2,7 @@
"$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json", "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
"port": 4321, "port": 4321,
"https": true, "https": true,
"initialPage": "https://enter-your-SharePoint-site/_layouts/workbench.aspx", "initialPage": "https://localhost:5432/workbench",
"api": { "api": {
"port": 5432, "port": 5432,
"entryPath": "node_modules/@microsoft/sp-webpart-workbench/lib/api/" "entryPath": "node_modules/@microsoft/sp-webpart-workbench/lib/api/"

12
samples/react-pages-hierarchy/gulpfile.js vendored
View File

@ -19,18 +19,6 @@ build.configureWebpack.mergeConfig({
} }
}); });
var getTasks = build.rig.getTasks;
build.rig.getTasks = function () {
var result = getTasks.call(build.rig);
result.set('serve', result.get('serve-deprecated'));
return result;
};
// disable tslint
build.tslintCmd.enabled = false;
build.initialize(require('gulp')); build.initialize(require('gulp'));
var runSequence = require('run-sequence'); var runSequence = require('run-sequence');

24348
samples/react-pages-hierarchy/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

52
samples/react-pages-hierarchy/package.json
View File

@ -1,42 +1,50 @@
{ {
"name": "react-pages-hierarchy", "name": "react-pages-hierarchy",
"version": "1.0.2", "version": "1.0.1",
"private": true, "private": true,
"main": "lib/index.js", "main": "lib/index.js",
"engines": {
"node": ">=0.10.0"
},
"scripts": { "scripts": {
"build": "gulp bundle", "build": "gulp bundle",
"clean": "gulp clean", "clean": "gulp clean",
"test": "gulp test" "test": "gulp test"
}, },
"dependencies": { "dependencies": {
"@microsoft/rush-stack-compiler-4.2": "^0.1.2", "@microsoft/sp-core-library": "1.10.0",
"@microsoft/sp-core-library": "1.14.0", "@microsoft/sp-lodash-subset": "1.10.0",
"@microsoft/sp-lodash-subset": "1.14.0", "@microsoft/sp-office-ui-fabric-core": "1.10.0",
"@microsoft/sp-office-ui-fabric-core": "1.14.0", "@microsoft/sp-property-pane": "1.10.0",
"@microsoft/sp-property-pane": "1.14.0", "@microsoft/sp-webpart-base": "1.10.0",
"@microsoft/sp-webpart-base": "1.14.0", "@pnp/common": "^2.0.3",
"@pnp/sp": "^3.1.0", "@pnp/logging": "^2.0.3",
"@pnp/spfx-controls-react": "^3.7.2", "@pnp/odata": "^2.0.3",
"@pnp/spfx-property-controls": "^3.6.0", "@pnp/sp": "^2.0.3",
"office-ui-fabric-react": "7.174.1", "@pnp/spfx-controls-react": "1.17.0",
"react": "16.13.1", "@pnp/spfx-property-controls": "1.17.0",
"react-dom": "16.13.1", "@types/es6-promise": "0.0.33",
"@types/react": "16.8.8",
"@types/react-dom": "16.8.3",
"@types/webpack-env": "1.13.1",
"office-ui-fabric-react": "6.189.2",
"react": "16.8.5",
"react-dom": "16.8.5",
"react-resize-detector": "^4.2.1" "react-resize-detector": "^4.2.1"
}, },
"resolutions": { "resolutions": {
"@types/react": "16.8.8" "@types/react": "16.8.8"
}, },
"devDependencies": { "devDependencies": {
"@microsoft/sp-build-web": "1.14.0", "@microsoft/rush-stack-compiler-3.3": "0.3.5",
"@microsoft/sp-module-interfaces": "1.14.0", "@microsoft/sp-build-web": "1.10.0",
"@microsoft/sp-tslint-rules": "1.14.0", "@microsoft/sp-module-interfaces": "1.10.0",
"@microsoft/sp-webpart-workbench": "^1.12.1", "@microsoft/sp-tslint-rules": "1.10.0",
"@types/es6-promise": "0.0.33", "@microsoft/sp-webpart-workbench": "1.10.0",
"@types/react": "16.9.51", "@types/chai": "3.4.34",
"@types/react-dom": "16.9.8", "@types/mocha": "2.2.38",
"@types/webpack-env": "^1.16.3",
"ajv": "~5.2.2", "ajv": "~5.2.2",
"gulp": "^4.0.2", "gulp": "^3.9.1",
"run-sequence": "^2.2.1" "run-sequence": "^2.2.1"
} }
} }

18
samples/react-pages-hierarchy/src/apiHooks/usePageApi.ts
View File

@ -1,10 +1,9 @@
import { useReducer, useEffect, useState } from 'react'; import { useReducer, useEffect, useState } from 'react';
import { PermissionKind, spfi, SPFx } from '@pnp/sp/presets/all'; import { sp, PermissionKind } from '@pnp/sp/presets/all';
import { ErrorHelper, LogHelper, ListTitles, PageFields } from '@src/utilities'; import { ErrorHelper, LogHelper, ListTitles, PageFields } from '@src/utilities';
import { Action } from "./action"; import { Action } from "./action";
import { GetRequest } from './getRequest'; import { GetRequest } from './getRequest';
import { IPage } from '@src/models/IPage'; import { IPage } from '@src/models/IPage';
import { WebPartContext } from '@microsoft/sp-webpart-base';
// state that we track // state that we track
interface PagesState { interface PagesState {
@ -84,7 +83,7 @@ function pagesReducer(state: PagesState, action: Action): PagesState {
} }
} }
export function usePageApi(currentPageId: number, pageEditFinished: boolean, context: WebPartContext): PageApi { export function usePageApi(currentPageId: number, pageEditFinished: boolean): PageApi {
const [pagesState, pagesDispatch] = useReducer(pagesReducer, { const [pagesState, pagesDispatch] = useReducer(pagesReducer, {
parentPageColumnExists: true, parentPageColumnExists: true,
userCanManagePages: false, userCanManagePages: false,
@ -93,8 +92,6 @@ export function usePageApi(currentPageId: number, pageEditFinished: boolean, con
getRequest: { isLoading: false, hasError: false, errorMessage: "" }, getRequest: { isLoading: false, hasError: false, errorMessage: "" },
}); });
const sp = spfi().using(SPFx(context));
// currentPageId is a dependency only because it can change when on the workbench, otherwise it really wouldn't change while on a page // currentPageId is a dependency only because it can change when on the workbench, otherwise it really wouldn't change while on a page
useEffect(() => { useEffect(() => {
LogHelper.verbose('usePageApi', 'useEffect', `[currentPageId, ${currentPageId}, pageEditFinished: ${pageEditFinished} ]`); LogHelper.verbose('usePageApi', 'useEffect', `[currentPageId, ${currentPageId}, pageEditFinished: ${pageEditFinished} ]`);
@ -129,7 +126,8 @@ export function usePageApi(currentPageId: number, pageEditFinished: boolean, con
PageFields.PARENTPAGELOOKUP PageFields.PARENTPAGELOOKUP
) )
.top(5000) .top(5000)
.orderBy(PageFields.TITLE, true)() .orderBy(PageFields.TITLE, true)
.get()
.catch(e => { .catch(e => {
ErrorHelper.handleHttpError('getPages', e); ErrorHelper.handleHttpError('getPages', e);
pagesDispatch({ type: ActionTypes.GET_PAGES_ERRORED }); pagesDispatch({ type: ActionTypes.GET_PAGES_ERRORED });
@ -155,7 +153,8 @@ export function usePageApi(currentPageId: number, pageEditFinished: boolean, con
LogHelper.verbose('usePageApi', 'parentPageExists', ``); LogHelper.verbose('usePageApi', 'parentPageExists', ``);
let parentPage = await sp.web.lists.getByTitle(ListTitles.SITEPAGES).fields let parentPage = await sp.web.lists.getByTitle(ListTitles.SITEPAGES).fields
.getByInternalNameOrTitle(PageFields.PARENTPAGELOOKUP)() .getByInternalNameOrTitle(PageFields.PARENTPAGELOOKUP)
.get()
.catch(e => { .catch(e => {
// swallow the exception we'll handle below // swallow the exception we'll handle below
}); });
@ -186,10 +185,11 @@ export function usePageApi(currentPageId: number, pageEditFinished: boolean, con
async function addParentPageFieldToSitePages(): Promise<void> { async function addParentPageFieldToSitePages(): Promise<void> {
LogHelper.verbose('usePageApi', 'addParentPageFieldToSitePages', ``); LogHelper.verbose('usePageApi', 'addParentPageFieldToSitePages', ``);
let list = await sp.web.lists.getByTitle(ListTitles.SITEPAGES)(); let list = await sp.web.lists.getByTitle(ListTitles.SITEPAGES)
.get();
let lookup = await sp.web.lists.getByTitle(ListTitles.SITEPAGES).fields let lookup = await sp.web.lists.getByTitle(ListTitles.SITEPAGES).fields
.addLookup(PageFields.PARENTPAGELOOKUP, { LookupListId: list.Id, LookupFieldName: PageFields.TITLE }) .addLookup(PageFields.PARENTPAGELOOKUP, list.Id, PageFields.TITLE)
.catch(e => { .catch(e => {
return null; return null;
ErrorHelper.handleHttpError('canUserUpdateSitePages', e); ErrorHelper.handleHttpError('canUserUpdateSitePages', e);

2
samples/react-pages-hierarchy/src/mocks/mockresponse.ts
View File

@ -424,7 +424,7 @@ export class MockResponse {
let result: IItemUpdateResult = { let result: IItemUpdateResult = {
item: item, item: item,
data: { 'etag': '' } data: { 'odata.etag': '' }
}; };
body = JSON.stringify(result); body = JSON.stringify(result);

10
samples/react-pages-hierarchy/src/webparts/BaseWebPart.ts
View File

@ -1,5 +1,6 @@
import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base'; import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base';
import { Environment, EnvironmentType } from '@microsoft/sp-core-library'; import { Environment, EnvironmentType } from '@microsoft/sp-core-library';
import { sp } from "@pnp/sp";
import { Logger, ConsoleListener, LogLevel } from "@pnp/logging"; import { Logger, ConsoleListener, LogLevel } from "@pnp/logging";
import { CustomFetchClient } from '@src/mocks/customfetchclient'; import { CustomFetchClient } from '@src/mocks/customfetchclient';
@ -13,6 +14,15 @@ export default class BaseWebPart<TProperties> extends BaseClientSideWebPart<TPro
} }
return super.onInit().then(_ => { return super.onInit().then(_ => {
sp.setup({
spfxContext: this.context,
sp: {
fetchClientFactory: () => {
return new CustomFetchClient(isUsingSharePoint);
},
}
});
// subscribe a listener // subscribe a listener
Logger.subscribe(new ConsoleListener()); Logger.subscribe(new ConsoleListener());

3
samples/react-pages-hierarchy/src/webparts/pagehierarchy/PageHierarchyWebPart.ts
View File

@ -53,8 +53,7 @@ export default class PageHierarchyWebPart extends BaseWebPart<IPageHierarchyWebP
displayMode: this.displayMode, displayMode: this.displayMode,
updateTitle: (t) => { this.properties.title = t; this.render(); }, updateTitle: (t) => { this.properties.title = t; this.render(); },
onConfigure: () => { this.onConfigure(); }, onConfigure: () => { this.onConfigure(); },
pageEditFinished: this.pageEditFinished, pageEditFinished: this.pageEditFinished
context: this.context
} }
); );
ReactDom.render(element, this.domElement, () => { ReactDom.render(element, this.domElement, () => {

2
samples/react-pages-hierarchy/src/webparts/pagehierarchy/components/Container/Container.tsx
View File

@ -9,7 +9,7 @@ import { usePageApi } from '@src/apiHooks/usePageApi';
import { Placeholder } from "@pnp/spfx-controls-react/lib/Placeholder"; import { Placeholder } from "@pnp/spfx-controls-react/lib/Placeholder";
export const Container: React.FunctionComponent<IContainerProps> = props => { export const Container: React.FunctionComponent<IContainerProps> = props => {
const pagesApi = usePageApi(props.currentPageId, props.pageEditFinished, props.context); const pagesApi = usePageApi(props.currentPageId, props.pageEditFinished);
let controlToRender = undefined; let controlToRender = undefined;
switch (props.pagesToDisplay) { switch (props.pagesToDisplay) {

2
samples/react-pages-hierarchy/src/webparts/pagehierarchy/components/Container/IContainerProps.ts
View File

@ -1,13 +1,11 @@
import { IReadonlyTheme } from '@microsoft/sp-component-base'; import { IReadonlyTheme } from '@microsoft/sp-component-base';
import { PagesToDisplay } from '@src/utilities'; import { PagesToDisplay } from '@src/utilities';
import { DisplayMode } from "@microsoft/sp-core-library"; import { DisplayMode } from "@microsoft/sp-core-library";
import { WebPartContext } from '@microsoft/sp-webpart-base';
export interface IContainerProps { export interface IContainerProps {
currentPageId: number; currentPageId: number;
pagesToDisplay: PagesToDisplay; pagesToDisplay: PagesToDisplay;
themeVariant: IReadonlyTheme; themeVariant: IReadonlyTheme;
context: WebPartContext;
domElement: HTMLElement; domElement: HTMLElement;
// all this is just for WebPartTitle control // all this is just for WebPartTitle control
showTitle: boolean; showTitle: boolean;

12
samples/react-pages-hierarchy/tsconfig.json
View File

@ -1,5 +1,5 @@
{ {
"extends": "./node_modules/@microsoft/rush-stack-compiler-4.2/includes/tsconfig-web.json", "extends": "./node_modules/@microsoft/rush-stack-compiler-3.3/includes/tsconfig-web.json",
"compilerOptions": { "compilerOptions": {
"target": "es5", "target": "es5",
"forceConsistentCasingInFileNames": true, "forceConsistentCasingInFileNames": true,
@ -25,18 +25,22 @@
"./node_modules/@microsoft" "./node_modules/@microsoft"
], ],
"types": [ "types": [
"es6-promise",
"webpack-env" "webpack-env"
], ],
"lib": [ "lib": [
// commented out to allow for this.constructor.name support // commented out to allow for this.constructor.name support
"es2015.promise", // "es5",
"es2017", "es2017",
"dom", "dom",
"es2015.collection" "es2015.collection"
] ]
}, },
"include": [ "include": [
"src/**/*.ts", "src/**/*.ts"
"src/**/*.tsx" ],
"exclude": [
"node_modules",
"lib"
] ]
} }

3
samples/react-pages-hierarchy/tslint.json
View File

@ -1,5 +1,5 @@
{ {
"extends": "./node_modules/@microsoft/sp-tslint-rules/base-tslint.json", "extends": "@microsoft/sp-tslint-rules/base-tslint.json",
"rules": { "rules": {
"class-name": false, "class-name": false,
"export-name": false, "export-name": false,
@ -17,6 +17,7 @@
"no-switch-case-fall-through": true, "no-switch-case-fall-through": true,
"no-unnecessary-semicolons": true, "no-unnecessary-semicolons": true,
"no-unused-expression": true, "no-unused-expression": true,
"no-use-before-declare": true,
"no-with-statement": true, "no-with-statement": true,
"semicolon": true, "semicolon": true,
"trailing-comma": false, "trailing-comma": false,

4
samples/react-teams-membership-updater/.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.140.", "name": "SPFx 1.12.1",
"image": "docker.io/m365pnp/spfx:1.14.0", "image": "docker.io/m365pnp/spfx:1.12.1",
// 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.

2
samples/react-teams-membership-updater/.yo-rc.json
View File

@ -2,7 +2,7 @@
"@microsoft/generator-sharepoint": { "@microsoft/generator-sharepoint": {
"isCreatingSolution": true, "isCreatingSolution": true,
"environment": "spo", "environment": "spo",
"version": "1.14.0", "version": "1.12.1",
"libraryName": "teams-membership-updater", "libraryName": "teams-membership-updater",
"libraryId": "5da816cf-c693-4b88-b9bd-a9da3587f05c", "libraryId": "5da816cf-c693-4b88-b9bd-a9da3587f05c",
"packageManager": "npm", "packageManager": "npm",

31
samples/react-teams-membership-updater/README.md
View File

@ -12,7 +12,7 @@ Used to update the membership of a team based on the contents of a CSV file, can
## Compatibility ## Compatibility
![SPFx 1.14.0](https://img.shields.io/badge/SPFx-1.14.0-green.svg) ![SPFx 1.12.1](https://img.shields.io/badge/SPFx-1.12.1-green.svg)
![Node.js v14 | v12 | v10](https://img.shields.io/badge/Node.js-v14%20%7C%20v12%20%7C%20v10-green.svg) ![Node.js v14 | v12 | v10](https://img.shields.io/badge/Node.js-v14%20%7C%20v12%20%7C%20v10-green.svg)
![SharePoint Online](https://img.shields.io/badge/SharePoint-Online-yellow.svg) ![SharePoint Online](https://img.shields.io/badge/SharePoint-Online-yellow.svg)
![Teams Yes: Designed for Microsoft Teams](https://img.shields.io/badge/Teams-Yes-green.svg "Designed for Microsoft Teams") ![Teams Yes: Designed for Microsoft Teams](https://img.shields.io/badge/Teams-Yes-green.svg "Designed for Microsoft Teams")
@ -29,9 +29,9 @@ This web part can be deployed to a site or as a teams personal app. This does r
Uses: Uses:
* PnP React Controls - PnP React Controls
* PnP React Property Controls - PnP React Property Controls
* React Papaparse (CSV parsing) - React Papaparse (CSV parsing)
Solution|Author(s) Solution|Author(s)
--------|--------- --------|---------
@ -49,20 +49,19 @@ Version|Date|Comments
1.1.0|July 13, 2021|Upgraded to v1.12.1 of SPFx and v3 of pnp controls 1.1.0|July 13, 2021|Upgraded to v1.12.1 of SPFx and v3 of pnp controls
1.2.0|August 17, 2021|Added support for populating private channels inside of a team, added support for paged list of teams from Graph, added sorting to the Team list 1.2.0|August 17, 2021|Added support for populating private channels inside of a team, added support for paged list of teams from Graph, added sorting to the Team list
1.2.1|September 21, 2021| Missing '/members' in the private channel membership url 1.2.1|September 21, 2021| Missing '/members' in the private channel membership url
1.2.2|March, 24, 2022|Upgraded to SPFx v1.14 and v4 of react-papaparse
## Minimal Path to Awesome ## Minimal Path to Awesome
* Clone this repository (or [download this solution as a .ZIP file](https://pnp.github.io/download-partial/?url=https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-teams-membership-updater) then unzip it) - Clone this repository
* From your command line, change your current directory to the directory containing this sample (`react-teams-membership-updater`, located under `samples`) - in the command line run:
* in the command line run: - `npm install`
* `npm install` - `gulp build`
* `gulp build` - `gulp bundle --ship`
* `gulp bundle --ship` - `gulp package-solution --ship`
* `gulp package-solution --ship` - Add to AppCatalog and deploy
* Add to AppCatalog and deploy
> This sample can also be opened with [VS Code Remote Development](https://code.visualstudio.com/docs/remote/remote-overview). Visit https://aka.ms/spfx-devcontainer for further instructions.
> This sample can also be opened with [VS Code Remote Development](https://code.visualstudio.com/docs/remote/remote-overview). Visit <https://aka.ms/spfx-devcontainer> for further instructions.
## Help ## Help
@ -80,8 +79,10 @@ For questions regarding this sample, [create a new question](https://github.com/
Finally, if you have an idea for improvement, [make a suggestion](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Aenhancement%2Csample%3A%20react-teams-membership-updater&template=question.yml&sample=react-teams-membership-updater&authors=@techienickb&title=react-teams-membership-updater%20-%20). Finally, if you have an idea for improvement, [make a suggestion](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Aenhancement%2Csample%3A%20react-teams-membership-updater&template=question.yml&sample=react-teams-membership-updater&authors=@techienickb&title=react-teams-membership-updater%20-%20).
## Disclaimer ## 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.** **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.**
<img src="<https://pnptelemetry.azurewebsites.net/sp-dev-fx-webparts/samples/react-teams-membership-updater> />
<img src="https://pnptelemetry.azurewebsites.net/sp-dev-fx-webparts/samples/react-teams-membership-updater />

4
samples/react-teams-membership-updater/assets/sample.json
View File

@ -9,7 +9,7 @@
"Used to update the membership of a team based on the contents of a CSV file, can be hosted in a SharePoint site where a list can be defined for logging purposes or run inside teams as a personal app." "Used to update the membership of a team based on the contents of a CSV file, can be hosted in a SharePoint site where a list can be defined for logging purposes or run inside teams as a personal app."
], ],
"creationDateTime": "2020-04-27", "creationDateTime": "2020-04-27",
"updateDateTime": "2022-03-24", "updateDateTime": "2021-09-21",
"products": [ "products": [
"SharePoint" "SharePoint"
], ],
@ -20,7 +20,7 @@
}, },
{ {
"key": "SPFX-VERSION", "key": "SPFX-VERSION",
"value": "1.14.0" "value": "1.12.1"
} }
], ],
"thumbnails": [ "thumbnails": [

21
samples/react-teams-membership-updater/config/package-solution.json
View File

@ -12,7 +12,7 @@
"websiteUrl": "https://nbdev.uk", "websiteUrl": "https://nbdev.uk",
"mpnId": "000000" "mpnId": "000000"
}, },
"version": "1.0.2.2", "version": "1.0.2.1",
"includeClientSideAssets": true, "includeClientSideAssets": true,
"isDomainIsolated": false, "isDomainIsolated": false,
"webApiPermissionRequests": [ "webApiPermissionRequests": [
@ -32,25 +32,6 @@
"resource": "Microsoft Graph", "resource": "Microsoft Graph",
"scope": "ChannelMember.ReadWrite.All" "scope": "ChannelMember.ReadWrite.All"
} }
],
"metadata": {
"shortDescription": {
"default": "Populate a Team or Channel Membership from a CSV file"
},
"longDescription": {
"default": "Populate or update a Team or Channel Membership from a CSV file"
},
"screenshotPaths": [],
"videoUrl": "",
"categories": []
},
"features": [
{
"title": "Channe/Team Membership Updating",
"description": "Updates/Populates a Team based on the values in a CSV file",
"id": "c7e4099a-153e-444f-a52f-c3bd3c137760",
"version": "1.0.2.1"
}
] ]
}, },
"paths": { "paths": {

7936
samples/react-teams-membership-updater/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

38
samples/react-teams-membership-updater/package.json
View File

@ -9,30 +9,32 @@
"test": "gulp test" "test": "gulp test"
}, },
"dependencies": { "dependencies": {
"@microsoft/sp-core-library": "1.14.0", "@microsoft/sp-core-library": "1.12.1",
"@microsoft/sp-lodash-subset": "1.14.0", "@microsoft/sp-http": "1.12.1",
"@microsoft/sp-office-ui-fabric-core": "1.14.0", "@microsoft/sp-lodash-subset": "1.12.1",
"@microsoft/sp-property-pane": "1.14.0", "@microsoft/sp-office-ui-fabric-core": "1.12.1",
"@microsoft/sp-webpart-base": "1.14.0", "@microsoft/sp-property-pane": "1.12.1",
"@pnp/spfx-controls-react": "3.7.2", "@microsoft/sp-webpart-base": "1.12.1",
"@pnp/spfx-property-controls": "3.6.0", "@pnp/spfx-controls-react": "^3.3.0",
"office-ui-fabric-react": "^7.174.1", "@pnp/spfx-property-controls": "^3.2.0",
"react": "16.13.1", "office-ui-fabric-react": "^7.176.1",
"react-dom": "16.13.1", "react": "16.9.0",
"react-papaparse": "^4.0.2" "react-dom": "16.9.0",
"react-papaparse": "^3.17.2"
}, },
"resolutions": { "resolutions": {
"@types/react": "16.8.8" "@types/react": "16.8.8"
}, },
"devDependencies": { "devDependencies": {
"@microsoft/rush-stack-compiler-3.9": "^0.4.48", "@microsoft/rush-stack-compiler-3.7": "0.2.3",
"@microsoft/sp-build-web": "1.14.0", "@microsoft/sp-build-web": "1.12.1",
"@microsoft/sp-module-interfaces": "1.14.0", "@microsoft/sp-module-interfaces": "1.12.1",
"@microsoft/sp-tslint-rules": "1.14.0", "@microsoft/sp-tslint-rules": "1.12.1",
"@types/react": "^16.9.51", "@microsoft/sp-webpart-workbench": "1.12.1",
"@types/react-dom": "^16.9.8", "@types/react": "^17.0.22",
"@types/react-dom": "^17.0.8",
"@types/webpack-env": "^1.16.2", "@types/webpack-env": "^1.16.2",
"ajv": "~6.9.1", "ajv": "~5.2.2",
"gulp": "~4.0.2" "gulp": "~4.0.2"
} }
} }

12
samples/react-teams-membership-updater/src/webparts/teamsMembershipUpdater/components/TeamsMembershipUpdater.tsx
View File

@ -3,7 +3,7 @@ import styles from './TeamsMembershipUpdater.module.scss';
import { ITeamsMembershipUpdaterProps } from './ITeamsMembershipUpdaterProps'; import { ITeamsMembershipUpdaterProps } from './ITeamsMembershipUpdaterProps';
import { DetailsList, DetailsListLayoutMode, IColumn, SelectionMode, ProgressIndicator, Separator, PrimaryButton, MessageBar, MessageBarType, Link, Toggle, List, Dropdown, IDropdownOption, Text, TeachingBubble, Icon, Callout, mergeStyleSets, FontWeights } from 'office-ui-fabric-react'; import { DetailsList, DetailsListLayoutMode, IColumn, SelectionMode, ProgressIndicator, Separator, PrimaryButton, MessageBar, MessageBarType, Link, Toggle, List, Dropdown, IDropdownOption, Text, TeachingBubble, Icon, Callout, mergeStyleSets, FontWeights } from 'office-ui-fabric-react';
import { ITeamsMembershipUpdaterWebPartProps } from '../TeamsMembershipUpdaterWebPart'; import { ITeamsMembershipUpdaterWebPartProps } from '../TeamsMembershipUpdaterWebPart';
import { usePapaParse } from 'react-papaparse'; import { readString } from 'react-papaparse';
import { MSGraphClient, SPHttpClient, SPHttpClientResponse } from '@microsoft/sp-http'; import { MSGraphClient, SPHttpClient, SPHttpClientResponse } from '@microsoft/sp-http';
import * as MicrosoftGraph from "@microsoft/microsoft-graph-types"; import * as MicrosoftGraph from "@microsoft/microsoft-graph-types";
import { FilePicker, IFilePickerResult } from '@pnp/spfx-controls-react'; import { FilePicker, IFilePickerResult } from '@pnp/spfx-controls-react';
@ -117,13 +117,11 @@ export default class TeamsMembershipUpdater extends React.Component<ITeamsMember
reader.readAsArrayBuffer(file); reader.readAsArrayBuffer(file);
reader.onloadend = ((ev) => { reader.onloadend = ((ev) => {
let decodedString = new TextDecoder('utf-8').decode(new DataView(reader.result as ArrayBuffer)); let decodedString = new TextDecoder('utf-8').decode(new DataView(reader.result as ArrayBuffer));
const { readString } = usePapaParse(); const csv = readString(decodedString, { header: true, skipEmptyLines: true });
readString(decodedString, { header: true, skipEmptyLines: true, worker: true, complete: (results) => { var h = csv.meta.fields;
var h = results.meta.fields; this._data = csv.data;
this._data = results.data; this._datacolumns = h.map(r => { return { key: r.replace(' ', ''), name: r, fieldName: r, isResizable: true }; });
this._datacolumns = h.map(r => { return { key: r.replace(' ', ''), name: r, fieldName: r, isResizable: true, minWidth: 100 }; });
this.setState({ ...this.state, csvcolumns: this._datacolumns, csvdata: this._data, csvItems: h.map(r => ({ key: r.replace(' ', ''), text: r })), logs: [], errors: [], logurl: null }); this.setState({ ...this.state, csvcolumns: this._datacolumns, csvdata: this._data, csvItems: h.map(r => ({ key: r.replace(' ', ''), text: r })), logs: [], errors: [], logurl: null });
} });
}); });
}); });
}); });

3
samples/react-teams-membership-updater/tsconfig.json
View File

@ -1,5 +1,5 @@
{ {
"extends": "./node_modules/@microsoft/rush-stack-compiler-3.9/includes/tsconfig-web.json", "extends": "./node_modules/@microsoft/rush-stack-compiler-3.7/includes/tsconfig-web.json",
"compilerOptions": { "compilerOptions": {
"target": "es5", "target": "es5",
"forceConsistentCasingInFileNames": true, "forceConsistentCasingInFileNames": true,
@ -19,6 +19,7 @@
"./node_modules/@microsoft" "./node_modules/@microsoft"
], ],
"types": [ "types": [
"es6-promise",
"webpack-env" "webpack-env"
], ],
"lib": [ "lib": [

1
samples/react-teams-membership-updater/tslint.json
View File

@ -17,6 +17,7 @@
"no-switch-case-fall-through": true, "no-switch-case-fall-through": true,
"no-unnecessary-semicolons": true, "no-unnecessary-semicolons": true,
"no-unused-expression": true, "no-unused-expression": true,
"no-use-before-declare": true,
"no-with-statement": true, "no-with-statement": true,
"semicolon": true, "semicolon": true,
"trailing-comma": false, "trailing-comma": false,