From 28370287934d69ce903a18d22f92ae5aa5e1991d Mon Sep 17 00:00:00 2001 From: thororen1234 <78185467+thororen1234@users.noreply.github.com> Date: Tue, 22 Oct 2024 14:45:56 -0400 Subject: [PATCH] Revert "Fixes" This reverts commit 6fc7fc9f97ab108b5e0ae01a3ad7251f98a2c275. --- src/plugins/betterRoleContext/index.tsx | 4 +-- src/plugins/biggerStreamPreview/index.tsx | 4 +-- src/plugins/imageZoom/index.tsx | 6 ++-- src/plugins/serverInfo/GuildInfoModal.tsx | 8 ++--- .../spotifyControls/PlayerComponent.tsx | 4 +-- src/plugins/viewIcons/index.tsx | 7 ++-- src/utils/discord.tsx | 35 ++++++++++--------- src/utils/modal.tsx | 30 +++++++--------- 8 files changed, 47 insertions(+), 51 deletions(-) diff --git a/src/plugins/betterRoleContext/index.tsx b/src/plugins/betterRoleContext/index.tsx index f9c06110..bf4cf0f3 100644 --- a/src/plugins/betterRoleContext/index.tsx +++ b/src/plugins/betterRoleContext/index.tsx @@ -8,7 +8,7 @@ import { definePluginSettings } from "@api/Settings"; import { getUserSettingLazy } from "@api/UserSettings"; import { ImageIcon } from "@components/Icons"; import { Devs } from "@utils/constants"; -import { getCurrentGuild, openMediaModal } from "@utils/discord"; +import { getCurrentGuild, openImageModal } from "@utils/discord"; import definePlugin, { OptionType } from "@utils/types"; import { findByPropsLazy } from "@webpack"; import { Clipboard, GuildStore, Menu, PermissionStore } from "@webpack/common"; @@ -99,7 +99,7 @@ export default definePlugin({ id="vc-view-role-icon" label="View Role Icon" action={() => { - openMediaModal(`${location.protocol}//${window.GLOBAL_ENV.CDN_HOST}/role-icons/${role.id}/${role.icon}.${settings.store.roleIconFileFormat}`); + openImageModal(`${location.protocol}//${window.GLOBAL_ENV.CDN_HOST}/role-icons/${role.id}/${role.icon}.${settings.store.roleIconFileFormat}`); }} icon={ImageIcon} /> diff --git a/src/plugins/biggerStreamPreview/index.tsx b/src/plugins/biggerStreamPreview/index.tsx index de0ca55e..8cca912b 100644 --- a/src/plugins/biggerStreamPreview/index.tsx +++ b/src/plugins/biggerStreamPreview/index.tsx @@ -19,7 +19,7 @@ import { NavContextMenuPatchCallback } from "@api/ContextMenu"; import { ScreenshareIcon } from "@components/Icons"; import { Devs } from "@utils/constants"; -import { openMediaModal } from "@utils/discord"; +import { openImageModal } from "@utils/discord"; import definePlugin from "@utils/types"; import { Menu } from "@webpack/common"; import { Channel, User } from "discord-types/general"; @@ -57,7 +57,7 @@ export const handleViewPreview = async ({ guildId, channelId, ownerId }: Applica const previewUrl = await ApplicationStreamPreviewStore.getPreviewURL(guildId, channelId, ownerId); if (!previewUrl) return; - openMediaModal(previewUrl); + openImageModal(previewUrl); }; export const addViewStreamContext: NavContextMenuPatchCallback = (children, { userId }: { userId: string | bigint; }) => { diff --git a/src/plugins/imageZoom/index.tsx b/src/plugins/imageZoom/index.tsx index 273d022e..59b2667c 100644 --- a/src/plugins/imageZoom/index.tsx +++ b/src/plugins/imageZoom/index.tsx @@ -156,14 +156,14 @@ export default definePlugin({ patches: [ { - find: ".contain,SCALE_DOWN:", + find: "Messages.OPEN_IN_BROWSER", replacement: { // there are 2 image thingies. one for carosuel and one for the single image. // so thats why i added global flag. // also idk if this patch is good, should it be more specific? // https://regex101.com/r/xfvNvV/1 - match: /\.slide,\i\),/g, - replace: `$&id:"${ELEMENT_ID}",` + match: /return.{1,200}\.wrapper.{1,200}src:\i,/g, + replace: `$&id: '${ELEMENT_ID}',` } }, diff --git a/src/plugins/serverInfo/GuildInfoModal.tsx b/src/plugins/serverInfo/GuildInfoModal.tsx index e2007dfe..fb8df2ce 100644 --- a/src/plugins/serverInfo/GuildInfoModal.tsx +++ b/src/plugins/serverInfo/GuildInfoModal.tsx @@ -7,7 +7,7 @@ import "./styles.css"; import { classNameFactory } from "@api/Styles"; -import { openMediaModal, openUserProfile } from "@utils/discord"; +import { openImageModal, openUserProfile } from "@utils/discord"; import { classes } from "@utils/misc"; import { ModalRoot, ModalSize, openModal } from "@utils/modal"; import { useAwaiter } from "@utils/react"; @@ -80,7 +80,7 @@ function GuildInfoModal({ guild }: GuildProps) { className={cl("banner")} src={bannerUrl} alt="" - onClick={() => openMediaModal(bannerUrl)} + onClick={() => openImageModal(bannerUrl)} /> )} @@ -89,7 +89,7 @@ function GuildInfoModal({ guild }: GuildProps) { ? openMediaModal(iconUrl)} + onClick={() => openImageModal(iconUrl)} /> :
{guild.acronym}
} @@ -151,7 +151,7 @@ function Owner(guildId: string, owner: User) { return (
- openMediaModal(ownerAvatarUrl)} /> + openImageModal(ownerAvatarUrl)} /> {Parser.parse(`<@${owner.id}>`)}
); diff --git a/src/plugins/spotifyControls/PlayerComponent.tsx b/src/plugins/spotifyControls/PlayerComponent.tsx index 72b63733..aef0c736 100644 --- a/src/plugins/spotifyControls/PlayerComponent.tsx +++ b/src/plugins/spotifyControls/PlayerComponent.tsx @@ -21,7 +21,7 @@ import "./spotifyStyles.css"; import { Flex } from "@components/Flex"; import { ImageIcon, LinkIcon, OpenExternalIcon } from "@components/Icons"; import { debounce } from "@shared/debounce"; -import { openMediaModal } from "@utils/discord"; +import { openImageModal } from "@utils/discord"; import { classes, copyWithToast } from "@utils/misc"; import { ContextMenuApi, FluxDispatcher, Forms, Menu, React, useEffect, useState, useStateFromStores } from "@webpack/common"; @@ -229,7 +229,7 @@ function AlbumContextMenu({ track }: { track: Track; }) { id="view-cover" label="View Album Cover" // trolley - action={() => openMediaModal(track.album.image.url)} + action={() => openImageModal(track.album.image.url)} icon={ImageIcon} /> >): string { - media = typeof media === "string" ? { url: media } : media; - media.original ??= media.url; - media.type ??= "IMAGE"; +export function openImageModal(url: string, props?: Partial>): string { return openModal(modalProps => ( - + className={ModalImageClasses.modal} + size={ModalSize.DYNAMIC}> + } + // Don't render forward message button + renderForwardComponent={() => null} + shouldHideMediaOptions={false} + shouldAnimate + {...props} + /> + )); } diff --git a/src/utils/modal.tsx b/src/utils/modal.tsx index 78e86be2..79f77708 100644 --- a/src/utils/modal.tsx +++ b/src/utils/modal.tsx @@ -101,31 +101,25 @@ export const Modals = findByPropsLazy("ModalRoot", "ModalCloseButton") as { }>; }; -// @TODO Type this -export type MediaData = { - url: string; - original?: string; - type?: string; - alt?: string; +export type ImageModal = ComponentType<{ + className?: string; + src: string; + placeholder: string; + original: string; width?: number; height?: number; + animated?: boolean; + responsive?: boolean; + renderLinkComponent(props: any): ReactNode; + renderForwardComponent(props: any): ReactNode; maxWidth?: number; maxHeight?: number; -} & Record; - -export type MediaModal = ComponentType<{ - onClose?: () => void; - items: MediaData[]; - startingIndex?: number; - onIndexChange?: (...args: any[]) => void; - fit?: any; - shouldRedactExplicitContent?: boolean; + shouldAnimate?: boolean; + onClose?(): void; shouldHideMediaOptions?: boolean; - shouldAnimateCarousel?: boolean; - className?: string; }>; -export const MediaModal = findComponentByCodeLazy(".MEDIA_MODAL_CLOSE") as MediaModal; +export const ImageModal = findComponentByCodeLazy(".MEDIA_MODAL_CLOSE", "responsive") as ImageModal; export const ModalRoot = LazyComponent(() => Modals.ModalRoot); export const ModalHeader = LazyComponent(() => Modals.ModalHeader);