diff --git a/studio/components/interfaces/Settings/Logs/LogTable.tsx b/studio/components/interfaces/Settings/Logs/LogTable.tsx index 99900a05372..08133ed0dec 100644 --- a/studio/components/interfaces/Settings/Logs/LogTable.tsx +++ b/studio/components/interfaces/Settings/Logs/LogTable.tsx @@ -1,21 +1,23 @@ -import { useEffect, useState, useMemo, useCallback } from 'react' -import { Alert, Button, IconEye, IconEyeOff } from 'ui' import DataGrid, { Row, RowRendererProps } from '@supabase/react-data-grid' +import { useCallback, useEffect, useMemo, useState } from 'react' +import { Alert, Button, IconClipboard, IconEye, IconEyeOff } from 'ui' -import LogSelection, { LogSelectionProps } from './LogSelection' -import { LogData, QueryType } from './Logs.types' -import { isDefaultLogPreviewFormat } from './Logs.utils' import CSVButton from 'components/ui/CSVButton' +import { useStore } from 'hooks' +import { copyToClipboard } from 'lib/helpers' +import { isEqual } from 'lodash' +import { LogQueryError } from '.' +import AuthColumnRenderer from './LogColumnRenderers/AuthColumnRenderer' import DatabaseApiColumnRender from './LogColumnRenderers/DatabaseApiColumnRender' import DatabasePostgresColumnRender from './LogColumnRenderers/DatabasePostgresColumnRender' import DefaultPreviewColumnRenderer from './LogColumnRenderers/DefaultPreviewColumnRenderer' -import { LogQueryError } from '.' -import ResourcesExceededErrorRenderer from './LogsErrorRenderers/ResourcesExceededErrorRenderer' -import DefaultErrorRenderer from './LogsErrorRenderers/DefaultErrorRenderer' -import FunctionsLogsColumnRender from './LogColumnRenderers/FunctionsLogsColumnRender' import FunctionsEdgeColumnRender from './LogColumnRenderers/FunctionsEdgeColumnRender' -import AuthColumnRenderer from './LogColumnRenderers/AuthColumnRenderer' -import { isEqual } from 'lodash' +import FunctionsLogsColumnRender from './LogColumnRenderers/FunctionsLogsColumnRender' +import LogSelection, { LogSelectionProps } from './LogSelection' +import { LogData, QueryType } from './Logs.types' +import { isDefaultLogPreviewFormat } from './Logs.utils' +import DefaultErrorRenderer from './LogsErrorRenderers/DefaultErrorRenderer' +import ResourcesExceededErrorRenderer from './LogsErrorRenderers/ResourcesExceededErrorRenderer' interface Props { data?: Array @@ -64,6 +66,7 @@ const LogTable = ({ projectRef, params, }: Props) => { + const { ui } = useStore() const [focusedLog, setFocusedLog] = useState(null) const firstRow: LogData | undefined = data?.[0] as LogData const columnNames = Object.keys(data[0] || {}) @@ -170,6 +173,12 @@ const LogTable = ({ [] ) + const copyResultsToClipboard = () => { + copyToClipboard(stringData, () => { + ui.setNotification({ category: 'success', message: 'Results copied to clipboard.' }) + }) + } + const LogsExplorerTableHeader = () => (
@@ -192,6 +201,9 @@ const LogTable = ({ Histogram )} + Download
diff --git a/studio/tests/pages/projects/LogTable.test.js b/studio/tests/pages/projects/LogTable.test.js index 5e90b4b5482..ebedfab0bdf 100644 --- a/studio/tests/pages/projects/LogTable.test.js +++ b/studio/tests/pages/projects/LogTable.test.js @@ -26,7 +26,7 @@ test('can display log data', async () => { await screen.findByText(/something_value/) // render copy button - userEvent.click(await screen.findByText(/Copy/)) + userEvent.click(await screen.findByText('Copy')) await screen.findByText(/Copied/) }) diff --git a/studio/tests/pages/projects/logs-query.test.js b/studio/tests/pages/projects/logs-query.test.js index edb1c28c0f3..ef81e455226 100644 --- a/studio/tests/pages/projects/logs-query.test.js +++ b/studio/tests/pages/projects/logs-query.test.js @@ -178,7 +178,7 @@ test('bug: can edit query after selecting a log', async () => { const rowValue = await screen.findByText(/12345/) // row value // open up an show selection panel await userEvent.click(rowValue) - await screen.findByText(/Copy/) + await screen.findByText('Copy') // change the query let editor = container.querySelector('.monaco-editor') @@ -197,7 +197,7 @@ test('bug: can edit query after selecting a log', async () => { { timeout: 1000 } ) // closes the selection panel - await expect(screen.findByText(/Copy/)).rejects.toThrow() + await expect(screen.findByText('Copy')).rejects.toThrow() }) test('query warnings', async () => {