completely rearchitect toasts

src/view/com/util/Toast.web.tsx

@@ -2,12 +2,12 @@
  * Note: the dataSet properties are used to leverage custom CSS in public/index.html
  */
 
-import React, {useEffect, useState} from 'react'
+import {useEffect, useState} from 'react'
 import {Pressable, StyleSheet, Text, View} from 'react-native'
 import {
   FontAwesomeIcon,
-  FontAwesomeIconStyle,
-  Props as FontAwesomeProps,
+  type FontAwesomeIconStyle,
+  type Props as FontAwesomeProps,
 } from '@fortawesome/react-native-fontawesome'
 
 const DURATION = 3500
@@ -25,8 +25,7 @@ let toastTimeout: NodeJS.Timeout | undefined
 
 // components
 // =
-type ToastContainerProps = {}
-export const ToastContainer: React.FC<ToastContainerProps> = ({}) => {
+export function ToastContainer() {
   const [activeToast, setActiveToast] = useState<ActiveToast | undefined>()
   useEffect(() => {
     globalSetActiveToast = (t: ActiveToast | undefined) => {