Add reset cache button to advanced project configuration tab (#1781)

* Cache service can now clear entire cache

* Add UI for clearing browser storage cache

Added a button to the Advanced Configuration section to clear the
storage cache, and a short paragraph explaining what it does and why and
when one might want to do that.

* Make cursor be a pointer on cache reload button

* Refresh page after cache reload button clicked

Author: rmunn

src/angular-app/bellows/core/offline/comments-offline-cache.service.ts

@@ -13,6 +13,10 @@ export class CommentsOfflineCacheService {
     return this.offlineCache.deleteObjectInStore('comments', id);
   }
 
+  deleteAllComments(): angular.IPromise<any> {
+    return this.offlineCache.clearEntireStore('comments');
+  }
+
   getAllComments(): angular.IPromise<any> {
     return this.offlineCache.getAllFromStore('comments', this.sessionService.projectId());
   }

src/angular-app/bellows/core/offline/editor-offline-cache.service.ts

@@ -15,6 +15,10 @@ export class EditorOfflineCacheService {
     return this.offlineCache.deleteObjectInStore('entries', id);
   }
 
+  deleteAllEntries(): angular.IPromise<any> {
+    return this.offlineCache.clearEntireStore('entries');
+  }
+
   getAllEntries(): angular.IPromise<any> {
     return this.offlineCache.getAllFromStore('entries', this.sessionService.projectId());
   }

src/angular-app/bellows/core/offline/offline-cache.service.ts

@@ -20,6 +20,10 @@ export class OfflineCacheService {
     return this.$q.when(this.getStore(storeName).removeItem(key));
   }
 
+  clearEntireStore(storeName: string): angular.IPromise<any> {
+    return this.$q.when(this.getStore(storeName).clear());
+  }
+
   getAllFromStore(storeName: string, projectId?: string): angular.IPromise<any> {
     const results: any[] = [];
     return this.$q.when(this.getStore(storeName).iterate<any, any>(value => {

src/angular-app/languageforge/lexicon/settings/configuration/configuration-advanced-options.component.html

@@ -4,5 +4,16 @@ <h2>Caution!</h2>
         <p>Please do not change these settings unless asked to by tech support.</p>
         <label for="updateIntervalSeconds">Update interval (in seconds)</label>
         <input type="number" ng-model="$ctrl.accPollUpdateTimerSecondsDirty">
+        <br>
+        <p>If something went wrong with downloading the dictionary and it only loaded a partial copy (i.e. some dictionary entries are missing), the button below can let you reset the browser storage, removing the partial copy of the dictionary stored in your browser so that you can download it again.</p>
+        <p><strong>CAUTION:</strong> Make sure you are online before doing this, otherwise you won't be able to redownload the dictionary and you'll see an empty project until you can go online again.</p>
+        <button
+            class="btn btn-danger"
+            style="cursor: pointer"
+            type="button"
+            data-ng-click="$ctrl.resetLocalStorage()"
+            >
+            Reset browser storage
+    </button>
     </div>
 </div>

src/angular-app/languageforge/lexicon/settings/configuration/configuration-advanced-options.component.ts

@@ -1,12 +1,18 @@
 import * as angular from 'angular';
 import {LexiconConfig} from '../../shared/model/lexicon-config.model';
+import {CommentsOfflineCacheService} from '../../../../bellows/core/offline/comments-offline-cache.service';
+import {EditorOfflineCacheService} from '../../../../bellows/core/offline/editor-offline-cache.service';
 
 export class AdvancedOptionsConfigurationController implements angular.IController {
   accPollUpdateTimerSecondsDirty: number;
   accOnUpdate: (params: { $event: { pollUpdateTimerSecondsDirty: number } }) => void;
 
-  static $inject: string[] = ['$scope'];
-  constructor(private $scope: angular.IScope) {
+  static $inject: string[] = ['$scope', 'editorOfflineCache', 'commentsOfflineCache',];
+  constructor(
+    private $scope: angular.IScope,
+    private editorOfflineCache: EditorOfflineCacheService,
+    private commentsOfflineCache: CommentsOfflineCacheService,
+    ) {
     $scope.$watch(
       () => this.accPollUpdateTimerSecondsDirty,
       (newVal: number, oldVal: number) => {
@@ -18,6 +24,13 @@ export class AdvancedOptionsConfigurationController implements angular.IControll
     );
   }
 
+  async resetLocalStorage() {
+    await this.editorOfflineCache.deleteAllEntries();
+    await this.commentsOfflineCache.deleteAllComments();
+    window.location.hash = '#!/';
+    window.location.reload(); // To force the redownload
+  }
+
   $onChanges(changes: any) {
     const configChange = changes.accConfigPristine as angular.IChangesObject<LexiconConfig>;
     if (configChange != null && configChange.currentValue != null) {