Fix UTF-8 issues in publish message dialog

This commit is contained in:
Philipp Heckel 2022-04-06 20:04:27 -04:00
parent 3f96fad7ce
commit 78a681f277
4 changed files with 987 additions and 1294 deletions

2243
web/package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -61,11 +61,9 @@ class Api {
* - https://bugzilla.mozilla.org/show_bug.cgi?id=1733755 * - https://bugzilla.mozilla.org/show_bug.cgi?id=1733755
* - https://gist.github.com/binwiederhier/627f146d1959799be207ad8c17a8f345 * - https://gist.github.com/binwiederhier/627f146d1959799be207ad8c17a8f345
*/ */
publishXHR(baseUrl, topic, body, headers, onProgress) { publishXHR(url, body, headers, onProgress) {
const url = topicUrl(baseUrl, topic);
const xhr = new XMLHttpRequest();
console.log(`[Api] Publishing message to ${url}`); console.log(`[Api] Publishing message to ${url}`);
const xhr = new XMLHttpRequest();
const send = new Promise(function (resolve, reject) { const send = new Promise(function (resolve, reject) {
xhr.open("PUT", url); xhr.open("PUT", url);
if (body.type) { if (body.type) {

View file

@ -80,7 +80,7 @@ const MessageBar = (props) => {
<TextField <TextField
autoFocus autoFocus
margin="dense" margin="dense"
placeholder="Message" placeholder="Type a message here"
type="text" type="text"
fullWidth fullWidth
variant="standard" variant="standard"

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, topicShortUrl, validTopic, validUrl} from "../app/utils"; import {basicAuth, formatBytes, maybeWithBasicAuth, topicShortUrl, topicUrl, validTopic, validUrl} 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";
@ -89,40 +89,38 @@ const SendDialog = (props) => {
}, [props.message]); }, [props.message]);
const handleSubmit = async () => { const handleSubmit = async () => {
const headers = {}; const url = new URL(topicUrl(baseUrl, topic));
if (title.trim()) { if (title.trim()) {
headers["X-Title"] = title.trim(); url.searchParams.append("title", title.trim());
} }
if (tags.trim()) { if (tags.trim()) {
headers["X-Tags"] = tags.trim(); url.searchParams.append("tags", tags.trim());
} }
if (priority && priority !== 3) { if (priority && priority !== 3) {
headers["X-Priority"] = priority.toString(); url.searchParams.append("priority", priority.toString());
} }
if (clickUrl.trim()) { if (clickUrl.trim()) {
headers["X-Click"] = clickUrl.trim(); url.searchParams.append("click", clickUrl.trim());
} }
if (attachUrl.trim()) { if (attachUrl.trim()) {
headers["X-Attach"] = attachUrl.trim(); url.searchParams.append("attach", attachUrl.trim());
} }
if (filename.trim()) { if (filename.trim()) {
headers["X-Filename"] = filename.trim(); url.searchParams.append("filename", filename.trim());
} }
if (email.trim()) { if (email.trim()) {
headers["X-Email"] = email.trim(); url.searchParams.append("email", email.trim());
} }
if (delay.trim()) { if (delay.trim()) {
headers["X-Delay"] = delay.trim(); url.searchParams.append("delay", delay.trim());
} }
if (attachFile && message.trim()) { if (attachFile && message.trim()) {
headers["X-Message"] = message.replaceAll("\n", "\\n").trim(); url.searchParams.append("message", message.replaceAll("\n", "\\n").trim());
} }
const body = (attachFile) ? attachFile : message; const body = (attachFile) ? attachFile : message;
try { try {
const user = await userManager.get(baseUrl); const user = await userManager.get(baseUrl);
if (user) { const headers = maybeWithBasicAuth({}, user);
headers["Authorization"] = basicAuth(user.username, user.password);
}
const progressFn = (ev) => { const progressFn = (ev) => {
if (ev.loaded > 0 && ev.total > 0) { if (ev.loaded > 0 && ev.total > 0) {
const percent = Math.round(ev.loaded * 100.0 / ev.total); const percent = Math.round(ev.loaded * 100.0 / ev.total);
@ -131,7 +129,7 @@ const SendDialog = (props) => {
setStatus(`Uploading ...`); setStatus(`Uploading ...`);
} }
}; };
const request = api.publishXHR(baseUrl, topic, body, headers, progressFn); const request = api.publishXHR(url, body, headers, progressFn);
setActiveRequest(request); setActiveRequest(request);
await request; await request;
if (!publishAnother) { if (!publishAnother) {
@ -262,7 +260,7 @@ const SendDialog = (props) => {
<TextField <TextField
margin="dense" margin="dense"
label="Message" label="Message"
placeholder="Type the main message body here." placeholder="Type a message here"
value={message} value={message}
onChange={ev => setMessage(ev.target.value)} onChange={ev => setMessage(ev.target.value)}
disabled={disabled} disabled={disabled}