joepie91
/
cvm
1
0
Fork 0
Code Issues 2 Pull Requests Releases Wiki Activity

Compare commits

base: joepie91:ab279c84f3c1b330ed42232557222f72241b6a5d
Branches Tags
joepie91:feature/node-rewrite
...
compare: joepie91:385d526b0f6c5f5db4ca583042d96051b1bc5558
Branches Tags
joepie91:feature/node-rewrite

2 Commits
ab279c84f3 ... 385d526b0f

Author SHA1 Message Date
Sven Slootweg 385d526b0f Add forgotten isUnderPrefix implementation 5 years ago
Sven Slootweg b9e2515dd3 Implement active tab highlighting in JSX layout 5 years ago
3 changed files with 13 additions and 12 deletions
Show Stats

9
src/app.js
Unescape Escape View File

@ -58,14 +58,7 @@ module.exports = function () {
}; };
app.use((req, res, next) => { app.use((req, res, next) => {
res.locals.isUnderPrefix = function isUnderPrefix(path, resultingClass) { res.locals.currentPath = req.originalUrl;
// FIXME: Proper path segment parsing...
if (req.originalUrl.indexOf(path) === 0) {
return resultingClass;
} else {
return "";
}
};
next(); next();
}); });

6
src/is-under-prefix.js
Unescape Escape View File

@ -0,0 +1,6 @@
"use strict";
module.exports = function isUnderPrefix(prefix, path) {
/* TODO: Does this need to be improved via 'proper' path segment parsing? */
return (path.indexOf(prefix) === 0);
};

10
src/views/layout.jsx
Unescape Escape View File

@ -2,10 +2,13 @@
const React = require("react"); const React = require("react");
const classnames = require("classnames"); const classnames = require("classnames");
// const {LocalsContext} = require("../express-async-react");
const {LocalsContext} = require("../express-async-react");
const isUnderPrefix = require("../is-under-prefix");
function MenuItem({ path, children }) { function MenuItem({ path, children }) {
let isActive = false; // FIXME let {currentPath} = React.useContext(LocalsContext);
let isActive = isUnderPrefix(path, currentPath);
return ( return (
<div className={classnames("menu-item", {active: isActive})}> <div className={classnames("menu-item", {active: isActive})}>
@ -17,8 +20,6 @@ function MenuItem({ path, children }) {
} }
module.exports = function Layout({ children }) { module.exports = function Layout({ children }) {
// let locals = React.useContext(LocalsContext);
return ( return (
<html> <html>
<head> <head>
@ -28,6 +29,7 @@ module.exports = function Layout({ children }) {
<body> <body>
<div className="menu"> <div className="menu">
<h1>CVM</h1> <h1>CVM</h1>
<MenuItem path="/hardware">Hardware</MenuItem>
<MenuItem path="/disk-images">Disk Images</MenuItem> <MenuItem path="/disk-images">Disk Images</MenuItem>
<MenuItem path="/instances">Instances</MenuItem> <MenuItem path="/instances">Instances</MenuItem>
<MenuItem path="/users">Users</MenuItem> <MenuItem path="/users">Users</MenuItem>

Write Preview
Loading…
Cancel
Save