release v0.3.7

Dockerfile

@@ -1,15 +0,0 @@
-FROM node:lts-slim
-
-ENV CYPRESS_INSTALL_BINARY=0
-
-WORKDIR /app
-
-COPY / ./
-RUN ls -R
-
-RUN npm install -g pnpm
-RUN pnpm install --unsafe-perm --frozen-lockfile
-RUN pnpm run build -C packages/website
-
-ENV NODE_ENV=production
-CMD [ "pnpm", "-C", "packages/website", "start" ]

package.json

@@ -3,7 +3,10 @@
   "scripts": {
     "lint": "eslint --ext js,ts,tsx .",
     "lint-fix": "pnpm lint -- --fix",
-    "format": "prettier --write ."
+    "format": "prettier --write .",
+    "release": "pnpm -C packages/reacord run release",
+    "build": "pnpm -C packages/website run build",
+    "start": "pnpm -C packages/website run start"
   },
   "devDependencies": {
     "@itsmapleleaf/configs": "^1.1.3",
@@ -11,7 +14,8 @@
     "@types/eslint": "^8.4.1",
     "eslint": "^8.14.0",
     "prettier": "^2.6.2",
-    "typescript": "^4.6.3"
+    "typescript": "^4.6.3",
+    "node": "^16"
   },
   "resolutions": {
     "esbuild": "latest"

packages/reacord/helpers/prune-nullish-values.test.ts

@@ -1,5 +1,6 @@
 import { expect, test } from "vitest"
-import { PruneNullishValues, pruneNullishValues } from "./prune-nullish-values"
+import type { PruneNullishValues } from "./prune-nullish-values"
+import { pruneNullishValues } from "./prune-nullish-values"
 
 test("pruneNullishValues", () => {
   type InputType = {
@@ -14,6 +15,7 @@ test("pruneNullishValues", () => {
 
   const input: InputType = {
     a: "a",
+    // eslint-disable-next-line unicorn/no-null
     b: null,
     c: undefined,
     d: {

packages/reacord/helpers/types.ts

@@ -1,4 +1,3 @@
-/* eslint-disable import/no-unused-modules */
 export type MaybePromise<T> = T | Promise<T>
 
 export type ValueOf<Type> = Type extends ReadonlyArray<infer Value>

packages/reacord/helpers/wait-for.ts

@@ -1,4 +1,4 @@
-import { setTimeout } from "timers/promises"
+import { setTimeout } from "node:timers/promises"
 
 const maxTime = 1000
 

packages/reacord/library/core/file.ts

@@ -1,7 +0,0 @@
-import { Readable } from "node:stream"
-
-export type ReacordFile = {
-  name?: string
-  description?: string
-  data: Buffer | Readable | string
-}

packages/reacord/library/core/instance.ts

@@ -1,5 +1,4 @@
 import type { ReactNode } from "react"
-import { ReacordFile } from "./file"
 
 /**
  * Represents an interactive message, which can later be replaced or deleted.
@@ -17,7 +16,4 @@ export type ReacordInstance = {
    * This prevents it from listening to user interactions.
    */
   deactivate: () => void
-
-  /** Attach a file to the message for this instance */
-  attach: (file: ReacordFile) => void
 }

packages/reacord/library/core/reacord-discord-js.ts

@@ -301,15 +301,6 @@ function createReacordMessage(message: Discord.Message): Message {
     delete: async () => {
       await message.delete()
     },
-    updateFiles: async (files) => {
-      await message.edit({
-        files: files.map(({ name, description, data }) => ({
-          name,
-          description,
-          attachment: data,
-        })),
-      })
-    },
   }
 }
 
@@ -319,10 +310,6 @@ function createEphemeralReacordMessage(): Message {
       console.warn("Ephemeral messages can't be edited")
       return Promise.resolve()
     },
-    updateFiles: () => {
-      console.warn("Ephemeral messages can't be edited")
-      return Promise.resolve()
-    },
     delete: () => {
       console.warn("Ephemeral messages can't be deleted")
       return Promise.resolve()
@@ -371,10 +358,7 @@ function getDiscordMessageOptions(
     })),
   }
 
-  const hasContent =
+  if (!options.content && !options.embeds?.length) {
-    options.content || options.embeds?.length || options.files?.length
-
-  if (!hasContent) {
     options.content = "_ _"
   }
 

packages/reacord/library/core/reacord.tsx

@@ -63,9 +63,6 @@ export abstract class Reacord {
         this.renderers = this.renderers.filter((it) => it !== renderer)
         renderer.destroy()
       },
-      attach: (file) => {
-        renderer.attach(file)
-      },
     }
 
     if (initialContent !== undefined) {

packages/reacord/library/internal/channel.ts

@@ -1,7 +1,5 @@
-import { ReacordFile } from "../core/file"
 import type { Message, MessageOptions } from "./message"
 
 export type Channel = {
   send(message: MessageOptions): Promise<Message>
-  sendFiles(files: readonly ReacordFile[]): Promise<Message>
 }

packages/reacord/library/internal/message.ts

@@ -2,7 +2,6 @@ import type { Except } from "type-fest"
 import { last } from "../../helpers/last"
 import type { EmbedOptions } from "../core/components/embed-options"
 import type { SelectProps } from "../core/components/select"
-import { ReacordFile } from "../main"
 
 export type MessageOptions = {
   content: string
@@ -50,7 +49,6 @@ export type MessageSelectOptionOptions = {
 export type Message = {
   edit(options: MessageOptions): Promise<void>
   delete(): Promise<void>
-  updateFiles(files: readonly ReacordFile[]): Promise<void>
 }
 
 export function getNextActionRow(options: MessageOptions): ActionRow {

packages/reacord/library/internal/renderers/channel-message-renderer.ts

@@ -1,4 +1,3 @@
-import { ReacordFile } from "../../core/file"
 import type { Channel } from "../channel"
 import type { Message, MessageOptions } from "../message"
 import { Renderer } from "./renderer"
@@ -11,10 +10,4 @@ export class ChannelMessageRenderer extends Renderer {
   protected createMessage(options: MessageOptions): Promise<Message> {
     return this.channel.send(options)
   }
-
-  protected createMessageFromFiles(
-    files: readonly ReacordFile[],
-  ): Promise<Message> {
-    return this.channel.sendFiles(files)
-  }
 }

packages/reacord/library/internal/renderers/renderer.ts

@@ -1,6 +1,5 @@
 import { Subject } from "rxjs"
 import { concatMap } from "rxjs/operators"
-import { ReacordFile } from "../../core/file"
 import { Container } from "../container.js"
 import type { ComponentInteraction } from "../interaction"
 import type { Message, MessageOptions } from "../message"
@@ -8,21 +7,15 @@ import type { Node } from "../node.js"
 
 type UpdatePayload =
   | { action: "update" | "deactivate"; options: MessageOptions }
-  | { action: "files"; files: readonly ReacordFile[] }
   | { action: "deferUpdate"; interaction: ComponentInteraction }
   | { action: "destroy" }
 
-type NewMessagePayload =
-  | { source: "content"; messageOptions?: MessageOptions }
-  | { source: "files"; files?: readonly ReacordFile[] }
-
 export abstract class Renderer {
   readonly nodes = new Container<Node<unknown>>()
   private componentInteraction?: ComponentInteraction
   private message?: Message
   private active = true
   private updates = new Subject<UpdatePayload>()
-  private files: readonly ReacordFile[] = []
 
   private updateSubscription = this.updates
     .pipe(concatMap((payload) => this.updateMessage(payload)))
@@ -53,11 +46,6 @@ export abstract class Renderer {
     this.updates.next({ action: "destroy" })
   }
 
-  attach(file: ReacordFile) {
-    const newFiles = (this.files = [...this.files, file])
-    this.updates.next({ action: "files", files: newFiles })
-  }
-
   handleComponentInteraction(interaction: ComponentInteraction) {
     this.componentInteraction = interaction
 
@@ -72,7 +60,7 @@ export abstract class Renderer {
     }
   }
 
-  protected abstract createMessage(options: NewMessagePayload): Promise<Message>
+  protected abstract createMessage(options: MessageOptions): Promise<Message>
 
   private getMessageOptions(): MessageOptions {
     const options: MessageOptions = {
@@ -114,15 +102,6 @@ export abstract class Renderer {
       return
     }
 
-    if (payload.action === "files") {
-      if (this.message) {
-        await this.message?.updateFiles(payload.files)
-      } else {
-        this.message = await this.createMessageFromFiles(payload.files)
-      }
-      return
-    }
-
     if (this.componentInteraction) {
       const promise = this.componentInteraction.update(payload.options)
       this.componentInteraction = undefined

packages/reacord/library/main.ts

@@ -12,7 +12,6 @@ export * from "./core/components/embed-title"
 export * from "./core/components/link"
 export * from "./core/components/option"
 export * from "./core/components/select"
-export * from "./core/file"
 export * from "./core/instance"
 export { useInstance } from "./core/instance-context"
 export * from "./core/reacord"

packages/reacord/package.json

@@ -2,7 +2,7 @@
   "name": "reacord",
   "type": "module",
   "description": "Create interactive Discord messages using React.",
-  "version": "0.3.5",
+  "version": "0.3.7",
   "types": "./dist/main.d.ts",
   "homepage": "https://reacord.mapleleaf.dev",
   "repository": "https://github.com/itsMapleLeaf/reacord.git",
@@ -35,7 +35,7 @@
     }
   },
   "scripts": {
-    "build": "tsup-node library/main.ts --target node16 --format cjs,esm --dts --sourcemap",
+    "build": "tsup library/main.ts --target node16 --format cjs,esm --dts --sourcemap",
     "build-watch": "pnpm build -- --watch",
     "test": "vitest --coverage --no-watch",
     "test-dev": "vitest",
@@ -78,7 +78,7 @@
     "type-fest": "^2.12.2",
     "typescript": "^4.6.3",
     "vite": "^2.9.5",
-    "vitest": "^0.9.4"
+    "vitest": "^0.10.0"
   },
   "resolutions": {
     "esbuild": "latest"

packages/reacord/playground/command-handler.ts

@@ -8,14 +8,16 @@ type Command = {
 
 export function createCommandHandler(client: Client, commands: Command[]) {
   client.on("ready", async () => {
-    for (const guild of client.guilds.cache.values()) {
+    for (const command of commands) {
-      client.application!.commands.set(
+      for (const guild of client.guilds.cache.values()) {
-        commands.map(({ name, description }) => ({
+        await client.application?.commands.create(
-          name,
+          {
-          description,
+            name: command.name,
-        })),
+            description: command.description,
-        guild.id,
+          },
-      )
+          guild.id,
+        )
+      }
     }
   })
 

packages/reacord/playground/main.tsx

@@ -1,9 +1,6 @@
 import { Client } from "discord.js"
 import "dotenv/config"
-import { readFile } from "fs/promises"
-import { join } from "path"
 import React from "react"
-import { fileURLToPath } from "url"
 import { Button, ReacordDiscordJs, useInstance } from "../library/main"
 import { createCommandHandler } from "./command-handler"
 import { Counter } from "./counter"
@@ -107,19 +104,6 @@ createCommandHandler(client, [
       reacord.reply(interaction, <DeleteThis />)
     },
   },
-  {
-    name: "anime",
-    description: "shows an anime image",
-    run: async (interaction) => {
-      const reply = reacord.reply(interaction)
-      const image = await readFile(
-        join(fileURLToPath(import.meta.url), "../anime.jpg"),
-      )
-
-      reply.attach({ name: "anime.jpg", data: image })
-      // reply.render("anime")
-    },
-  },
 ])
 
 await client.login(process.env.TEST_BOT_TOKEN)

packages/reacord/test/commonjs-require.test.ts

@@ -0,0 +1,12 @@
+import { spawnSync } from "node:child_process"
+import { createRequire } from "node:module"
+import { beforeAll, expect, test } from "vitest"
+
+beforeAll(() => {
+  spawnSync("pnpm", ["run", "build"])
+})
+
+test("can require commonjs", () => {
+  const require = createRequire(import.meta.url)
+  expect(() => require("../dist/main.cjs")).not.toThrow()
+})

packages/website/app/root.tsx

@@ -1,4 +1,3 @@
-import packageJson from "reacord/package.json"
 import type {
   LinksFunction,
   LoaderFunction,
@@ -13,6 +12,7 @@ import {
   ScrollRestoration,
   useLoaderData,
 } from "@remix-run/react"
+import packageJson from "reacord/package.json"
 import bannerUrl from "~/assets/banner.png"
 import faviconUrl from "~/assets/favicon.png"
 import { GuideLinksProvider } from "~/modules/navigation/guide-links-context"
@@ -77,6 +77,7 @@ export default function App() {
   return (
     <html lang="en" className="bg-slate-900 text-slate-100">
       <head>
+        {/* eslint-disable-next-line unicorn/text-encoding-identifier-case */}
         <meta charSet="utf-8" />
         <meta name="viewport" content="width=device-width,initial-scale=1" />
         <Meta />
@@ -84,9 +85,10 @@ export default function App() {
         {process.env.NODE_ENV === "production" && (
           <script
             async
-            data-website-id="49c69ade-5593-4853-9686-c9ca9d519a18"
+            defer
-            src="https://umami-production-265f.up.railway.app/umami.js"
+            data-website-id="e3ce3a50-720e-4489-be37-cc091c1b7029"
-          />
+            src="https://umami-production-72bc.up.railway.app/umami.js"
+          ></script>
         )}
       </head>
       <body>

packages/website/package.json

@@ -11,7 +11,7 @@
     "typecheck": "tsc --noEmit && tsc --project cypress/tsconfig.json --noEmit"
   },
   "dependencies": {
-    "@headlessui/react": "^1.5.0",
+    "@headlessui/react": "^1.6.0",
     "@heroicons/react": "^1.0.6",
     "@reach/rect": "^0.17.0",
     "@remix-run/node": "^1.4.1",
@@ -33,13 +33,13 @@
     "@remix-run/node": "^1.4.1",
     "@testing-library/cypress": "^8.0.2",
     "@types/node": "*",
-    "@types/react": "^18.0.6",
+    "@types/react": "^18.0.7",
     "@types/react-dom": "^18.0.2",
     "@types/tailwindcss": "^3.0.10",
     "@types/wait-on": "^5.3.1",
-    "autoprefixer": "^10.4.4",
+    "autoprefixer": "^10.4.5",
     "concurrently": "^7.1.0",
-    "cypress": "^9.5.4",
+    "cypress": "^9.6.0",
     "execa": "^6.1.0",
     "postcss": "^8.4.12",
     "rehype-prism-plus": "^1.3.2",
@@ -48,8 +48,5 @@
     "typescript": "^4.6.3",
     "wait-on": "^6.0.1"
   },
-  "engines": {
-    "node": ">=14"
-  },
   "sideEffects": false
 }