mito-ai: add a support button to taskpane

mito-ai/src/Extensions/AiChat/ChatTaskpane.tsx

@@ -22,6 +22,7 @@ import { CodeCell } from '@jupyterlab/cells';
 import { StateEffect, Compartment } from '@codemirror/state';
 import { codeDiffStripesExtension } from './CodeDiffDisplay';
 import OpenAI from "openai";
+import SupportIcon from '../../icons/SupportIcon';
 
 const getDefaultChatHistoryManager = (notebookTracker: INotebookTracker, variableManager: IVariableManager): ChatHistoryManager => {
 
@@ -356,7 +357,13 @@ const ChatTaskpane: React.FC<IChatTaskpaneProps> = ({
     return (
         <div className="chat-taskpane">
             <div className="chat-taskpane-header">
-                <p className="chat-taskpane-header-title"></p>
+                <IconButton
+                    icon={<SupportIcon />}
+                    title="Get Help"
+                    onClick={() => {
+                        window.open('mailto:[email protected]?subject=Mito AI Chat Support', '_blank');
+                    }}
+                />
                 <IconButton
                     icon={<ResetIcon />}
                     title="Clear the chat history"

mito-ai/src/icons/SupportIcon.tsx

@@ -0,0 +1,11 @@
+import React from 'react';
+
+const SupportIcon: React.FC = () => {
+    return (
+        <svg width="15" height="16" viewBox="0 0 15 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M12.4445 5.35708V5.33338C12.4445 3.90818 11.8904 2.56889 10.883 1.56148C9.87562 0.553941 8.53635 0 7.11113 0C4.16886 0 1.77778 2.39108 1.77778 5.33334V5.35705C0.773343 5.50223 0 6.36446 0 7.40726V9.77764C0 10.9213 0.930372 11.8519 2.07424 11.8519H2.66683C3.15573 11.8519 3.55572 11.4519 3.55572 10.963V6.22223C3.55572 5.73334 3.15573 5.33334 2.66683 5.33334H2.37053C2.37053 2.72008 4.49802 0.592594 7.11128 0.592594C8.37646 0.592594 9.56763 1.08445 10.4624 1.98223C11.3572 2.88001 11.852 4.06816 11.852 5.33331H11.5557C11.0668 5.33331 10.6668 5.73331 10.6668 6.2222V10.963C10.6668 11.4519 11.0668 11.8518 11.5557 11.8518H11.852V13.037C11.852 13.8548 11.1883 14.5185 10.3705 14.5185H8.84755C8.71422 14.0089 8.25496 13.6296 7.70385 13.6296H6.51866C5.86383 13.6296 5.33347 14.16 5.33347 14.8148C5.33347 15.4696 5.86383 16 6.51866 16H7.70385C8.25496 16 8.71423 15.6207 8.84755 15.1111H10.3705C11.5142 15.1111 12.4448 14.1807 12.4448 13.0369V11.828C13.4492 11.6828 14.2225 10.8206 14.2225 9.77777V7.40739C14.2225 6.36443 13.4492 5.50224 12.4448 5.35717L12.4445 5.35708Z" fill="black"/>
+        </svg>
+    )
+}
+
+export default SupportIcon;

mito-ai/style/ChatTaskpane.css

@@ -22,7 +22,7 @@
 .chat-taskpane-header {
     display: flex;
     flex-direction: row;
-    justify-content: space-between;
+    justify-content: end;
     align-items: center;
     padding-top: 10px;
     padding-bottom: 5px;