vbatts/ntfy
1
0
Fork 0
Code Pull requests Activity

Merge pull request #533 from yardenshoham/generate-topic-name

Browse source 
Add "Generate topic name" button to "Subscribe to topic" dialog
This commit is contained in:
Philipp C. Heckel 2022-12-08 09:10:00 -05:00 committed by GitHub
commit eebd0f113b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 33 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
web/public/static/langs/en.json
View file

@ -129,6 +129,7 @@
"subscribe_dialog_subscribe_topic_placeholder": "Topic name, e.g. phil_alerts", "subscribe_dialog_subscribe_topic_placeholder": "Topic name, e.g. phil_alerts",
"subscribe_dialog_subscribe_use_another_label": "Use another server", "subscribe_dialog_subscribe_use_another_label": "Use another server",
"subscribe_dialog_subscribe_base_url_label": "Service URL", "subscribe_dialog_subscribe_base_url_label": "Service URL",
"subscribe_dialog_subscribe_button_generate_topic_name": "Generate topic name",
"subscribe_dialog_subscribe_button_cancel": "Cancel", "subscribe_dialog_subscribe_button_cancel": "Cancel",
"subscribe_dialog_subscribe_button_subscribe": "Subscribe", "subscribe_dialog_subscribe_button_subscribe": "Subscribe",
"subscribe_dialog_login_title": "Login required", "subscribe_dialog_login_title": "Login required",

47
web/src/components/SubscribeDialog.js
View file

@ -18,6 +18,18 @@ import {useTranslation} from "react-i18next";
const publicBaseUrl = "https://ntfy.sh"; const publicBaseUrl = "https://ntfy.sh";
const randomAlphanumericString = () => {
const alphabet = 'abcdefghijklmnopqrstuvwxyz0123456789';
const size = 16;
let id = '';
let i = size;
while (i--) {
id += alphabet[(Math.random() * alphabet.length) | 0];
}
return id;
}
const SubscribeDialog = (props) => { const SubscribeDialog = (props) => {
const [baseUrl, setBaseUrl] = useState(""); const [baseUrl, setBaseUrl] = useState("");
const [topic, setTopic] = useState(""); const [topic, setTopic] = useState("");
@ -104,21 +116,26 @@ const SubscribePage = (props) => {
<DialogContentText> <DialogContentText>
{t("subscribe_dialog_subscribe_description")} {t("subscribe_dialog_subscribe_description")}
</DialogContentText> </DialogContentText>
<TextField <div style={{display: 'flex'}} role="row">
autoFocus <TextField
margin="dense" autoFocus
id="topic" margin="dense"
placeholder={t("subscribe_dialog_subscribe_topic_placeholder")} id="topic"
value={props.topic} placeholder={t("subscribe_dialog_subscribe_topic_placeholder")}
onChange={ev => props.setTopic(ev.target.value)} value={props.topic}
type="text" onChange={ev => props.setTopic(ev.target.value)}
fullWidth type="text"
variant="standard" fullWidth
inputProps={{ variant="standard"
maxLength: 64, inputProps={{
"aria-label": t("subscribe_dialog_subscribe_topic_placeholder") maxLength: 64,
}} "aria-label": t("subscribe_dialog_subscribe_topic_placeholder")
/> }}
/>
<Button onClick={() => {props.setTopic(randomAlphanumericString())}} style={{flexShrink: "0", marginTop: "0.5em"}}>
{t("subscribe_dialog_subscribe_button_generate_topic_name")}
</Button>
</div>
<FormControlLabel <FormControlLabel
sx={{pt: 1}} sx={{pt: 1}}
control={ control={