Move to TanStack Start from Next.js (#184)

web/shared/la-editor/hooks/use-text-menu-commands.ts

@@ -0,0 +1,48 @@
+import * as React from "react"
+import { Editor } from "@tiptap/react"
+
+export const useTextmenuCommands = (editor: Editor) => {
+  const onBold = React.useCallback(
+    () => editor.chain().focus().toggleBold().run(),
+    [editor],
+  )
+  const onItalic = React.useCallback(
+    () => editor.chain().focus().toggleItalic().run(),
+    [editor],
+  )
+  const onStrike = React.useCallback(
+    () => editor.chain().focus().toggleStrike().run(),
+    [editor],
+  )
+  const onCode = React.useCallback(
+    () => editor.chain().focus().toggleCode().run(),
+    [editor],
+  )
+  const onCodeBlock = React.useCallback(
+    () => editor.chain().focus().toggleCodeBlock().run(),
+    [editor],
+  )
+  const onQuote = React.useCallback(
+    () => editor.chain().focus().toggleBlockquote().run(),
+    [editor],
+  )
+  const onLink = React.useCallback(
+    (url: string, inNewTab?: boolean) =>
+      editor
+        .chain()
+        .focus()
+        .setLink({ href: url, target: inNewTab ? "_blank" : "" })
+        .run(),
+    [editor],
+  )
+
+  return {
+    onBold,
+    onItalic,
+    onStrike,
+    onCode,
+    onCodeBlock,
+    onQuote,
+    onLink,
+  }
+}

web/shared/la-editor/hooks/use-text-menu-states.ts

@@ -0,0 +1,34 @@
+import * as React from "react"
+import { Editor } from "@tiptap/react"
+import { ShouldShowProps } from "../types"
+import { isCustomNodeSelected, isTextSelected } from "../lib/utils"
+
+export const useTextmenuStates = (editor: Editor) => {
+  const shouldShow = React.useCallback(
+    ({ view, from }: ShouldShowProps) => {
+      if (!view) {
+        return false
+      }
+
+      const domAtPos = view.domAtPos(from || 0).node as HTMLElement
+      const nodeDOM = view.nodeDOM(from || 0) as HTMLElement
+      const node = nodeDOM || domAtPos
+
+      if (isCustomNodeSelected(editor, node)) {
+        return false
+      }
+
+      return isTextSelected({ editor })
+    },
+    [editor],
+  )
+
+  return {
+    isBold: editor.isActive("bold"),
+    isItalic: editor.isActive("italic"),
+    isStrike: editor.isActive("strike"),
+    isUnderline: editor.isActive("underline"),
+    isCode: editor.isActive("code"),
+    shouldShow,
+  }
+}