From d2ab639716e93ebffac610c1d955269409efd536 Mon Sep 17 00:00:00 2001 From: Der_Googler <54764558+DerGoogler@users.noreply.github.com> Date: Thu, 19 Sep 2024 02:47:22 +0200 Subject: [PATCH] . --- src/external/telegram-pusher/App.tsx | 394 +++++++++++++++++++++++---- src/native/BuildConfig.ts | 4 +- src/native/Chooser.ts | 4 +- webpack.config.ts | 6 +- 4 files changed, 345 insertions(+), 63 deletions(-) diff --git a/src/external/telegram-pusher/App.tsx b/src/external/telegram-pusher/App.tsx index 1d9be6c9..9e1f0158 100644 --- a/src/external/telegram-pusher/App.tsx +++ b/src/external/telegram-pusher/App.tsx @@ -1,17 +1,37 @@ -import { TextField, Stack, Button, Box, ButtonGroup, Typography, MenuItem, Select, InputLabel, FormControl } from "@mui/material"; -import { Send, Add, Delete } from "@mui/icons-material"; +import { + TextField, + Stack, + Button, + Box, + ButtonGroup, + Typography, + MenuItem, + Select, + InputLabel, + FormControl, + ImageListItem, + ImageList, + Alert, + AlertTitle, + Card, + CardActions, + CardContent, +} from "@mui/material"; +import { Send, Add, Delete, Save } from "@mui/icons-material"; import React from "react"; import { useNativeStorage } from "@Hooks/useNativeStorage"; import { os } from "@Native/Os"; import { Toolbar } from "@Components/onsenui/Toolbar"; import { Page } from "@Components/onsenui/Page"; import { Chooser } from "@Native/Chooser"; +import { Image } from "@Components/dapi/Image"; const App: React.FC = () => { const [content, setContent] = useNativeStorage("tgs_content", ""); const [botToken, setBotToken] = useNativeStorage("tgs_bot_token", ""); const [chatId, setChatId] = useNativeStorage("tgs_chat_id", ""); + const [buttonsPresets, setButtonsPresets] = useNativeStorage("tgs_buttons_presets", []); const [buttons, setButtons] = useNativeStorage("tgs_buttons", [ [{ text: "📦 Download", url: "https://google.com" }], [ @@ -24,7 +44,8 @@ const App: React.FC = () => { const [newButtonText, setNewButtonText] = React.useState(""); const [newButtonUrl, setNewButtonUrl] = React.useState(""); const [selectedRow, setSelectedRow] = React.useState(0); - const [image, setImage] = React.useState(""); + const [images, setImages] = React.useState([]); + const [document, setDocument] = React.useState(null); const validBotToken = React.useMemo(() => { return botToken.length >= 43; @@ -67,6 +88,13 @@ const App: React.FC = () => { } }; + const saveButtonsPreset = () => { + setButtonsPresets((p) => [...p, buttons]); + }; + + const isMoreThanOneImage = React.useMemo(() => images.length > 1, [images]); + const isImage = React.useMemo(() => images.length !== 0, [images]); + const removeButton = (rowIndex, buttonIndex) => { const updatedButtons = buttons .map((row, i) => (i === rowIndex ? row.filter((_, j) => j !== buttonIndex) : row)) @@ -76,42 +104,73 @@ const App: React.FC = () => { }; const handleSave = React.useCallback(async () => { - if (botToken.length <= (43 || 45) || chatId.length <= 1) { + if (!(validBotToken || validBotToken)) { os.toast("Cannot send a message without Chat ID or Bot Token", Toast.LENGTH_SHORT); return; } - console.log(image); + const sendType = document ? "sendDocument" : isImage ? (isMoreThanOneImage ? "sendMediaGroup" : "sendPhoto") : "sendMessage"; + + const data = new FormData(); + + data.append("chat_id", chatId); + // data.append("disable_notification", "true"); + + // disable for meadia groups + if (!isMoreThanOneImage) { + data.append("parse_mode", "markdown"); + if (buttons) { + data.append( + "reply_markup", + JSON.stringify({ + inline_keyboard: buttons, + }) + ); + } + } + + if (isImage) { + if (images.length > 1) { + const mediaGroup = images.map((image, index) => ({ + type: "photo", + media: `attach://photo${index}`, // Reference to the appended Blob + caption: index === 0 ? content : undefined, // Optionally add caption only to the first image + })); + + // Append each image Blob to FormData with a unique name + images.forEach((image, index) => { + data.append(`photo${index}`, new Blob([image], { type: "image/png" }), `photo${index}.png`); + }); + + data.append("media", JSON.stringify(mediaGroup)); + } else { + data.append("caption", content); + data.append("photo", new Blob([images[0]], { type: "image/png" }), "photo.png"); + } + } else if (document) { + data.append("caption", content); + data.append("document", new Blob([document], { type: document.type }), document.name); + } else { + data.append("text", content); + } - const type = image ? "caption" : "text"; + data.append("disable_web_page_preview", "false"); try { - const response = await fetch(`https://api.telegram.org/bot${botToken}/sendMessage`, { + const response = await fetch(`https://api.telegram.org/bot${botToken}/${sendType}`, { method: "POST", - headers: { - "Content-Type": "application/json", - }, - body: JSON.stringify({ - chat_id: chatId, - [type]: content, - parse_mode: "Markdown", - photo: image, - disable_web_page_preview: false, - reply_markup: JSON.stringify({ - inline_keyboard: buttons || {}, - }), - }), + body: data, }); if (response.ok) { - os.toast("Message sent successfully", Toast.LENGTH_SHORT); + console.log("Message sent successfully"); } else { - os.toast("Error sending message: " + response.statusText, Toast.LENGTH_SHORT); + console.warn("Error sending message: " + response.statusText); } } catch (error) { - os.toast("Error sending message: " + (error as Error).message, Toast.LENGTH_SHORT); + console.warn("Error sending message: " + (error as Error).message); } - }, [botToken, chatId, content, buttons, image]); + }, [botToken, chatId, content, buttons, images]); const renderToolbar = () => { return ( @@ -164,6 +223,14 @@ const App: React.FC = () => { variant="filled" /> + + {isMoreThanOneImage && ( + + Warning + You're about to send a media group. Markdown and inline buttons are not available. + + )} + { }} multiline /> - {/* - - Image - - - - */} + + + Document + + + + + + + + + + + + + Images + + + + + {" "} + + + + {images.length !== 0 && ( + + {images.map((image, i) => ( + + + + ))} + + )} + + Buttons - + Choose Row