Upgrade project to SPFx 1.14.0

2022-04-06 01:15:55 +02:00 · 2022-04-06 01:15:55 +02:00 · 63403451ea
parent 972278fc23
commit 63403451ea
23 changed files with 6061 additions and 7528 deletions
--- a/samples/react-birthdays/.npmignore
+++ b/samples/react-birthdays/.npmignore
@ -0,0 +1,16 @@
+!dist
+config
+
+gulpfile.js
+
+release
+src
+temp
+
+tsconfig.json
+tslint.json
+
+*.log
+
+.yo-rc.json
+.vscode
--- a/samples/react-birthdays/.yo-rc.json
+++ b/samples/react-birthdays/.yo-rc.json
@ -1,6 +1,6 @@
 {
  "@microsoft/generator-sharepoint": {
-    "version": "1.8.2",
+    "version": "1.14.0",
    "libraryName": "happy-birdthay",
    "libraryId": "57890dd1-b655-4ec8-85ec-e47a9b696e7c",
    "environment": "spo",
--- a/samples/react-birthdays/README.md
+++ b/samples/react-birthdays/README.md
@ -42,7 +42,7 @@ userAADGUID| Text| no | required if used Azure Function to get Birthdays from AA
 Title| Text| true
 email| Text| true

-> **IMPORTANT:** After create a column Index on column "Birthday"
+> **IMPORTANT:** Create index on column "Birthday".

 ## Solution

@ -58,6 +58,7 @@ Version|Date|Comments
 1.0.0|November 6, 2018|Initial release
 1.1.0|July 23, 2019 | new version
 2.0.0|June 16, 2021 | Upgraded to SPFx 1.12.1
+3.0.0|April 6, 2022 | Upgraded to SPFx 1.14.0

 ## Minimal Path to Awesome

--- a/samples/react-birthdays/config/copy-assets.json
+++ b/samples/react-birthdays/config/copy-assets.json
@ -1,4 +0,0 @@
-{
-  "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/copy-assets.schema.json",
-  "deployCdnPath": "temp/deploy"
-}
--- a/samples/react-birthdays/config/deploy-azure-storage.json
+++ b/samples/react-birthdays/config/deploy-azure-storage.json
@ -1,6 +1,6 @@
 {
  "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/deploy-azure-storage.schema.json",
-  "workingDir": "./temp/deploy/",
+  "workingDir": "./release/assets/",
  "account": "<!-- STORAGE ACCOUNT NAME -->",
  "container": "happy-birdthay",
  "accessKey": "<!-- ACCESS KEY -->"
--- a/samples/react-birthdays/config/package-solution.json
+++ b/samples/react-birthdays/config/package-solution.json
@ -1,12 +1,38 @@
 {
  "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
  "solution": {
-    "name": "happy-birdthay-anniversary-client-side-solution",
+    "name": "happy-birthday-anniversary-client-side-solution",
    "id": "474e78f8-113f-4057-a9a9-640241137620",
-    "version": "2.0.0.0",
+    "version": "3.0.0.0",
    "includeClientSideAssets": true,
    "skipFeatureDeployment": true,
    "isDomainIsolated": false,
+    "developer": {
+      "name": "",
+      "privacyUrl": "",
+      "termsOfUseUrl": "",
+      "websiteUrl": "",
+      "mpnId": "Undefined-1.14.0"
+    },
+    "metadata": {
+      "shortDescription": {
+        "default": "birthdays-anniversay"
+      },
+      "longDescription": {
+        "default": "birthdays-anniversay"
+      },
+      "screenshotPaths": [],
+      "videoUrl": "",
+      "categories": []
+    },
+    "features": [
+      {
+        "title": "birthdays-anniversay Feature",
+        "description": "The feature that activates elements of the birthdays-anniversay solution.",
+        "id": "22eb0871-ae82-49b1-8d14-9dd9e1ec4d30",
+        "version": "3.0.0.0"
+      }
+    ],
    "webApiPermissionRequests": [
      {
        "resource": "Microsoft Graph",
--- a/samples/react-birthdays/config/serve.json
+++ b/samples/react-birthdays/config/serve.json
@ -2,9 +2,5 @@
  "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
  "port": 4321,
  "https": true,
-  "initialPage": "https://localhost:5432/workbench",
-  "api": {
-    "port": 5432,
-    "entryPath": "node_modules/@microsoft/sp-webpart-workbench/lib/api/"
-  }
+  "initialPage": "https://enter-your-SharePoint-site/_layouts/workbench.aspx"
 }
--- a/samples/react-birthdays/gulpfile.js
+++ b/samples/react-birthdays/gulpfile.js
@ -5,6 +5,13 @@ const gulp = require('gulp');
 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'));

-build.initialize(gulp);
+  return result;
+};
+
+build.initialize(require('gulp'));
--- a/samples/react-birthdays/package-lock.json
+++ b/samples/react-birthdays/package-lock.json
--- a/samples/react-birthdays/package.json
+++ b/samples/react-birthdays/package.json
@ -2,9 +2,7 @@
  "name": "birthdays-anniversay",
  "version": "2.0.0",
  "private": true,
-  "engines": {
-    "node": ">=0.10.0"
-  },
+  "main": "lib/index.js",
  "scripts": {
    "build": "gulp bundle",
    "clean": "gulp clean",
@ -12,11 +10,11 @@
  },
  "dependencies": {
    "@microsoft/loader-set-webpack-public-path": "^3.4.5",
-    "@microsoft/rush-stack-compiler-3.2": "^0.3.37",
-    "@microsoft/sp-core-library": "1.8.2",
-    "@microsoft/sp-lodash-subset": "1.8.2",
-    "@microsoft/sp-office-ui-fabric-core": "1.8.2",
-    "@microsoft/sp-webpart-base": "^1.12.1",
+    "@microsoft/sp-core-library": "1.14.0",
+    "@microsoft/sp-lodash-subset": "1.14.0",
+    "@microsoft/sp-office-ui-fabric-core": "1.14.0",
+    "@microsoft/sp-property-pane": "1.14.0",
+    "@microsoft/sp-webpart-base": "1.14.0",
    "@pnp/common": "^1.3.11",
    "@pnp/graph": "^1.3.11",
    "@pnp/logging": "^1.3.11",
@ -24,28 +22,25 @@
    "@pnp/sp": "^1.3.11",
    "@pnp/spfx-controls-react": "1.10.0",
    "@pnp/spfx-property-controls": "1.12.0",
-    "@types/es6-promise": "0.0.33",
-    "@types/react": "16.7.22",
-    "@types/react-dom": "16.8.0",
-    "@types/webpack-env": "1.13.1",
    "moment": "^2.29.1",
-    "office-ui-fabric-react": "6.143.0",
-    "react": "16.7.0",
-    "react-dom": "16.7.0"
+    "office-ui-fabric-react": "7.174.1",
+    "react": "16.13.1",
+    "react-dom": "16.13.1"
  },
  "devDependencies": {
-    "@microsoft/rush-stack-compiler-2.9": "0.7.7",
+    "@microsoft/rush-stack-compiler-3.9": "0.4.48",
    "@microsoft/set-webpack-public-path-plugin": "^2.4.0",
-    "@microsoft/sp-build-web": "^1.12.1",
-    "@microsoft/sp-module-interfaces": "1.8.2",
-    "@microsoft/sp-tslint-rules": "1.8.2",
-    "@microsoft/sp-webpart-workbench": "^1.12.1",
-    "@types/chai": "3.4.34",
-    "@types/mocha": "2.2.38",
+    "@microsoft/sp-build-web": "1.14.0",
+    "@microsoft/sp-module-interfaces": "1.14.0",
+    "@microsoft/sp-tslint-rules": "1.14.0",
+    "@types/es6-promise": "0.0.33",
+    "@types/react": "16.9.51",
+    "@types/react-dom": "16.9.8",
+    "@types/webpack-env": "1.13.1",
    "ajv": "~5.2.2",
-    "gulp": "~3.9.1"
+    "gulp": "4.0.2"
  },
  "resolutions": {
-    "@types/react": "16.7.22"
+    "@types/react": "16.8.8"
  }
 }
--- a/samples/react-birthdays/src/controls/happyBirthdayCard/HappyBirthdayCard.module.scss
+++ b/samples/react-birthdays/src/controls/happyBirthdayCard/HappyBirthdayCard.module.scss
@ -1,4 +1,4 @@
-@import '~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss';
+@import '~office-ui-fabric-react/dist/sass/References.scss';

 .happyBirdthay {
  .documentCard {
--- a/samples/react-birthdays/src/controls/happyBirthdayCard/HappyBirthdayCard.tsx
+++ b/samples/react-birthdays/src/controls/happyBirthdayCard/HappyBirthdayCard.tsx
@ -2,9 +2,8 @@ import * as React from 'react';
 import styles from './HappyBirthdayCard.module.scss';
 import { IHappyBirthdayCardProps } from './IHappyBirthdayCardProps';
 import { IHappyBirthdayCardPState } from './IHappyBirthdayCardState';
-import { escape } from '@microsoft/sp-lodash-subset';
-import { IPersonaSharedProps, Persona, PersonaSize, IPersonaProps, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
-import { Image, IImageProps, ImageFit } from 'office-ui-fabric-react/lib/Image';
+import { IPersonaSharedProps, Persona, PersonaSize, IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { Image, ImageFit } from 'office-ui-fabric-react/lib/Image';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import * as strings from 'ControlStrings';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
--- a/samples/react-birthdays/src/controls/happyBirthdayCard/IHappyBirthdayCardState.ts
+++ b/samples/react-birthdays/src/controls/happyBirthdayCard/IHappyBirthdayCardState.ts
@ -1,4 +1,3 @@
 export interface IHappyBirthdayCardPState {
-
  isBirthdayToday: boolean;
 }
--- a/samples/react-birthdays/src/controls/happybirthday/HappyBirthday.module.scss
+++ b/samples/react-birthdays/src/controls/happybirthday/HappyBirthday.module.scss
@ -1,4 +1,4 @@
-@import '~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss';
+@import '~office-ui-fabric-react/dist/sass/References.scss';

 .happyBirthday {
  .backgroundImgBallons{
--- a/samples/react-birthdays/src/controls/happybirthday/HappyBirthday.tsx
+++ b/samples/react-birthdays/src/controls/happybirthday/HappyBirthday.tsx
@ -2,29 +2,12 @@ import * as React from 'react';
 import styles from './HappyBirthday.module.scss';
 import { IHappyBirthdayProps } from './IHappyBirthdayProps';
 import { IHappbirthdayState } from './IHappybirthdayState';
-import { escape } from '@microsoft/sp-lodash-subset';
 import { IUser } from './IUser';
 import HappyBirdthayCard from '../../controls/happyBirthdayCard/HappyBirthdayCard';
 import * as moment from 'moment';
-import { Image, IImageProps, ImageFit } from 'office-ui-fabric-react/lib/Image';
-import { Label } from 'office-ui-fabric-react/lib/Label';
-import * as strings from 'ControlStrings';

 export class HappyBirthday extends React.Component<IHappyBirthdayProps, IHappbirthdayState> {

-  private _showBirthdays: boolean = true;
-  constructor(props: IHappyBirthdayProps) {
-    super(props);
-    console.log(props.imageTemplate);
-  }
-
-  public async componentDidMount() {
-  }
-
-  public componentDidUpdate(prevProps: IHappyBirthdayProps, prevState: IHappbirthdayState): void {
-  }
-
-  //
  public render(): React.ReactElement<IHappyBirthdayProps> {
    return (
      <div className={styles.happyBirthday}>
--- a/samples/react-birthdays/src/controls/happybirthday/IHappyBirthdayProps.ts
+++ b/samples/react-birthdays/src/controls/happybirthday/IHappyBirthdayProps.ts
@ -1,5 +1,5 @@
 import { IUser } from './IUser';
-import { WebPartContext } from "@microsoft/sp-webpart-base";
+
 export interface IHappyBirthdayProps {
  users: IUser[];
  imageTemplate: string;
--- a/samples/react-birthdays/src/services/SPService.ts
+++ b/samples/react-birthdays/src/services/SPService.ts
@ -1,13 +1,11 @@
-
 import { WebPartContext } from "@microsoft/sp-webpart-base";
-import { ApplicationCustomizerContext } from "@microsoft/sp-application-base";
-import { SPHttpClient, SPHttpClientResponse, MSGraphClient } from "@microsoft/sp-http";
+import { MSGraphClient } from "@microsoft/sp-http";
 import * as moment from 'moment';

 export class SPService {
  private graphClient: MSGraphClient = null;
  private  birthdayListTitle: string = "Birthdays";
-  constructor(private _context: WebPartContext | ApplicationCustomizerContext) {
+  constructor(private _context: WebPartContext) {

  }
  // Get Profiles
@ -21,9 +19,9 @@ export class SPService {
      _month = parseInt(moment().format('MM'));
      _day = parseInt(moment().format('DD'));
      _filter = "fields/Birthday ge '" + _today + "'";
-      // If we are in Dezember we have to look if there are birthday in January
+      // If we are in December we have to look if there are birthdays in January
      // we have to build a condition to select birthday in January based on number of upcommingDays
-      // we can not use the year for teste , the year is always 2000.
+      // we can not use the year for test, the year is always 2000.
      console.log(_month);
      _countdays = _day + upcommingDays;
      _f = 0;
--- a/samples/react-birthdays/src/webparts/Birthdays/BirthdaysWebPart.ts
+++ b/samples/react-birthdays/src/webparts/Birthdays/BirthdaysWebPart.ts
@ -13,7 +13,6 @@ import {
 import * as strings from 'BirthdaysWebPartStrings';
 import Birthdays from './components/Birthdays';
 import { IBirthdaysProps } from './components/IBirthdaysProps';
-import { Version } from '@microsoft/sp-core-library';

 export interface IBirthdaysWebPartProps {
  title: string;
--- a/samples/react-birthdays/src/webparts/Birthdays/components/Birthdays.module.scss
+++ b/samples/react-birthdays/src/webparts/Birthdays/components/Birthdays.module.scss
@ -1,4 +1,4 @@
-@import '~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss';
+@import '~office-ui-fabric-react/dist/sass/References.scss';

 .happyBirthday {
  .backgroundImgBallons{
--- a/samples/react-birthdays/src/webparts/Birthdays/components/Birthdays.tsx
+++ b/samples/react-birthdays/src/webparts/Birthdays/components/Birthdays.tsx
@ -1,14 +1,13 @@
 import * as React from 'react';
 import styles from './Birthdays.module.scss';
 import { IBirthdaysProps } from './IBirthdaysProps';
-import { escape } from '@microsoft/sp-lodash-subset';
 import { HappyBirthday, IUser } from '../../../controls/happybirthday';
 import * as moment from 'moment';
 import { IBirthdayState } from './IBirthdaysState';
 import SPService from '../../../services/SPService';
 import { WebPartTitle } from "@pnp/spfx-controls-react/lib/WebPartTitle";
 const imgBackgroundBallons: string = require('../../../../assets/ballonsBackgroud.png');
-import { Image, IImageProps, ImageFit } from 'office-ui-fabric-react/lib/Image';
+import { Image, ImageFit } from 'office-ui-fabric-react/lib/Image';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import * as strings from 'ControlStrings';

--- a/samples/react-birthdays/tsconfig.json
+++ b/samples/react-birthdays/tsconfig.json
@ -1,5 +1,5 @@
 {
-  "extends": "./node_modules/@microsoft/rush-stack-compiler-3.2/includes/tsconfig-web.json",
+  "extends": "./node_modules/@microsoft/rush-stack-compiler-3.9/includes/tsconfig-web.json",
  "compilerOptions": {
    "target": "es5",
    "forceConsistentCasingInFileNames": true,
@ -19,20 +19,17 @@
      "./node_modules/@microsoft"
    ],
    "types": [
-      "es6-promise",
      "webpack-env"
    ],
    "lib": [
      "es5",
      "dom",
-      "es2015.collection"
+      "es2015.collection",
+      "es2015.promise"
    ]
  },
  "include": [
-    "src/**/*.ts"
-  ],
-  "exclude": [
-    "node_modules",
-    "lib"
+    "src/**/*.ts",
+    "src/**/*.tsx"
  ]
 }
--- a/samples/react-birthdays/tslint.json
+++ b/samples/react-birthdays/tslint.json
@ -1,5 +1,5 @@
 {
-  "extends": "@microsoft/sp-tslint-rules/base-tslint.json",
+  "extends": "./node_modules/@microsoft/sp-tslint-rules/base-tslint.json",
  "rules": {
    "class-name": false,
    "export-name": false,
@ -17,7 +17,6 @@
    "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,