forked from mirrors/gecko-dev
		
	 a39846bf34
			
		
	
	
		a39846bf34
		
	
	
	
	
		
			
			backup-settings changes: - adds a new button in the Backup section of about:preferences / about:settings - shows the turn on dialog after pressing the button Turn on dialog behaviour (implemented): - pressing the cancel will close the dialog - pressing the confirm button will set the pref browser.backup.scheduled.enabled=true and close the dialog - pressing the passwords checkbox will show more options Turn on dialog behaviour (not implemented): - requiring a password for the backup (see Bug 1895981) - modifying the save location and showing a file picker (see Bug 1895943) Other changes: - tests for backup-settings and the turn on dialog - Storybook template for the turn on dialog Lo-fi Figma designs: https://www.figma.com/design/vNbX4c0ws0L1qr0mxpKvsW/Fx-Backup?node-id=147-4558&t=PYLY0QMN1n8GR9vW-0 Differential Revision: https://phabricator.services.mozilla.com/D209769
		
			
				
	
	
		
			115 lines
		
	
	
	
		
			3.4 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			115 lines
		
	
	
	
		
			3.4 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| /* This Source Code Form is subject to the terms of the Mozilla Public
 | |
|  * License, v. 2.0. If a copy of the MPL was not distributed with this
 | |
|  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 | |
| 
 | |
| import { html } from "chrome://global/content/vendor/lit.all.mjs";
 | |
| import { MozLitElement } from "chrome://global/content/lit-utils.mjs";
 | |
| 
 | |
| // eslint-disable-next-line import/no-unassigned-import
 | |
| import "chrome://browser/content/backup/turn-on-scheduled-backups.mjs";
 | |
| 
 | |
| /**
 | |
|  * The widget for managing the BackupService that is embedded within the main
 | |
|  * document of about:settings / about:preferences.
 | |
|  */
 | |
| export default class BackupSettings extends MozLitElement {
 | |
|   static properties = {
 | |
|     backupServiceState: { type: Object },
 | |
|   };
 | |
| 
 | |
|   static get queries() {
 | |
|     return {
 | |
|       scheduledBackupsButtonEl: "#backup-toggle-scheduled-button",
 | |
|       turnOnScheduledBackupsDialogEl: "#turn-on-scheduled-backups-dialog",
 | |
|       turnOnScheduledBackupsEl: "turn-on-scheduled-backups",
 | |
|     };
 | |
|   }
 | |
| 
 | |
|   /**
 | |
|    * Creates a BackupPreferences instance and sets the initial default
 | |
|    * state.
 | |
|    */
 | |
|   constructor() {
 | |
|     super();
 | |
|     this.backupServiceState = {
 | |
|       backupFilePath: "Documents", // TODO: make save location configurable (bug 1895943)
 | |
|       backupInProgress: false,
 | |
|       scheduledBackupsEnabled: false,
 | |
|     };
 | |
|   }
 | |
| 
 | |
|   /**
 | |
|    * Dispatches the BackupUI:InitWidget custom event upon being attached to the
 | |
|    * DOM, which registers with BackupUIChild for BackupService state updates.
 | |
|    */
 | |
|   connectedCallback() {
 | |
|     super.connectedCallback();
 | |
|     this.dispatchEvent(
 | |
|       new CustomEvent("BackupUI:InitWidget", { bubbles: true })
 | |
|     );
 | |
| 
 | |
|     this.addEventListener("scheduledBackupsCancel", this);
 | |
|     this.addEventListener("scheduledBackupsConfirm", this);
 | |
|   }
 | |
| 
 | |
|   handleEvent(event) {
 | |
|     switch (event.type) {
 | |
|       case "scheduledBackupsConfirm":
 | |
|         this.turnOnScheduledBackupsDialogEl.close();
 | |
|         this.dispatchEvent(
 | |
|           new CustomEvent("BackupUI:ScheduledBackupsConfirm", {
 | |
|             bubbles: true,
 | |
|             composed: true,
 | |
|           })
 | |
|         );
 | |
|         break;
 | |
|       case "scheduledBackupsCancel":
 | |
|         this.turnOnScheduledBackupsDialogEl.close();
 | |
|         break;
 | |
|     }
 | |
|   }
 | |
| 
 | |
|   handleShowScheduledBackups() {
 | |
|     if (
 | |
|       !this.backupServiceState.scheduledBackupsEnabled &&
 | |
|       this.turnOnScheduledBackupsDialogEl
 | |
|     ) {
 | |
|       this.turnOnScheduledBackupsDialogEl.showModal();
 | |
|     }
 | |
|   }
 | |
| 
 | |
|   turnOnScheduledBackupsDialogTemplate() {
 | |
|     return html`<dialog id="turn-on-scheduled-backups-dialog">
 | |
|       <turn-on-scheduled-backups
 | |
|         .backupFilePath=${this.backupServiceState.backupFilePath}
 | |
|       ></turn-on-scheduled-backups>
 | |
|     </dialog>`;
 | |
|   }
 | |
| 
 | |
|   render() {
 | |
|     return html`<link
 | |
|         rel="stylesheet"
 | |
|         href="chrome://browser/skin/preferences/preferences.css"
 | |
|       />
 | |
|       <link
 | |
|         rel="stylesheet"
 | |
|         href="chrome://browser/content/backup/backup-settings.css"
 | |
|       />
 | |
|       <div id="scheduled-backups">
 | |
|         <div>
 | |
|           Backup in progress:
 | |
|           ${this.backupServiceState.backupInProgress ? "Yes" : "No"}
 | |
|         </div>
 | |
| 
 | |
|         ${this.turnOnScheduledBackupsDialogTemplate()}
 | |
| 
 | |
|         <moz-button
 | |
|           id="backup-toggle-scheduled-button"
 | |
|           @click=${this.handleShowScheduledBackups}
 | |
|           data-l10n-id="settings-data-backup-toggle"
 | |
|         ></moz-button>
 | |
|       </div>`;
 | |
|   }
 | |
| }
 | |
| 
 | |
| customElements.define("backup-settings", BackupSettings);
 |