Merge latest development back to main (#78)

* Fix structure matching on exported data

* Sequential colouring of integers

* Fix structure matching first row and header special character bugs

* Fix colouring of numerical columns

* Add mui/icons-material package

* Structure Matching Settings dropdown template

* Disregard column selection upon refresh

* Update npm package due to vulnerability

* Add default value to rule dropdown selection

* Fix structure definition bug due to nested structures

* Export search results only when filtering

* Fix nested segments

* Fix timezone offset in file export

* Add popup to indicate where export is saved

* Fix nested segments

* Temporary solution for issue of minimap width

* Fix filter on top of structure match

* Remove prints

* Create regular expression from headers

* Fix crash when multiple structure matches are performed

* Auto-update logview on search operation click

* Improve export naming for other data types

* Utilize line number to sort structure entries

* Update screenshots

* Update README.md

* Implement Structure Definition Saving

* Implement Structure Definition Load

* Remove debugging statements

* Fix styling issue of Structure Settings Dropdown

* Formatted code with Prettier

* Fix structure export bug

* Enable path selection in export

* Update README.md

* Fix timestamp unselected bug

* Fix regex search bug

---------

Co-authored-by: ckitsanelis <[email protected]>
Co-authored-by: Zamfirov <[email protected]>
Co-authored-by: LightFLP <[email protected]>

README.md

@@ -18,11 +18,25 @@ To install Tracy in Visual Studio Code:
 
 ## User Guide
 
-### Log format
+### Input File Format Guidelines
 
-Tracy assumes that a log is represented in JSON format. The log must be a list of JSON objects, with each object representing an event. Every event is assumed to have the same fields, with the first field being the timestamp of the event. Thus, the log can be viewed as a table where each row is an event and each column an event field, with the first column containing the timestamps.
+Tracy is designed to process log files represented in JSON format. The input log file must adhere to specific criteria outlined below to ensure optimal utilization of Tracy's capabilities.
 
-Files with extension `*.tracy.json` will be automatically opened in Tracy.
+1. **File Format:**
+   - The input log file must be formatted in JSON. Specifically, it should be structured as a list of JSON objects, where each object represents a distinct event.
+   - All events within the log file must possess identical fields, rendering the log as a tabular structure with rows representing events and columns representing event fields.
+   - It is recommended that the input file contains only UTF-8 encoded characters. Non-UTF characters may lead to unexpected behavior or errors during processing by Tracy.
+
+2. **Automated File Recognition:**
+   - Files with the extension `*.tracy.json` will be automatically recognized and opened by Tracy without any additional configuration.
+
+3. **Transformation for Non-JSON Files:**
+   - If the input log file is not in JSON format, users are required to transform it before using Tracy.
+   - To facilitate this transformation, an open source converter has been developed. This converter can be accessed [here](https://github.com/TNO/vscode-tracy-csv-converter), and it streamlines the process of converting non-JSON log files into the required JSON format.
+
+4. **Column Configuration:**
+   - If the input log file contains a column that indicates the timestamp of each event, then it should be explicitly named "Timestamp". Furthermore, for ease of use we suggest that such a column corresponds to the first column of each event.
+   - Users are advised against including two specific column names, namely "Line" and "Structure," as these columns are utilized internally by Tracy.
 
 ### The minimap
 

media/style.css

@@ -14,6 +14,19 @@
     box-shadow: 0 2px 8px var(--vscode-widget-shadow);
 }
 
+.structure-settings-dropdown {
+    background-color:  var(--vscode-menu-background);
+}
+
+.structure-settings-dropdown-item {
+    color: var(--vscode-menu-foreground);
+    background-color: var(--vscode-menu-background);
+}
+
+.structure-dialog-icon {
+    color: var(--vscode-menu-foreground);
+}
+
 ::selection {
     color: var(--vscode-menu-background);
     background-color: var(--vscode-menu-foreground);

package.json

@@ -68,6 +68,7 @@
   "dependencies": {
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
+    "@mui/icons-material": "^5.15.0",
     "@mui/material": "^5.14.0",
     "framer-motion": "^10.15.1",
     "lodash": "^4.17.21",

src/extension/extension.ts

@@ -2,7 +2,7 @@ import * as vscode from 'vscode';
 import fs from 'fs';
 
 export function activate(context: vscode.ExtensionContext) {
-    context.subscriptions.push(EditorProvider.register(context));
+	context.subscriptions.push(EditorProvider.register(context));
 }
 
 export class EditorProvider implements vscode.CustomTextEditorProvider {
@@ -18,11 +18,12 @@ export class EditorProvider implements vscode.CustomTextEditorProvider {
 	) { }
 
 	public async resolveCustomTextEditor(
-		document: vscode.TextDocument, 
+		document: vscode.TextDocument,
 		webviewPanel: vscode.WebviewPanel,
 		_token: vscode.CancellationToken
 	): Promise<void> {
 		const rulesFile = `${document.fileName}.rules`;
+		const structureDefinitionFile = `${document.fileName}.structure`;
 
 		// Setup initial content for the webview
 		webviewPanel.webview.options = {
@@ -34,7 +35,7 @@ export class EditorProvider implements vscode.CustomTextEditorProvider {
 			webviewPanel.webview.postMessage({
 				type: message_type,
 				text: document.getText(),
-				rules: fs.existsSync(rulesFile) ? JSON.parse(fs.readFileSync(rulesFile, {encoding: 'utf8'})) : [],
+				rules: fs.existsSync(rulesFile) ? JSON.parse(fs.readFileSync(rulesFile, { encoding: 'utf8' })) : [],
 			});
 		}
 
@@ -59,17 +60,74 @@ export class EditorProvider implements vscode.CustomTextEditorProvider {
 
 		// Receive message from the webview.
 		webviewPanel.webview.onDidReceiveMessage(e => {
+
 			if (e.type === 'readFile') {
 				updateWebview('readFile');
 			} else if (e.type === 'saveRules') {
 				fs.writeFileSync(rulesFile, JSON.stringify(e.rules));
 			}
+			else if (e.type === 'saveStructureDefinition') {
+
+				const options: vscode.SaveDialogOptions = {
+					title: 'Save Structure Definition',
+					defaultUri: vscode.Uri.joinPath(document.uri, structureDefinitionFile),
+					filters: {
+						'Stucture files': ['structure']
+				   }
+			   	};
+				vscode.window.showSaveDialog(options).then(fileUri => {
+					if (fileUri) {
+						fs.writeFileSync(fileUri.fsPath, e.structureDefinition);
+					}
+				});				
+			}
+			else if (e.type === 'loadStructureDefinition') {
+				const options: vscode.OpenDialogOptions = {
+					title: 'Load Structure Definition',
+					canSelectMany: false,
+					openLabel: 'Load',
+					filters: {
+					   'Stucture files': ['structure']
+				   }
+			   	};
+				vscode.window.showOpenDialog(options).then(fileUri => {
+
+					if (fileUri && fileUri[0]) {
+						const filePath = fileUri[0].fsPath;
+
+						webviewPanel.webview.postMessage({
+							type: 'loadedStructureDefinition', 
+							structureDefinition: fs.existsSync(filePath) ? JSON.parse(fs.readFileSync(filePath, {encoding: 'utf8'})) : []
+						});
+					}
+
+				});				
+			}
 			else if (e.type === 'exportData') {
-				const filename = document.fileName.split(".tracy")[0].split("_Tracy_export_")[0]
-				const _date = new Date().toISOString().slice(0,10).replace(/-/g, "");
-				const _time = new Date().toISOString().slice(11,19).replace(/:/g, "");
+				let filename = document.fileName;
+				const splitItems = [".tracy", ".json", ".txt", ".csv", "_Tracy_export_"];
+				splitItems.forEach(item => { filename = filename.split(item)[0]; });
+				const tzoffset = (new Date()).getTimezoneOffset() * 60000; //offset in milliseconds
+				const _date = new Date(Date.now() - tzoffset).toISOString().slice(0, 10).replace(/-/g, "");
+				const _time = new Date(Date.now() - tzoffset).toISOString().slice(11, 19).replace(/:/g, "");
 				const exportFile = `${filename}_Tracy_export_${_date}_${_time}.tracy.json`;
-				fs.writeFileSync(exportFile, JSON.stringify(e.data));
+				const options: vscode.SaveDialogOptions = {
+					title: 'Export Data',
+					defaultUri: vscode.Uri.joinPath(document.uri, exportFile),
+					filters: {
+						'Tracy files': ['json']
+				   }
+			   	};
+				vscode.window.showSaveDialog(options).then(fileUri => {
+					if (fileUri) {
+						fs.writeFileSync(fileUri.fsPath, JSON.stringify(e.data));
+					}
+				});	
+				// fs.writeFileSync(exportFile, JSON.stringify(e.data));
+				// webviewPanel.webview.postMessage({
+				// 	type: "readExportPath",
+				// 	text: fileUri.fsPath,
+				// });
 			}
 		});
 	}