From b6041c00f70b3f9d8b24dff9c6021745f1682117 Mon Sep 17 00:00:00 2001 From: rozetko Date: Fri, 20 Jan 2023 21:13:00 +0300 Subject: [PATCH] do not display unsupported actions for tasks && display success alert on download start --- src/icons.ts | 4 +- .../components/Panel.tsx | 102 +++++++++++------- 2 files changed, 63 insertions(+), 43 deletions(-) diff --git a/src/icons.ts b/src/icons.ts index af34bb9..72e4d55 100644 --- a/src/icons.ts +++ b/src/icons.ts @@ -1,7 +1,7 @@ export const CLOSE_ICON_BASE_64 = 'iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACJSURBVHgB7ZPRCcAgDESv0lWc0zhC53OIjmAVUpCSamL76YEoyfFIiAGWfldK6SwnKHyhep9xJ3iPcqgH5RyxV1VlBWYJypXVHMEiCaqBbRhAy3W3B76j954wq6ZSVZsOY+WXt6i9l2ymGTlUq0VpOcIqaQC96Zth01DN1zBBefVI4SNp9Za+6wLcH6DKFrfpxgAAAABJRU5ErkJggg=='; -export const DOWNLOAD_ICON_BASE_64 = - 'iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAADlSURBVHgB3ZPNDYJAEIVnN96lBA7A2RIsATuQiiwBSrAD7MAjCZBACXqFwPomMRtEwMVwgZeQhfn5mNnMEG1CaZoeiqKwTWJ3JkFCiEtVVU+8+r9iJRlKSrk3iqOFtWJglmXHf3yDwCRJbBxxnudh34cRYluMMbKGcgWNCIlnjEuIJ1JK2WzDWeKb7YHjONEsYBf6kTABY+mWuYX+3Xiex9UFU7D3FllfwLqueQvi/h8ZCtBprDLY703T6A0yWj2ArmSoxedQV4jSSz5xj4pmCi0/NKfrwNz5bdtaNENciOu6N1qNXhzZXHMb9Q+nAAAAAElFTkSuQmCC'; +export const OPTIONS_ICON_BASE_64 = + 'iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAMAAAC6V+0/AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAS1BMVEUAAADH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0NnH0Nn///+uWGxHAAAAF3RSTlMAABI4MAgNNbzy7JcQG6zvoPxPbavwDHoS9oEAAAABYktHRBibaYUeAAAACXBIWXMAAABgAAAAYADwa0LPAAAAB3RJTUUH5wEUFy4lfOQAfAAAAFdJREFUGNPFjkkKwCAQBEcd912TzP9/GglIQvBuXQoamm6ArbCHv7hAOaS0VkMSBWeAxjofIKacU4TgnTUIhYhqgz5EHVodKutw1o98vvU5dH2Hlpe2cgMuNAUd58WuNgAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAyMy0wMS0yMFQyMDo0NjozNyswMzowMDMOisYAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMjMtMDEtMjBUMjA6NDY6MzcrMDM6MDBCUzJ6AAAAAElFTkSuQmCC'; export const UNSELECT_ICON_BASE_64 = 'PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMC41IiB5PSIwLjUiIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNSIgcng9IjEuNSIgZmlsbD0iIzExMTIxNiIgc3Ryb2tlPSIjMkQyRTM0Ii8+Cjwvc3ZnPgo='; export const SELECT_ICON_BASE_64 = diff --git a/src/panels/corpglory-dataexporter-panel/components/Panel.tsx b/src/panels/corpglory-dataexporter-panel/components/Panel.tsx index 82488a1..90514ac 100644 --- a/src/panels/corpglory-dataexporter-panel/components/Panel.tsx +++ b/src/panels/corpglory-dataexporter-panel/components/Panel.tsx @@ -9,12 +9,12 @@ import { } from '../types'; import { convertTimestampToDate, convertTimeZoneTypeToName, getCurrentDashboardUid } from '../../../utils'; -import { CLOSE_ICON_BASE_64, DOWNLOAD_ICON_BASE_64, SELECT_ICON_BASE_64, UNSELECT_ICON_BASE_64 } from '../../../icons'; +import { CLOSE_ICON_BASE_64, OPTIONS_ICON_BASE_64, SELECT_ICON_BASE_64, UNSELECT_ICON_BASE_64 } from '../../../icons'; import { deleteTask, getStaticFile, getTasks, queryApi } from '../../../services/api_service'; import { getDashboardByUid, getDatasources } from '../../../services/grafana_backend_service'; -import { contextSrv } from 'grafana/app/core/core'; +import { appEvents, contextSrv } from 'grafana/app/core/core'; import { css } from '@emotion/css'; import { @@ -40,6 +40,7 @@ import { DataSourceSettings, TimeRange, OrgRole, + AppEvents, } from '@grafana/data'; import { RefreshEvent } from '@grafana/runtime'; @@ -297,7 +298,7 @@ export function Panel({ width, height, timeRange, eventBus, timeZone }: Props) { name: 'A', fields: [ { - name: 'Time', + name: 'Status Updated At', type: FieldType.number, values: _.map(sortedTasks, (task) => convertTimestampToDate(task.progress?.time)), }, @@ -342,41 +343,25 @@ export function Panel({ width, height, timeRange, eventBus, timeZone }: Props) { values: _.map(sortedTasks, (task) => task.progress?.errorMessage || '-'), }, { - name: 'Download CSV', + name: 'Actions', type: FieldType.string, - values: _.map(sortedTasks, () => `data:image/png;base64,${DOWNLOAD_ICON_BASE_64}`), + values: _.map(sortedTasks, (task) => { + switch (task.progress?.status) { + case ExportStatus.FINISHED: + return `data:image/png;base64,${OPTIONS_ICON_BASE_64}`; + case ExportStatus.ERROR: + return `data:image/png;base64,${CLOSE_ICON_BASE_64}`; + case ExportStatus.EXPORTING: + return ``; + default: + throw new Error(`Unknown exporting status: ${task.progress?.status}`); + } + }), config: { custom: { filterable: false, displayMode: 'image', }, - links: [ - { - targetBlank: false, - title: 'Download', - url: '#', - onClick: (event: DataLinkClickEvent) => onDownloadClick(event), - }, - ], - }, - }, - { - name: 'Delete task', - type: FieldType.string, - values: _.map(tasks, () => `data:image/png;base64,${CLOSE_ICON_BASE_64}`), - config: { - custom: { - filterable: false, - displayMode: 'image', - }, - links: [ - { - targetBlank: false, - title: 'Delete', - url: '#', - onClick: (event: DataLinkClickEvent) => onDeleteClick(event), - }, - ], }, }, ], @@ -391,22 +376,57 @@ export function Panel({ width, height, timeRange, eventBus, timeZone }: Props) { theme: createTheme(), replaceVariables: (value: string) => value, }); + + // @ts-expect-error + dataFrames[0].fields[9].getLinks = (cell: { valueRowIndex: number }) => { + const rowIndex = cell.valueRowIndex; + const task = _.find(sortedTasks, (task, idx) => idx === rowIndex); + if (!task) { + return; + } + switch (task.progress?.status) { + case ExportStatus.FINISHED: + return [ + { + targetBlank: false, + title: 'Download', + url: '#', + onClick: () => onDownloadClick(task), + }, + { + targetBlank: false, + title: 'Delete', + url: '#', + onClick: () => onDeleteClick(task), + }, + ]; + case ExportStatus.ERROR: + return [ + { + targetBlank: false, + title: 'Delete', + url: '#', + onClick: () => onDeleteClick(task), + }, + ]; + case ExportStatus.EXPORTING: + return []; + default: + throw new Error(`Unknown exporting status: ${task.progress?.status}`); + } + }; return dataFrames[0]; } - async function onDeleteClick(e: DataLinkClickEvent): Promise { - const rowIndex = e.origin.rowIndex; - - const task = _.find(tasks, (task, idx) => idx === rowIndex); - await deleteTask(task?.id); + async function onDeleteClick(taskToDelete: ExportTask): Promise { + await deleteTask(taskToDelete?.id); - const filteredTasks = _.filter(tasks, (task, idx) => idx !== rowIndex); + const filteredTasks = _.filter(tasks, (task) => task.id !== taskToDelete.id); setTasks(filteredTasks); } - function onDownloadClick(e: DataLinkClickEvent): void { - const rowIndex = e.origin.rowIndex; - const task = _.find(tasks, (task, idx) => idx === rowIndex); + function onDownloadClick(task: ExportTask): void { + appEvents.emit(AppEvents.alertSuccess, ['CSV has started downloading...']); getStaticFile(task?.id); }