wip

Author: AJIXuMuK

src/controls/siteBreadcrumb/SiteBreadcrumb.test.tsx

@@ -1,13 +1,13 @@
 /// <reference types="sinon" />
 
-import * as React from 'react';
-import { assert, expect } from 'chai';
-import { mount, ReactWrapper } from 'enzyme';
-import { SiteBreadcrumb } from './SiteBreadcrumb';
-import { ISiteBreadcrumbProps } from './ISiteBreadcrumb';
-import styles from './SiteBreadcrumb.module.scss';
-
-declare const sinon;
+// import * as React from 'react';
+// import { assert, expect } from 'chai';
+// import { mount, ReactWrapper } from 'enzyme';
+// import { SiteBreadcrumb } from './SiteBreadcrumb';
+// import { ISiteBreadcrumbProps } from './ISiteBreadcrumb';
+// import styles from './SiteBreadcrumb.module.scss';
+
+// declare const sinon;
 
 /**
  * DISCLAIMER: Currently does not work because of the following issue:

src/controls/siteBreadcrumb/SiteBreadcrumb.tsx

@@ -30,15 +30,15 @@ export class SiteBreadcrumb extends React.Component<ISiteBreadcrumbProps, ISiteB
   /**
    * React component lifecycle hook, runs after render
    */
-  public componentDidMount() {
+  public componentDidMount(): void {
     // Start generating the links for the breadcrumb
     this._generateLinks();
   }
 
   /**
    * Start the link generation for the breadcrumb
    */
-  private _generateLinks() {
+  private _generateLinks(): void {
     // Add the current site to the links list
     this._linkItems.push({
       text: this.props.context.pageContext.web.title,
@@ -76,7 +76,7 @@ export class SiteBreadcrumb extends React.Component<ISiteBreadcrumbProps, ISiteB
    * Retrieve the parent web URLs
    * @param webUrl Current URL of the web to process
    */
-  private _getParentWeb(webUrl: string) {
+  private _getParentWeb(webUrl: string): void {
     // Retrieve the parent web info
     const apiUrl = `${webUrl}/_api/web/parentweb?$select=Id,Title,ServerRelativeUrl`;
     this.props.context.spHttpClient.get(apiUrl, SPHttpClient.configurations.v1)
@@ -110,6 +110,9 @@ export class SiteBreadcrumb extends React.Component<ISiteBreadcrumbProps, ISiteB
           // Set the current breadcrumb data which is already retrieved
           this._setBreadcrumbData();
         }
+      })
+      .catch(() => {
+        // no-op;
       });
   }
 

src/controls/sitePicker/SitePicker.tsx

@@ -103,13 +103,13 @@ export const SitePicker: React.FunctionComponent<ISitePickerProps> = (props: Rea
       if (existingIndex >= 0) {
         newSelectedSites.splice(existingIndex, 1);
       }
-      else {
+      else if (item.data) {
         newSelectedSites.push({
-          ...item.data!
+          ...item.data
         });
       }
     }
-    else {
+    else if (item.data) {
       newSelectedSites = [{
         ...item.data!
       }];
@@ -188,7 +188,7 @@ export const SitePicker: React.FunctionComponent<ISitePickerProps> = (props: Rea
     return <div className={styles.siteOption}>
       <div className={styles.siteOptionContent}>
         <span className={styles.siteOptionTitle}>{option.text}</span>
-        <span className={styles.siteOptionUrl}>{toRelativeUrl(option.data!.url)}</span>
+        <span className={styles.siteOptionUrl}>{toRelativeUrl(option.data ? option.data.url : '')}</span>
       </div>
     </div>;
   };
@@ -244,6 +244,9 @@ export const SitePicker: React.FunctionComponent<ISitePickerProps> = (props: Rea
       const copy = orderBy(newSites, [propOrderBy || 'title'], [isDesc ? 'desc' : 'asc']);
       setAllSites(copy);
       setIsLoading(false);
+    })
+    .catch(() => {
+      // no-op;
     });
 
   }, [context, isLoading, mode, limitToCurrentSiteCollection]);

src/controls/taxonomyPicker/ITermPicker.ts

@@ -54,11 +54,11 @@ export interface IPropertyFieldTermPickerProps {
    * Normally this function must be always defined with the 'this.onPropertyChange'
    * method of the web part object.
    */
-  onPropertyChange(propertyPath: string, oldValue: any, newValue: any): void;
+  onPropertyChange(propertyPath: string, oldValue: any, newValue: any): void; // eslint-disable-line @typescript-eslint/no-explicit-any
   /**
    * Parent Web Part properties
    */
-  properties: any;
+  properties: any; // eslint-disable-line @typescript-eslint/no-explicit-any
   /**
    * An UNIQUE key indicates the identity of this control
    */

src/controls/taxonomyPicker/TaxonomyPicker.tsx

@@ -69,8 +69,14 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
   /**
    * componentDidMount lifecycle hook
    */
-  public componentDidMount() {
-    this.validateTerms();
+  public componentDidMount(): void {
+    this.validateTerms()
+      .then(() => {
+        // no-op;
+      })
+      .catch(() => {
+        // no-op;
+      });
   }
 
   /**
@@ -82,7 +88,7 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
     });
   }
 
-  public UNSAFE_componentWillReceiveProps(nextProps: ITaxonomyPickerProps) {
+  public UNSAFE_componentWillReceiveProps(nextProps: ITaxonomyPickerProps): void {
     let newState: ITaxonomyPickerState | undefined;
     // Check if the initial values objects are not equal, if that is the case, data can be refreshed
     if (!isEqual(this.props.initialValues, nextProps.initialValues)) {
@@ -117,7 +123,7 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
       useSessionStorage
     } = this.props;
 
-    let isValidateOnLoad = validateOnLoad && initialValues && initialValues.length >= 1;
+    const isValidateOnLoad = validateOnLoad && initialValues && initialValues.length >= 1;
     if (isValidateOnLoad) {
 
       const notFoundTerms: string[] = [];
@@ -149,20 +155,27 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
    */
   private loadTermStores(): void {
     if (this.props.termActions && this.props.termActions.initialize) {
-      this.props.termActions.initialize(this.termsService);
-      // this.props.termActions.actions.forEach(x => {
-      //   x.initialize(this.termsService);
-      // });
+      this.props.termActions.initialize(this.termsService)
+        .then(() => {
+          // no-op;
+        })
+        .catch(() => {
+          // no-op;
+        });
     }
 
-    this.termsService.getAllTerms(this.props.termsetNameOrID, this.props.hideDeprecatedTags, this.props.hideTagsNotAvailableForTagging, this.props.useSessionStorage).then((response: ITermSet) => {
-      // Check if a response was retrieved
-      let termSetAndTerms = response ? response : null;
-      this.setState({
-        termSetAndTerms,
-        loaded: true
+    this.termsService.getAllTerms(this.props.termsetNameOrID, this.props.hideDeprecatedTags, this.props.hideTagsNotAvailableForTagging, this.props.useSessionStorage)
+      .then((response: ITermSet) => {
+        // Check if a response was retrieved
+        const termSetAndTerms = response ? response : null;
+        this.setState({
+          termSetAndTerms,
+          loaded: true
+        });
+      })
+      .catch(() => {
+        // no-op;
       });
-    });
   }
 
   /**
@@ -223,7 +236,13 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
     this.cancel = false;
     this.onClosePanel();
 
-    this.validate(this.state.activeNodes);
+    this.validate(this.state.activeNodes)
+      .then(() => {
+        // no-op;
+      })
+      .catch(() => {
+        // no-op;
+      });
   }
 
   /**
@@ -322,12 +341,18 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
  * Fires When Items Changed in TermPicker
  * @param node
  */
-  private termsFromPickerChanged(terms: IPickerTerms) {
+  private termsFromPickerChanged(terms: IPickerTerms): void {
     this.setState({
       activeNodes: terms
     });
 
-    this.validate(terms);
+    this.validate(terms)
+      .then(() => {
+        // no-op;
+      })
+      .catch(() => {
+        // no-op;
+      });
   }
 
   /**
@@ -389,14 +414,14 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
     return !errorMessage;
   }
 
-  private onNewTerm = (newLabel: string) => {
+  private onNewTerm = (newLabel: string): void => {
     this.props.onNewTerm(
-        {
-          key: EmptyGuid,
-          name: newLabel,
-          path: newLabel,
-          termSet: this.termsService.cleanGuid(this.props.termsetNameOrID)
-        }
+      {
+        key: EmptyGuid,
+        name: newLabel,
+        path: newLabel,
+        termSet: this.termsService.cleanGuid(this.props.termsetNameOrID)
+      }
     );
   }
 
@@ -410,9 +435,9 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
       const target: HTMLInputElement = event.target as HTMLInputElement;
       const targetValue = !!target ? target.value : null;
 
-      if(!!this.props.onGetErrorMessage && !!targetValue) {
-          await this.validateOnGetErrorMessage(targetValue);
-        } else {
+      if (!!this.props.onGetErrorMessage && !!targetValue) {
+        await this.validateOnGetErrorMessage(targetValue);
+      } else {
         if (!!targetValue) {
           this.invalidTerm = targetValue;
         }
@@ -442,7 +467,7 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
    * @param termSet
    * @param isChecked
    */
-  private termSetSelectedChange = (termSet: ITermSet, isChecked: boolean) => {
+  private termSetSelectedChange = (termSet: ITermSet, isChecked: boolean): void => {
     const ts: ITermSet = { ...termSet };
     // Clean /Guid.../ from the ID
     ts.Id = this.termsService.cleanGuid(ts.Id);

src/controls/taxonomyPicker/Term.tsx

@@ -17,7 +17,7 @@ export default class Term extends React.Component<ITermProps, ITermState> {
     super(props);
 
     // Check if current term is selected
-    let active = this.props.activeNodes.filter(item => item.key === this.props.term.Id);
+    const active = this.props.activeNodes.filter(item => item.key === this.props.term.Id);
 
     this.state = {
       selected: active.length > 0,
@@ -32,7 +32,7 @@ export default class Term extends React.Component<ITermProps, ITermState> {
   /**
    * Handle the checkbox change trigger
    */
-  private _handleChange(ev: React.FormEvent<HTMLElement>, isChecked: boolean) {
+  private _handleChange(ev: React.FormEvent<HTMLElement>, isChecked: boolean): void {
     this.setState({
       selected: isChecked
     });
@@ -44,10 +44,10 @@ export default class Term extends React.Component<ITermProps, ITermState> {
    * @param nextProps
    * @param nextContext
    */
-  public UNSAFE_componentWillReceiveProps?(nextProps: ITermProps, nextContext: any): void {
+  public UNSAFE_componentWillReceiveProps(nextProps: ITermProps, nextContext: any): void { // eslint-disable-line @typescript-eslint/no-explicit-any
     // If multi-selection is turned off, only a single term can be selected
     //if (!this.props.multiSelection) {
-      let active = nextProps.activeNodes.filter(item => item.key === this.props.term.Id);
+      const active = nextProps.activeNodes.filter(item => item.key === this.props.term.Id);
       this.setState ({
         selected: active.length > 0,
         termLabel: this.state.termLabel
@@ -58,7 +58,7 @@ export default class Term extends React.Component<ITermProps, ITermState> {
   /**
    * Get the right class name for the term
    */
-  private getClassName() {
+  private getClassName(): string {
     if (this.props.term.IsDeprecated) {
       return styles.termDisabled;
     }

src/controls/taxonomyPicker/TermParent.tsx

@@ -31,7 +31,7 @@ export default class TermParent extends React.Component<ITermParentProps, ITermP
   /**
    * componentWillMount
    */
-  public UNSAFE_componentWillMount() {
+  public UNSAFE_componentWillMount(): void {
     // fix term depth if anchroid for rendering
     if (this.props.anchorId)
     {
@@ -57,7 +57,7 @@ export default class TermParent extends React.Component<ITermParentProps, ITermP
   /**
    * Handle the click event: collapse or expand
    */
-  private _handleClick() {
+  private _handleClick(): void {
     this.setState({
       expanded: !this.state.expanded
     });
@@ -86,7 +86,7 @@ export default class TermParent extends React.Component<ITermParentProps, ITermP
     // Check if the terms have been loaded
     if (this.state.loaded) {
       if (this._terms.length > 0) {
-        let disabledPaths = [];
+        const disabledPaths = [];
         termElm = (
           <div style={styleProps}>
             {