Some Fixes

This commit is contained in:
thororen1234 2025-01-29 08:14:41 -05:00
parent 8222eb430e
commit d9a61fd436
9 changed files with 73 additions and 32 deletions

View file

@ -8,12 +8,13 @@ import { classNameFactory } from "@api/Styles";
import { getIntlMessage, getUniqueUsername } from "@utils/discord"; import { getIntlMessage, getUniqueUsername } from "@utils/discord";
import { classes } from "@utils/misc"; import { classes } from "@utils/misc";
import { findByPropsLazy, findComponentByCodeLazy } from "@webpack"; import { findByPropsLazy, findComponentByCodeLazy } from "@webpack";
import { Avatar, ChannelStore, ContextMenuApi, Dots, GuildStore, PresenceStore, ReadStateStore, Text, TypingStore, useDrag, useDrop, useRef, UserStore, useStateFromStores } from "@webpack/common"; import { Avatar, ChannelStore, ContextMenuApi, GuildStore, PresenceStore, ReadStateStore, Text, TypingStore, useDrag, useDrop, useRef, UserStore, useStateFromStores } from "@webpack/common";
import { Channel, Guild, User } from "discord-types/general"; import { Channel, Guild, User } from "discord-types/general";
import { ChannelTabsProps, CircleQuestionIcon, closeTab, isTabSelected, moveDraggedTabs, moveToTab, openedTabs, settings } from "../util"; import { ChannelTabsProps, CircleQuestionIcon, closeTab, isTabSelected, moveDraggedTabs, moveToTab, openedTabs, settings } from "../util";
import { TabContextMenu } from "./ContextMenus"; import { TabContextMenu } from "./ContextMenus";
const ThreeDots = findComponentByCodeLazy(".dots,", "dotRadius:");
const { getBadgeWidthForValue } = findByPropsLazy("getBadgeWidthForValue"); const { getBadgeWidthForValue } = findByPropsLazy("getBadgeWidthForValue");
const dotStyles = findByPropsLazy("numberBadge", "textBadge"); const dotStyles = findByPropsLazy("numberBadge", "textBadge");
@ -52,7 +53,7 @@ const ChannelIcon = ({ channel }: { channel: Channel; }) =>
function TypingIndicator({ isTyping }: { isTyping: boolean; }) { function TypingIndicator({ isTyping }: { isTyping: boolean; }) {
return isTyping return isTyping
? <Dots dotRadius={3} themed={true} className={cl("typing-indicator")} /> ? <ThreeDots dotRadius={3} themed={true} className={cl("typing-indicator")} />
: null; : null;
} }

View file

@ -8,7 +8,7 @@ import { BadgeUserArgs, ProfileBadge } from "@api/Badges";
import ErrorBoundary from "@components/ErrorBoundary"; import ErrorBoundary from "@components/ErrorBoundary";
import { Devs } from "@utils/constants"; import { Devs } from "@utils/constants";
import { Margins } from "@utils/margins"; import { Margins } from "@utils/margins";
import { Modals, ModalSize, openModal } from "@utils/modal"; import { ModalContent, ModalHeader, ModalRoot, ModalSize, openModal } from "@utils/modal";
import definePlugin from "@utils/types"; import definePlugin from "@utils/types";
import { Button, Flex, Forms, RelationshipStore } from "@webpack/common"; import { Button, Flex, Forms, RelationshipStore } from "@webpack/common";
@ -81,8 +81,8 @@ const ranks: rankInfo[] =
function openRankModal(rank: rankInfo) { function openRankModal(rank: rankInfo) {
openModal(props => ( openModal(props => (
<ErrorBoundary> <ErrorBoundary>
<Modals.ModalRoot {...props} size={ModalSize.DYNAMIC}> <ModalRoot {...props} size={ModalSize.DYNAMIC}>
<Modals.ModalHeader> <ModalHeader>
<Flex style={{ width: "100%", justifyContent: "center" }}> <Flex style={{ width: "100%", justifyContent: "center" }}>
<Forms.FormTitle <Forms.FormTitle
tag="h2" tag="h2"
@ -95,16 +95,16 @@ function openRankModal(rank: rankInfo) {
{rank.title} {rank.title}
</Forms.FormTitle> </Forms.FormTitle>
</Flex> </Flex>
</Modals.ModalHeader> </ModalHeader>
<Modals.ModalContent> <ModalContent>
<div style={{ padding: "1em", textAlign: "center" }}> <div style={{ padding: "1em", textAlign: "center" }}>
<rank.assetSVG height="150px"></rank.assetSVG> <rank.assetSVG height="150px"></rank.assetSVG>
<Forms.FormText className={Margins.top16}> <Forms.FormText className={Margins.top16}>
{rank.description} {rank.description}
</Forms.FormText> </Forms.FormText>
</div> </div>
</Modals.ModalContent> </ModalContent>
</Modals.ModalRoot> </ModalRoot>
</ErrorBoundary > </ErrorBoundary >
)); ));
} }

View file

@ -7,7 +7,7 @@
import "./style.css"; import "./style.css";
import { classNameFactory } from "@api/Styles"; import { classNameFactory } from "@api/Styles";
import { Button, ButtonLooks, GuildStore, useStateFromStores } from "@webpack/common"; import { Button, GuildStore, useStateFromStores } from "@webpack/common";
import { HiddenServersStore } from "../HiddenServersStore"; import { HiddenServersStore } from "../HiddenServersStore";
import { openHiddenServersModal } from "./HiddenServersMenu"; import { openHiddenServersModal } from "./HiddenServersMenu";
@ -23,7 +23,7 @@ function HiddenServersButton() {
{actuallyHidden > 0 ? ( {actuallyHidden > 0 ? (
<Button <Button
className={cl("button")} className={cl("button")}
look={ButtonLooks.BLANK} look={Button.Looks.BLANK}
size={Button.Sizes.MIN} size={Button.Sizes.MIN}
onClick={() => openHiddenServersModal()} onClick={() => openHiddenServersModal()}
> >

View file

@ -8,7 +8,6 @@ import "./styles.css";
import { classNameFactory } from "@api/Styles"; import { classNameFactory } from "@api/Styles";
import { proxyLazy } from "@utils/lazy"; import { proxyLazy } from "@utils/lazy";
import { findByPropsLazy } from "@webpack";
import { Forms } from "@webpack/common"; import { Forms } from "@webpack/common";
import { ComponentType, HTMLAttributes } from "react"; import { ComponentType, HTMLAttributes } from "react";
@ -36,10 +35,4 @@ export const { Spinner } = proxyLazy(() => Forms as any as {
Spinner: Spinner, Spinner: Spinner,
SpinnerTypes: typeof SpinnerTypes; SpinnerTypes: typeof SpinnerTypes;
}); });
const icons = findByPropsLazy("PencilIcon");
export const QrCodeIcon = proxyLazy(() => icons.QrCodeCameraIcon ?? icons.QrCodeIcon) as ComponentType<{
size: number;
}>;
export const cl = classNameFactory("qrlogin-"); export const cl = classNameFactory("qrlogin-");

View file

@ -18,9 +18,10 @@
import { EquicordDevs } from "@utils/constants"; import { EquicordDevs } from "@utils/constants";
import definePlugin from "@utils/types"; import definePlugin from "@utils/types";
import { Icons } from "@webpack/common";
import { Message } from "discord-types/general"; import { Message } from "discord-types/general";
const PinIcon = ({ style = {} }) => <svg className="icon__9293f" aria-hidden="true" role="img" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M19.38 11.38a3 3 0 0 0 4.24 0l.03-.03a.5.5 0 0 0 0-.7L13.35.35a.5.5 0 0 0-.7 0l-.03.03a3 3 0 0 0 0 4.24L13 5l-2.92 2.92-3.65-.34a2 2 0 0 0-1.6.58l-.62.63a1 1 0 0 0 0 1.42l9.58 9.58a1 1 0 0 0 1.42 0l.63-.63a2 2 0 0 0 .58-1.6l-.34-3.64L19 11l.38.38ZM9.07 17.07a.5.5 0 0 1-.08.77l-5.15 3.43a.5.5 0 0 1-.63-.06l-.42-.42a.5.5 0 0 1-.06-.63L6.16 15a.5.5 0 0 1 .77-.08l2.14 2.14Z" className="" style={style}></path></svg>;
export default definePlugin({ export default definePlugin({
name: "PinIcon", name: "PinIcon",
description: "Adds a pin icon to pinned messages", description: "Adds a pin icon to pinned messages",
@ -35,6 +36,6 @@ export default definePlugin({
} }
], ],
PinnedIcon({ pinned }: Message) { PinnedIcon({ pinned }: Message) {
return pinned ? (<Icons.PinIcon size="xs" style={{ position: "absolute", right: "0", top: "0" }} />) : null; return pinned ? (<PinIcon style={{ position: "absolute", right: "0", top: "0" }} />) : null;
} }
}); });

View file

@ -13,7 +13,6 @@ import {
ChannelRouter, ChannelRouter,
ChannelStore, ChannelStore,
FluxDispatcher, FluxDispatcher,
Icons,
Menu, Menu,
MessageActions, MessageActions,
PermissionsBits, PermissionsBits,
@ -45,6 +44,37 @@ interface ContextMenuProps {
user: User; user: User;
} }
const ArrowsLeftRightIcon = <svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<polyline points="17 11 21 7 17 3" />
<line x1="21" y1="7" x2="9" y2="7" />
<polyline points="7 21 3 17 7 13" />
<line x1="15" y1="17" x2="3" y2="17" />
</svg>;
const XSmallIcon = <svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<line x1="18" y1="6" x2="6" y2="18" />
<line x1="6" y1="6" x2="18" y2="18" />
</svg>;
function MakeContextCallback(name: "user" | "channel"): NavContextMenuPatchCallback { function MakeContextCallback(name: "user" | "channel"): NavContextMenuPatchCallback {
return (children, { user, channel, guildId }: ContextMenuProps) => { return (children, { user, channel, guildId }: ContextMenuProps) => {
@ -122,7 +152,7 @@ export default definePlugin({
toolbar={ toolbar={
<> <>
<HeaderBarIcon <HeaderBarIcon
icon={Icons.ArrowsLeftRightIcon} icon={ArrowsLeftRightIcon}
tooltip="Switch channels" tooltip="Switch channels"
onClick={() => { onClick={() => {
const currentChannel = ChannelStore.getChannel(SelectedChannelStore.getChannelId()); const currentChannel = ChannelStore.getChannel(SelectedChannelStore.getChannelId());
@ -137,7 +167,7 @@ export default definePlugin({
}} }}
/> />
<HeaderBarIcon <HeaderBarIcon
icon={Icons.XSmallIcon} icon={XSmallIcon}
tooltip="Close Sidebar Chat" tooltip="Close Sidebar Chat"
onClick={() => { onClick={() => {
FluxDispatcher.dispatch({ FluxDispatcher.dispatch({

View file

@ -6,7 +6,7 @@
import { ChatBarButton, ChatBarButtonFactory } from "@api/ChatButtons"; import { ChatBarButton, ChatBarButtonFactory } from "@api/ChatButtons";
import { classes } from "@utils/misc"; import { classes } from "@utils/misc";
import { Button, ButtonLooks, ButtonWrapperClasses, Tooltip } from "@webpack/common"; import { Button, ButtonWrapperClasses, Tooltip } from "@webpack/common";
import { cl } from "../utils"; import { cl } from "../utils";
import { openSoundBoardLog } from "./SoundBoardLog"; import { openSoundBoardLog } from "./SoundBoardLog";
@ -42,7 +42,7 @@ export function IconWithTooltip({ text, icon, onClick }) {
aria-haspopup="dialog" aria-haspopup="dialog"
aria-label={text} aria-label={text}
size="" size=""
look={ButtonLooks.BLANK} look={Button.Looks.BLANK}
onMouseEnter={onMouseEnter} onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave} onMouseLeave={onMouseLeave}
innerClassName={ButtonWrapperClasses.button} innerClassName={ButtonWrapperClasses.button}

View file

@ -28,7 +28,7 @@ import { ModalProps, openModalLazy } from "@utils/modal";
import { useForceUpdater } from "@utils/react"; import { useForceUpdater } from "@utils/react";
import definePlugin, { OptionType, StartAt } from "@utils/types"; import definePlugin, { OptionType, StartAt } from "@utils/types";
import { extractAndLoadChunksLazy, findByPropsLazy, findComponentByCodeLazy, findModuleId, wreq } from "@webpack"; import { extractAndLoadChunksLazy, findByPropsLazy, findComponentByCodeLazy, findModuleId, wreq } from "@webpack";
import { Button, Clickable, Icons, Menu, Toasts, UserStore, useState } from "@webpack/common"; import { Button, Clickable, Menu, Toasts, UserStore, useState } from "@webpack/common";
import { FunctionComponent } from "react"; import { FunctionComponent } from "react";
@ -46,7 +46,20 @@ interface Emoji {
id: bigint | null; id: bigint | null;
name: string; name: string;
} }
const CircleXIcon = <svg
xmlns="http://www.w3.org/2000/svg"
width="16" height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<circle cx="12" cy="12" r="10" />
<line x1="15" y1="9" x2="9" y2="15" />
<line x1="9" y1="9" x2="15" y2="15" />
</svg>;
interface DiscordStatus { interface DiscordStatus {
emojiInfo: Emoji | null; emojiInfo: Emoji | null;
text: string; text: string;
@ -56,7 +69,6 @@ interface DiscordStatus {
const StatusStyles = findByPropsLazy("statusItem"); const StatusStyles = findByPropsLazy("statusItem");
// TODO: find clearCustomStatusHint original css/svg or replace // TODO: find clearCustomStatusHint original css/svg or replace
const PMenu = findComponentByCodeLazy(".menuItemLabel", ".menuItemInner"); const PMenu = findComponentByCodeLazy(".menuItemLabel", ".menuItemInner");
const EmojiComponent = findComponentByCodeLazy(/\.translateSurrogatesToInlineEmoji\(\i.\i\),/); const EmojiComponent = findComponentByCodeLazy(/\.translateSurrogatesToInlineEmoji\(\i.\i\),/);
@ -90,11 +102,11 @@ function setStatus(status: DiscordStatus) {
}); });
} }
const ClearStatusButton = () => <Clickable className={StatusStyles.clearCustomStatusHint} onClick={e => { e.stopPropagation(); CustomStatusSettings?.updateSetting(null); }}><Icons.CircleXIcon size="sm" /></Clickable>; const ClearStatusButton = () => <Clickable className={StatusStyles.clearCustomStatusHint} onClick={e => { e.stopPropagation(); CustomStatusSettings?.updateSetting(null); }}>{CircleXIcon}</Clickable>;
function StatusIcon({ isHovering, status }: { isHovering: boolean; status: DiscordStatus; }) { function StatusIcon({ isHovering, status }: { isHovering: boolean; status: DiscordStatus; }) {
return <div className={StatusStyles.status}>{isHovering ? return <div className={StatusStyles.status}>{isHovering ?
<Icons.CircleXIcon size="sm" /> CircleXIcon
: (status.emojiInfo != null ? <EmojiComponent emoji={status.emojiInfo} animate={false} hideTooltip={false} /> : <div className={StatusStyles.customEmojiPlaceholder} />)}</div>; : (status.emojiInfo != null ? <EmojiComponent emoji={status.emojiInfo} animate={false} hideTooltip={false} /> : <div className={StatusStyles.customEmojiPlaceholder} />)}</div>;
} }

View file

@ -208,6 +208,12 @@ export default definePlugin({
replace: (_, otherClasses, isIf, isMuted, mutedClassExpression) => isIf replace: (_, otherClasses, isIf, isMuted, mutedClassExpression) => isIf
? `${isMuted}?${mutedClassExpression}:"",${otherClasses}if(${isMuted})return ""` ? `${isMuted}?${mutedClassExpression}:"",${otherClasses}if(${isMuted})return ""`
: `${isMuted}?${mutedClassExpression}:"",${otherClasses}${isMuted}?""` : `${isMuted}?${mutedClassExpression}:"",${otherClasses}${isMuted}?""`
},
{
// Make muted channels also appear as unread if hide unreads is false and the channel is hidden
predicate: () => settings.store.channelStyle === ChannelStyle.MutedUnread || settings.store.channelStyle === ChannelStyle.Unread,
match: /\.LOCKED;if\((?<={channel:(\i).+?)/,
replace: (m, channel) => `${m}!$self.isHiddenChannel(${channel})&&`
} }
] ]
}, },
@ -216,8 +222,6 @@ export default definePlugin({
predicate: () => settings.store.channelStyle !== ChannelStyle.Unread && settings.store.channelStyle !== ChannelStyle.MutedUnread, predicate: () => settings.store.channelStyle !== ChannelStyle.Unread && settings.store.channelStyle !== ChannelStyle.MutedUnread,
replacement: [ replacement: [
{ {
// Make muted channels also appear as unread if hide unreads is false, using the HiddenIconWithMutedStyle and the channel is hidden
predicate: () => settings.store.hideUnreads === false && settings.store.showMode === ShowMode.HiddenIconWithMutedStyle,
match: /(?<=\.LOCKED(?:;if\(|:))(?<={channel:(\i).+?)/, match: /(?<=\.LOCKED(?:;if\(|:))(?<={channel:(\i).+?)/,
replace: (_, channel) => `!$self.isHiddenChannel(${channel})&&` replace: (_, channel) => `!$self.isHiddenChannel(${channel})&&`
}, },