Add a 'Clear Cache' button

This deletes the IndexedDB database and reloads the page.

This solely exists as a get-out clause for users in case the indexedDB instance
gets corrupted. Hopefully we won't ever need to point users to it.

src/components/structures/UserSettings.js

@@ -418,6 +418,14 @@ module.exports = React.createClass({
         Modal.createDialog(BugReportDialog, {});
     },
 
+    _onClearCacheClicked: function() {
+        MatrixClientPeg.get().store.deleteAllData().then(() => {
+            // forceReload=false since we don't really need new HTML/JS files
+            // we just need to restart the JS runtime.
+            window.location.reload(false);
+        });
+    },
+
     _onInviteStateChange: function(event, member, oldMembership) {
         if (member.userId === this._me && oldMembership === "invite") {
             this.forceUpdate();
@@ -690,6 +698,18 @@ module.exports = React.createClass({
         </div>;
     },
 
+    _renderClearCache: function() {
+        return <div>
+            <h3>Clear Cache</h3>
+                <div className="mx_UserSettings_section">
+                    <AccessibleButton className="mx_UserSettings_button danger"
+                        onClick={this._onClearCacheClicked}>
+                        Clear Cache (triggers page refresh)
+                    </AccessibleButton>
+                </div>
+        </div>;
+    },
+
     _renderBulkOptions: function() {
         let invitedRooms = MatrixClientPeg.get().getRooms().filter((r) => {
             return r.hasMembershipState(this._me, "invite");
@@ -913,6 +933,8 @@ module.exports = React.createClass({
                     </div>
                 </div>
 
+                {this._renderClearCache()}
+
                 {this._renderDeactivateAccount()}
 
                 </GeminiScrollbar>