vbatts/ntfy
1
0
Fork 0
Code Pull requests Activity

Publish message button

Browse source
This commit is contained in:
Philipp Heckel 2022-04-03 22:58:44 -04:00
parent 7716b1e81e
commit 6f07944442
3 changed files with 15 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
web/src/components/App.js
View file

@ -65,6 +65,7 @@ const Layout = () => {
const params = useParams(); const params = useParams();
const [mobileDrawerOpen, setMobileDrawerOpen] = useState(false); const [mobileDrawerOpen, setMobileDrawerOpen] = useState(false);
const [notificationsGranted, setNotificationsGranted] = useState(notifier.granted()); const [notificationsGranted, setNotificationsGranted] = useState(notifier.granted());
const [sendDialogOpenMode, setSendDialogOpenMode] = useState("");
const users = useLiveQuery(() => userManager.all()); const users = useLiveQuery(() => userManager.all());
const subscriptions = useLiveQuery(() => subscriptionManager.all()); const subscriptions = useLiveQuery(() => subscriptionManager.all());
const newNotificationsCount = subscriptions?.reduce((prev, cur) => prev + cur.new, 0) || 0; const newNotificationsCount = subscriptions?.reduce((prev, cur) => prev + cur.new, 0) || 0;
@ -91,12 +92,17 @@ const Layout = () => {
mobileDrawerOpen={mobileDrawerOpen} mobileDrawerOpen={mobileDrawerOpen}
onMobileDrawerToggle={() => setMobileDrawerOpen(!mobileDrawerOpen)} onMobileDrawerToggle={() => setMobileDrawerOpen(!mobileDrawerOpen)}
onNotificationGranted={setNotificationsGranted} onNotificationGranted={setNotificationsGranted}
onPublishMessageClick={() => setSendDialogOpenMode(SendDialog.OPEN_MODE_DEFAULT)}
/> />
<Main> <Main>
<Toolbar/> <Toolbar/>
<Outlet context={{ subscriptions, selected }}/> <Outlet context={{ subscriptions, selected }}/>
</Main> </Main>
<Messaging selected={selected}/> <Messaging
selected={selected}
dialogOpenMode={sendDialogOpenMode}
onDialogOpenModeChange={setSendDialogOpenMode}
/>
</Box> </Box>
); );
} }
@ -125,17 +131,17 @@ const Main = (props) => {
const Messaging = (props) => { const Messaging = (props) => {
const [message, setMessage] = useState(""); const [message, setMessage] = useState("");
const [dialogKey, setDialogKey] = useState(0); const [dialogKey, setDialogKey] = useState(0);
const [dialogOpenMode, setDialogOpenMode] = useState("");
const dialogOpenMode = props.dialogOpenMode;
const subscription = props.selected; const subscription = props.selected;
const selectedTopicUrl = (subscription) ? topicUrl(subscription.baseUrl, subscription.topic) : ""; const selectedTopicUrl = (subscription) ? topicUrl(subscription.baseUrl, subscription.topic) : "";
const handleOpenDialogClick = () => { const handleOpenDialogClick = () => {
setDialogOpenMode(SendDialog.OPEN_MODE_DEFAULT); props.onDialogOpenModeChange(SendDialog.OPEN_MODE_DEFAULT);
}; };
const handleSendDialogClose = () => { const handleSendDialogClose = () => {
setDialogOpenMode(""); props.onDialogOpenModeChange("");
setDialogKey(prev => prev+1); setDialogKey(prev => prev+1);
}; };
@ -153,8 +159,8 @@ const Messaging = (props) => {
topicUrl={selectedTopicUrl} topicUrl={selectedTopicUrl}
message={message} message={message}
onClose={handleSendDialogClose} onClose={handleSendDialogClose}
onDragEnter={() => setDialogOpenMode(prev => (prev) ? prev : SendDialog.OPEN_MODE_DRAG)} // Only update if not already open onDragEnter={() => props.onDialogOpenModeChange(prev => (prev) ? prev : SendDialog.OPEN_MODE_DRAG)} // Only update if not already open
onResetOpenMode={() => setDialogOpenMode(SendDialog.OPEN_MODE_DEFAULT)} onResetOpenMode={() => props.onDialogOpenModeChange(SendDialog.OPEN_MODE_DEFAULT)}
/> />
</> </>
); );

2
web/src/components/Navigation.js
View file

@ -118,7 +118,7 @@ const NavList = (props) => {
<ListItemIcon><ArticleIcon/></ListItemIcon> <ListItemIcon><ArticleIcon/></ListItemIcon>
<ListItemText primary="Documentation"/> <ListItemText primary="Documentation"/>
</ListItemButton> </ListItemButton>
<ListItemButton onClick={() => setSubscribeDialogOpen(true)}> <ListItemButton onClick={() => props.onPublishMessageClick()}>
<ListItemIcon><Send/></ListItemIcon> <ListItemIcon><Send/></ListItemIcon>
<ListItemText primary="Publish message"/> <ListItemText primary="Publish message"/>
</ListItemButton> </ListItemButton>

4
web/src/components/SendDialog.js
View file

@ -150,11 +150,11 @@ const SendDialog = (props) => {
const fileSizeLimitReached = fileSizeLimit > 0 && file.size > fileSizeLimit; const fileSizeLimitReached = fileSizeLimit > 0 && file.size > fileSizeLimit;
const quotaReached = remainingBytes > 0 && file.size > remainingBytes; const quotaReached = remainingBytes > 0 && file.size > remainingBytes;
if (fileSizeLimitReached && quotaReached) { if (fileSizeLimitReached && quotaReached) {
return setAttachFileError(`exceeds ${formatBytes(fileSizeLimit)} file limit, quota reached: ${formatBytes(remainingBytes)} remaining`); return setAttachFileError(`exceeds ${formatBytes(fileSizeLimit)} file limit, and quota reached, ${formatBytes(remainingBytes)} remaining`);
} else if (fileSizeLimitReached) { } else if (fileSizeLimitReached) {
return setAttachFileError(`exceeds ${formatBytes(fileSizeLimit)} file limit`); return setAttachFileError(`exceeds ${formatBytes(fileSizeLimit)} file limit`);
} else if (quotaReached) { } else if (quotaReached) {
return setAttachFileError(`quota reached, only ${formatBytes(remainingBytes)} remaining`); return setAttachFileError(`quota reached, ${formatBytes(remainingBytes)} remaining`);
} }
setAttachFileError(""); setAttachFileError("");
} catch (e) { } catch (e) {