From e4041516b2750f36996ffab388ee534b7b09c9b3 Mon Sep 17 00:00:00 2001
From: Peter Linnegan <plinnegan@baosystems.com>
Date: Fri, 11 Mar 2022 09:53:45 +0000
Subject: [PATCH] feat: keep user content when save fails due to being logged
 out

---
 src/modules/edit/edit.component.tsx           | 33 +++++++++++--------
 .../render/components/render.component.tsx    |  2 +-
 .../shared/components/LoggedOutMessage.tsx    |  9 +++--
 3 files changed, 26 insertions(+), 18 deletions(-)

diff --git a/src/modules/edit/edit.component.tsx b/src/modules/edit/edit.component.tsx
index ece3688..c7aa580 100644
--- a/src/modules/edit/edit.component.tsx
+++ b/src/modules/edit/edit.component.tsx
@@ -28,7 +28,8 @@ const styles = {
 class Edit extends React.Component<
     { enqueueSnackbar: any },
     {
-        loggedOut: boolean;
+        loggedOutOnEdit: boolean;
+        loggedOutOnSave: boolean;
         editedContent?: string;
     }
 > {
@@ -36,11 +37,12 @@ class Edit extends React.Component<
     constructor(props) {
         super(props);
         this.state = {
-            loggedOut: false
+            loggedOutOnEdit: false,
+            loggedOutOnSave: false,
         };
-        fetchContent().then((resp ) => {
+        fetchContent().then((resp) => {
             if (resp === loggedOut) {
-                this.setState({loggedOut: true})
+                this.setState({ loggedOutOnEdit: true, loggedOutOnSave: false });
             } else {
                 this.setState({
                     editedContent: resp,
@@ -52,7 +54,7 @@ class Edit extends React.Component<
                     // @ts-ignore
                     window.editor = this.editor;
                 }
-            } 
+            }
         });
     }
 
@@ -65,12 +67,12 @@ class Edit extends React.Component<
         saveContent(contentHook(this.state.editedContent))
             .then((resp) => {
                 if (resp.redirected === true && resp.url.includes('login.action')) {
-                    this.setState({loggedOut: true})
+                    this.setState({ loggedOutOnSave: true, loggedOutOnEdit: false });
                     this.props.enqueueSnackbar('Error: Logged out and cannot save');
                 } else {
                     this.props.enqueueSnackbar('Content saved');
+                    window.location.hash = '/';
                 }
-                window.location.hash = '/';
             })
             .catch((e) => {
                 this.props.enqueueSnackbar('Error: Cannot save');
@@ -78,28 +80,31 @@ class Edit extends React.Component<
     };
 
     render() {
-        if (this.state.loggedOut) {
-            return <LoggedOutMessage />
+        const {loggedOutOnEdit, loggedOutOnSave} = this.state
+        if (loggedOutOnEdit) {
+            return <LoggedOutMessage requestRefresh={true} />;
         }
         return (
             <React.Fragment>
-                <ReadmeLink/>
+                {loggedOutOnSave ? <LoggedOutMessage requestRefresh={false} /> : <ReadmeLink />}
                 <div style={styles.buttons}>
                     <ButtonStrip>
                         <Button onClick={this.saveChanges} primary dataTest={'save-button'}>
                             Save
                         </Button>
                         <Link to={`/`} style={styles.cancel}>
-                            <Button destructive dataTest={'cancel-button'}>Cancel</Button>
+                            <Button destructive dataTest={'cancel-button'}>
+                                Cancel
+                            </Button>
                         </Link>
                     </ButtonStrip>
                 </div>
-                <div style={styles.clear as any}/>
-                <div id='edit'/>
+                <div style={styles.clear as any} />
+                <div id="edit" />
             </React.Fragment>
         );
     }
-    componentWillUnmount(){
+    componentWillUnmount() {
         let editor = document.querySelector('.jodit-container');
         if (editor) editor.remove();
     }
diff --git a/src/modules/render/components/render.component.tsx b/src/modules/render/components/render.component.tsx
index cdef36e..d79fba7 100644
--- a/src/modules/render/components/render.component.tsx
+++ b/src/modules/render/components/render.component.tsx
@@ -46,7 +46,7 @@ export default class Render extends React.Component<any, {
         })
     }
     renderContent() {
-        if (this.state.loggedOut) return <LoggedOutMessage />
+        if (this.state.loggedOut) return <LoggedOutMessage requestRefresh={true} />
         if (this.state.loading) return <Loading/>
         if (!this.state.content||this.state.content.length===0) return <Typography>New Dashboard Information widget</Typography>;
         return <React.Fragment>
diff --git a/src/modules/shared/components/LoggedOutMessage.tsx b/src/modules/shared/components/LoggedOutMessage.tsx
index 0b93a57..ffe26a4 100644
--- a/src/modules/shared/components/LoggedOutMessage.tsx
+++ b/src/modules/shared/components/LoggedOutMessage.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 
-const LoggedOutMessage = () => {
+const LoggedOutMessage = ({requestRefresh}) => {
+    console.log(requestRefresh);
     const styles = {
         loginLink: {
             color: '#069',
@@ -10,11 +11,12 @@ const LoggedOutMessage = () => {
         },
         loggedOut: {
             fontFamily: 'Roboto',
+            float: 'left'
         },
     };
     const baseUrl = window.parent.location.origin;
     return (
-        <p style={styles.loggedOut}>
+        <p style={styles.loggedOut as any}>
             You are no longer logged in, please click{' '}
             <a
                 style={styles.loginLink}
@@ -24,7 +26,8 @@ const LoggedOutMessage = () => {
             >
                 here
             </a>{' '}
-            to open a new tab and login, then refresh the current page.
+            to open a new tab and login, then
+            {requestRefresh ? ' refresh the current page' : ' try saving again'}.
         </p>
     );
 };