From d408355b4e394297e9368099d9ae5b44fe708889 Mon Sep 17 00:00:00 2001 From: vargburz Date: Mon, 9 Jan 2023 21:10:40 +0300 Subject: [PATCH 1/5] add date picker --- .../components/Panel.tsx | 24 ++++++++++++------- 1 file changed, 16 insertions(+), 8 deletions(-) diff --git a/src/panels/corpglory-dataexporter-panel/components/Panel.tsx b/src/panels/corpglory-dataexporter-panel/components/Panel.tsx index 9c7494a..e55ae90 100644 --- a/src/panels/corpglory-dataexporter-panel/components/Panel.tsx +++ b/src/panels/corpglory-dataexporter-panel/components/Panel.tsx @@ -8,7 +8,7 @@ import { getDashboardByUid, getDatasources } from '../../../services/grafana_bac import { contextSrv } from 'grafana/app/core/core'; -import { Table, Button, HorizontalGroup, Modal, LoadingPlaceholder } from '@grafana/ui'; +import { Table, Button, HorizontalGroup, Modal, LoadingPlaceholder, TimeRangeInput } from '@grafana/ui'; import { PanelProps, toDataFrame, @@ -20,6 +20,7 @@ import { PanelModel, DataQuery, DataSourceSettings, + TimeRange, } from '@grafana/data'; import { RefreshEvent } from '@grafana/runtime'; @@ -41,6 +42,8 @@ export function Panel({ width, height, timeRange, eventBus }: Props) { const [isModalOpen, setModalVisibility] = useState(false); + const [selectedTimeRange, setTimeRange] = useState(timeRange); + useEffect(() => { async function getCurrentDashboard(): Promise { const currentDashboardUid = getDashboardUid(window.location.toString()); @@ -90,10 +93,10 @@ export function Panel({ width, height, timeRange, eventBus }: Props) { }, [dashboard, datasources]); // eslint-disable-line react-hooks/exhaustive-deps useEffect(() => { - if (tasks === null) { - return; - } - const dataFrame = getDataFrameForTaskTable(tasks); + // if (tasks === null) { + // return; + // } + const dataFrame = getDataFrameForTaskTable([]); setTasksDataFrame(dataFrame); }, [tasks]); // eslint-disable-line react-hooks/exhaustive-deps @@ -143,9 +146,8 @@ export function Panel({ width, height, timeRange, eventBus }: Props) { async function onAddTaskClick(): Promise { const selectedQueries = _.filter(queries, (query: QueryTableRowConfig) => query.selected); - // TODO: timerange picker - const timerange: [number, number] = [timeRange.from.unix(), timeRange.to.unix()]; + const timerange: [number, number] = [selectedTimeRange.from.unix(), selectedTimeRange.to.unix()]; // TODO: move this function to API Service await queryApi('/task', { method: 'POST', @@ -375,7 +377,13 @@ export function Panel({ width, height, timeRange, eventBus }: Props) { ) : (
- + + { + setTimeRange(newTimeRange); + }} + /> - + {queriesDataFrame === null ? ( // TODO: if datasource responds with error, display the error ) : (
-
- - { - setTimeRange(newTimeRange); - }} - /> - - + + + { + setTimeRange(newTimeRange); + }} + /> + +
+ + + + )} @@ -404,3 +424,13 @@ export function Panel({ width, height, timeRange, eventBus }: Props) { ); } + +const getStyles = () => ({ + calendarModal: css` + section { + position: fixed; + top: 20%; + z-index: 1061; + } + `, +}); From d44907e87d9817d4e962f007453bd8406f1ddeeb Mon Sep 17 00:00:00 2001 From: vargburz Date: Wed, 11 Jan 2023 19:13:21 +0300 Subject: [PATCH 4/5] fix import order --- .../corpglory-dataexporter-panel/components/Panel.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/panels/corpglory-dataexporter-panel/components/Panel.tsx b/src/panels/corpglory-dataexporter-panel/components/Panel.tsx index 17f9e73..1af10d9 100644 --- a/src/panels/corpglory-dataexporter-panel/components/Panel.tsx +++ b/src/panels/corpglory-dataexporter-panel/components/Panel.tsx @@ -1,5 +1,4 @@ import { PanelOptions, TaskTableRowConfig, QueryTableRowConfig, DatasourceType } from '../types'; -import { css } from '@emotion/css'; import { convertTimestampToDate, getDashboardUid } from '../../../utils'; import { CLOSE_ICON_BASE_64, DOWNLOAD_ICON_BASE_64, SELECT_ICON_BASE_64, UNSELECT_ICON_BASE_64 } from '../../../icons'; @@ -8,6 +7,7 @@ import { deleteTask, getStaticFile, getTasks, queryApi } from '../../../services import { getDashboardByUid, getDatasources } from '../../../services/grafana_backend_service'; import { contextSrv } from 'grafana/app/core/core'; +import { css } from '@emotion/css'; import { Table, @@ -103,10 +103,10 @@ export function Panel({ width, height, timeRange, eventBus }: Props) { }, [dashboard, datasources]); // eslint-disable-line react-hooks/exhaustive-deps useEffect(() => { - // if (tasks === null) { - // return; - // } - const dataFrame = getDataFrameForTaskTable([]); + if (tasks === null) { + return; + } + const dataFrame = getDataFrameForTaskTable(tasks); setTasksDataFrame(dataFrame); }, [tasks]); // eslint-disable-line react-hooks/exhaustive-deps From cb64c4894a83354d7f6b34fbda19b7052f03e855 Mon Sep 17 00:00:00 2001 From: rozetko Date: Thu, 12 Jan 2023 16:33:30 +0300 Subject: [PATCH 5/5] lint fix --- src/plugin_state.ts | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/plugin_state.ts b/src/plugin_state.ts index 39459b6..3aa8344 100644 --- a/src/plugin_state.ts +++ b/src/plugin_state.ts @@ -90,9 +90,13 @@ class PluginState { this.grafanaBackend.get(this.GRAFANA_PLUGIN_SETTINGS_URL); static updateGrafanaPluginSettings = async (data: UpdateGrafanaPluginSettingsProps, enabled = true) => - // @ts-ignore - // for some reason, there is no `options` argument in Grafana's public types for BackendSrv but it exists - this.grafanaBackend.post(this.GRAFANA_PLUGIN_SETTINGS_URL, { ...data, enabled, pinned: true }, { showSuccessAlert: false }); + this.grafanaBackend.post( + this.GRAFANA_PLUGIN_SETTINGS_URL, + { ...data, enabled, pinned: true }, + // @ts-ignore + // for some reason, there is no `options` argument in Grafana's public types for BackendSrv but it exists + { showSuccessAlert: false } + ); static createGrafanaToken = async () => { const baseUrl = '/api/auth/keys';