From c74f8df231199a9e7fb708a3698430015e137341 Mon Sep 17 00:00:00 2001 From: MapleLeaf <19603573+itsMapleLeaf@users.noreply.github.com> Date: Sat, 25 Dec 2021 04:06:56 -0600 Subject: [PATCH] split up embed file --- playground/counter.tsx | 14 +++-- src.new/embed.tsx | 100 ---------------------------------- src.new/embed/embed-child.ts | 6 ++ src.new/embed/embed-field.tsx | 30 ++++++++++ src.new/embed/embed-title.tsx | 25 +++++++++ src.new/embed/embed.tsx | 50 +++++++++++++++++ 6 files changed, 120 insertions(+), 105 deletions(-) delete mode 100644 src.new/embed.tsx create mode 100644 src.new/embed/embed-child.ts create mode 100644 src.new/embed/embed-field.tsx create mode 100644 src.new/embed/embed-title.tsx create mode 100644 src.new/embed/embed.tsx diff --git a/playground/counter.tsx b/playground/counter.tsx index 6bbd235..0235907 100644 --- a/playground/counter.tsx +++ b/playground/counter.tsx @@ -1,6 +1,8 @@ import * as React from "react" import { Button } from "../src.new/button.js" -import { Embed } from "../src.new/embed.js" +import { EmbedField } from "../src.new/embed/embed-field.js" +import { EmbedTitle } from "../src.new/embed/embed-title.js" +import { Embed } from "../src.new/embed/embed.js" export function Counter() { const [count, setCount] = React.useState(0) @@ -11,10 +13,12 @@ export function Counter() { this button was clicked {count} times {embedVisible && ( - the counter - - {count % 2 === 0 ? "yes" : "no"} - + the counter + {count > 0 && ( + + {count % 2 === 0 ? "yes" : "no"} + + )} )} {embedVisible && ( diff --git a/src.new/embed.tsx b/src.new/embed.tsx deleted file mode 100644 index 480d45b..0000000 --- a/src.new/embed.tsx +++ /dev/null @@ -1,100 +0,0 @@ -import type { MessageEmbedOptions, MessageOptions } from "discord.js" -import React from "react" -import { ReacordElement } from "./element.js" -import { Node } from "./node.js" - -export type EmbedProps = { - description?: string - url?: string - timestamp?: Date - color?: number - footer?: { - text: string - iconURL?: string - } - image?: { - url: string - } - thumbnail?: { - url: string - } - author?: { - name: string - url?: string - iconURL?: string - } - children?: React.ReactNode -} - -export function Embed(props: EmbedProps) { - return ( - new EmbedNode(props)}> - {props.children} - - ) -} - -class EmbedNode extends Node { - override modifyMessageOptions(options: MessageOptions): void { - const embed = { ...this.props } - for (const child of this.children) { - if (child instanceof EmbedChildNode) { - child.modifyEmbedOptions(embed) - } - } - - options.embeds ??= [] - options.embeds.push(embed) - } -} - -abstract class EmbedChildNode extends Node { - abstract modifyEmbedOptions(options: MessageEmbedOptions): void -} - -export type EmbedTitleProps = { - children: string - url?: string -} - -Embed.Title = function Title(props: EmbedTitleProps) { - return ( - new EmbedTitleNode(props)} - /> - ) -} - -class EmbedTitleNode extends EmbedChildNode { - override modifyEmbedOptions(options: MessageEmbedOptions): void { - options.title = this.props.children - options.url = this.props.url - } -} - -export type EmbedFieldProps = { - name: string - inline?: boolean - children: string -} - -Embed.Field = function Field(props: EmbedFieldProps) { - return ( - new EmbedFieldNode(props)} - /> - ) -} - -class EmbedFieldNode extends EmbedChildNode { - override modifyEmbedOptions(options: MessageEmbedOptions): void { - options.fields ??= [] - options.fields.push({ - name: this.props.name, - value: this.props.children, - inline: this.props.inline, - }) - } -} diff --git a/src.new/embed/embed-child.ts b/src.new/embed/embed-child.ts new file mode 100644 index 0000000..a4c04c3 --- /dev/null +++ b/src.new/embed/embed-child.ts @@ -0,0 +1,6 @@ +import type { MessageEmbedOptions } from "discord.js" +import { Node } from "../node.js" + +export abstract class EmbedChildNode extends Node { + abstract modifyEmbedOptions(options: MessageEmbedOptions): void +} diff --git a/src.new/embed/embed-field.tsx b/src.new/embed/embed-field.tsx new file mode 100644 index 0000000..02f8b33 --- /dev/null +++ b/src.new/embed/embed-field.tsx @@ -0,0 +1,30 @@ +import { MessageEmbedOptions } from "discord.js" +import React from "react" +import { ReacordElement } from "../element.jsx" +import { EmbedChildNode } from "./embed-child.js" + +export type EmbedFieldProps = { + name: string + inline?: boolean + children: string +} + +export function EmbedField(props: EmbedFieldProps) { + return ( + new EmbedFieldNode(props)} + /> + ) +} + +class EmbedFieldNode extends EmbedChildNode { + override modifyEmbedOptions(options: MessageEmbedOptions): void { + options.fields ??= [] + options.fields.push({ + name: this.props.name, + value: this.props.children, + inline: this.props.inline, + }) + } +} diff --git a/src.new/embed/embed-title.tsx b/src.new/embed/embed-title.tsx new file mode 100644 index 0000000..9bc3b32 --- /dev/null +++ b/src.new/embed/embed-title.tsx @@ -0,0 +1,25 @@ +import { MessageEmbedOptions } from "discord.js" +import React from "react" +import { ReacordElement } from "../element.jsx" +import { EmbedChildNode } from "./embed-child.js" + +export type EmbedTitleProps = { + children: string + url?: string +} + +export function EmbedTitle(props: EmbedTitleProps) { + return ( + new EmbedTitleNode(props)} + /> + ) +} + +class EmbedTitleNode extends EmbedChildNode { + override modifyEmbedOptions(options: MessageEmbedOptions): void { + options.title = this.props.children + options.url = this.props.url + } +} diff --git a/src.new/embed/embed.tsx b/src.new/embed/embed.tsx new file mode 100644 index 0000000..db5e7a1 --- /dev/null +++ b/src.new/embed/embed.tsx @@ -0,0 +1,50 @@ +import type { MessageOptions } from "discord.js" +import React from "react" +import { ReacordElement } from "../element.js" +import { Node } from "../node.js" +import { EmbedChildNode } from "./embed-child.js" + +export type EmbedProps = { + description?: string + url?: string + timestamp?: Date + color?: number + footer?: { + text: string + iconURL?: string + } + image?: { + url: string + } + thumbnail?: { + url: string + } + author?: { + name: string + url?: string + iconURL?: string + } + children?: React.ReactNode +} + +export function Embed(props: EmbedProps) { + return ( + new EmbedNode(props)}> + {props.children} + + ) +} + +class EmbedNode extends Node { + override modifyMessageOptions(options: MessageOptions): void { + const embed = { ...this.props } + for (const child of this.children) { + if (child instanceof EmbedChildNode) { + child.modifyEmbedOptions(embed) + } + } + + options.embeds ??= [] + options.embeds.push(embed) + } +}