Added a 'Save and Preview' button and made the 'Save' button fire an alert when successful and reload the page so changes are reflected.

lektor/admin/static/js/components/SlideDialog.jsx

@@ -28,12 +28,14 @@ class SlideDialog extends Component {
     if (event.which === 27 && this.props.closeOnEscape) {
       event.preventDefault()
       dialogSystem.dismissDialog()
+      window.location.reload()
     }
   }
 
   _onCloseClick (event) {
     event.preventDefault()
     dialogSystem.dismissDialog()
+    window.location.reload()
   }
 
   render () {

lektor/admin/static/js/dialogs/successDialog.jsx

@@ -0,0 +1,38 @@
+'use strict'
+
+import PropTypes from 'prop-types'
+import React from 'react'
+import RecordComponent from '../components/RecordComponent'
+import SlideDialog from '../components/SlideDialog'
+import dialogSystem from '../dialogSystem'
+import i18n from '../i18n'
+
+class SuccessDialog extends RecordComponent {
+  onClose () {
+    dialogSystem.dismissDialog()
+    window.location.reload()
+  }
+
+  render () {
+    return (
+      <SlideDialog
+        hasCloseButton
+        closeOnEscape        
+        title={i18n.trans('SUCCESS')}>
+        <p>
+          {this.props.message}
+        </p>
+        <div className='actions'>
+          <button type='submit' className='btn btn-primary'
+            onClick={this.onClose.bind(this)}>{i18n.trans('CLOSE')}</button>
+        </div>
+      </SlideDialog>
+    )
+  }
+}
+
+SuccessDialog.propTypes = {
+  message: PropTypes.string
+}
+
+export default SuccessDialog

lektor/admin/static/js/views/EditPage.jsx

@@ -5,6 +5,8 @@ import update from 'react-addons-update'
 import RecordEditComponent from '../components/RecordEditComponent'
 import utils from '../utils'
 import i18n from '../i18n'
+import dialogSystem from '../dialogSystem'
+import SuccessDialog from '../dialogs/successDialog'
 import widgets from '../widgets'
 import makeRichPromise from '../richPromise'
 
@@ -135,7 +137,27 @@ class EditPage extends RecordEditComponent {
     const newData = this.getValues()
     utils.apiRequest('/rawrecord', { json: {
       data: newData, path: path, alt: alt },
-    // eslint-disable-next-line indent
+      method: 'PUT' }, makeRichPromise)
+      .then((resp) => {
+        this.setState({
+          hasPendingChanges: false
+        }, () => {
+          this.transitionToAdminPage('.edit', {
+            path: this.getUrlRecordPathWithAlt(path)
+          })
+          dialogSystem.showDialog(SuccessDialog, {
+            message: 'Your changes have been saved!'
+          })
+        })
+      })
+  }
+
+  saveChangesAndPreview () {
+    const path = this.getRecordPath()
+    const alt = this.getRecordAlt()
+    const newData = this.getValues()
+    utils.apiRequest('/rawrecord', { json: {
+      data: newData, path: path, alt: alt },
       method: 'PUT' }, makeRichPromise)
       .then((resp) => {
         this.setState({
@@ -225,6 +247,8 @@ class EditPage extends RecordEditComponent {
         <div className='actions'>
           <button type='submit' className='btn btn-primary'
             onClick={this.saveChanges.bind(this)}>{i18n.trans('SAVE_CHANGES')}</button>
+          <button type='submit' className='btn btn-secondary'
+            onClick={this.saveChangesAndPreview.bind(this)}>{i18n.trans('SAVE_CHANGES_AND_PREVIEW')}</button>
           {deleteButton}
         </div>
       </div>

lektor/translations/en.json

@@ -56,6 +56,8 @@
   "EDIT_ATTACHMENT_METADATA_OF": "Edit Metadata of Attachment “%s”",
   "EDIT_PAGE_NAME": "Edit “%s”",
   "SAVE_CHANGES": "Save Changes",
+  "SAVE_CHANGES_AND_PREVIEW": "Save And Preview",
+  "EDIT_SAVED_SUCCESFULLY": "Your changes have been saved",
   "BROWSE_FS": "Browse in Filesystem",
   "BROWSE_FS_MAC": "Reveal in Finder",
   "BROWSE_FS_WINDOWS": "Open in Explorer",
@@ -118,6 +120,7 @@
   "FAILED_TO_INSTALL_SHELL_COMMANDS": "Failed to install shell commands.",
   "INSTALL_SHELL_COMMAND_SUCCESS": "Shell command was successfully installed.",
   "OPERATION_SUCCESS": "Success",
+  "SUCCESS": "Success",
   "YES": "Yes",
   "NO": "No",
   "OK": "OK",