diff --git a/src/panels/corpglory-dataexporter-panel/components/Panel.tsx b/src/panels/corpglory-dataexporter-panel/components/Panel.tsx index cf2d4b4..0caac7e 100644 --- a/src/panels/corpglory-dataexporter-panel/components/Panel.tsx +++ b/src/panels/corpglory-dataexporter-panel/components/Panel.tsx @@ -3,7 +3,7 @@ import { PanelOptions, TaskTableRowConfig, QueryTableRowConfig, DatasourceType } import { convertTimestampToDate, getDashboardUid } from '../../../utils'; import { CLOSE_ICON_BASE_64, DOWNLOAD_ICON_BASE_64, SELECT_ICON_BASE_64, UNSELECT_ICON_BASE_64 } from '../../../icons'; -import { queryApi } from '../../../services/api_service'; +import { getTasks, queryApi } from '../../../services/api_service'; import { getDashboardByUid, getDatasources } from '../../../services/grafana_backend_service'; import { contextSrv } from 'grafana/app/core/core'; @@ -21,13 +21,15 @@ import { DataQuery, DataSourceSettings, } from '@grafana/data'; +import { RefreshEvent } from '@grafana/runtime'; import React, { useState, useEffect } from 'react'; import * as _ from 'lodash'; interface Props extends PanelProps {} -export function Panel({ width, height, timeRange }: Props) { +export function Panel({ width, height, timeRange, eventBus }: Props) { + // TODO: Dashboard type const [dashboard, setDashboard] = useState(null); const [datasources, setDatasources] = useState(null); @@ -96,16 +98,7 @@ export function Panel({ width, height, timeRange }: Props) { setTasksDataFrame(dataFrame); }, [tasks]); - useEffect(() => { - // TODO: move this function to API Service - async function getTasks(): Promise { - return queryApi('/task', {}); - } - - getTasks() - .then((tasks) => setTasks(tasks)) - .catch((err) => console.error(err)); - }, []); + useEffect(refresh, []); useEffect(() => { if (queries === null) { @@ -114,6 +107,15 @@ export function Panel({ width, height, timeRange }: Props) { setQueriesDataFrame(getDataFrameForQueriesTable(queries)); }, [queries]); + function refresh(): void { + console.log('rfrsh') + getTasks() + .then((tasks) => setTasks(tasks)) + .catch((err) => console.error(err)); + } + + eventBus.subscribe(RefreshEvent, refresh); + function getDatasourceByUid(uid?: string): DataSourceSettings | undefined { if (_.isNil(uid)) { console.warn(`uid is required to get datasource`); @@ -137,7 +139,6 @@ export function Panel({ width, height, timeRange }: Props) { // TODO: timerange picker const timerange: [number, number] = [timeRange.from.unix(), timeRange.to.unix()]; - // TODO: move this function to API Service await queryApi('/task', { method: 'POST', @@ -145,13 +146,13 @@ export function Panel({ width, height, timeRange }: Props) { from: timerange[0] * 1000, to: timerange[1] * 1000, // @ts-ignore - username: contextSrv.user.username, + username: contextSrv.user.name, tasks: selectedQueries, url: window.location.toString(), }, }); - // TODO: refresh panel (or get websocket events) + refresh(); onCloseModal(); unselectAllQueries(); @@ -241,7 +242,7 @@ export function Panel({ width, height, timeRange }: Props) { { name: 'User', type: FieldType.string, - values: _.map(configs, (config) => config.user), + values: _.map(configs, (config) => config.username), }, { name: 'Datasource', @@ -256,7 +257,7 @@ export function Panel({ width, height, timeRange }: Props) { { name: 'Progress', type: FieldType.string, - values: _.map(configs, (config) => `${config.progress}%`), + values: _.map(configs, (config) => `${(config.progress * 100).toFixed(0)}%`), }, { name: 'Status', diff --git a/src/panels/corpglory-dataexporter-panel/types.ts b/src/panels/corpglory-dataexporter-panel/types.ts index 2e82846..c83ef92 100644 --- a/src/panels/corpglory-dataexporter-panel/types.ts +++ b/src/panels/corpglory-dataexporter-panel/types.ts @@ -4,13 +4,12 @@ export interface PanelOptions {} export type TaskTableRowConfig = { timestamp: number; - // TODO: rename user to username - user: string; + username: string; datasourceRef: DataSourceRef; rowsCount: number; progress: number; status: string; - downloadLink: string; + filename?: string; }; export type QueryTableRowConfig = Omit & { diff --git a/src/services/api_service.ts b/src/services/api_service.ts index cdc90d4..84b2fc4 100644 --- a/src/services/api_service.ts +++ b/src/services/api_service.ts @@ -1,3 +1,5 @@ +import { TaskTableRowConfig } from '../panels/corpglory-dataexporter-panel/types'; + import axios from 'axios'; export const API_HOST = `${window.location.protocol}//${window.location.host}/`; @@ -39,3 +41,7 @@ export const queryApi = async (path: string, config: RequestConfig) => return response.data as RT; }; + +export async function getTasks(): Promise { + return queryApi('/task', {}); +}