# 0.12.0

* First release with the following changes

src/TaskEditor.tsx

@@ -139,6 +139,16 @@ const TaskEditor = ({ task, tasks, columnName, columnNames, customFields, dateFo
     setSubmitting(false);
   };
 
+  // Called when the go to raw task button is clicked
+  const handleGoToRawTask = values => {
+    vscode.postMessage({
+      command: 'kanbn.goToRaw',
+      taskId: task!.id,
+      taskData: values,
+      panelUuid
+    });
+  };
+
   // Called when the delete task button is clicked
   const handleRemoveTask = values => {
     vscode.postMessage({
@@ -243,6 +253,16 @@ const TaskEditor = ({ task, tasks, columnName, columnNames, customFields, dateFo
               {dirty && <span className="kanbn-task-editor-dirty">*</span>}
             </h1>
             <div className="kanbn-task-editor-buttons kanbn-task-editor-main-buttons">
+              {editing && <button
+                type="button"
+                className="kanbn-task-editor-button kanbn-task-editor-button-go-to"
+                title="Go to raw task"
+                onClick={() => {
+                  handleGoToRawTask(values);
+                }}
+              >
+                <i className="codicon codicon-file-code"></i>Go to raw
+              </button>}
               {editing && <button
                 type="button"
                 className="kanbn-task-editor-button kanbn-task-editor-button-delete"

src/TaskItem.tsx

@@ -71,16 +71,41 @@ const TaskItem = ({ task, columnName, customFields, position, dateFormat, vscode
               <div className="kanbn-task-data kanbn-task-data-tags">
                 {task.metadata.tags!.map(tag => {
                   return (
-                    <span className={[
-                      'kanbn-task-tag',
-                      `kanbn-task-tag-${paramCase(tag)}`
-                    ].join(' ')}>
+                    <span onClick={() => {
+                      vscode.postMessage({
+                        command: 'kanbn.goToRaw',
+                        taskId: task.id,
+                        columnName: task.column
+                      });
+                    }}
+                      className={[
+                        'kanbn-task-tag',
+                        `kanbn-task-tag-${paramCase(tag)}`
+                      ].join(' ')}>
                       {tag}
                     </span>
                   );
                 })}
               </div>
             }
+            {
+              task.relations.length > 0 &&
+              <div className="kanbn-task-data kanbn-task-data-tags">
+                {task.relations.map(relation => {
+                  return (
+                    <span onClick={() => {
+                      vscode.postMessage({
+                        command: 'kanbn.goToRaw',
+                        taskId: task.id,
+                        columnName: task.column
+                      });
+                    }}>
+                      <u>{relation.task}</u>
+                    </span>
+                  );
+                })}
+              </div>
+            }
             {
               customFields.map(customField => {
                 if (customField.name in task.metadata) {
@@ -168,7 +193,14 @@ const TaskItem = ({ task, columnName, customFields, position, dateFormat, vscode
             {
               task.workload !== undefined &&
               <div className="kanbn-task-data kanbn-task-data-workload">
-                <i className="codicon codicon-run"></i>{task.workload}
+                <i className="codicon codicon-tools"
+                  onClick={() => {
+                    vscode.postMessage({
+                      command: 'kanbn.goToRaw',
+                      taskId: task.id,
+                      columnName: task.column
+                    });
+                  }}></i>{task.workload}
               </div>
             }
             {

src/index.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import * as ReactDOM from 'react-dom';
+import { render } from 'react-dom';
 import App from './App';
 import './index.css';
 
-ReactDOM.render(
+render(
   <App />,
   document.getElementById('root') as HTMLElement
 );