Routing shell

2020-12-30 16:10:30 -06:00
parent 29ae24c6a6
commit 1a8d9c529e
7 changed files with 175 additions and 60 deletions
@@ -1,24 +1,27 @@
 import classNames from 'classnames';
 import Icon from './Icon';
+import { Link } from 'wouter';

-const Tab = ({ title, icon, selected, selectedIcon, onClick }) => (
-  <a
-    onClick={onClick}
-    href="#"
-    className={classNames('px-6 rounded-md text-sm text-center font-medium cursor-pointer', {
-      'text-gray-500 dark:text-white': !selected,
-      'text-gray-800 dark:text-gray-600': selected,
-    })}
-  >
-    {icon && (
-      <Icon
-        icon={selected ? selectedIcon : icon}
-        className="cursor-pointer"
-        style={{ fontSize: '18px' }}
-      />
-    )}
-    <label className="block cursor-pointer">{title}</label>
-  </a>
+const Tab = ({ title, href, icon, selected, selectedIcon, onClick }) => (
+  <Link href={href}>
+    <a
+      onClick={onClick}
+      href="#"
+      className={classNames('px-6 rounded-md text-sm text-center font-medium cursor-pointer', {
+        'text-gray-500 dark:text-white': !selected,
+        'text-gray-800 dark:text-gray-600': selected,
+      })}
+    >
+      {icon && (
+        <Icon
+          icon={selected ? selectedIcon : icon}
+          className="cursor-pointer"
+          style={{ fontSize: '18px' }}
+        />
+      )}
+      <label className="block cursor-pointer">{title}</label>
+    </a>
+  </Link>
 );

 export default Tab;