Add input for AT toast testing

frontend/app/modules/toast/Toast.tsx

@@ -1,9 +1,11 @@
-import React from 'react'
+import React, { FC } from 'react'
+import { observer } from 'mobx-react'
 import { ToastContainer } from 'react-toastify'
-import { createGlobalStyle } from 'styled-components'
+import { createGlobalStyle, styled } from 'styled-components'
 import 'react-toastify/dist/ReactToastify.css'
+import { useStore } from '../../hooks/useStore'
 
-export const GlobalStyle = createGlobalStyle`
+const GlobalStyle = createGlobalStyle`
 .Toastify__toast-container--bottom-left{
   max-width: 360px;
   margin-left: 10px;
@@ -14,11 +16,27 @@ export const GlobalStyle = createGlobalStyle`
 }
 `
 
-const Toast = () => (
-  <>
-    <GlobalStyle />
-    <ToastContainer />
-  </>
-)
+const Input = styled.input`
+  border: 0;
+  padding: 0;
+  margin: 0;
+  display: block;
+  height: 1px;
+  max-height: 1px;
+  background: transparent;
+  color: transparent;
+`
+
+const Toast: FC = () => {
+  const { toastStore: store } = useStore()
+
+  return (
+    <>
+      <GlobalStyle />
+      <ToastContainer />
+      <Input value={store.lastText} id="toast-text" />
+    </>
+  )
+}
 
-export default Toast
+export default observer(Toast)

frontend/app/modules/toast/toast.store.ts

@@ -1,28 +1,33 @@
-import { toast, ToastPosition, TypeOptions } from 'react-toastify'
+import { toast, ToastPosition } from 'react-toastify'
 import { RootStore } from '../../store/rootStore'
-import ToastInner from './ToastInner'
+import { makeObservable, observable } from 'mobx'
 
 export class ToastStore {
   rootStore: RootStore
   isDarkTheme: boolean
+  @observable lastText: string
 
   constructor(rootStore: RootStore) {
+    makeObservable(this)
+
     this.rootStore = rootStore
     this.isDarkTheme = false
+    this.lastText = ''
   }
 
   setTheme(isDarkTheme: boolean) {
     this.isDarkTheme = isDarkTheme
   }
 
   showToast(text: string, timeout = 3000) {
+    this.lastText = text
+
     const toastOptions = {
       theme: this.isDarkTheme ? 'dark' : 'light',
       position: 'bottom-left' as ToastPosition,
       autoClose: timeout,
-      type: 'info' as TypeOptions,
     }
 
-    toast(ToastInner({ text }), toastOptions)
+    toast.info(text, toastOptions)
   }
 }

frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-feature-smartapp",
-  "version": "2.4.1",
+  "version": "2.4.2",
   "description": "SmartApp with all features",
   "main": "index.js",
   "scripts": {