From 861c742b3e0e3a3a568e78811a180d72438f987a Mon Sep 17 00:00:00 2001
From: Deluan <deluan@navidrome.org>
Date: Wed, 4 Nov 2020 19:29:55 -0500
Subject: [PATCH] Move notifications to the top

This avoids notifications getting covered by the player
---
 ui/src/layout/Layout.js       |  2 ++
 ui/src/layout/Login.js        |  4 ++--
 ui/src/layout/Notification.js | 11 +++++++++++
 3 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 ui/src/layout/Notification.js

diff --git a/ui/src/layout/Layout.js b/ui/src/layout/Layout.js
index 1df7c164..7a637508 100644
--- a/ui/src/layout/Layout.js
+++ b/ui/src/layout/Layout.js
@@ -4,6 +4,7 @@ import { Layout } from 'react-admin'
 import { makeStyles } from '@material-ui/core/styles'
 import Menu from './Menu'
 import AppBar from './AppBar'
+import Notification from './Notification'
 import themes from '../themes'
 
 const useStyles = makeStyles({
@@ -22,6 +23,7 @@ export default (props) => {
       menu={Menu}
       appBar={AppBar}
       theme={theme}
+      notification={Notification}
     />
   )
 }
diff --git a/ui/src/layout/Login.js b/ui/src/layout/Login.js
index 33c6ba69..808cbc85 100644
--- a/ui/src/layout/Login.js
+++ b/ui/src/layout/Login.js
@@ -10,9 +10,9 @@ import TextField from '@material-ui/core/TextField'
 import { createMuiTheme, makeStyles } from '@material-ui/core/styles'
 import { ThemeProvider } from '@material-ui/styles'
 import Logo from '../icons/android-icon-72x72.png'
+import { useLogin, useNotify, useTranslate } from 'react-admin'
 
-import { Notification, useLogin, useNotify, useTranslate } from 'react-admin'
-
+import Notification from './Notification'
 import LightTheme from '../themes/light'
 import config from '../config'
 import { clearQueue } from '../audioplayer'
diff --git a/ui/src/layout/Notification.js b/ui/src/layout/Notification.js
new file mode 100644
index 00000000..001d3fc0
--- /dev/null
+++ b/ui/src/layout/Notification.js
@@ -0,0 +1,11 @@
+import React from 'react'
+import { Notification as RANotification } from 'react-admin'
+
+const Notification = (props) => (
+  <RANotification
+    {...props}
+    anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
+  />
+)
+
+export default Notification