Add button to start sprint

ext-src/KanbnBoardPanel.ts

@@ -151,6 +151,24 @@ export default class KanbnBoardPanel {
           // TODO open a burndown chart webview panel
           vscode.window.showErrorMessage('Not implemented yet!');
           return;
+
+        // Start a new sprint
+        case 'kanbn.sprint':
+
+          // Prompt for a sprint name
+          const newSprintName = await vscode.window.showInputBox({
+            placeHolder: 'The sprint name.'
+          });
+
+          // If the input prompt wasn't cancelled, start a new sprint
+          if (newSprintName !== undefined) {
+            try {
+              await kanbn.sprint(newSprintName, '', new Date());
+            } catch (e) {
+              vscode.window.showErrorMessage(e.message);
+            }
+          }
+          return;
       }
     }, null, this._disposables);
   }

src/App.tsx

@@ -24,6 +24,7 @@ function App() {
   const [panelUuid, setPanelUuid] = useState('');
   const [showBurndownButton, setShowBurndownButton] = useState(false);
   const [showSprintButton, setShowSprintButton] = useState(false);
+  const [currentSprint, setCurrentSprint] = useState(null);
 
   window.addEventListener('message', event => {
     const tasks = Object.fromEntries(event.data.tasks.map(task => [task.id, task]));
@@ -42,6 +43,13 @@ function App() {
         setCompletedColumns(event.data.completedColumns);
         setShowBurndownButton(event.data.showBurndownButton);
         setShowSprintButton(event.data.showSprintButton);
+
+        // Get current sprint
+        let sprint = null;
+        if ('sprints' in event.data.index.options && event.data.index.options.sprints.length) {
+          sprint = event.data.index.options.sprints[event.data.index.options.sprints.length - 1];
+        }
+        setCurrentSprint(sprint);
         break;
 
       case 'task':
@@ -70,6 +78,7 @@ function App() {
           dateFormat={dateFormat}
           showBurndownButton={showBurndownButton}
           showSprintButton={showSprintButton}
+          currentSprint={currentSprint}
           vscode={vscode}
         />
       }

src/Board.tsx

@@ -3,6 +3,7 @@ import React, { useState } from "react";
 import TaskItem from './TaskItem';
 import { paramCase } from 'param-case';
 import VSCodeApi from "./VSCodeApi";
+import formatDate from 'dateformat';
 
 // Called when a task item has finished being dragged
 const onDragEnd = (result, columns, setColumns, vscode: VSCodeApi) => {
@@ -141,6 +142,7 @@ const Board = ({
   dateFormat,
   showBurndownButton,
   showSprintButton,
+  currentSprint,
   vscode
 }: {
   name: string,
@@ -152,6 +154,11 @@ const Board = ({
   dateFormat: string,
   showBurndownButton: boolean,
   showSprintButton: boolean,
+  currentSprint: {
+    start: string,
+    name: string,
+    description: string
+  }|null,
   vscode: VSCodeApi
 }) => {
   const [, setColumns] = useState(columns);
@@ -209,10 +216,15 @@ const Board = ({
                       command: 'kanbn.sprint'
                     });
                   }}
-                  title="Start a new sprint"
+                  title={[
+                    currentSprint
+                      ? `${currentSprint.name}\nStarted ${formatDate(currentSprint.start, dateFormat)}`
+                      : '',
+                    'Start a new sprint'
+                  ].join('\n')}
                 >
                   <i className="codicon codicon-rocket"></i>
-                  Sprint 1
+                  {currentSprint ? currentSprint.name : 'No sprint'}
                 </button>
               }
               {

src/index.css

@@ -28,12 +28,17 @@ body.vscode-high-contrast {
 .kanbn-filter {
     position: relative;
     flex: 1;
-    text-align: right;
+}
+
+.kanbn-filter form {
+    width: 100%;
+    display: flex;
+    white-space: nowrap;
 }
 
 .kanbn-filter-input {
     box-sizing: border-box;
-    width: 60%;
+    flex: 1;
     padding: 8px;
     background-color: var(--vscode-input-background);
     color: var(--vscode-input-foreground);