pengjunjie/webapp-conversation
1
0
Fork 1
mirror of https://github.com/langgenius/webapp-conversation.git synced 2025-12-08 17:32:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

✨[Error] Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect either doesn't have a dependency array, or one of the dependencies changes on every render.

Browse Source 
error (intercept-console-error.js:57)
	getRootForUpdatedFiber (react-dom-client.development.js:3899)
	dispatchSetStateInternal (react-dom-client.development.js:8249)
	dispatchSetState (react-dom-client.development.js:8209)
	(anonymous function) (react-tooltip.min.mjs:18:14416)
This commit is contained in:
Eric-Guo
2025-09-13 17:12:13 +08:00
committed by lyzno1
parent 18a4229464
commit 34bb34f890
2 changed files with 29 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
app/components/base/tooltip/index.tsx
View File

@ -1,9 +1,8 @@
'use client' 'use client'
import classNames from 'classnames' import classNames from 'classnames'
import type { FC } from 'react' import type { FC } from 'react'
import React from 'react' import React, { useState } from 'react'
import { Tooltip as ReactTooltip } from 'react-tooltip' // fixed version to 5.8.3 https://github.com/ReactTooltip/react-tooltip/issues/972 import { PortalToFollowElem, PortalToFollowElemContent, PortalToFollowElemTrigger } from '@/app/components/base/portal-to-follow-elem'
import 'react-tooltip/dist/react-tooltip.css'
type TooltipProps = { type TooltipProps = {
selector: string selector: string
@ -15,6 +14,10 @@ type TooltipProps = {
children: React.ReactNode children: React.ReactNode
} }
const arrow = (
<svg className="absolute text-white h-2 w-full left-0 top-full" x="0px" y="0px" viewBox="0 0 255 255"><polygon className="fill-current" points="0,0 127.5,127.5 255,0"></polygon></svg>
)
const Tooltip: FC<TooltipProps> = ({ const Tooltip: FC<TooltipProps> = ({
selector, selector,
content, content,
@ -24,22 +27,31 @@ const Tooltip: FC<TooltipProps> = ({
className, className,
clickable, clickable,
}) => { }) => {
const [open, setOpen] = useState(false)
const triggerMethod = clickable ? 'click' : 'hover'
return ( return (
<div className='tooltip-container'> <PortalToFollowElem
{React.cloneElement(children as React.ReactElement, { open={open}
'data-tooltip-id': selector, onOpenChange={setOpen}
}) placement={position}
} offset={10}
<ReactTooltip >
id={selector} <PortalToFollowElemTrigger
content={content} data-selector={selector}
className={classNames('!bg-white !text-xs !font-normal !text-gray-700 !shadow-lg !opacity-100', className)} onClick={() => triggerMethod === 'click' && setOpen(v => !v)}
place={position} onMouseEnter={() => triggerMethod === 'hover' && setOpen(true)}
clickable={clickable} onMouseLeave={() => triggerMethod === 'hover' && setOpen(false)}
> >
{htmlContent && htmlContent} {children}
</ReactTooltip> </PortalToFollowElemTrigger>
</div> <PortalToFollowElemContent className="z-[999]">
<div className={classNames('relative px-3 py-2 text-xs font-normal text-gray-700 bg-white rounded-md shadow-lg', className)}>
{htmlContent ?? content}
{arrow}
</div>
</PortalToFollowElemContent>
</PortalToFollowElem>
) )
} }

1
app/components/welcome/index.tsx
View File

@ -37,7 +37,6 @@ const Welcome: FC<IWelcomeProps> = ({
savedInputs, savedInputs,
onInputsChange, onInputsChange,
}) => { }) => {
console.log(promptConfig)
const { t } = useTranslation() const { t } = useTranslation()
const hasVar = promptConfig.prompt_variables.length > 0 const hasVar = promptConfig.prompt_variables.length > 0
const [isFold, setIsFold] = useState<boolean>(true) const [isFold, setIsFold] = useState<boolean>(true)