Merge pull request #759 from gautamdsheth/feature/useLocalCaching

Feature - Added session storage as property

docs/documentation/docs/controls/TaxonomyPicker.md

@@ -171,6 +171,8 @@ The TaxonomyPicker control can be configured with the following properties:
 | errorMessage | string | no | Static error message displayed below the picker. Use `onGetErrorMessage` to dynamically change the error message displayed (if any) based on the current value. `errorMessage` and `onGetErrorMessage` are mutually exclusive (`errorMessage` takes precedence). |
 | onGetErrorMessage | (value: IPickerTerms) => string \| Promise&lt;string&gt; | no | The method is used to get the validation error message and determine whether the picker value is valid or not. Mutually exclusive with the static string `errorMessage` (it will take precedence over this).<br />When it returns string:<ul><li>If valid, it returns empty string.</li><li>If invalid, it returns the error message string to be shown below the picker.</li></ul><br />When it returns Promise&lt;string&gt;:<ul><li>The resolved value is display as error message.</li><li>The rejected, the value is thrown away.</li></ul> |
 | required | boolean | no | Specifies if to display an asterisk near the label. Note that error message should be specified in `onGetErrorMessage` or `errorMessage` |
+| useSessionStorage | boolean | no | Specify if the control uses session storage. Default is set to true for better performance. |
+
 
 Interface `IPickerTerm`
 

src/controls/taxonomyPicker/ITaxonomyPicker.ts

@@ -120,6 +120,12 @@ export interface ITaxonomyPickerProps  {
    * Note that error message should be specified in onGetErrorMessage
    */
   required?: boolean;
+
+  /**
+   * Specifies if you want to use session storage
+   * Default will be true
+   */
+  useSessionStorage?: boolean;
 }
 
 /**

src/controls/taxonomyPicker/TaxonomyPicker.tsx

@@ -112,7 +112,8 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
       hideTagsNotAvailableForTagging,
       initialValues,
       validateOnLoad,
-      termsetNameOrID
+      termsetNameOrID,
+      useSessionStorage
     } = this.props;
 
     let isValidateOnLoad = validateOnLoad && initialValues && initialValues.length >= 1;
@@ -121,7 +122,7 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
       const notFoundTerms: string[] = [];
       const notFoundTermIds: string[] = [];
 
-      const termSet = await this.termsService.getAllTerms(termsetNameOrID, hideDeprecatedTags, hideTagsNotAvailableForTagging);
+      const termSet = await this.termsService.getAllTerms(termsetNameOrID, hideDeprecatedTags, hideTagsNotAvailableForTagging, useSessionStorage);
       const allTerms = termSet.Terms;
 
       for (let i = 0, len = initialValues.length; i < len; i++) {
@@ -153,7 +154,7 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
       // });
     }
 
-    this.termsService.getAllTerms(this.props.termsetNameOrID, this.props.hideDeprecatedTags, this.props.hideTagsNotAvailableForTagging).then((response: ITermSet) => {
+    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({
@@ -167,7 +168,7 @@ export class TaxonomyPicker extends React.Component<ITaxonomyPickerProps, ITaxon
    * Force update of the taxonomy tree - required by term action in case the term has been added, deleted or moved.
    */
   private async updateTaxonomyTree(): Promise<void> {
-    const termSetAndTerms = await this.termsService.getAllTerms(this.props.termsetNameOrID, this.props.hideDeprecatedTags, this.props.hideTagsNotAvailableForTagging);
+    const termSetAndTerms = await this.termsService.getAllTerms(this.props.termsetNameOrID, this.props.hideDeprecatedTags, this.props.hideTagsNotAvailableForTagging, this.props.useSessionStorage);
 
     this.setState({
       termSetAndTerms

src/services/SPTermStorePickerService.ts

@@ -149,7 +149,7 @@ export default class SPTermStorePickerService {
    * Retrieve all terms for the given term set
    * @param termset
    */
-  public async getAllTerms(termset: string, hideDeprecatedTags?: boolean, hideTagsNotAvailableForTagging?: boolean): Promise<ITermSet> {
+  public async getAllTerms(termset: string, hideDeprecatedTags?: boolean, hideTagsNotAvailableForTagging?: boolean, useSessionStorage: boolean = true): Promise<ITermSet> {
     if (Environment.type === EnvironmentType.Local) {
       // If the running environment is local, load the data from the mock
       return this.getAllMockTerms();
@@ -168,7 +168,7 @@ export default class SPTermStorePickerService {
         }
       }
 
-      let childTerms = this.getTermsById(termsetId);
+      let childTerms = this.getTermsById(termsetId, useSessionStorage);
 
       if (childTerms) {
         return childTerms;
@@ -231,7 +231,7 @@ export default class SPTermStorePickerService {
               }
             }
             try {
-              if (window.sessionStorage) {
+              if (useSessionStorage && window.sessionStorage) {
                 window.sessionStorage.setItem(termsetId, JSON.stringify(termStoreResultTermSet));
               }
             } catch (error) {
@@ -287,16 +287,19 @@ export default class SPTermStorePickerService {
     }
   }
 
-  private getTermsById(termId) {
+  private getTermsById(termId, useSessionStorage: boolean = true) {
     try {
-      if (window.sessionStorage) {
+      if (useSessionStorage && window.sessionStorage) {
         let terms = window.sessionStorage.getItem(termId);
         if (terms) {
           return JSON.parse(terms);
         } else {
           return null;
         }
       }
+      else{
+        return null;
+      }
     } catch (error) {
       return null;
     }
@@ -315,22 +318,24 @@ export default class SPTermStorePickerService {
       // If the running environment is local, load the data from the mock
       return SPTermStoreMockHttpClient.searchTermsByName(searchText);
     } else {
-      let childTerms = this.getTermsById(termId);
+      const { useSessionStorage } = this.props;
+      let childTerms = this.getTermsById(termId, useSessionStorage);
       if (childTerms) {
         return this.searchTermsBySearchText(childTerms, searchText);
       }
       else {
         const {
           termsetNameOrID,
           hideDeprecatedTags,
-          hideTagsNotAvailableForTagging
+          hideTagsNotAvailableForTagging,          
         } = this.props;
 
         const terms = await this.getAllTermsByAnchorId(
           termsetNameOrID,
           termId,
           hideDeprecatedTags,
-          hideTagsNotAvailableForTagging);
+          hideTagsNotAvailableForTagging,
+          useSessionStorage);
 
         if (terms) {
           return this.searchTermsBySearchText(terms, searchText);
@@ -344,7 +349,7 @@ export default class SPTermStorePickerService {
   /**
    * Retrieve all terms for the given term set and anchorId
    */
-  public async getAllTermsByAnchorId(termsetNameOrID: string, anchorId: string, hideDeprecatedTags?: boolean, hideTagsNotAvailableForTagging?: boolean): Promise<IPickerTerm[]> {
+  public async getAllTermsByAnchorId(termsetNameOrID: string, anchorId: string, hideDeprecatedTags?: boolean, hideTagsNotAvailableForTagging?: boolean, useSessionStorage: boolean = true): Promise<IPickerTerm[]> {
 
     let returnTerms: IPickerTerm[] = [];
 
@@ -355,7 +360,7 @@ export default class SPTermStorePickerService {
         returnTerms.push(this.convertTermToPickerTerm(term));
       });
     } else {
-      const childTerms = this.getTermsById(anchorId);
+      const childTerms = this.getTermsById(anchorId, useSessionStorage);
       if (childTerms) {
         return childTerms;
       }
@@ -374,7 +379,7 @@ export default class SPTermStorePickerService {
           });
 
           try {
-            if (window.sessionStorage) {
+            if (useSessionStorage && window.sessionStorage) {
               window.sessionStorage.setItem(anchorId, JSON.stringify(returnTerms));
             }
           }