add tableflip and unflip commands (#2075)

Author: LevitatingBusinessMan

src/app/features/room/RoomInput.tsx

@@ -103,7 +103,7 @@ import {
 } from '../../utils/room';
 import { sanitizeText } from '../../utils/sanitize';
 import { CommandAutocomplete } from './CommandAutocomplete';
-import { Command, SHRUG, useCommands } from '../../hooks/useCommands';
+import { Command, SHRUG, TABLEFLIP, UNFLIP, useCommands } from '../../hooks/useCommands';
 import { mobileOrTablet } from '../../utils/user-agent';
 import { useElementSizeObserver } from '../../hooks/useElementSizeObserver';
 import { ReplyLayout, ThreadIndicator } from '../../components/message';
@@ -270,6 +270,12 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
       } else if (commandName === Command.Shrug) {
         plainText = `${SHRUG} ${plainText}`;
         customHtml = `${SHRUG} ${customHtml}`;
+      } else if (commandName === Command.TableFlip) {
+        plainText = `${TABLEFLIP} ${plainText}`;
+        customHtml = `${TABLEFLIP} ${customHtml}`;
+      } else if (commandName === Command.UnFlip) {
+        plainText = `${UNFLIP} ${plainText}`;
+        customHtml = `${UNFLIP} ${customHtml}`;
       } else if (commandName) {
         const commandContent = commands[commandName as Command];
         if (commandContent) {

src/app/hooks/useCommands.ts

@@ -6,6 +6,8 @@ import * as roomActions from '../../client/action/room';
 import { useRoomNavigate } from './useRoomNavigate';
 
 export const SHRUG = '¯\\_(ツ)_/¯';
+export const TABLEFLIP = '(╯°□°)╯︵ ┻━┻';
+export const UNFLIP = '┬─┬ノ( º_ºノ)';
 
 export function parseUsersAndReason(payload: string): {
   users: string[];
@@ -48,6 +50,8 @@ export enum Command {
   MyRoomAvatar = 'myroomavatar',
   ConvertToDm = 'converttodm',
   ConvertToRoom = 'converttoroom',
+  TableFlip = 'tableflip',
+  UnFlip = 'unflip',
 }
 
 export type CommandContent = {
@@ -78,6 +82,16 @@ export const useCommands = (mx: MatrixClient, room: Room): CommandRecord => {
         description: 'Send ¯\\_(ツ)_/¯ as message',
         exe: async () => undefined,
       },
+      [Command.TableFlip]: {
+        name: Command.TableFlip,
+        description: `Send ${TABLEFLIP} as message`,
+        exe: async () => undefined,
+      },
+      [Command.UnFlip]: {
+        name: Command.UnFlip,
+        description: `Send ${UNFLIP} as message`,
+        exe: async () => undefined,
+      },
       [Command.StartDm]: {
         name: Command.StartDm,
         description: 'Start direct message with user. Example: /startdm userId1',