OHIF-252: "Recent" and "All" tabs should be disabled if there are no studies on their category (#1859)

* OHIF-252: "Recent" and "All" tabs should be disabled if there are no studies on their category

* fix button props and avoid onClick on disabled state

platform/ui/src/components/Button/Button.jsx

@@ -91,6 +91,8 @@ const Button = ({
   startIcon: startIconProp,
   endIcon: endIconProp,
   className,
+  onClick,
+  /** TODO: All possible props should be explicitly defined -- avoid spreading props  */
   ...rest
 }) => {
   const startIcon = startIconProp && (
@@ -112,8 +114,8 @@ const Button = ({
 
   const handleOnClick = e => {
     buttonElement.current.blur();
-    if (rest.onClick) {
-      rest.onClick(e);
+    if (!disabled) {
+      onClick(e);
     }
   };
 
@@ -159,6 +161,7 @@ Button.propTypes = {
   startIcon: PropTypes.node,
   endIcon: PropTypes.node,
   className: PropTypes.string,
+  onClick: PropTypes.func.isRequired,
 };
 
 export default Button;

platform/ui/src/components/StudyBrowser/StudyBrowser.jsx

@@ -79,8 +79,9 @@ const StudyBrowser = ({
           className="border rounded-md border-secondary-light"
         >
           {tabs.map(tab => {
-            const { name, label } = tab;
+            const { name, label, studies } = tab;
             const isActive = activeTabName === name;
+            const isDisabled = !studies.length;
             return (
               <Button
                 key={name}
@@ -92,6 +93,7 @@ const StudyBrowser = ({
                 onClick={() => {
                   onClickTab(name);
                 }}
+                disabled={isDisabled}
               >
                 {label}
               </Button>