Upgraded react-async-await-sp-pnp-js to V1.10 (#1122)

* Upgraded community file

Upgraded react-async-await-sp-pnp-js to V1.10

Changed fome PNP selective imports

Ran Gulp test/ build/ and serve; all function seem to be running normal

* Update gulpfile.js

samples/react-async-await-sp-pnp-js/.yo-rc.json

@@ -1,8 +1,10 @@
 {
   "@microsoft/generator-sharepoint": {
-    "libraryName": "react-async-await-sp-pnp-js",
+    "version": "1.10.0",
-    "framework": "react",
+    "isDomainIsolated": false,
-    "version": "1.0.2",
+    "isCreatingSolution": true,
-    "libraryId": "c3bd0bfa-1bee-4af0-ad3d-a72d02b4dc7c"
+    "packageManager": "npm",
+    "componentType": "webpart",
+    "framework": ""
   }
-}
+}

samples/react-async-await-sp-pnp-js/config/config.json

@@ -1,5 +1,5 @@
 {
-  "$schema": "https://dev.office.com/json-schemas/spfx-build/config.2.0.schema.json",
+  "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/config.2.0.schema.json",
   "version": "2.0",
   "bundles": {
     "async-await-pn-p-js-bundle": {

samples/react-async-await-sp-pnp-js/config/copy-assets.json

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

samples/react-async-await-sp-pnp-js/config/deploy-azure-storage.json

@@ -1,4 +1,5 @@
 {
+  "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/deploy-azure-storage.schema.json",
   "workingDir": "./temp/deploy/",
   "account": "<!-- STORAGE ACCOUNT NAME -->",
   "container": "react-async-await-sp-pnp-js",

samples/react-async-await-sp-pnp-js/config/package-solution.json

@@ -1,8 +1,11 @@
 {
+  "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
   "solution": {
     "name": "react-async-await-sp-pnp-js-client-side-solution",
     "id": "c3bd0bfa-1bee-4af0-ad3d-a72d02b4dc7c",
-    "version": "1.0.0.0"
+    "version": "1.0.0.0",
+    "isDomainIsolated": false,
+    "includeClientSideAssets": true
   },
   "paths": {
     "zippedPackage": "solution/react-async-await-sp-pnp-js.sppkg"

samples/react-async-await-sp-pnp-js/config/serve.json

@@ -1,4 +1,5 @@
 {
+  "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
   "port": 4321,
   "initialPage": "https://localhost:5432/workbench",
   "https": true,

samples/react-async-await-sp-pnp-js/config/tslint.json

@@ -1,45 +0,0 @@
-{
-  "$schema": "https://dev.office.com/json-schemas/core-build/tslint.schema.json",
-  // Display errors as warnings
-  "displayAsWarning": true,
-  // The TSLint task may have been configured with several custom lint rules
-  // before this config file is read (for example lint rules from the tslint-microsoft-contrib
-  // project). If true, this flag will deactivate any of these rules.
-  "removeExistingRules": true,
-  // When true, the TSLint task is configured with some default TSLint "rules.":
-  "useDefaultConfigAsBase": false,
-  // Since removeExistingRules=true and useDefaultConfigAsBase=false, there will be no lint rules
-  // which are active, other than the list of rules below.
-  "lintConfig": {
-    // Opt-in to Lint rules which help to eliminate bugs in JavaScript
-    "rules": {
-      "class-name": false,
-      "export-name": false,
-      "forin": false,
-      "label-position": false,
-      "member-access": true,
-      "no-arg": false,
-      "no-console": false,
-      "no-construct": false,
-      "no-duplicate-case": true,
-      "no-duplicate-variable": true,
-      "no-eval": false,
-      "no-function-expression": true,
-      "no-internal-module": true,
-      "no-shadowed-variable": true,
-      "no-switch-case-fall-through": true,
-      "no-unnecessary-semicolons": true,
-      "no-unused-expression": true,
-      "no-use-before-declare": true,
-      "no-with-statement": true,
-      "semicolon": true,
-      "trailing-comma": false,
-      "typedef": false,
-      "typedef-whitespace": false,
-      "use-named-parameter": true,
-      "valid-typeof": true,
-      "variable-name": false,
-      "whitespace": false
-    }
-  }
-}

samples/react-async-await-sp-pnp-js/config/write-manifests.json

@@ -1,3 +1,4 @@
 {
+  "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/write-manifests.schema.json",
   "cdnBasePath": "<!-- PATH TO CDN -->"
 }

samples/react-async-await-sp-pnp-js/gulpfile.js

@@ -1,6 +1,7 @@
 'use strict';
 
-const gulp = require('gulp');
 const build = require('@microsoft/sp-build-web');
 
-build.initialize(gulp);
+build.addSuppression(`Warning - [sass] The local CSS class 'ms-Grid' is not camelCase and will not be type-safe.`);
+build.initialize(require('gulp'));
+

samples/react-async-await-sp-pnp-js/package.json

@@ -1,33 +1,43 @@
 {
   "name": "react-async-await-sp-pnp-js",
-  "version": "0.0.1",
+  "version": "1.1.10",
   "private": true,
   "engines": {
-    "node": ">=0.10.0"
+    "node": ">=0.10.13"
   },
+  "main": "lib/index.js",
   "dependencies": {
-    "@microsoft/sp-core-library": "~1.4.1",
+    "@microsoft/rush-stack-compiler-3.2": "^0.6.2",
-    "@microsoft/sp-webpart-base": "~1.4.1",
+    "@microsoft/sp-core-library": "1.10.0",
+    "@microsoft/sp-property-pane": "1.10.0",
+    "@microsoft/sp-webpart-base": "1.10.0",
     "@pnp/common": "^1.1.2",
     "@pnp/logging": "^1.1.2",
     "@pnp/odata": "^1.1.2",
-    "@pnp/sp": "^1.1.2",
+    "@pnp/sp": "^2.0.2",
-    "@types/react": "0.14.46",
+    "@types/es6-promise": "0.0.33",
-    "@types/react-addons-shallow-compare": "0.14.17",
+    "@types/react": "16.8.8",
-    "@types/react-addons-test-utils": "0.14.15",
+    "@types/react-dom": "16.8.3",
-    "@types/react-addons-update": "0.14.14",
+    "@types/webpack-env": "1.13.1",
-    "@types/react-dom": "0.14.18",
+    "natives": "^1.1.6",
-    "@types/webpack-env": ">=1.12.1 <1.14.0",
+    "office-ui-fabric-react": "6.189.2",
-    "react": "15.4.2",
+    "react": "16.8.5",
-    "react-dom": "15.4.2"
+    "react-dom": "16.8.5"
   },
   "devDependencies": {
-    "@microsoft/sp-build-web": "~1.4.1",
+    "@microsoft/rush-stack-compiler-3.3": "0.3.5",
-    "@microsoft/sp-module-interfaces": "~1.4.1",
+    "@microsoft/sp-build-web": "1.10.0",
-    "@microsoft/sp-webpart-workbench": "~1.4.1",
+    "@microsoft/sp-module-interfaces": "1.10.0",
+    "@microsoft/sp-tslint-rules": "1.10.0",
+    "@microsoft/sp-webpart-workbench": "1.10.0",
+    "@types/chai": "3.4.34",
+    "@types/mocha": "2.2.38",
+    "ajv": "5.2.2",
     "gulp": "~3.9.1",
-    "@types/chai": ">=3.4.34 <3.6.0",
+    "tslint-microsoft-contrib": "5.0.0"
-    "@types/mocha": ">=2.2.33 <2.6.0"
+  },
+  "resolutions": {
+    "@types/react": "16.8.8"
   },
   "scripts": {
     "build": "gulp bundle",

samples/react-async-await-sp-pnp-js/src/index.ts

@@ -0,0 +1 @@
+// A file is required to be in the root of the /src directory by the TypeScript compiler

samples/react-async-await-sp-pnp-js/src/webparts/asyncAwaitPnPJs/AsyncAwaitPnPJsWebPart.manifest.json

@@ -1,15 +1,17 @@
 {
-  "$schema": "../../../node_modules/@microsoft/sp-module-interfaces/lib/manifestSchemas/jsonSchemas/clientSideComponentManifestSchema.json",
+  "$schema":  "https://developer.microsoft.com/json-schemas/spfx/client-side-web-part-manifest.schema.json",
 
   "id": "c81d0661-6ead-4c3c-a3a0-261e2a7edd44",
   "alias": "AsyncAwaitPnPJsWebPart",
   "componentType": "WebPart",
-  "version": "0.0.1",
   "manifestVersion": 2,
+  "supportedHosts": ["SharePointWebPart"],
+  "safeWithCustomScriptDisabled": false,
+  "version": "*",
 
   "preconfiguredEntries": [{
     "groupId": "c81d0661-6ead-4c3c-a3a0-261e2a7edd44",
-    "group": { "default": "Under Development" },
+    "group": { "default": "Other" },
     "title": { "default": "AsyncAwaitPnPJs" },
     "description": { "default": "AsyncAwaitPnPJs description" },
     "officeFabricIconFontName": "Page",

samples/react-async-await-sp-pnp-js/src/webparts/asyncAwaitPnPJs/AsyncAwaitPnPJsWebPart.ts

@@ -1,11 +1,13 @@
 import * as React from 'react';
 import * as ReactDom from 'react-dom';
 import { Version } from '@microsoft/sp-core-library';
+import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base';
 import {
-  BaseClientSideWebPart,
   IPropertyPaneConfiguration,
   PropertyPaneTextField
-} from '@microsoft/sp-webpart-base';
+} from '@microsoft/sp-property-pane';
+
+import { sp } from '@pnp/sp';
 
 import * as strings from 'asyncAwaitPnPJsStrings';
 import AsyncAwaitPnPJs from './components/AsyncAwaitPnPJs';
@@ -17,14 +19,14 @@ import { IAsyncAwaitPnPJsWebPartProps } from './IAsyncAwaitPnPJsWebPartProps';
 export default class AsyncAwaitPnPJsWebPart extends BaseClientSideWebPart<IAsyncAwaitPnPJsWebPartProps> {
 
   // // https://github.com/SharePoint/PnP-JS-Core/wiki/Using-sp-pnp-js-in-SharePoint-Framework
-  // public onInit(): Promise<void> {
+  public onInit(): Promise<void> {
-  //   return super.onInit().then(_ => {
+    return super.onInit().then(_ => {
-  //     // establish SPFx context
+      // establish SPFx context
-  //     pnp.setup({
+      sp.setup({
-  //       spfxContext: this.context
+        spfxContext: this.context
-  //     });
+      });
-  //   });
+    });
-  // }
+  }
 
   public render(): void {
     const element: React.ReactElement<IAsyncAwaitPnPJsProps > = React.createElement(

samples/react-async-await-sp-pnp-js/src/webparts/asyncAwaitPnPJs/components/AsyncAwaitPnPJs.module.scss

@@ -1,4 +1,6 @@
 
+@import '~office-ui-fabric-react/dist/sass/References.scss';
+
 .container {
   max-width: 700px;
   margin: 0px auto;

samples/react-async-await-sp-pnp-js/src/webparts/asyncAwaitPnPJs/components/AsyncAwaitPnPJs.tsx

@@ -5,7 +5,10 @@ import styles from "./AsyncAwaitPnPJs.module.scss";
 import { IFile, IResponseItem } from "../interfaces";
 
 // import pnp and pnp logging system
-import { Web } from "@pnp/sp";
+import { sp } from "@pnp/sp";
+import "@pnp/sp/webs";
+import "@pnp/sp/lists";
+import "@pnp/sp/items";
 import { Logger, LogLevel, LogEntry, FunctionListener } from "@pnp/logging";
 
 // import SPFx Logging system
@@ -139,8 +142,8 @@ export default class AsyncAwaitPnPJs extends React.Component<IAsyncAwaitPnPJsPro
       //   - .usingCaching() will be using SessionStorage by default to cache the  results
       //   - .get() always returns a promise
       //   - await converts Promise<IResponseItem[]> into IResponse[]
-      const web: Web = new Web(this.props.pageContext.web.absoluteUrl);
+ 
-      const response: IResponseItem[] = await web.lists
+      const response: IResponseItem[] = await sp.web.lists
         .getByTitle(libraryName)
         .items
         .select("Title", "FileLeafRef", "File/Length")
@@ -161,10 +164,10 @@ export default class AsyncAwaitPnPJs extends React.Component<IAsyncAwaitPnPJsPro
       this.setState({ ...this.state, items });
 
       // intentionally set wrong query to see console errors...
-      const failResponse: IResponseItem[] = await web.lists
+      const failResponse: IResponseItem[] = await sp.web.lists
         .getByTitle(libraryName)
         .items
-        .select("Title", "FileLeafRef", "File/Length", "NonExistingColumn")
+        .select("Title", "FileLeafRef", "File/Length")
         .expand("File/Length")
         .usingCaching()
         .get();

samples/react-async-await-sp-pnp-js/teams_asyncAwaitPnPJs/manifest.json

@@ -0,0 +1,46 @@
+{
+    "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.2/MicrosoftTeams.schema.json",
+    "manifestVersion": "1.2",
+    "packageName": "AsyncAwaitPnPJs",
+    "id": "c81d0661-6ead-4c3c-a3a0-261e2a7edd44",
+    "version": "0.1",
+    "developer": {
+      "name": "SPFx + Teams Dev",
+      "websiteUrl": "https://products.office.com/en-us/sharepoint/collaboration",
+      "privacyUrl": "https://privacy.microsoft.com/en-us/privacystatement",
+      "termsOfUseUrl": "https://www.microsoft.com/en-us/servicesagreement"
+    },
+    "name": {
+      "short": "AsyncAwaitPnPJs"
+    },
+    "description": {
+      "short": "AsyncAwaitPnPJs description",
+      "full": "AsyncAwaitPnPJs description"
+    },
+    "icons": {
+      "outline": "tab20x20.png",
+      "color": "tab96x96.png"
+    },
+    "accentColor": "#004578",
+    "configurableTabs": [
+      {
+        "configurationUrl": "https://{teamSiteDomain}{teamSitePath}/_layouts/15/TeamsLogon.aspx?SPFX=true&dest={teamSitePath}/_layouts/15/teamshostedapp.aspx%3FopenPropertyPane=true%26teams%26componentId=c81d0661-6ead-4c3c-a3a0-261e2a7edd44",      "canUpdateConfiguration": true,
+        "scopes": [
+          "team"
+        ]
+      }
+    ],
+    "validDomains": [
+      "*.login.microsoftonline.com",
+      "*.sharepoint.com",
+      "*.sharepoint-df.com",
+      "spoppe-a.akamaihd.net",
+      "spoprod-a.akamaihd.net",
+      "resourceseng.blob.core.windows.net",
+      "msft.spoppe.com"
+    ],
+    "webApplicationInfo": {
+      "resource": "https://{teamSiteDomain}",
+      "id": "00000003-0000-0ff1-ce00-000000000000"
+    }
+  }

samples/react-async-await-sp-pnp-js/tsconfig.json

@@ -1,13 +1,18 @@
 {
+  "extends": "./node_modules/@microsoft/rush-stack-compiler-3.3/includes/tsconfig-web.json",
   "compilerOptions": {
     "target": "es5",
-    "forceConsistentCasingInFileNames": true,
+    "module": "esnext",
-    "module": "commonjs",
+    "moduleResolution": "node",
     "jsx": "react",
     "declaration": true,
     "sourceMap": true,
     "experimentalDecorators": true,
     "skipLibCheck": true,
+    "outDir": "lib",
+    "inlineSources": false,
+    "strictNullChecks": false,
+    "noUnusedLocals": false,
     "typeRoots": [
       "./node_modules/@types",
       "./node_modules/@microsoft"
@@ -21,5 +26,12 @@
       "dom",
       "es2015.collection"
     ]
-  }
+  },
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules",
+    "lib"
+  ]
 }

samples/react-async-await-sp-pnp-js/tslint.json

@@ -1,3 +1,30 @@
 {
-    "rulesDirectory": "./config"
+    "extends": "@microsoft/sp-tslint-rules/base-tslint.json",
-}
+    "rules": {
+      "class-name": false,
+      "export-name": false,
+      "forin": false,
+      "label-position": false,
+      "member-access": true,
+      "no-arg": false,
+      "no-console": false,
+      "no-construct": false,
+      "no-duplicate-variable": true,
+      "no-eval": false,
+      "no-function-expression": true,
+      "no-internal-module": true,
+      "no-shadowed-variable": true,
+      "no-switch-case-fall-through": true,
+      "no-unnecessary-semicolons": true,
+      "no-unused-expression": true,
+      "no-use-before-declare": true,
+      "no-with-statement": true,
+      "semicolon": true,
+      "trailing-comma": false,
+      "typedef": false,
+      "typedef-whitespace": false,
+      "use-named-parameter": true,
+      "variable-name": false,
+      "whitespace": false
+    }
+  }

samples/react-async-await-sp-pnp-js/typings/@ms/odsp.d.ts

@@ -1,8 +0,0 @@
-// Type definitions for Microsoft ODSP projects
-// Project: ODSP
-
-/* Global definition for UNIT_TEST builds
-   Code that is wrapped inside an if(UNIT_TEST) {...}
-   block will not be included in the final bundle when the
-   --ship flag is specified */
-declare const UNIT_TEST: boolean;

samples/react-async-await-sp-pnp-js/typings/tsd.d.ts

@@ -1 +0,0 @@
-/// <reference path="@ms/odsp.d.ts" />