profile fix part 1

This commit is contained in:
Anton Tranelis 2024-11-21 10:20:03 +01:00
parent 43e798f44e
commit fe33d56131
2 changed files with 38 additions and 31 deletions

View File

@ -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>

View File

@ -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>
}