1
0
Fork 0
forked from mirrors/ntfy

Split baseUrl and topic

This commit is contained in:
Philipp Heckel 2022-04-05 23:33:07 -04:00
parent 4a5f34801a
commit 83bb9951b0
3 changed files with 36 additions and 22 deletions

View file

@ -127,7 +127,7 @@ class Api {
if (response.status !== 200) { if (response.status !== 200) {
throw new Error(`Unexpected server response ${response.status}`); throw new Error(`Unexpected server response ${response.status}`);
} }
const stats = response.json(); const stats = await response.json();
console.log(`[Api] Stats`, stats); console.log(`[Api] Stats`, stats);
return stats; return stats;
} }

View file

@ -9,7 +9,6 @@ import SendIcon from "@mui/icons-material/Send";
import api from "../app/Api"; import api from "../app/Api";
import SendDialog from "./SendDialog"; import SendDialog from "./SendDialog";
import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp'; import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp';
import EmojiPicker from "./EmojiPicker";
import {Portal, Snackbar} from "@mui/material"; import {Portal, Snackbar} from "@mui/material";
const Messaging = (props) => { const Messaging = (props) => {
@ -18,7 +17,6 @@ const Messaging = (props) => {
const dialogOpenMode = props.dialogOpenMode; const dialogOpenMode = props.dialogOpenMode;
const subscription = props.selected; const subscription = props.selected;
const selectedTopicUrl = (subscription) ? topicUrl(subscription.baseUrl, subscription.topic) : "";
const handleOpenDialogClick = () => { const handleOpenDialogClick = () => {
props.onDialogOpenModeChange(SendDialog.OPEN_MODE_DEFAULT); props.onDialogOpenModeChange(SendDialog.OPEN_MODE_DEFAULT);
@ -40,7 +38,8 @@ const Messaging = (props) => {
<SendDialog <SendDialog
key={`sendDialog${dialogKey}`} // Resets dialog when canceled/closed key={`sendDialog${dialogKey}`} // Resets dialog when canceled/closed
openMode={dialogOpenMode} openMode={dialogOpenMode}
topicUrl={selectedTopicUrl} baseUrl={subscription?.baseUrl ?? window.location.origin}
topic={subscription?.topic ?? ""}
message={message} message={message}
onClose={handleSendDialogClose} onClose={handleSendDialogClose}
onDragEnter={() => props.onDialogOpenModeChange(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

View file

@ -18,7 +18,7 @@ import IconButton from "@mui/material/IconButton";
import InsertEmoticonIcon from '@mui/icons-material/InsertEmoticon'; import InsertEmoticonIcon from '@mui/icons-material/InsertEmoticon';
import {Close} from "@mui/icons-material"; import {Close} from "@mui/icons-material";
import MenuItem from "@mui/material/MenuItem"; import MenuItem from "@mui/material/MenuItem";
import {basicAuth, formatBytes, shortUrl, splitTopicUrl, validTopicUrl} from "../app/utils"; import {basicAuth, formatBytes, topicShortUrl, topicUrl, validTopicUrl} from "../app/utils";
import Box from "@mui/material/Box"; import Box from "@mui/material/Box";
import AttachmentIcon from "./AttachmentIcon"; import AttachmentIcon from "./AttachmentIcon";
import DialogFooter from "./DialogFooter"; import DialogFooter from "./DialogFooter";
@ -27,8 +27,10 @@ import userManager from "../app/UserManager";
import EmojiPicker from "./EmojiPicker"; import EmojiPicker from "./EmojiPicker";
const SendDialog = (props) => { const SendDialog = (props) => {
const [topicUrl, setTopicUrl] = useState(""); const [baseUrl, setBaseUrl] = useState("");
const [topic, setTopic] = useState("");
const [message, setMessage] = useState(""); const [message, setMessage] = useState("");
const [messageFocused, setMessageFocused] = useState(true);
const [title, setTitle] = useState(""); const [title, setTitle] = useState("");
const [tags, setTags] = useState(""); const [tags, setTags] = useState("");
const [priority, setPriority] = useState(3); const [priority, setPriority] = useState(3);
@ -71,21 +73,22 @@ const SendDialog = (props) => {
}, []); }, []);
useEffect(() => { useEffect(() => {
setTopicUrl(props.topicUrl); setBaseUrl(props.baseUrl);
setShowTopicUrl(props.topicUrl === "") setTopic(props.topic);
}, [props.topicUrl]); setShowTopicUrl(!props.baseUrl || !props.topic);
setMessageFocused(!!props.topic); // Focus message only if topic is set
}, [props.baseUrl, props.topic]);
useEffect(() => { useEffect(() => {
const valid = validTopicUrl(topicUrl) && !attachFileError; const valid = validTopicUrl(topicUrl(baseUrl, topic)) && !attachFileError;
setSendButtonEnabled(valid); setSendButtonEnabled(valid);
}, [topicUrl, attachFileError]); }, [baseUrl, topic, attachFileError]);
useEffect(() => { useEffect(() => {
setMessage(props.message); setMessage(props.message);
}, [props.message]); }, [props.message]);
const handleSubmit = async () => { const handleSubmit = async () => {
const { baseUrl, topic } = splitTopicUrl(topicUrl);
const headers = {}; const headers = {};
if (title.trim()) { if (title.trim()) {
headers["X-Title"] = title.trim(); headers["X-Title"] = title.trim();
@ -145,7 +148,6 @@ const SendDialog = (props) => {
const checkAttachmentLimits = async (file) => { const checkAttachmentLimits = async (file) => {
try { try {
const { baseUrl } = splitTopicUrl(topicUrl);
const stats = await api.userStats(baseUrl); const stats = await api.userStats(baseUrl);
const fileSizeLimit = stats.attachmentFileSizeLimit ?? 0; const fileSizeLimit = stats.attachmentFileSizeLimit ?? 0;
const remainingBytes = stats.visitorAttachmentBytesRemaining ?? 0; const remainingBytes = stats.visitorAttachmentBytesRemaining ?? 0;
@ -212,24 +214,37 @@ const SendDialog = (props) => {
onDragLeave={handleAttachFileDragLeave}/> onDragLeave={handleAttachFileDragLeave}/>
} }
<Dialog maxWidth="md" open={open} onClose={props.onCancel} fullScreen={fullScreen}> <Dialog maxWidth="md" open={open} onClose={props.onCancel} fullScreen={fullScreen}>
<DialogTitle>{topicUrl ? `Publish to ${shortUrl(topicUrl)}` : "Publish message"}</DialogTitle> <DialogTitle>{(baseUrl && topic) ? `Publish to ${topicShortUrl(baseUrl, topic)}` : "Publish message"}</DialogTitle>
<DialogContent> <DialogContent>
{dropZone && <DropBox/>} {dropZone && <DropBox/>}
{showTopicUrl && {showTopicUrl &&
<ClosableRow closable={!!props.topicUrl} disabled={disabled} onClose={() => { <ClosableRow closable={!!props.baseUrl && !!props.topic} disabled={disabled} onClose={() => {
setTopicUrl(props.topicUrl); setBaseUrl(props.baseUrl);
setTopic(props.topic);
setShowTopicUrl(false); setShowTopicUrl(false);
}}> }}>
<TextField <TextField
margin="dense" margin="dense"
label="Topic URL" label="Server URL"
value={topicUrl} placeholder="Server URL, e.g. https://example.com"
onChange={ev => setTopicUrl(ev.target.value)} value={baseUrl}
onChange={ev => setBaseUrl(ev.target.value)}
disabled={disabled}
type="url"
variant="standard"
sx={{flexGrow: 1, marginRight: 1}}
/>
<TextField
margin="dense"
label="Topic"
placeholder="Topic name, e.g. phil_alerts"
value={topic}
onChange={ev => setTopic(ev.target.value)}
disabled={disabled} disabled={disabled}
type="text" type="text"
variant="standard" variant="standard"
fullWidth autoFocus={!messageFocused}
required sx={{flexGrow: 1}}
/> />
</ClosableRow> </ClosableRow>
} }
@ -254,8 +269,8 @@ const SendDialog = (props) => {
type="text" type="text"
variant="standard" variant="standard"
rows={5} rows={5}
autoFocus={messageFocused}
fullWidth fullWidth
autoFocus
multiline multiline
/> />
<div style={{display: 'flex'}}> <div style={{display: 'flex'}}>