SendTimestamps (#891)
Co-authored-by: Tyler Flowers <contact@ggtylerr.dev>
This commit is contained in:
V
GitHub
parent
f75f887861
commit
88ad4f1b05
@ -18,12 +18,12 @@
|
||||
|
||||
import { Devs } from "@utils/constants";
|
||||
import definePlugin from "@utils/types";
|
||||
import { filters, findLazy, mapMangledModuleLazy } from "@webpack";
|
||||
import { filters, mapMangledModuleLazy } from "@webpack";
|
||||
import { ComponentDispatch } from "@webpack/common";
|
||||
|
||||
const ExpressionPickerState = mapMangledModuleLazy('name:"expression-picker-last-active-view"', {
|
||||
close: filters.byCode("activeView:null", "setState")
|
||||
});
|
||||
const ComponentDispatch = findLazy(m => m.emitter?._events?.INSERT_TEXT);
|
||||
|
||||
export default definePlugin({
|
||||
name: "GifPaste",
|
||||
|
||||
@ -24,13 +24,10 @@ import {
|
||||
ModalRoot,
|
||||
openModal,
|
||||
} from "@utils/modal";
|
||||
import { findLazy } from "@webpack";
|
||||
import { Button, Forms, React, Switch, TextInput } from "@webpack/common";
|
||||
import { Button, ComponentDispatch, Forms, React, Switch, TextInput } from "@webpack/common";
|
||||
|
||||
import { encrypt } from "../index";
|
||||
|
||||
const ComponentDispatch = findLazy(m => m.emitter?._events?.INSERT_TEXT);
|
||||
|
||||
function EncModal(props: ModalProps) {
|
||||
const [secret, setSecret] = React.useState("");
|
||||
const [cover, setCover] = React.useState("");
|
||||
|
||||
@ -19,10 +19,7 @@
|
||||
import { addButton, removeButton } from "@api/MessagePopover";
|
||||
import { Devs } from "@utils/constants";
|
||||
import definePlugin from "@utils/types";
|
||||
import { findLazy } from "@webpack";
|
||||
import { ChannelStore } from "@webpack/common";
|
||||
|
||||
const ComponentDispatch = findLazy(m => m.emitter?._events?.INSERT_TEXT);
|
||||
import { ChannelStore, ComponentDispatch } from "@webpack/common";
|
||||
|
||||
export default definePlugin({
|
||||
name: "QuickMention",
|
||||
|
||||
219
src/plugins/sendTimestamps/index.tsx
Normal file
219
src/plugins/sendTimestamps/index.tsx
Normal file
@ -0,0 +1,219 @@
|
||||
/*
|
||||
* Vencord, a modification for Discord's desktop app
|
||||
* Copyright (c) 2023 Vendicated and contributors
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation, either version 3 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import "./styles.css";
|
||||
|
||||
import { addPreSendListener, removePreSendListener } from "@api/MessageEvents";
|
||||
import { classNameFactory } from "@api/Styles";
|
||||
import { Devs } from "@utils/constants";
|
||||
import { getTheme, Theme } from "@utils/discord";
|
||||
import { Margins } from "@utils/margins";
|
||||
import { closeModal, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalProps, ModalRoot, openModal } from "@utils/modal";
|
||||
import definePlugin from "@utils/types";
|
||||
import { Button, ButtonLooks, ButtonWrapperClasses, ComponentDispatch, Forms, Parser, Select, Tooltip, useMemo, useState } from "@webpack/common";
|
||||
|
||||
function parseTime(time: string) {
|
||||
const cleanTime = time.slice(1, -1).replace(/(\d)(AM|PM)$/i, "$1 $2");
|
||||
|
||||
let ms = new Date(`${new Date().toDateString()} ${cleanTime}`).getTime() / 1000;
|
||||
if (isNaN(ms)) return time;
|
||||
|
||||
// add 24h if time is in the past
|
||||
if (Date.now() / 1000 > ms) ms += 86400;
|
||||
|
||||
return `<t:${Math.round(ms)}:t>`;
|
||||
}
|
||||
|
||||
const Formats = ["", "t", "T", "d", "D", "f", "F", "R"] as const;
|
||||
type Format = typeof Formats[number];
|
||||
|
||||
const cl = classNameFactory("vc-st-");
|
||||
|
||||
function PickerModal({ rootProps, close }: { rootProps: ModalProps, close(): void; }) {
|
||||
const [value, setValue] = useState<string>();
|
||||
const [format, setFormat] = useState<Format>("");
|
||||
const time = Math.round((new Date(value!).getTime() || Date.now()) / 1000);
|
||||
|
||||
const formatTimestamp = (time: number, format: Format) => `<t:${time}${format && `:${format}`}>`;
|
||||
|
||||
const [formatted, rendered] = useMemo(() => {
|
||||
const formatted = formatTimestamp(time, format);
|
||||
return [formatted, Parser.parse(formatted)];
|
||||
}, [time, format]);
|
||||
|
||||
return (
|
||||
<ModalRoot {...rootProps}>
|
||||
<ModalHeader className={cl("modal-header")}>
|
||||
<Forms.FormTitle tag="h2">
|
||||
Timestamp Picker
|
||||
</Forms.FormTitle>
|
||||
|
||||
<ModalCloseButton onClick={close} />
|
||||
</ModalHeader>
|
||||
|
||||
<ModalContent className={cl("modal-content")}>
|
||||
<input
|
||||
type="datetime-local"
|
||||
value={value}
|
||||
onChange={e => setValue(e.currentTarget.value)}
|
||||
style={{
|
||||
colorScheme: getTheme() === Theme.Light ? "light" : "dark",
|
||||
}}
|
||||
/>
|
||||
|
||||
<Forms.FormTitle>Timestamp Format</Forms.FormTitle>
|
||||
<Select
|
||||
options={
|
||||
Formats.map(m => ({
|
||||
label: m,
|
||||
value: m
|
||||
}))
|
||||
}
|
||||
isSelected={v => v === format}
|
||||
select={v => setFormat(v)}
|
||||
serialize={v => v}
|
||||
renderOptionLabel={o => (
|
||||
<div className={cl("format-label")}>
|
||||
{Parser.parse(formatTimestamp(time, o.value))}
|
||||
</div>
|
||||
)}
|
||||
renderOptionValue={() => rendered}
|
||||
/>
|
||||
|
||||
<Forms.FormTitle className={Margins.bottom8}>Preview</Forms.FormTitle>
|
||||
<Forms.FormText className={cl("preview-text")}>
|
||||
{rendered} ({formatted})
|
||||
</Forms.FormText>
|
||||
</ModalContent>
|
||||
|
||||
<ModalFooter>
|
||||
<Button
|
||||
onClick={() => {
|
||||
ComponentDispatch.dispatchToLastSubscribed("INSERT_TEXT", { rawText: formatted });
|
||||
close();
|
||||
}}
|
||||
>Insert</Button>
|
||||
</ModalFooter>
|
||||
</ModalRoot>
|
||||
);
|
||||
}
|
||||
|
||||
export default definePlugin({
|
||||
name: "SendTimestamps",
|
||||
description: "Send timestamps easily via chat box button & text shortcuts. Read the extended description!",
|
||||
authors: [Devs.Ven, Devs.Tyler],
|
||||
dependencies: ["MessageEventsAPI"],
|
||||
|
||||
patches: [
|
||||
{
|
||||
find: ".activeCommandOption",
|
||||
replacement: {
|
||||
match: /(.)\.push.{1,30}disabled:(\i),.{1,20}\},"gift"\)\)/,
|
||||
replace: "$&;try{$2||$1.push($self.chatBarIcon())}catch{}",
|
||||
}
|
||||
},
|
||||
],
|
||||
|
||||
start() {
|
||||
this.listener = addPreSendListener((_, msg) => {
|
||||
msg.content = msg.content.replace(/`\d{1,2}:\d{2} ?(?:AM|PM)?`/gi, parseTime);
|
||||
});
|
||||
},
|
||||
|
||||
stop() {
|
||||
removePreSendListener(this.listener);
|
||||
},
|
||||
|
||||
chatBarIcon() {
|
||||
return (
|
||||
<Tooltip text="Insert Timestamp">
|
||||
{({ onMouseEnter, onMouseLeave }) => (
|
||||
<div style={{ display: "flex" }}>
|
||||
<Button
|
||||
aria-haspopup="dialog"
|
||||
aria-label=""
|
||||
size=""
|
||||
look={ButtonLooks.BLANK}
|
||||
onMouseEnter={onMouseEnter}
|
||||
onMouseLeave={onMouseLeave}
|
||||
innerClassName={ButtonWrapperClasses.button}
|
||||
onClick={() => {
|
||||
const key = openModal(props => (
|
||||
<PickerModal
|
||||
rootProps={props}
|
||||
close={() => closeModal(key)}
|
||||
/>
|
||||
));
|
||||
}}
|
||||
className={cl("button")}
|
||||
>
|
||||
<div className={ButtonWrapperClasses.buttonWrapper}>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
role="img"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<g fill="none" fill-rule="evenodd">
|
||||
<path fill="currentColor" d="M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19a2 2 0 0 0 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7v-5z" />
|
||||
<rect width="24" height="24" />
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</Tooltip >
|
||||
);
|
||||
},
|
||||
|
||||
settingsAboutComponent() {
|
||||
const samples = [
|
||||
"12:00",
|
||||
"3:51",
|
||||
"17:59",
|
||||
"24:00",
|
||||
"12:00 AM",
|
||||
"0:13PM"
|
||||
].map(s => `\`${s}\``);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Forms.FormText>
|
||||
To quickly send send time only timestamps, include timestamps formatted as `HH:MM` (including the backticks!) in your message
|
||||
</Forms.FormText>
|
||||
<Forms.FormText>
|
||||
See below for examples.
|
||||
If you need anything more specific, use the Date button in the chat bar!
|
||||
</Forms.FormText>
|
||||
<Forms.FormText>
|
||||
Examples:
|
||||
<ul>
|
||||
{samples.map(s => (
|
||||
<li key={s}>
|
||||
<code>{s}</code> {"->"} {Parser.parse(parseTime(s))}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</Forms.FormText>
|
||||
</>
|
||||
);
|
||||
},
|
||||
});
|
||||
48
src/plugins/sendTimestamps/styles.css
Normal file
48
src/plugins/sendTimestamps/styles.css
Normal file
@ -0,0 +1,48 @@
|
||||
.vc-st-modal-content input {
|
||||
background-color: var(--input-background);
|
||||
color: var(--text-normal);
|
||||
width: 95%;
|
||||
padding: 8px 8px 8px 12px;
|
||||
margin: 1em 0;
|
||||
outline: none;
|
||||
border: 1px solid var(--input-background);
|
||||
border-radius: 4px;
|
||||
font-weight: 500;
|
||||
font-style: inherit;
|
||||
font-size: 100%;
|
||||
}
|
||||
|
||||
.vc-st-format-label,
|
||||
.vc-st-format-label span {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.vc-st-modal-content [class|="select"] {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.vc-st-modal-content [class|="select"] span {
|
||||
background-color: var(--input-background);
|
||||
}
|
||||
|
||||
.vc-st-modal-header {
|
||||
justify-content: space-between;
|
||||
align-content: center;
|
||||
}
|
||||
|
||||
.vc-st-modal-header h1 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.vc-st-modal-header button {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.vc-st-preview-text {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.vc-st-button {
|
||||
margin-right: 4px;
|
||||
transform: scale(1.1);
|
||||
}
|
||||
@ -258,6 +258,10 @@ export const Devs = /* #__PURE__*/ Object.freeze({
|
||||
name: "pylix",
|
||||
id: 492949202121261067n
|
||||
},
|
||||
Tyler: {
|
||||
name: "\\\\GGTyler\\\\",
|
||||
id: 143117463788191746n
|
||||
},
|
||||
RyanCaoDev: {
|
||||
name: "RyanCaoDev",
|
||||
id: 952235800110694471n,
|
||||
|
||||
@ -16,9 +16,12 @@
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import { findLazy } from "@webpack";
|
||||
import { ChannelStore, GuildStore, PrivateChannelsStore, SelectedChannelStore } from "@webpack/common";
|
||||
import { Guild } from "discord-types/general";
|
||||
|
||||
const PreloadedUserSettings = findLazy(m => m.ProtoClass?.typeName.endsWith("PreloadedUserSettings"));
|
||||
|
||||
export function getCurrentChannel() {
|
||||
return ChannelStore.getChannel(SelectedChannelStore.getChannelId());
|
||||
}
|
||||
@ -30,3 +33,12 @@ export function getCurrentGuild(): Guild | undefined {
|
||||
export function openPrivateChannel(userId: string) {
|
||||
PrivateChannelsStore.openPrivateChannel(userId);
|
||||
}
|
||||
|
||||
export const enum Theme {
|
||||
Dark = 1,
|
||||
Light = 2
|
||||
}
|
||||
|
||||
export function getTheme(): Theme {
|
||||
return PreloadedUserSettings.getCurrentValue()?.appearance?.theme;
|
||||
}
|
||||
|
||||
@ -23,6 +23,7 @@ import { _resolveReady, filters, findByCodeLazy, findByPropsLazy, findLazy, mapM
|
||||
import type * as t from "./types/utils";
|
||||
|
||||
export let FluxDispatcher: t.FluxDispatcher;
|
||||
export const ComponentDispatch = findLazy(m => m.emitter?._events?.INSERT_TEXT);
|
||||
|
||||
export const RestAPI: t.RestAPI = findByPropsLazy("getAPIBaseURL", "get");
|
||||
export const moment: typeof import("moment") = findByPropsLazy("parseTwoDigitYear");
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user