feat(editor): preguntar al restaurar borrador

no lo pude testear por el problema que tuve

app/assets/stylesheets/editor.scss

@@ -33,6 +33,9 @@
 		background: white;
 	}
 
+	.editor-toolbar-aviso-guardado {
+		display: none;
+	}
 	.editor-aviso-word {
 		display: none;
 		position: initial; /* evitar que tape el texto */

app/javascript/editor/editor.ts

@@ -1,4 +1,4 @@
-import { storeContent, restoreContent, forgetContent } from 'editor/storage'
+import { storeContent, restoreContent, hasContent, forgetContent } from 'editor/storage'
 import { isDirectChild, moveChildren, safeGetSelection, safeGetRangeAt, setAuxiliaryToolbar, parentBlockNames } from 'editor/utils'
 import { types, getValidChildren, getType } from 'editor/types'
 import { setupButtons as setupMarksButtons } from 'editor/types/marks'
@@ -182,6 +182,10 @@ export interface Editor {
 	},
 	contentEl: HTMLElement,
 	wordAlertEl: HTMLElement,
+	guardado: {
+		alertEl: HTMLElement,
+		restoreEl: HTMLButtonElement,
+	},
 	htmlEl: HTMLTextAreaElement,
 }
 
@@ -219,6 +223,10 @@ function setupEditor (editorEl: HTMLElement): void {
 		},
 		contentEl: getSel(editorEl, '.editor-content'),
 		wordAlertEl: getSel(editorEl, '.editor-aviso-word'),
+		guardado: {
+			alertEl: getSel(editorEl, '.editor-toolbar-aviso-guardado'),
+			restoreEl: getSel(editorEl, '[data-editor-button=restore]'),
+		},
 		htmlEl: getSel(editorEl, 'textarea'),
 	}
 	console.debug('iniciando editor', editor)
@@ -228,7 +236,13 @@ function setupEditor (editorEl: HTMLElement): void {
 	// después o la versión local es la última.
 	//
 	// TODO: Preguntar si se lo quiere recuperar.
-	restoreContent(editor)
+	if (hasContent(editor)) {
+		editor.guardado.alertEl.style.display = 'block'
+		editor.guardado.restoreEl.addEventListener('click', () => {
+			restoreContent(editor)
+			editor.guardado.alertEl.style.display = 'none'
+		})
+	}
 
 	// Word alert
 	editor.contentEl.addEventListener('paste', () => {

app/javascript/editor/storage.ts

@@ -22,6 +22,10 @@ export function storeContent (editor: Editor): void {
 	window.localStorage.setItem(getStorageKey(editor), editor.contentEl.innerHTML)
 }
 
+export function hasContent (editor: Editor): boolean {
+	return !!window.localStorage.getItem(getStorageKey(editor))
+}
+
 export function restoreContent (editor: Editor): void {
 	const content = window.localStorage.getItem(getStorageKey(editor))
 

app/views/posts/attributes/_content.haml

@@ -19,6 +19,10 @@
 
       TODO: Eliminar todo el espacio en blanco para minificar HTML
     .editor-toolbar{ style: 'z-index: 1' }
+      .editor-toolbar-aviso-guardado.alert.alert-primary
+        %p= t('editor.saved.alert')
+        %button.btn{ type: 'button', data: { 'editor_button': 'restore' } }= t('editor.saved.restore')
+
       .editor-primary-toolbar.scrollbar-black
         %button.btn{ type: 'button', title: t('editor.multimedia'), data: { editor_button: 'multimedia' } }>
           %i.fa.fa-fw.fa-upload>

config/locales/en.yml

@@ -604,6 +604,9 @@ en:
     url: Address
     more: More heading levels
     word: "If you're pasting from an hegemonic word processor, please be patient with us, it's not always simple to recover the whole format :)"
+    saved:
+      alert: "You have a draft of the article saved, do you want to restore it?"
+      restore: "Restore draft"
   email_address:
     address_unknown: "the address is unknown"
     domain_does_not_accept_email: "this domain is not configured to accept email"

config/locales/es.yml

@@ -617,6 +617,10 @@ es:
     url: Dirección
     more: Más niveles de título
     word: "Si estás pegando texto desde un hegemónico editor de texto que empieza con W, por favor tenenos paciencia, no siempre es simple recuperar y respetar todo el formato :)"
+    saved:
+      alert: "Tenés un borrador del artículo guardado, ¿querés restaurarlo?"
+      restore: "Restaurar artículo"
+
   email_address:
     address_unknown: "la dirección es desconocida"
     domain_does_not_accept_email: "el nombre de dominio no acepta correo"