Merge pull request #64 from metrico/feat/export

Changes export file names for easier sorting

ngx-flow/projects/ngx-flow/src/helpers/functions.ts

@@ -606,3 +606,8 @@ export function methodCheck(payload: number) {
 export function messageFormatter(dist: Array<any>) {
     return dist;
 }
+
+export const convertDateToFileName = (date: Date) => {
+
+    return `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}_${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`
+}

ngx-flow/projects/ngx-flow/src/tab-flow/tab-flow.component.ts

@@ -7,7 +7,7 @@ import {
     ChangeDetectorRef, Component, ElementRef, EventEmitter, HostListener, Input, OnDestroy, OnInit, Output, ViewChild, ViewEncapsulation
 } from '@angular/core';
 import { TransactionFilterService } from '../transaction-filter/transaction-filter.service';
-import { cloneObject, getColorByString, getMethodColor, isIpInSubnet, JSON_parse, md5 } from '../helpers/functions';
+import { cloneObject, convertDateToFileName, getColorByString, getMethodColor, isIpInSubnet, JSON_parse, md5 } from '../helpers/functions';
 import { getStorage, setStorage } from '../helpers/functions';
 import { UserConstValue } from '../models/const-value.model';
 import { FlowItemType } from '../models/flow-item-type.model';
@@ -596,7 +596,7 @@ export class TabFlowComponent
                 this.canvas.nativeElement.src = canvas.toDataURL();
                 this.downloadLink.nativeElement.href = canvas.toDataURL('image/png');
                 const date = new Date();
-                this.downloadLink.nativeElement.download = `${date.toUTCString()}.png`;
+                this.downloadLink.nativeElement.download = `${convertDateToFileName(date)}.png`;
                 this.downloadLink.nativeElement.click();
                 setTimeout(() => {
                     this.pngReady.emit({});

package.json

@@ -1,6 +1,6 @@
 {
     "name": "qxip-flow-panel",
-    "version": "10.0.12",
+    "version": "10.0.13",
     "description": "Plugin providing Flow diagram for Grafana",
     "scripts": {
         "build:component": "cd ./ngx-flow && npm run build:component",

src/components/SimplePanel.tsx

@@ -27,6 +27,7 @@ import {
     Menu
 } from '@grafana/ui';
 import { hash } from 'helpers/hash';
+import { convertDateToFileName } from 'helpers/convertDateToFileName';
 
 
 
@@ -44,6 +45,7 @@ declare global {
 }
 export let valueLabelsName: string[] = [];
 let bufferCheck = '';
+
 export const TemplateEditor = ({ value, onChange }: StandardEditorProps<string>) => {
     const [isOpen, setIsOpen] = React.useState(false);
     const themeName: string = useTheme2().name;
@@ -264,7 +266,7 @@ export const SimplePanel: React.FC<Props> = ({ options, data, width, height }: a
 
             // Add file name
             const date = new Date();
-            link.download = `${date.toUTCString()}.txt`;
+            link.download = `${convertDateToFileName(date)}.txt`;
             link.click();
         }
         document.addEventListener('export-flow-as-text', handler);
@@ -361,7 +363,7 @@ export const SimplePanel: React.FC<Props> = ({ options, data, width, height }: a
 
             // Add file name
             const date = new Date();
-            link.download = `${date.toUTCString()}.pcap`;
+            link.download = `${convertDateToFileName(date)}.pcap`;
             link.click();
 
         }

src/helpers/convertDateToFileName.ts

@@ -0,0 +1,5 @@
+
+export const convertDateToFileName = (date: Date) => {
+
+    return `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}_${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`
+}