From 6767768f1d32674886bf6e0586a96d555aed70b7 Mon Sep 17 00:00:00 2001
From: Colin <colin.diesh@gmail.com>
Date: Fri, 23 Sep 2022 14:19:10 -0600
Subject: [PATCH] Fix trackhubregistry

---
 plugins/trackhub-registry/package.json                 |  3 ++-
 .../src/trackhub-registry/SelectBox.js                 |  6 +++---
 .../src/trackhub-registry/TrackHubRegistrySelect.js    | 10 ++++------
 3 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/plugins/trackhub-registry/package.json b/plugins/trackhub-registry/package.json
index aa81981d96..7a98da353f 100644
--- a/plugins/trackhub-registry/package.json
+++ b/plugins/trackhub-registry/package.json
@@ -48,7 +48,8 @@
     "mobx-react": "^7.0.0",
     "mobx-state-tree": "^5.0.0",
     "prop-types": "^15.0.0",
-    "react": ">=16.8.0"
+    "react": ">=16.8.0",
+    "tss-react": "^3.0.0"
   },
   "private": true,
   "distModule": "esm/index.js",
diff --git a/plugins/trackhub-registry/src/trackhub-registry/SelectBox.js b/plugins/trackhub-registry/src/trackhub-registry/SelectBox.js
index cf61b44711..276dbf87ee 100644
--- a/plugins/trackhub-registry/src/trackhub-registry/SelectBox.js
+++ b/plugins/trackhub-registry/src/trackhub-registry/SelectBox.js
@@ -3,11 +3,11 @@ import FormHelperText from '@mui/material/FormHelperText'
 import InputLabel from '@mui/material/InputLabel'
 import MenuItem from '@mui/material/MenuItem'
 import Select from '@mui/material/Select'
-import { makeStyles } from '@mui/material/styles'
+import { makeStyles } from 'tss-react/mui'
 import PropTypes from 'prop-types'
 import React from 'react'
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles()(theme => ({
   formControl: {
     minWidth: 192,
     marginLeft: theme.spacing(2),
@@ -22,7 +22,7 @@ function SelectBox({
   label,
   helpText,
 }) {
-  const classes = useStyles()
+  const { classes } = useStyles()
   return (
     <FormControl className={classes.formControl}>
       <InputLabel>{label}</InputLabel>
diff --git a/plugins/trackhub-registry/src/trackhub-registry/TrackHubRegistrySelect.js b/plugins/trackhub-registry/src/trackhub-registry/TrackHubRegistrySelect.js
index 6fbe223cea..41c8233f85 100644
--- a/plugins/trackhub-registry/src/trackhub-registry/TrackHubRegistrySelect.js
+++ b/plugins/trackhub-registry/src/trackhub-registry/TrackHubRegistrySelect.js
@@ -9,8 +9,8 @@ import {
   RadioGroup,
   Tooltip,
   Typography,
-  makeStyles,
 } from '@mui/material'
+import { makeStyles } from 'tss-react/mui'
 import { isAbortException } from '@jbrowse/core/util'
 import SanitizedHTML from '@jbrowse/core/ui/SanitizedHTML'
 import PropTypes from 'prop-types'
@@ -37,7 +37,7 @@ function Wire({ children, ...props }) {
   return children(props)
 }
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles()(theme => ({
   hubList: {
     maxHeight: 400,
     overflowY: 'auto',
@@ -55,7 +55,7 @@ function TrackHubRegistrySelect({ model, setModelReady }) {
   const [hubs, setHubs] = useState(new Map())
   const [allHubsRetrieved, setAllHubsRetrieved] = useState(false)
   const [selectedHub, setSelectedHub] = useState('')
-  const classes = useStyles()
+  const { classes } = useStyles()
 
   useEffect(() => {
     if (selectedHub) {
@@ -262,9 +262,7 @@ function TrackHubRegistrySelect({ model, setModelReady }) {
     return <div>{renderItems}</div>
   }
 
-  const speciesList = Object.keys(assemblies)
-    .sort()
-    .filter(item => item.toLowerCase().includes('sapiens'))
+  const speciesList = Object.keys(assemblies).sort()
 
   renderItems.push(
     <SelectBox