v0.2.0-unstable3

client/src/components/tableView/prettyTableView.jsx

@@ -65,22 +65,23 @@ const PrettyTableView = ({ getKey, data, columns, onRowClick, linkTo }) => {
                     '&:hover': {
                       backgroundColor: 'rgba(0, 0, 0, 0.06)',
                       borderColor: 'gray',
-                      textDecoration: 'underline',
+                      '&:hover .emphasis': {
+                        textDecoration: 'underline'
+                      }
                     },
                   }}
                 >
                   {columns.map((column) => (
                 
-                    <TableCell sx={column.style}>
+                    <TableCell 
-                      {!column.clickable ? <Link
+                    component={(linkTo && !column.clickable) ? Link : 'td'}
-                        to={linkTo && linkTo(row, key)}
+                    to={linkTo(row, key)}
-                        style={{
+                    className={column.underline ? 'emphasis' : ''}
-                          color: 'inherit',
+                    sx={{
-                          textDecoration: 'inherit',
+                      textDecoration: 'none',
-                        }}
+                      ...column.style,
-                      >
+                    }}>
-                        {column.field(row, key)}
+                      {column.field(row, key)}
-                      </Link> : column.field(row, key)}
                     </TableCell>
                   ))}
                 </TableRow>

client/src/pages/config/users/proxyman.jsx

@@ -170,7 +170,7 @@ const ProxyManagement = () => {
       {routes && <PrettyTableView 
         data={routes}
         getKey={(r) => r.Name + r.Target + r.Mode}
-        onRowClick={(r) => {navigate('/ui/config-url/' + r.Name)}}
+        linkTo={(r) => '/ui/config-url/' + r.Name}
         columns={[
           { 
             title: '', 
@@ -184,14 +184,13 @@ const ProxyManagement = () => {
             style: {
               textDecoration: 'inherit',
             },
+            underline: true,
             field: (r) => <>
               <div style={{display:'inline-block', textDecoration: 'inherit', fontSize:'125%', color: isDark ? theme.palette.primary.light : theme.palette.primary.dark}}>{r.Name}</div><br/>
               <div style={{display:'inline-block', textDecoration: 'inherit', fontSize: '90%', opacity: '90%'}}>{r.Description}</div>
             </>
           },
-          // { title: 'Description', field: (r) => shorten(r.Description), style:{fontSize: '90%', opacity: '90%'} },
           { title: 'Origin', clickable:true, search: (r) => r.Host + ' ' + r.PathPrefix, field: (r) => <HostChip route={r} /> },
-          // { title: 'Mode', field: (r) => <RouteMode route={r} /> },
           { title: 'Target', search: (r) => r.Target, field: (r) => <><RouteMode route={r} /> <Chip label={r.Target} /></> },
           { title: 'Security', field: (r) => <RouteSecurity route={r} />,
           style: {minWidth: '70px'} },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "cosmos-server",
-  "version": "0.2.0-unstable2",
+  "version": "0.2.0-unstable3",
   "description": "",
   "main": "test-server.js",
   "bugs": {