add welcome toast with version

src/structure-viewer/index.ts

@@ -25,6 +25,10 @@ import { ModelLoader } from './helpers/model';
 import { VolumeData } from './helpers/volume';
 require('./skin/rcsb.scss')
 
+/** package version, filled in at bundle build time */
+declare const __RCSB_MOLSTAR_VERSION__: string
+export const RCSB_MOLSTAR_VERSION = __RCSB_MOLSTAR_VERSION__;
+
 export const DefaultStructureViewerProps: StructureViewerProps = {
     volumeServerUrl: '//maps.rcsb.org/',
     modelUrlProvider: (pdbId: string) => {
@@ -84,12 +88,19 @@ export class StructureViewer {
             modelLoader: new ModelLoader(this.plugin),
             structureView: new StructureView(this.plugin),
             volumeData: new VolumeData(this.plugin)
-        };
+        }
 
         ReactDOM.render(React.createElement(Plugin, { plugin: this.plugin }), target)
 
         const renderer = this.plugin.canvas3d.props.renderer;
-        PluginCommands.Canvas3D.SetSettings.dispatch(this.plugin, { settings: { renderer: { ...renderer, backgroundColor: ColorNames.white } } });
+        PluginCommands.Canvas3D.SetSettings.dispatch(this.plugin, { settings: { renderer: { ...renderer, backgroundColor: ColorNames.white } } })
+
+        PluginCommands.Toast.Show.dispatch(this.plugin, {
+            title: 'Welcome',
+            message: `RCSB PDB Mol* Viewer ${RCSB_MOLSTAR_VERSION}`,
+            key: 'toast-welcome',
+            timeoutMs: 10000
+        })
     }
 
     async loadPdbId(pdbId: string, assemblyId = 'deposited') {

webpack.config.js

@@ -1,4 +1,5 @@
 const path = require('path');
+const fs = require('fs');
 const webpack = require('webpack');
 const ExtraWatchWebpackPlugin = require('extra-watch-webpack-plugin');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
@@ -31,6 +32,10 @@ const sharedConfig = {
         }),
         new webpack.DefinePlugin({
             __PLUGIN_VERSION_TIMESTAMP__: webpack.DefinePlugin.runtimeValue(() => `${new Date().valueOf()}`, true),
+            __RCSB_MOLSTAR_VERSION__: webpack.DefinePlugin.runtimeValue(() => {
+                const version = JSON.parse(fs.readFileSync('./package.json')).version;
+                return `'${version}'`;
+            }, true),
             'process.env.DEBUG': JSON.stringify(process.env.DEBUG)
         }),
         new MiniCssExtractPlugin({ filename: 'app.css' })