ImageModal Fixes from sadan4

This commit is contained in:
thororen1234 2024-10-22 14:56:38 -04:00
parent 2837028793
commit 91f88396c6
13 changed files with 61 additions and 36 deletions

3
src/utils/discord.css Normal file
View file

@ -0,0 +1,3 @@
.vc-imagemodal-fix {
position: inherit;
}

View file

@ -16,11 +16,13 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import "./discord.css";
import { MessageObject } from "@api/MessageEvents";
import { ChannelStore, ComponentDispatch, Constants, FluxDispatcher, GuildStore, InviteActions, MaskedLink, MessageActions, ModalImageClasses, PrivateChannelsStore, RestAPI, SelectedChannelStore, SelectedGuildStore, UserProfileActions, UserProfileStore, UserSettingsActionCreators, UserUtils } from "@webpack/common";
import { ChannelStore, ComponentDispatch, Constants, FluxDispatcher, GuildStore, InviteActions, MaskedLink, MessageActions, PrivateChannelsStore, RestAPI, SelectedChannelStore, SelectedGuildStore, UserProfileActions, UserProfileStore, UserSettingsActionCreators, UserUtils } from "@webpack/common";
import { Channel, Guild, Message, User } from "discord-types/general";
import { ImageModal, ModalRoot, ModalSize, openModal } from "./modal";
import { ImageModal, openModal } from "./modal";
/**
* Open the invite modal
@ -108,25 +110,24 @@ export function sendMessage(
return MessageActions.sendMessage(channelId, messageData, waitForChannelReady, extra);
}
const FIX_CLASS_NAME = "vc-imagemodal-fix";
export function openImageModal(url: string, props?: Partial<React.ComponentProps<ImageModal>>): string {
return openModal(modalProps => (
<ModalRoot
<ImageModal
{...modalProps}
className={ModalImageClasses.modal}
size={ModalSize.DYNAMIC}>
<ImageModal
className={ModalImageClasses.image}
original={url}
placeholder={url}
src={url}
renderLinkComponent={props => <MaskedLink {...props} />}
// Don't render forward message button
renderForwardComponent={() => null}
shouldHideMediaOptions={false}
shouldAnimate
{...props}
/>
</ModalRoot>
renderLinkComponent={props => <MaskedLink {...props} />}
// Don't render forward message button scaleDown_f97a12 contain_f97a12
renderForwardComponent={() => null}
shouldHideMediaOptions={false}
shouldAnimate={true}
fit={FIX_CLASS_NAME}
items={[{
...props,
type: "IMAGE",
url,
}]}
/>
));
}

View file

@ -101,7 +101,8 @@ export const Modals = findByPropsLazy("ModalRoot", "ModalCloseButton") as {
}>;
};
export type ImageModal = ComponentType<{
// FIXME: type this
export type ImageModal = any & ComponentType<{
className?: string;
src: string;
placeholder: string;
@ -119,7 +120,7 @@ export type ImageModal = ComponentType<{
shouldHideMediaOptions?: boolean;
}>;
export const ImageModal = findComponentByCodeLazy(".MEDIA_MODAL_CLOSE", "responsive") as ImageModal;
export const ImageModal = findComponentByCodeLazy(".MEDIA_MODAL_CLOSE") as ImageModal;
export const ModalRoot = LazyComponent(() => Modals.ModalRoot);
export const ModalHeader = LazyComponent(() => Modals.ModalHeader);