Merge pull request #99 from utopia-os/remove-tribute

fix(source): remove tribute

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "utopia-ui",
-  "version": "3.0.38",
+  "version": "3.0.39",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "utopia-ui",
-      "version": "3.0.38",
+      "version": "3.0.39",
       "license": "GPL-3.0-only",
       "dependencies": {
         "@heroicons/react": "^2.0.17",
@@ -27,7 +27,6 @@
         "react-string-replace": "^1.1.1",
         "react-toastify": "^9.1.3",
         "remark-breaks": "^4.0.0",
-        "tributejs": "github:coreydales/tribute#Fix-compile-error-T-does-not-satisfy-the-constraint",
         "tw-elements": "^1.0.0",
         "yet-another-react-lightbox": "^3.21.7"
       },
@@ -7728,11 +7727,6 @@
         "node": ">=8.0"
       }
     },
-    "node_modules/tributejs": {
-      "version": "5.1.3",
-      "resolved": "git+ssh://git@github.com/coreydales/tribute.git#126b8fcc9addc673946dc78d8f6bda08ac73c9a3",
-      "license": "MIT"
-    },
     "node_modules/trim-lines": {
       "version": "3.0.1",
       "license": "MIT",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "utopia-ui",
-  "version": "3.0.38",
+  "version": "3.0.39",
   "description": "Reuseable React Components to build mapping apps for real life communities and networks",
   "repository": "https://github.com/utopia-os/utopia-ui",
   "homepage:": "https://utopia-os.org/",
@@ -88,7 +88,6 @@
     "react-string-replace": "^1.1.1",
     "react-toastify": "^9.1.3",
     "remark-breaks": "^4.0.0",
-    "tributejs": "github:coreydales/tribute#Fix-compile-error-T-does-not-satisfy-the-constraint",
     "tw-elements": "^1.0.0",
     "yet-another-react-lightbox": "^3.21.7"
   },

src/Components/Input/TextAreaInput.tsx

@@ -3,7 +3,6 @@
 /* eslint-disable @typescript-eslint/restrict-template-expressions */
 /* eslint-disable @typescript-eslint/prefer-nullish-coalescing */
 import { useEffect, useRef, useState } from 'react'
-import Tribute from 'tributejs'
 
 import { useTags } from '#components/Map/hooks/useTags'
 
@@ -37,9 +36,6 @@ export function TextAreaInput({
   const ref = useRef<HTMLTextAreaElement>(null)
   const [inputValue, setInputValue] = useState<string>(defaultValue)
 
-  // prevent react18 from calling useEffect twice
-  const init = useRef(false)
-
   const tags = useTags()
 
   const values: KeyValue[] = []
@@ -48,30 +44,6 @@ export function TextAreaInput({
     values.push({ key: tag.name, value: tag.name, color: tag.color })
   })
 
-  const tribute = new Tribute({
-    containerClass: 'tw-z-3000 tw-bg-base-100 tw-p-2 tw-rounded-lg tw-shadow',
-    selectClass: 'tw-font-bold',
-    trigger: '#',
-    values,
-    menuShowMinLength: 3,
-    noMatchTemplate: () => {
-      return ''
-    },
-    menuItemTemplate: function (item) {
-      return `<span style="color: ${item.original.color}; padding: 5px; border-radius: 3px;">#${item.string}</span>`
-    },
-  })
-
-  useEffect(() => {
-    if (!init.current) {
-      if (ref.current) {
-        tribute.attach(ref.current)
-      }
-      init.current = true
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [ref])
-
   useEffect(() => {
     setInputValue(defaultValue)
   }, [defaultValue])