Files
supabase/apps/studio/components/interfaces/Settings/Logs/RecentQueriesItem.tsx
Gildas Garcia 96d43099bb chore: refactor Button API so that it can be used a standard button (#46880)
## Problem

Our `<Button>` component breaks the default `button` contract by
redefining the `type` prop to set its variant (`primary`, `default`,
etc) instead of the button type (`submit`, `button`, etc).
This is confusing and forces to write more code when using it with
shadcn components that expect/inject the standard button props.

## Solution

- rename the `type` prop to `variant`
- rename the `htmlType` prop to `type`
- propagate the changes where necessary
- format code

## How to test

As this is just prop renaming, if it builds it's ok

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-06-16 23:59:58 +02:00

40 lines
1.0 KiB
TypeScript

import { Play } from 'lucide-react'
import { useRouter } from 'next/router'
import { Button } from 'ui'
import SqlSnippetCode from './Logs.SqlSnippetCode'
import Table from '@/components/to-be-cleaned/Table'
import type { LogSqlSnippets } from '@/types'
interface Props {
item: LogSqlSnippets.Content
}
const RecentQueriesItem: React.FC<Props> = ({ item }) => {
const router = useRouter()
const { ref } = router.query
return (
<Table.tr key={item.sql}>
<Table.td
className={`expanded-row-content border-l border-r bg-alternative px-3! pt-0! pb-0! transition-all`}
>
<SqlSnippetCode>{item.sql}</SqlSnippetCode>
</Table.td>
<Table.td className="text-right">
<Button
variant="alternative"
iconRight={<Play size={10} />}
onClick={() =>
router.push(`/project/${ref}/logs/explorer?q=${encodeURIComponent(item.sql)}`)
}
>
Run
</Button>
</Table.td>
</Table.tr>
)
}
export default RecentQueriesItem