From 41d677570d61d717571895300ab831b4a98f974a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mehmet=20Mall=C4=B1?= <mehmet.malli@trendyol.com>
Date: Mon, 25 Apr 2022 18:01:37 +0300
Subject: [PATCH] Added anchorOrigin props to AlertDisplay
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Mehmet Mallı <mehmet.malli@trendyol.com>
Signed-off-by: Mehmet Mallı <mallimehmet@gmail.com>
Signed-off-by: Mehmet Mallı <mehmet.malli@trendyol.com>
---
 .../src/components/AlertDisplay/AlertDisplay.tsx     | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/core-components/src/components/AlertDisplay/AlertDisplay.tsx b/packages/core-components/src/components/AlertDisplay/AlertDisplay.tsx
index 5d90979557..6be2fcda49 100644
--- a/packages/core-components/src/components/AlertDisplay/AlertDisplay.tsx
+++ b/packages/core-components/src/components/AlertDisplay/AlertDisplay.tsx
@@ -31,10 +31,18 @@ import pluralize from 'pluralize';
  * Shown as SnackBar at the top of the page
  */
 // TODO: improve on this and promote to a shared component for use by all apps.
-export function AlertDisplay(_props: {}) {
+
+type Props = {
+  vertical?: 'top' | 'bottom';
+  horizontal?: 'left' | 'center' | 'right';
+}
+
+export function AlertDisplay(props: Props) {
   const [messages, setMessages] = useState<Array<AlertMessage>>([]);
   const alertApi = useApi(alertApiRef);
 
+  const { vertical = 'top', horizontal = 'center' } = props;
+
   useEffect(() => {
     const subscription = alertApi
       .alert$()
@@ -56,7 +64,7 @@ export function AlertDisplay(_props: {}) {
   };
 
   return (
-    <Snackbar open anchorOrigin={{ vertical: 'top', horizontal: 'center' }}>
+    <Snackbar open anchorOrigin={{ vertical, horizontal}}>
       <Alert
         action={
           <IconButton