mirror of
https://github.com/supabase/supabase.git
synced 2026-10-16 22:59:11 +03:00
Joshen Lim
09a1f431bc
## Context This is largely just a mechanical change here: Opting to use lucide icons with the `Icon` suffix across all icon imports within `studio` - so that it’s clearer which components are icons + reduces the possibility of name collision with our own components - e.g <User /> vs <UserIcon /> Also added a eslint rule for this: <img width="1069" height="167" alt="image" src="https://github.com/user-attachments/assets/7f36f443-5ca2-4bf6-8d22-86e774513bfc" /> And updated `AGENTS.md` as such: ``` Icons come from `lucide-react`, always imported with the `Icon` suffix (`import { CheckIcon, Trash2Icon } from 'lucide-react'`) — never the bare names (`Check`) or `Check as CheckIcon` aliases (lint-enforced). ```
37 lines
1.1 KiB
TypeScript
37 lines
1.1 KiB
TypeScript
import { XIcon } from 'lucide-react'
|
|
import { Button } from 'ui'
|
|
|
|
import { useDataTable } from './providers/DataTableProvider'
|
|
import { ShortcutTooltip } from '@/components/ui/ShortcutTooltip'
|
|
import { SHORTCUT_IDS } from '@/state/shortcuts/registry'
|
|
import { useShortcut } from '@/state/shortcuts/useShortcut'
|
|
|
|
export interface DataTableResetButtonProps {
|
|
/** Called alongside `table.resetColumnFilters()` — for filters that live outside TanStack Table's columnFilters state (e.g. a cross-cutting URL param). */
|
|
onReset?: () => void
|
|
}
|
|
|
|
export function DataTableResetButton({ onReset }: DataTableResetButtonProps) {
|
|
const { table } = useDataTable()
|
|
const reset = () => {
|
|
table.resetColumnFilters()
|
|
onReset?.()
|
|
}
|
|
|
|
useShortcut(SHORTCUT_IDS.DATA_TABLE_RESET_FILTERS, reset, {
|
|
registerInCommandMenu: true,
|
|
})
|
|
|
|
return (
|
|
<ShortcutTooltip
|
|
shortcutId={SHORTCUT_IDS.DATA_TABLE_RESET_FILTERS}
|
|
label="Reset filters"
|
|
side="left"
|
|
>
|
|
<Button size="tiny" onClick={reset} icon={<XIcon />}>
|
|
Reset
|
|
</Button>
|
|
</ShortcutTooltip>
|
|
)
|
|
}
|