5f533247e1
* Update Supabase docs URLs to use env variable Co-authored-by: a <a@alaisteryoung.com> * Refactor: Use DOCS_URL constant for documentation links This change centralizes documentation links using a new DOCS_URL constant, improving maintainability and consistency. Co-authored-by: a <a@alaisteryoung.com> * Refactor: Use DOCS_URL constant for all documentation links This change replaces hardcoded documentation URLs with a centralized constant, improving maintainability and consistency. Co-authored-by: a <a@alaisteryoung.com> * replace more instances * ci: Autofix updates from GitHub workflow * remaining instances * fix duplicate useRouter --------- Co-authored-by: Cursor Agent <cursoragent@cursor.com> Co-authored-by: alaister <10985857+alaister@users.noreply.github.com>
75 lines
2.4 KiB
TypeScript
75 lines
2.4 KiB
TypeScript
import Link from 'next/link'
|
|
import ReactMarkdown from 'react-markdown'
|
|
|
|
import { createLintSummaryPrompt, lintInfoMap } from 'components/interfaces/Linter/Linter.utils'
|
|
import { Lint } from 'data/lint/lint-query'
|
|
import { DOCS_URL } from 'lib/constants'
|
|
import { ExternalLink } from 'lucide-react'
|
|
import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
|
|
import { AiIconAnimation, Button } from 'ui'
|
|
import { EntityTypeIcon, LintCTA, LintEntity } from './Linter.utils'
|
|
|
|
interface LintDetailProps {
|
|
lint: Lint
|
|
projectRef: string
|
|
onAskAssistant?: () => void
|
|
}
|
|
|
|
const LintDetail = ({ lint, projectRef, onAskAssistant }: LintDetailProps) => {
|
|
const snap = useAiAssistantStateSnapshot()
|
|
|
|
return (
|
|
<div>
|
|
<h3 className="text-sm mb-2">Entity</h3>
|
|
<div className="flex items-center gap-1 px-2 py-0.5 bg-surface-200 border rounded-lg text-sm mb-6 w-fit">
|
|
<EntityTypeIcon type={lint.metadata?.type} />
|
|
<LintEntity metadata={lint.metadata} />
|
|
</div>
|
|
|
|
<h3 className="text-sm mb-2">Issue</h3>
|
|
<ReactMarkdown className="leading-6 text-sm text-foreground-light mb-6">
|
|
{lint.detail.replace(/\\`/g, '`')}
|
|
</ReactMarkdown>
|
|
<h3 className="text-sm mb-2">Description</h3>
|
|
<ReactMarkdown className="text-sm text-foreground-light mb-6">
|
|
{lint.description.replace(/\\`/g, '`')}
|
|
</ReactMarkdown>
|
|
|
|
<h3 className="text-sm mb-2">Resolve</h3>
|
|
<div className="flex items-center gap-2">
|
|
<Button
|
|
icon={<AiIconAnimation className="scale-75 w-3 h-3" />}
|
|
onClick={() => {
|
|
onAskAssistant?.()
|
|
snap.newChat({
|
|
name: 'Summarize lint',
|
|
open: true,
|
|
initialInput: createLintSummaryPrompt(lint),
|
|
})
|
|
}}
|
|
>
|
|
Ask Assistant
|
|
</Button>
|
|
<LintCTA title={lint.name} projectRef={projectRef} metadata={lint.metadata} />
|
|
<Button asChild type="text">
|
|
<Link
|
|
href={
|
|
lintInfoMap.find((item) => item.name === lint.name)?.docsLink ||
|
|
`${DOCS_URL}/guides/database/database-linter`
|
|
}
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
className="no-underline"
|
|
>
|
|
<span className="flex items-center gap-2">
|
|
Learn more <ExternalLink size={14} />
|
|
</span>
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default LintDetail
|