hermes-web/app/(protected)/commands/page.tsx

371 lines
13 KiB
TypeScript
Raw Normal View History

'use client';
import { cn } from "@/lib/utils";
interface ICommand {
name: string
description: string
syntax: string
permissions: string[]
version: string | undefined
examples: string[]
subcommands: ICommand[]
}
const COMMAND_PREFIX = '!'
const commands: ICommand[] = [
{
name: "nightbot",
description: "Interacts with Nightbot.",
syntax: "",
permissions: ["tts.commands.nightbot"],
version: "4.2",
examples: [],
subcommands: [
{
name: "play",
description: "Play the songs on the queue.",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "pause",
description: "Pause the currently playing song.",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "skip",
description: "Skip the currently playing song.",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "volume",
description: "Skip the currently playing song.",
syntax: "<volume 0-100>",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "clear_queue",
description: "Clears the queue.",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "clear_playlist",
description: "Clears the playlist.",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
]
},
{
name: "obs",
description: "Interacts with OBS.",
syntax: "<scene name> <source name>",
permissions: [],
version: "3.6",
examples: [],
subcommands: [
{
name: "rotate",
description: "Apply a rotational transformation",
syntax: "<rotation in degree>",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "x",
description: "Move element to a new X position",
syntax: "<x position in pixels>",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "y",
description: "Move element to a new Y position",
syntax: "<y position in pixels>",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
]
},
{
name: "refresh",
description: "Refreshes certain data being stored on the client.",
syntax: "",
permissions: [],
version: "3.2",
examples: [],
subcommands: [
{
name: "tts_voice_enabled",
description: "Refreshes the list of enabled TTS voices used by chat",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "word_filters",
description: "Refreshes the list of words filters",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "default_voice",
description: "Refreshes the default voice",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "redemptions",
description: "Refreshes the redemmptions",
syntax: "",
permissions: [],
version: "3.4",
examples: [],
subcommands: [],
},
{
name: "obs_cache",
description: "Refreshes the cache for OBS",
syntax: "",
permissions: [],
version: "3.7",
examples: [],
subcommands: [],
},
{
name: "permissions",
description: "Refreshes the group permissions",
syntax: "",
permissions: [],
version: "3.7",
examples: [],
subcommands: [],
}
]
},
{
name: "skip",
description: "Skips the currently playing message.",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: [
{
name: "all",
description: "Clears everything in queue and skips the currently playing message. This effectively runs !skipall command.",
syntax: "",
permissions: ["tts.commands.skipall"],
version: "3.9",
examples: [],
subcommands: []
},
]
},
{
name: "skipall",
description: "Clears everything in queue and skips the currently playing message.",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: []
},
{
name: "tts",
description: "Clears everything in queue and skips the currently playing message.",
syntax: "",
permissions: [],
version: "3.2",
examples: [],
subcommands: [
{
name: "enable",
description: "Enables a TTS voice.",
syntax: "<tts voice name>",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "disable",
description: "Disables a TTS voice",
syntax: "<tts voice name>",
permissions: [],
version: undefined,
examples: [],
subcommands: [],
},
{
name: "add",
description: "Adds a TTS voice to the list of available voices, case sensitive.",
syntax: "<name of tts voice>",
permissions: ["tom"],
version: "3.9",
examples: ["Brian"],
subcommands: []
},
{
name: "remove",
description: "Removes a TTS voice from the list of available voices.",
syntax: "<name of tts voice>",
permissions: ["tom"],
version: "3.9",
examples: [],
subcommands: []
},
{
name: "join",
description: "Voices the messages of another channel",
syntax: "<mention of other broadcaster>",
permissions: ["tts.commands.tts.join"],
version: "4.0",
examples: [],
subcommands: [],
},
{
name: "leave",
description: "Stop reading the messages of another channel",
syntax: "<mention of other broadcaster>",
permissions: ["tts.commands.tts.leave"],
version: "4.0",
examples: [],
subcommands: [],
}
]
},
{
name: "version",
description: "Sends a message to the console with version info.",
syntax: "",
permissions: [],
version: undefined,
examples: [],
subcommands: []
},
{
name: "voice",
description: "Change voice when reading messages for yourself.",
syntax: "<voice name>",
permissions: [],
version: undefined,
examples: ["brian"],
subcommands: [
{
name: "<mention of affected chatter>",
description: "Change chatter's voice when reading messages.",
syntax: "",
permissions: ["tts.commands.voice.admin"],
version: "4.0",
examples: ["brian @Nightbot"],
subcommands: []
}
]
}
]
const CommandsPage = () => {
return (
<div className="m-10">
<div className="text-center text-2xl">Commands</div>
<ul className="grid gap-3 p-6 w-full lg:grid-cols-[1fr_1fr]">
{commands.map((command) =>
<li key={command.name}
className="row-span-2">
<section
className="bg-background mt-5 p-2 rounded-lg align-top text-start flex h-full w-full select-none flex-col justify-start bg-gradient-to-b from-blue-400 to-blue-500 no-underline outline-none focus:shadow-md">
<div className="align-top items-center">
<p className="inline-block text-lg">{COMMAND_PREFIX}{command.name}</p>
{command.permissions.map(p =>
<div key={p}
className={"inline-block rounded-lg text-sm ml-0.5 mr-0.5 p-0.5 " + cn(
p == "tom" && "bg-white text-black",
p != "tom" && "bg-gray-400"
)}>
{p}
</div>
)}
{!!command.version &&
<div
className="inline-block rounded-lg text-sm ml-0.5 mr-0.5 p-0.5 bg-red-600">
version required: {command.version}
</div>
}
<div className="inline-block text-sm ml-0 md:ml-1 text-wrap">{command.description}</div>
</div>
{command.subcommands.length == 0 &&
<div>Syntax: {COMMAND_PREFIX}{command.name} {command.syntax}</div>
}
{command.examples.map(ex =>
<div key={command.name + " " + ex} className="bg-blend-darken">Example: {COMMAND_PREFIX}{command.name} {ex}</div>
)}
{command.subcommands.map(c =>
<div key={c.name} className="m-1 p-2 rounded-md bg-gradient-to-b from-blue-400 to-blue-500">
<div className="inline">
{COMMAND_PREFIX}{command.name} {command.syntax.length == 0 ? "" : command.syntax + " "}{c.name} {c.syntax}
</div>
{c.permissions.map(p =>
<div key={p}
className={"inline-block rounded-lg text-sm ml-0.5 mr-0.5 p-0.5 " + cn(
p == "tom" && "bg-white text-black",
p != "tom" && "bg-gray-400"
)}>
{p}
</div>
)}
{!!c.version &&
<div
className="inline rounded-lg text-sm ml-0.5 mr-0.5 p-0.5 bg-red-600">
version required: {c.version}
</div>
}
<div className="text-sm">{c.description}</div>
</div>
)}
</section>
</li>
)}
</ul>
</div>
);
}
export default CommandsPage;