import * as React from 'react'; import {useState} from 'react'; import Navigation from "./Navigation"; import Paper from "@mui/material/Paper"; import IconButton from "@mui/material/IconButton"; import TextField from "@mui/material/TextField"; import SendIcon from "@mui/icons-material/Send"; import api from "../app/Api"; import PublishDialog from "./PublishDialog"; import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp'; import {Portal, Snackbar} from "@mui/material"; import {useTranslation} from "react-i18next"; const Messaging = (props) => { const [message, setMessage] = useState(""); const [dialogKey, setDialogKey] = useState(0); const dialogOpenMode = props.dialogOpenMode; const subscription = props.selected; const handleOpenDialogClick = () => { props.onDialogOpenModeChange(PublishDialog.OPEN_MODE_DEFAULT); }; const handleDialogClose = () => { props.onDialogOpenModeChange(""); setDialogKey(prev => prev+1); }; return ( <> {subscription && } props.onDialogOpenModeChange(prev => (prev) ? prev : PublishDialog.OPEN_MODE_DRAG)} // Only update if not already open onResetOpenMode={() => props.onDialogOpenModeChange(PublishDialog.OPEN_MODE_DEFAULT)} /> ); } const MessageBar = (props) => { const { t } = useTranslation(); const subscription = props.subscription; const [snackOpen, setSnackOpen] = useState(false); const handleSendClick = async () => { try { await api.publish(subscription.baseUrl, subscription.topic, props.message); } catch (e) { console.log(`[MessageBar] Error publishing message`, e); setSnackOpen(true); } props.onMessageChange(""); }; return ( theme.palette.mode === 'light' ? theme.palette.grey[100] : theme.palette.grey[900] }} > props.onMessageChange(ev.target.value)} onKeyPress={(ev) => { if (ev.key === 'Enter') { ev.preventDefault(); handleSendClick(); } }} /> setSnackOpen(false)} message={t("message_bar_error_publishing")} /> ); }; export default Messaging;