Fetch banner.txt from public URL instead of config (#1216)

src/components/common/motd-banner/motd-banner.tsx

@@ -1,41 +1,53 @@
 /*
- SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
-
- SPDX-License-Identifier: AGPL-3.0-only
+ * SPDX-FileCopyrightText: 2021 The HedgeDoc developers (see AUTHORS file)
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
  */
 
 import equal from 'fast-deep-equal'
-import React from 'react'
+import React, { useCallback } from 'react'
 import { Alert, Button } from 'react-bootstrap'
 import { useSelector } from 'react-redux'
-import { Link } from 'react-router-dom'
 import { ApplicationState } from '../../../redux'
 import { setBanner } from '../../../redux/banner/methods'
 import { ForkAwesomeIcon } from '../fork-awesome/fork-awesome-icon'
-import { ShowIf } from '../show-if/show-if'
+import { BANNER_LOCAL_STORAGE_KEY } from '../../application-loader/initializers/fetch-and-set-banner'
 
 export const MotdBanner: React.FC = () => {
   const bannerState = useSelector((state: ApplicationState) => state.banner, equal)
 
-  const dismissBanner = () => {
-    setBanner({ ...bannerState, show: false })
-    window.localStorage.setItem('bannerTimeStamp', bannerState.timestamp)
+  const dismissBanner = useCallback(() => {
+    if (bannerState.lastModified) {
+      window.localStorage.setItem(BANNER_LOCAL_STORAGE_KEY, bannerState.lastModified)
+    }
+    setBanner({
+      text: '',
+      lastModified: null
+    })
+  }, [bannerState])
+
+  if (bannerState.text === undefined) {
+    return null
+  }
+
+  if (!bannerState.text) {
+    return <span data-cy={ 'no-motd-banner' }/>
   }
 
   return (
-    <ShowIf condition={ bannerState.show }>
-      <Alert variant='primary' dir='auto' className='mb-0 text-center d-flex flex-row justify-content-center'>
-        <Link to='/s/banner' className='flex-grow-1 align-self-center text-black'>
-          { bannerState.text }
-        </Link>
-        <Button
-          variant='outline-primary'
-          size='sm'
-          className='mx-2'
-          onClick={ dismissBanner }>
-          <ForkAwesomeIcon icon='times'/>
-        </Button>
-      </Alert>
-    </ShowIf>
+    <Alert data-cy={ 'motd-banner' } variant="primary" dir="auto"
+           className="mb-0 text-center d-flex flex-row justify-content-center">
+      <span className="flex-grow-1 align-self-center text-black">
+        { bannerState.text }
+      </span>
+      <Button
+        data-cy={ 'motd-dismiss' }
+        variant="outline-primary"
+        size="sm"
+        className="mx-2"
+        onClick={ dismissBanner }>
+        <ForkAwesomeIcon icon="times"/>
+      </Button>
+    </Alert>
   )
 }