56 lines
2.0 KiB
JavaScript
56 lines
2.0 KiB
JavaScript
|
import * as React from 'react';
|
||
|
|
import Button from '@mui/material/Button';
|
||
|
|
import TextField from '@mui/material/TextField';
|
||
|
|
import Dialog from '@mui/material/Dialog';
|
||
|
|
import DialogActions from '@mui/material/DialogActions';
|
||
|
|
import DialogContent from '@mui/material/DialogContent';
|
||
|
|
import DialogContentText from '@mui/material/DialogContentText';
|
||
|
|
import DialogTitle from '@mui/material/DialogTitle';
|
||
|
|
import {useState} from "react";
|
||
|
|
import Subscription from "./Subscription";
|
||
|
|
|
||
|
|
const defaultBaseUrl = "https://ntfy.sh"
|
||
|
|
|
||
|
|
const AddDialog = (props) => {
|
||
|
|
const [topic, setTopic] = useState("");
|
||
|
|
const handleCancel = () => {
|
||
|
|
setTopic('');
|
||
|
|
props.onCancel();
|
||
|
|
}
|
||
|
|
const handleSubmit = () => {
|
||
|
|
const subscription = new Subscription(defaultBaseUrl, topic);
|
||
|
|
props.onSubmit(subscription);
|
||
|
|
setTopic('');
|
||
|
|
}
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<Dialog open={props.open} onClose={props.onClose}>
|
||
|
|
<DialogTitle>Subscribe to topic</DialogTitle>
|
||
|
|
<DialogContent>
|
||
|
|
<DialogContentText>
|
||
|
|
Topics may not be password-protected, so choose a name that's not easy to guess.
|
||
|
|
Once subscribed, you can PUT/POST notifications.
|
||
|
|
</DialogContentText>
|
||
|
|
<TextField
|
||
|
|
autoFocus
|
||
|
|
margin="dense"
|
||
|
|
id="name"
|
||
|
|
label="Topic name, e.g. phil_alerts"
|
||
|
|
value={topic}
|
||
|
|
onChange={ev => setTopic(ev.target.value)}
|
||
|
|
type="text"
|
||
|
|
fullWidth
|
||
|
|
variant="standard"
|
||
|
|
/>
|
||
|
|
</DialogContent>
|
||
|
|
<DialogActions>
|
||
|
|
<Button onClick={handleCancel}>Cancel</Button>
|
||
|
|
<Button onClick={handleSubmit} autoFocus disabled={topic === ""}>Subscribe</Button>
|
||
|
|
</DialogActions>
|
||
|
|
</Dialog>
|
||
|
|
</>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default AddDialog;
|