From fe33d561315107f06b753f2ecedcf976e763f21c Mon Sep 17 00:00:00 2001
From: Anton Tranelis <mail@antontranelis.de>
Date: Thu, 21 Nov 2024 10:20:03 +0100
Subject: [PATCH] profile fix part 1

---
 .../ItemPopupComponents/HeaderView.tsx        |  1 +
 .../ItemPopupComponents/TextView.tsx          | 68 ++++++++++---------
 2 files changed, 38 insertions(+), 31 deletions(-)

diff --git a/src/Components/Map/Subcomponents/ItemPopupComponents/HeaderView.tsx b/src/Components/Map/Subcomponents/ItemPopupComponents/HeaderView.tsx
index 71c637b2..078ae834 100644
--- a/src/Components/Map/Subcomponents/ItemPopupComponents/HeaderView.tsx
+++ b/src/Components/Map/Subcomponents/ItemPopupComponents/HeaderView.tsx
@@ -103,6 +103,7 @@ export function HeaderView({
             <div className={`${avatar ? 'tw-ml-2' : ''} tw-overflow-hidden`}>
               <div
                 className={`${big ? 'xl:tw-text-3xl tw-text-2xl' : 'tw-text-xl'} tw-font-semibold tw-truncate`}
+                title={title}
               >
                 {title}
               </div>
diff --git a/src/Components/Map/Subcomponents/ItemPopupComponents/TextView.tsx b/src/Components/Map/Subcomponents/ItemPopupComponents/TextView.tsx
index 8ba7f09b..dad03843 100644
--- a/src/Components/Map/Subcomponents/ItemPopupComponents/TextView.tsx
+++ b/src/Components/Map/Subcomponents/ItemPopupComponents/TextView.tsx
@@ -1,19 +1,17 @@
+/* eslint-disable no-console */
 /* eslint-disable @typescript-eslint/no-unnecessary-condition */
-/* eslint-disable @typescript-eslint/restrict-template-expressions */
-/* eslint-disable @typescript-eslint/no-unsafe-argument */
-/* eslint-disable @typescript-eslint/no-non-null-assertion */
 /* eslint-disable @typescript-eslint/no-unsafe-assignment */
 /* eslint-disable @typescript-eslint/restrict-plus-operands */
 /* eslint-disable @typescript-eslint/no-unsafe-return */
 /* eslint-disable @typescript-eslint/no-unsafe-member-access */
 /* eslint-disable @typescript-eslint/no-unsafe-call */
-import { memo } from 'react'
+import { memo, useEffect } from 'react'
 import Markdown from 'react-markdown'
 import remarkBreaks from 'remark-breaks'
 
 import { useAddFilterTag } from '#components/Map/hooks/useFilter'
 import { useTags } from '#components/Map/hooks/useTags'
-import { Item } from '#src/types'
+import { Item, Tag } from '#src/types'
 import { decodeTag } from '#utils/FormatTags'
 import { getValue } from '#utils/GetValue'
 import { hashTagRegex } from '#utils/HashTagRegex'
@@ -76,47 +74,54 @@ export const TextView = ({
     })
   }
 
-  // eslint-disable-next-line react/prop-types
   const CustomH1 = ({ children }) => <h1 className='tw-text-xl tw-font-bold'>{children}</h1>
-  // eslint-disable-next-line react/prop-types
+
   const CustomH2 = ({ children }) => <h2 className='tw-text-lg tw-font-bold'>{children}</h2>
-  // eslint-disable-next-line react/prop-types
+
   const CustomH3 = ({ children }) => <h3 className='tw-text-base tw-font-bold'>{children}</h3>
-  // eslint-disable-next-line react/prop-types
+
   const CustomH4 = ({ children }) => <h4 className='tw-text-base tw-font-bold'>{children}</h4>
-  // eslint-disable-next-line react/prop-types
+
   const CustomH5 = ({ children }) => <h5 className='tw-text-sm tw-font-bold'>{children}</h5>
-  // eslint-disable-next-line react/prop-types
+
   const CustomH6 = ({ children }) => <h6 className='tw-text-sm tw-font-bold'>{children}</h6>
-  // eslint-disable-next-line react/prop-types
+
   const CustomParagraph = ({ children }) => <p className='!tw-my-2'>{children}</p>
-  // eslint-disable-next-line react/prop-types
+
   const CustomUnorderdList = ({ children }) => (
     <ul className='tw-list-disc tw-list-inside'>{children}</ul>
   )
-  // eslint-disable-next-line react/prop-types
+
   const CustomOrderdList = ({ children }) => (
     <ol className='tw-list-decimal tw-list-inside'>{children}</ol>
   )
-  // eslint-disable-next-line react/prop-types
+
   const CustomHorizontalRow = ({ children }) => <hr className='tw-border-current'>{children}</hr>
   // eslint-disable-next-line react/prop-types
   const CustomImage = ({ alt, src, title }) => (
     <img className='tw-max-w-full tw-rounded tw-shadow' src={src} alt={alt} title={title} />
   )
-  // eslint-disable-next-line react/prop-types
+
   const CustomExternalLink = ({ href, children }) => (
     <a className='tw-font-bold tw-underline' href={href} target='_blank' rel='noreferrer'>
       {' '}
       {children}
     </a>
   )
-  /* eslint-disable react/prop-types */
-  const CustomHashTagLink = ({ children, tag, item }) => {
+
+  const CustomHashTagLink = ({
+    children,
+    tag,
+    item,
+  }: {
+    children: string
+    tag: Tag
+    item?: Item
+  }) => {
     return (
       <a
         style={{ color: tag ? tag.color : '#faa', fontWeight: 'bold', cursor: 'pointer' }}
-        key={tag ? tag.name + item.id : item.id}
+        key={tag ? tag.name + item?.id : item?.id}
         onClick={(e) => {
           e.stopPropagation()
           addFilterTag(tag)
@@ -126,7 +131,6 @@ export const TextView = ({
       </a>
     )
   }
-  /* eslint-enable react/prop-types */
 
   // eslint-disable-next-line react/display-name
   const MemoizedVideoEmbed = memo(({ url }: { url: string }) => (
@@ -144,32 +148,34 @@ export const TextView = ({
       remarkPlugins={[remarkBreaks]}
       components={{
         p: CustomParagraph,
-        a: ({ href, children }) => {
-          // eslint-disable-next-line react/prop-types
+        a: ({ href, children }: { href: string; children: string }) => {
           const isYouTubeVideo = href?.startsWith('https://www.youtube.com/watch?v=')
-          // eslint-disable-next-line react/prop-types
+
           const isRumbleVideo = href?.startsWith('https://rumble.com/embed/')
 
           if (isYouTubeVideo) {
-            // eslint-disable-next-line react/prop-types
             const videoId = href?.split('v=')[1].split('&')[0]
             const youtubeEmbedUrl = `https://www.youtube-nocookie.com/embed/${videoId}`
 
             return <MemoizedVideoEmbed url={youtubeEmbedUrl}></MemoizedVideoEmbed>
           }
           if (isRumbleVideo) {
-            return <MemoizedVideoEmbed url={href!}></MemoizedVideoEmbed>
+            return <MemoizedVideoEmbed url={href}></MemoizedVideoEmbed>
           }
-          // eslint-disable-next-line react/prop-types
+
           if (href?.startsWith('#')) {
+            console.log(href.slice(1).toLowerCase())
+            console.log(tags)
             const tag = tags.find(
               (t) => t.name.toLowerCase() === decodeURI(href).slice(1).toLowerCase(),
             )
-            return (
-              <CustomHashTagLink tag={tag} item={item}>
-                {children}
-              </CustomHashTagLink>
-            )
+            if (tag)
+              return (
+                <CustomHashTagLink tag={tag} item={item}>
+                  {children}
+                </CustomHashTagLink>
+              )
+            else return children
           } else {
             return <CustomExternalLink href={href}>{children}</CustomExternalLink>
           }