Show version number in sidebar

webapp/src/components/sidebar.scss

@@ -30,10 +30,21 @@
         flex: 0 0 auto;
     }
 
-    .LogoWithNameIcon, .LogoWithNameWhiteIcon {
-        max-height: 24px;
-        margin-top: 6px;
-        width: auto;
+    .logo {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+
+        .LogoWithNameIcon, .LogoWithNameWhiteIcon {
+            max-height: 24px;
+            width: auto;
+        }
+
+        .version {
+            font-size: 11px;
+            font-weight: 500;
+            color: rgba(var(--sidebar-fg), 0.8);
+        }
     }
 
     .octo-sidebar-list {
@@ -68,6 +79,7 @@
         >.heading {
             line-height: 30px;
             cursor: default;
+            flex-grow: 1;
         }
 
         >.IconButton {

webapp/src/components/sidebar.tsx

@@ -6,6 +6,7 @@ import {FormattedMessage, injectIntl, IntlShape} from 'react-intl'
 import {Archiver} from '../archiver'
 import {Board, MutableBoard} from '../blocks/board'
 import {BoardView, IViewType, MutableBoardView} from '../blocks/boardView'
+import {Constants} from '../constants'
 import mutator from '../mutator'
 import octoClient from '../octoClient'
 import {darkTheme, defaultTheme, lightTheme, loadTheme, setTheme, Theme} from '../theme'
@@ -364,7 +365,13 @@ class Sidebar extends React.Component<Props, State> {
         return (
             <ModalWrapper>
                 <MenuWrapper>
-                    {this.state.whiteLogo ? <LogoWithNameWhiteIcon/> : <LogoWithNameIcon/>}
+                    <div className='logo'>
+                        {this.state.whiteLogo ? <LogoWithNameWhiteIcon/> : <LogoWithNameIcon/>}
+                        <div className='octo-spacer'/>
+                        <div className='version'>
+                            {`v${Constants.versionString}`}
+                        </div>
+                    </div>
                     <Menu>
                         {user && user.username !== 'single-user' && <>
                             <Menu.Label><b>{user.username}</b></Menu.Label>

webapp/src/constants.ts

@@ -18,6 +18,8 @@ class Constants {
     static readonly minColumnWidth = 100
     static readonly defaultTitleColumnWidth = 280
     static readonly titleColumnId = '__title'
+
+    static readonly versionString = '0.5.0'
 }
 
 export {Constants}