@jbrowse/plugin-menus 2.6.1

package/esm/SessionManager/components/DeleteDialog.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { Button, DialogActions, DialogContent, DialogContentText, } from '@mui/material';
+import { Dialog } from '@jbrowse/core/ui';
+export default function DeleteDialog({ open, sessionNameToDelete, handleClose, }) {
+    return (React.createElement(Dialog, { open: open, "aria-labelledby": "alert-dialog-title", "aria-describedby": "alert-dialog-description", title: `Delete session "${sessionNameToDelete}"?` },
+        React.createElement(DialogContent, null,
+            React.createElement(DialogContentText, { id: "alert-dialog-description" }, "This action cannot be undone")),
+        React.createElement(DialogActions, null,
+            React.createElement(Button, { onClick: () => handleClose(), color: "primary" }, "Cancel"),
+            React.createElement(Button, { onClick: () => handleClose(true), color: "primary", autoFocus: true }, "Delete"))));
+}
+//# sourceMappingURL=DeleteDialog.js.map

package/esm/SessionManager/components/DeleteDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeleteDialog.js","sourceRoot":"","sources":["../../../src/SessionManager/components/DeleteDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EACL,MAAM,EACN,aAAa,EACb,aAAa,EACb,iBAAiB,GAClB,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AAEzC,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,IAAI,EACJ,mBAAmB,EACnB,WAAW,GAKZ;IACC,OAAO,CACL,oBAAC,MAAM,IACL,IAAI,EAAE,IAAI,qBACM,oBAAoB,sBACnB,0BAA0B,EAC3C,KAAK,EAAE,mBAAmB,mBAAmB,IAAI;QAEjD,oBAAC,aAAa;YACZ,oBAAC,iBAAiB,IAAC,EAAE,EAAC,0BAA0B,mCAE5B,CACN;QAChB,oBAAC,aAAa;YACZ,oBAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,EAAE,EAAE,KAAK,EAAC,SAAS,aAE5C;YACT,oBAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,KAAK,EAAC,SAAS,EAAC,SAAS,mBAE1D,CACK,CACT,CACV,CAAA;AACH,CAAC"}

package/esm/SessionManager/components/SessionManager.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import { AbstractSessionModel } from '@jbrowse/core/util';
+interface SessionSnap {
+    name: string;
+    views?: {
+        tracks: unknown[];
+    }[];
+    [key: string]: unknown;
+}
+interface SessionModel extends AbstractSessionModel {
+    savedSessions: SessionSnap[];
+    removeSavedSession: (arg: SessionSnap) => void;
+    activateSession: (arg: string) => void;
+    loadAutosaveSession: () => void;
+    previousAutosaveId: string;
+}
+declare const SessionManager: ({ session }: {
+    session: SessionModel;
+}) => React.JSX.Element;
+export default SessionManager;

package/esm/SessionManager/components/SessionManager.js

@@ -0,0 +1,74 @@
+import React, { useState } from 'react';
+import { IconButton, List, ListItem, ListItemIcon, ListItemSecondaryAction, ListItemText, ListSubheader, Paper, Typography, } from '@mui/material';
+import { makeStyles } from 'tss-react/mui';
+import { observer } from 'mobx-react';
+import pluralize from 'pluralize';
+// icons
+import DeleteIcon from '@mui/icons-material/Delete';
+import ViewListIcon from '@mui/icons-material/ViewList';
+import DeleteDialog from './DeleteDialog';
+const useStyles = makeStyles()(theme => ({
+    root: {
+        margin: theme.spacing(1),
+    },
+    message: {
+        padding: theme.spacing(3),
+    },
+}));
+const AutosaveEntry = observer(({ session }) => {
+    const { classes } = useStyles();
+    const autosavedSession = JSON.parse(localStorage.getItem(session.previousAutosaveId) || '{}').session;
+    const { views = [] } = autosavedSession || {};
+    const totalTracks = views
+        .map(view => view.tracks.length)
+        .reduce((a, b) => a + b, 0);
+    return autosavedSession ? (React.createElement(Paper, { className: classes.root },
+        React.createElement(List, { subheader: React.createElement(ListSubheader, null, "Previous autosaved entry") },
+            React.createElement(ListItem, { button: true, onClick: () => session.loadAutosaveSession() },
+                React.createElement(ListItemIcon, null,
+                    React.createElement(ViewListIcon, null)),
+                React.createElement(ListItemText, { primary: autosavedSession.name, secondary: session.name === autosavedSession.name
+                        ? 'Currently open'
+                        : `${views.length} ${pluralize('view', views.length)}; ${totalTracks}
+                           open ${pluralize('track', totalTracks)}` }))))) : null;
+});
+const SessionManager = observer(({ session }) => {
+    const { classes } = useStyles();
+    const [sessionIndexToDelete, setSessionIndexToDelete] = useState();
+    const [open, setOpen] = useState(false);
+    function handleDialogClose(deleteSession = false) {
+        if (deleteSession && sessionIndexToDelete !== undefined) {
+            session.removeSavedSession(session.savedSessions[sessionIndexToDelete]);
+        }
+        setSessionIndexToDelete(undefined);
+        setOpen(false);
+    }
+    const sessionNameToDelete = sessionIndexToDelete !== undefined
+        ? session.savedSessions[sessionIndexToDelete].name
+        : '';
+    return (React.createElement(React.Fragment, null,
+        React.createElement(AutosaveEntry, { session: session }),
+        React.createElement(Paper, { className: classes.root },
+            React.createElement(List, { subheader: React.createElement(ListSubheader, null, "Saved sessions") }, session.savedSessions.length ? (session.savedSessions.map((sessionSnapshot, idx) => {
+                const { views = [] } = sessionSnapshot;
+                const totalTracks = views
+                    .map(view => view.tracks.length)
+                    .reduce((a, b) => a + b, 0);
+                return (React.createElement(ListItem, { button: true, disabled: session.name === sessionSnapshot.name, onClick: () => session.activateSession(sessionSnapshot.name), key: sessionSnapshot.name },
+                    React.createElement(ListItemIcon, null,
+                        React.createElement(ViewListIcon, null)),
+                    React.createElement(ListItemText, { primary: sessionSnapshot.name, secondary: session.name === sessionSnapshot.name
+                            ? 'Currently open'
+                            : `${views.length} ${pluralize('view', views.length)}; ${totalTracks}
+                           open ${pluralize('track', totalTracks)}` }),
+                    React.createElement(ListItemSecondaryAction, null,
+                        React.createElement(IconButton, { edge: "end", disabled: session.name === sessionSnapshot.name, "aria-label": "Delete", onClick: () => {
+                                setSessionIndexToDelete(idx);
+                                setOpen(true);
+                            } },
+                            React.createElement(DeleteIcon, null)))));
+            })) : (React.createElement(Typography, { className: classes.message }, "No saved sessions found")))),
+        React.createElement(DeleteDialog, { open: open, sessionNameToDelete: sessionNameToDelete, handleClose: handleDialogClose })));
+});
+export default SessionManager;
+//# sourceMappingURL=SessionManager.js.map

package/esm/SessionManager/components/SessionManager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SessionManager.js","sourceRoot":"","sources":["../../../src/SessionManager/components/SessionManager.tsx"],"names":[],"mappings":"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"}

package/esm/SessionManager/index.d.ts

@@ -0,0 +1,5 @@
+export declare const configSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>;
+export declare const stateModel: import("mobx-state-tree").IModelType<{
+    id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
+    type: import("mobx-state-tree").ISimpleType<"SessionManager">;
+}, {}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;

package/esm/SessionManager/index.js

@@ -0,0 +1,9 @@
+import { ConfigurationSchema } from '@jbrowse/core/configuration';
+import { ElementId } from '@jbrowse/core/util/types/mst';
+import { types } from 'mobx-state-tree';
+export const configSchema = ConfigurationSchema('SessionManager', {});
+export const stateModel = types.model('SessionManager', {
+    id: ElementId,
+    type: types.literal('SessionManager'),
+});
+//# sourceMappingURL=index.js.map

package/esm/SessionManager/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/SessionManager/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAA;AAEvC,MAAM,CAAC,MAAM,YAAY,GAAG,mBAAmB,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAA;AAErE,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,gBAAgB,EAAE;IACtD,EAAE,EAAE,SAAS;IACb,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC;CACtC,CAAC,CAAA"}

package/esm/index.d.ts

@@ -0,0 +1,7 @@
+import Plugin from '@jbrowse/core/Plugin';
+import PluginManager from '@jbrowse/core/PluginManager';
+export default class extends Plugin {
+    name: string;
+    install(pluginManager: PluginManager): void;
+    configure(pluginManager: PluginManager): void;
+}

package/esm/index.js

@@ -0,0 +1,75 @@
+import { lazy } from 'react';
+import WidgetType from '@jbrowse/core/pluggableElementTypes/WidgetType';
+import Plugin from '@jbrowse/core/Plugin';
+import { isAbstractMenuManager } from '@jbrowse/core/util';
+import HelpIcon from '@mui/icons-material/Help';
+import InfoIcon from '@mui/icons-material/Info';
+import { configSchema as aboutConfigSchema, stateModel as aboutStateModel, } from './AboutWidget';
+import { configSchema as helpConfigSchema, stateModel as helpStateModel, } from './HelpWidget';
+import { configSchema as importSessionConfigSchema, stateModel as importSessionStateModel, } from './ImportSessionWidget';
+import { configSchema as sessionManagerConfigSchema, stateModel as sessionManagerStateModel, } from './SessionManager';
+export default class extends Plugin {
+    constructor() {
+        super(...arguments);
+        this.name = 'MenusPlugin';
+    }
+    install(pluginManager) {
+        pluginManager.addWidgetType(() => {
+            return new WidgetType({
+                name: 'AboutWidget',
+                heading: 'About',
+                configSchema: aboutConfigSchema,
+                stateModel: aboutStateModel,
+                ReactComponent: lazy(() => import('./AboutWidget/components/AboutWidget')),
+            });
+        });
+        pluginManager.addWidgetType(() => {
+            return new WidgetType({
+                name: 'HelpWidget',
+                heading: 'Help',
+                configSchema: helpConfigSchema,
+                stateModel: helpStateModel,
+                ReactComponent: lazy(() => import('./HelpWidget/components/HelpWidget')),
+            });
+        });
+        pluginManager.addWidgetType(() => {
+            return new WidgetType({
+                name: 'ImportSessionWidget',
+                heading: 'Import session',
+                configSchema: importSessionConfigSchema,
+                stateModel: importSessionStateModel,
+                ReactComponent: lazy(() => import('./ImportSessionWidget/components/ImportSessionWidget')),
+            });
+        });
+        pluginManager.addWidgetType(() => {
+            return new WidgetType({
+                name: 'SessionManager',
+                heading: 'Sessions',
+                configSchema: sessionManagerConfigSchema,
+                stateModel: sessionManagerStateModel,
+                ReactComponent: lazy(() => import('./SessionManager/components/SessionManager')),
+            });
+        });
+    }
+    configure(pluginManager) {
+        if (isAbstractMenuManager(pluginManager.rootModel)) {
+            pluginManager.rootModel.appendToMenu('Help', {
+                label: 'About',
+                icon: InfoIcon,
+                onClick: (session) => {
+                    const widget = session.addWidget('AboutWidget', 'aboutWidget');
+                    session.showWidget(widget);
+                },
+            });
+            pluginManager.rootModel.appendToMenu('Help', {
+                label: 'Help',
+                icon: HelpIcon,
+                onClick: (session) => {
+                    const widget = session.addWidget('HelpWidget', 'helpWidget');
+                    session.showWidget(widget);
+                },
+            });
+        }
+    }
+}
+//# sourceMappingURL=index.js.map

package/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "@jbrowse/plugin-menus",
+  "version": "2.6.1",
+  "description": "JBrowse 2 basic menus",
+  "keywords": [
+    "jbrowse",
+    "jbrowse2"
+  ],
+  "license": "Apache-2.0",
+  "homepage": "https://jbrowse.org",
+  "bugs": "https://github.com/GMOD/jbrowse-components/issues",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/GMOD/jbrowse-components.git",
+    "directory": "plugins/menus"
+  },
+  "author": "JBrowse Team",
+  "distMain": "dist/index.js",
+  "srcMain": "src/index.ts",
+  "main": "dist/index.js",
+  "files": [
+    "dist",
+    "src",
+    "esm"
+  ],
+  "scripts": {
+    "build": "npm-run-all build:*",
+    "test": "cd ../..; jest plugins/menus",
+    "prepublishOnly": "yarn test",
+    "prepack": "yarn build && yarn useDist",
+    "postpack": "yarn useSrc",
+    "useDist": "node ../../scripts/useDist.js",
+    "useSrc": "node ../../scripts/useSrc.js",
+    "prebuild": "npm run clean",
+    "build:esm": "tsc --build tsconfig.build.esm.json",
+    "build:es5": "tsc --build tsconfig.build.es5.json",
+    "clean": "rimraf dist esm *.tsbuildinfo"
+  },
+  "dependencies": {
+    "@mui/icons-material": "^5.0.1",
+    "pluralize": "^8.0.0",
+    "react-dropzone": "^14.2.1"
+  },
+  "peerDependencies": {
+    "@jbrowse/core": "^2.0.0",
+    "@mui/material": "^5.0.0",
+    "mobx": "^6.0.0",
+    "mobx-react": "^7.0.0",
+    "mobx-state-tree": "^5.0.0",
+    "react": ">=16.8.0",
+    "react-dom": ">=16.8.0",
+    "tss-react": "^4.0.0"
+  },
+  "distModule": "esm/index.js",
+  "srcModule": "src/index.ts",
+  "module": "esm/index.js",
+  "publishConfig": {
+    "access": "public"
+  },
+  "gitHead": "1cbe7ba097fb2d2763c776e5e429e4670cdd583c"
+}

package/src/AboutWidget/components/AboutWidget.test.tsx

@@ -0,0 +1,35 @@
+import React from 'react'
+import { render } from '@testing-library/react'
+import { types } from 'mobx-state-tree'
+import { ConfigurationSchema } from '@jbrowse/core/configuration'
+
+// locals
+import AboutWidget from './AboutWidget'
+
+describe('<AboutWidget />', () => {
+  it('renders', () => {
+    const session = types
+      .model({
+        configuration: ConfigurationSchema('Null', {}),
+        rpcManager: types.frozen({}),
+        widgetModel: types.model({ type: types.literal('AboutWidget') }),
+      })
+      .create(
+        { widgetModel: { type: 'AboutWidget' } },
+        {
+          pluginManager: {
+            pluginMetadata: {},
+            plugins: [
+              {
+                name: 'HelloPlugin',
+                version: '1.0.0',
+                url: 'http://google.com',
+              },
+            ],
+          },
+        },
+      )
+    const { container } = render(<AboutWidget model={session.widgetModel} />)
+    expect(container.firstChild).toMatchSnapshot()
+  })
+})

package/src/AboutWidget/components/AboutWidget.tsx

@@ -0,0 +1,91 @@
+import React from 'react'
+import { observer } from 'mobx-react'
+import { IAnyStateTreeNode, getEnv } from 'mobx-state-tree'
+import { getSession } from '@jbrowse/core/util'
+import { Typography, Link } from '@mui/material'
+import { makeStyles } from 'tss-react/mui'
+import PluginManager from '@jbrowse/core/PluginManager'
+
+const useStyles = makeStyles()(theme => ({
+  root: {
+    margin: theme.spacing(2),
+    paddingTop: theme.spacing(2),
+  },
+  subtitle: {
+    margin: theme.spacing(1),
+  },
+  pluginList: {
+    margin: theme.spacing(1),
+    marginTop: theme.spacing(5),
+  },
+}))
+
+function About({ model }: { model: IAnyStateTreeNode }) {
+  const { classes } = useStyles()
+  const { version } = getSession(model)
+  const { pluginManager } = getEnv(model)
+  const { plugins } = pluginManager as PluginManager
+  const corePlugins = new Set(
+    plugins
+      .filter(p => pluginManager.pluginMetadata[p.name]?.isCore)
+      .map(p => p.name),
+  )
+
+  return (
+    <div className={classes.root}>
+      <Typography variant="h4" align="center">
+        JBrowse 2
+      </Typography>
+      <Typography variant="h6" align="center" className={classes.subtitle}>
+        {version}
+      </Typography>
+      <Typography align="center">
+        JBrowse is a{' '}
+        <Link href="http://gmod.org/" target="_blank" rel="noopener noreferrer">
+          GMOD
+        </Link>{' '}
+        project
+      </Typography>
+      <br />
+      <Typography align="center">
+        © 2019-2022 The Evolutionary Software Foundation
+      </Typography>
+      <div className={classes.pluginList}>
+        <Typography>External plugins loaded</Typography>
+        <ul>
+          {plugins
+            .filter(plugin => !corePlugins.has(plugin.name))
+            .map(plugin => {
+              const { url, name, version = '' } = plugin
+              const text = `${name} ${version || ''}`
+              return (
+                <li key={plugin.name}>
+                  {plugin.url ? (
+                    <Link target="_blank" rel="noopener noreferrer" href={url}>
+                      {text}
+                    </Link>
+                  ) : (
+                    <Typography>{text}</Typography>
+                  )}
+                </li>
+              )
+            })}
+        </ul>
+        <Typography>Core plugins loaded</Typography>
+        <ul>
+          {plugins
+            .filter(plugin => corePlugins.has(plugin.name))
+            .map(plugin => (
+              <li key={plugin.name}>
+                <Typography>
+                  {plugin.name} {plugin.version || ''}
+                </Typography>
+              </li>
+            ))}
+        </ul>
+      </div>
+    </div>
+  )
+}
+
+export default observer(About)

package/src/AboutWidget/components/__snapshots__/AboutWidget.test.tsx.snap

@@ -0,0 +1,65 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<AboutWidget /> renders 1`] = `
+<div
+  class="css-1a8qml5-root"
+>
+  <h4
+    class="MuiTypography-root MuiTypography-h4 MuiTypography-alignCenter css-149xwtl-MuiTypography-root"
+  >
+    JBrowse 2
+  </h4>
+  <h6
+    class="MuiTypography-root MuiTypography-h6 MuiTypography-alignCenter css-1l8stdg-MuiTypography-root-subtitle"
+  />
+  <p
+    class="MuiTypography-root MuiTypography-body1 MuiTypography-alignCenter css-1uwgr7b-MuiTypography-root"
+  >
+    JBrowse is a
+     
+    <a
+      class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-1bhi0za-MuiTypography-root-MuiLink-root"
+      href="http://gmod.org/"
+      rel="noopener noreferrer"
+      target="_blank"
+    >
+      GMOD
+    </a>
+     
+    project
+  </p>
+  <br />
+  <p
+    class="MuiTypography-root MuiTypography-body1 MuiTypography-alignCenter css-1uwgr7b-MuiTypography-root"
+  >
+    © 2019-2022 The Evolutionary Software Foundation
+  </p>
+  <div
+    class="css-la8yjp-pluginList"
+  >
+    <p
+      class="MuiTypography-root MuiTypography-body1 css-ahj2mt-MuiTypography-root"
+    >
+      External plugins loaded
+    </p>
+    <ul>
+      <li>
+        <a
+          class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-1bhi0za-MuiTypography-root-MuiLink-root"
+          href="http://google.com"
+          rel="noopener noreferrer"
+          target="_blank"
+        >
+          HelloPlugin 1.0.0
+        </a>
+      </li>
+    </ul>
+    <p
+      class="MuiTypography-root MuiTypography-body1 css-ahj2mt-MuiTypography-root"
+    >
+      Core plugins loaded
+    </p>
+    <ul />
+  </div>
+</div>
+`;

package/src/AboutWidget/index.ts

@@ -0,0 +1,10 @@
+import { ConfigurationSchema } from '@jbrowse/core/configuration'
+import { ElementId } from '@jbrowse/core/util/types/mst'
+import { types } from 'mobx-state-tree'
+
+export const configSchema = ConfigurationSchema('AboutWidget', {})
+
+export const stateModel = types.model('AboutWidget', {
+  id: ElementId,
+  type: types.literal('AboutWidget'),
+})

package/src/HelpWidget/components/HelpWidget.test.js

@@ -0,0 +1,10 @@
+import React from 'react'
+import { render } from '@testing-library/react'
+import HelpWidget from './HelpWidget'
+
+describe('<HelpWidget />', () => {
+  it('renders', () => {
+    const { container } = render(<HelpWidget />)
+    expect(container.firstChild).toMatchSnapshot()
+  })
+})

package/src/HelpWidget/components/HelpWidget.tsx

@@ -0,0 +1,75 @@
+import React from 'react'
+import { observer } from 'mobx-react'
+import { IAnyStateTreeNode } from 'mobx-state-tree'
+import { getSession } from '@jbrowse/core/util'
+import { makeStyles } from 'tss-react/mui'
+import { Link, Typography } from '@mui/material'
+
+const useStyles = makeStyles()(theme => ({
+  root: {
+    margin: theme.spacing(2),
+  },
+  subtitle: {
+    margin: theme.spacing(1),
+  },
+}))
+
+function Help({ model }: { model?: IAnyStateTreeNode }) {
+  const { classes } = useStyles()
+  const root = model ? getSession(model) : { version: '' }
+  return (
+    <div className={classes.root}>
+      <Typography variant="h4" align="center">
+        JBrowse 2
+      </Typography>
+      <Typography variant="h6" align="center" className={classes.subtitle}>
+        {root.version}
+      </Typography>
+
+      <Typography>
+        Here are some resources to get help. Please report the version number
+        above when asking questions. Thanks!
+      </Typography>
+      <ul>
+        <li>
+          <Link
+            href="https://github.com/GMOD/jbrowse-components/discussions"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            Question & answer forum
+          </Link>
+        </li>
+        <li>
+          <Link
+            href="https://github.com/GMOD/jbrowse-components/issues/new/choose"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            Report a bug
+          </Link>
+        </li>
+        <li>
+          <Link
+            href="https://jbrowse.org/jb2/docs/user_guide"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            User guide
+          </Link>
+        </li>
+        <li>
+          <Link
+            href="https://jbrowse.org/jb2/docs/"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            Documentation
+          </Link>
+        </li>
+      </ul>
+    </div>
+  )
+}
+
+export default observer(Help)

package/src/HelpWidget/components/__snapshots__/HelpWidget.test.js.snap

@@ -0,0 +1,63 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<HelpWidget /> renders 1`] = `
+<div
+  class="css-dpbaeg-root"
+>
+  <h4
+    class="MuiTypography-root MuiTypography-h4 MuiTypography-alignCenter css-149xwtl-MuiTypography-root"
+  >
+    JBrowse 2
+  </h4>
+  <h6
+    class="MuiTypography-root MuiTypography-h6 MuiTypography-alignCenter css-1l8stdg-MuiTypography-root-subtitle"
+  />
+  <p
+    class="MuiTypography-root MuiTypography-body1 css-ahj2mt-MuiTypography-root"
+  >
+    Here are some resources to get help. Please report the version number above when asking questions. Thanks!
+  </p>
+  <ul>
+    <li>
+      <a
+        class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-1bhi0za-MuiTypography-root-MuiLink-root"
+        href="https://github.com/GMOD/jbrowse-components/discussions"
+        rel="noopener noreferrer"
+        target="_blank"
+      >
+        Question & answer forum
+      </a>
+    </li>
+    <li>
+      <a
+        class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-1bhi0za-MuiTypography-root-MuiLink-root"
+        href="https://github.com/GMOD/jbrowse-components/issues/new/choose"
+        rel="noopener noreferrer"
+        target="_blank"
+      >
+        Report a bug
+      </a>
+    </li>
+    <li>
+      <a
+        class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-1bhi0za-MuiTypography-root-MuiLink-root"
+        href="https://jbrowse.org/jb2/docs/user_guide"
+        rel="noopener noreferrer"
+        target="_blank"
+      >
+        User guide
+      </a>
+    </li>
+    <li>
+      <a
+        class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways css-1bhi0za-MuiTypography-root-MuiLink-root"
+        href="https://jbrowse.org/jb2/docs/"
+        rel="noopener noreferrer"
+        target="_blank"
+      >
+        Documentation
+      </a>
+    </li>
+  </ul>
+</div>
+`;