BiggerStreamPreview

index.tsx

Download

Source

src/plugins/biggerStreamPreview/index.tsx

1import { NavContextMenuPatchCallback } from "@api/ContextMenu";

2import { ScreenshareIcon } from "@components/Icons";

3import { Devs } from "@utils/constants";

4import { openImageModal } from "@utils/discord";

5import definePlugin from "@utils/types";

6import { ApplicationStream, Channel, Stream, User } from "@vencord/discord-types";

7import { ApplicationStreamingStore, ApplicationStreamPreviewStore, Menu } from "@webpack/common";

9export interface UserContextProps {

10 channel: Channel,

11 channelSelected: boolean,

12 className: string,

13 config: { context: string; };

14 context: string,

15 onHeightUpdate: Function,

16 position: string,

17 target: HTMLElement,

18 theme: string,

19 user: User;

20}

22export interface StreamContextProps {

23 appContext: string,

24 className: string,

25 config: { context: string; };

26 context: string,

27 exitFullscreen: Function,

28 onHeightUpdate: Function,

29 position: string,

30 target: HTMLElement,

31 stream: Stream,

32 theme: string,

33}

35export const handleViewPreview = async ({ guildId, channelId, ownerId }: ApplicationStream | Stream) => {

36 const previewUrl = await ApplicationStreamPreviewStore.getPreviewURL(guildId, channelId, ownerId);

37 if (!previewUrl) return;

39 openImageModal({

40 url: previewUrl,

41 height: 720,

42 width: 1280

43 });

44};

export const addViewStreamContext: NavContextMenuPatchCallback = (children, { userId }: { userId: string | bigint; }) => {

47 const stream = ApplicationStreamingStore.getAnyStreamForUser(userId);

48 if (!stream) return;

50 const streamPreviewItem = (

51 <Menu.MenuItem

52 label="View Stream Preview"

53 id="view-stream-preview"

54 icon={ScreenshareIcon}

55 action={() => stream && handleViewPreview(stream)}

56 disabled={!stream}

57 />

58 );

60 children.push(<Menu.MenuSeparator />, streamPreviewItem);

61};

63export const streamContextPatch: NavContextMenuPatchCallback = (children, { stream }: StreamContextProps) => {

64 return addViewStreamContext(children, { userId: stream.ownerId });

65};

67export const userContextPatch: NavContextMenuPatchCallback = (children, { user }: UserContextProps) => {

68 if (user) return addViewStreamContext(children, { userId: user.id });

69};

71export default definePlugin({

72 name: "BiggerStreamPreview",

73 description: "This plugin allows you to enlarge stream previews",

74 tags: ["Media", "Appearance"],

75 authors: [Devs.phil],

76 contextMenus: {

77 "user-context": userContextPatch,

78 "stream-context": streamContextPatch

79 }

80});

import { NavContextMenuPatchCallback } from "@api/ContextMenu";
import { ScreenshareIcon } from "@components/Icons";
import { Devs } from "@utils/constants";
import { openImageModal } from "@utils/discord";
import definePlugin from "@utils/types";
import { ApplicationStream, Channel, Stream, User } from "@vencord/discord-types";
import { ApplicationStreamingStore, ApplicationStreamPreviewStore, Menu } from "@webpack/common";

export interface UserContextProps {
    channel: Channel,
    channelSelected: boolean,
    className: string,
    config: { context: string; };
    context: string,
    onHeightUpdate: Function,
    position: string,
    target: HTMLElement,
    theme: string,
    user: User;
}

export interface StreamContextProps {
    appContext: string,
    className: string,
    config: { context: string; };
    context: string,
    exitFullscreen: Function,
    onHeightUpdate: Function,
    position: string,
    target: HTMLElement,
    stream: Stream,
    theme: string,
}

export const handleViewPreview = async ({ guildId, channelId, ownerId }: ApplicationStream | Stream) => {
    const previewUrl = await ApplicationStreamPreviewStore.getPreviewURL(guildId, channelId, ownerId);
    if (!previewUrl) return;

    openImageModal({
        url: previewUrl,
        height: 720,
        width: 1280
    });
};

export const addViewStreamContext: NavContextMenuPatchCallback = (children, { userId }: { userId: string | bigint; }) => {
    const stream = ApplicationStreamingStore.getAnyStreamForUser(userId);
    if (!stream) return;

    const streamPreviewItem = (
        <Menu.MenuItem
            label="View Stream Preview"
            id="view-stream-preview"
            icon={ScreenshareIcon}
            action={() => stream && handleViewPreview(stream)}
            disabled={!stream}
        />
    );

    children.push(<Menu.MenuSeparator />, streamPreviewItem);
};

export const streamContextPatch: NavContextMenuPatchCallback = (children, { stream }: StreamContextProps) => {
    return addViewStreamContext(children, { userId: stream.ownerId });
};

export const userContextPatch: NavContextMenuPatchCallback = (children, { user }: UserContextProps) => {
    if (user) return addViewStreamContext(children, { userId: user.id });
};

export default definePlugin({
    name: "BiggerStreamPreview",
    description: "This plugin allows you to enlarge stream previews",
    tags: ["Media", "Appearance"],
    authors: [Devs.phil],
    contextMenus: {
        "user-context": userContextPatch,
        "stream-context": streamContextPatch
    }
});

Source

FiveCord for Windows