Modify navigation to work with rightpanel segment

- Ensure that rightpanel does not show in the URL.
- Create an action of details to insert the rightpanel segment.
- Make sure rightpanel can be a child of room.

Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
This commit is contained in:
RMidhunSuresh 2021-06-17 14:16:10 +05:30
parent b74e4452dd
commit 7500bbeaad

View file

@ -37,7 +37,9 @@ function allowsChild(parent, child) {
// downside of the approach: both of these will control which tile is selected // downside of the approach: both of these will control which tile is selected
return type === "room" || type === "empty-grid-tile"; return type === "room" || type === "empty-grid-tile";
case "room": case "room":
return type === "lightbox" || type === "details" || type === "members"; return type === "lightbox" || type === "members" || type === "rightpanel";
case "rightpanel":
return type === "details";
default: default:
return false; return false;
} }
@ -114,6 +116,7 @@ export function parseUrlPath(urlPath, currentNavPath, defaultSessionId) {
} }
segments.push(new Segment("room", roomId)); segments.push(new Segment("room", roomId));
if (currentNavPath.get("details")?.value) { if (currentNavPath.get("details")?.value) {
segments.push(new Segment("rightpanel"));
segments.push(new Segment("details")); segments.push(new Segment("details"));
} }
} else if (type === "last-session") { } else if (type === "last-session") {
@ -124,6 +127,9 @@ export function parseUrlPath(urlPath, currentNavPath, defaultSessionId) {
if (sessionSegment) { if (sessionSegment) {
segments.push(sessionSegment); segments.push(sessionSegment);
} }
} else if (type === "details") {
segments.push(new Segment("rightpanel"));
segments.push(new Segment("details"));
} else { } else {
// might be undefined, which will be turned into true by Segment // might be undefined, which will be turned into true by Segment
const value = iterator.next().value; const value = iterator.next().value;
@ -152,6 +158,8 @@ export function stringifyPath(path) {
urlPath += `/${segment.type}/${segment.value}`; urlPath += `/${segment.type}/${segment.value}`;
} }
break; break;
case "rightpanel":
continue;
default: default:
urlPath += `/${segment.type}`; urlPath += `/${segment.type}`;
if (segment.value && segment.value !== true) { if (segment.value && segment.value !== true) {
@ -185,6 +193,18 @@ export function tests() {
const urlPath = stringifyPath(path); const urlPath = stringifyPath(path);
assert.equal(urlPath, "/session/1/rooms/a,b,c/1"); assert.equal(urlPath, "/session/1/rooms/a,b,c/1");
}, },
"stringify url with rightpanel and details segment": assert => {
const nav = new Navigation(allowsChild);
const path = nav.pathFrom([
new Segment("session", 1),
new Segment("rooms", ["a", "b", "c"]),
new Segment("room", "b"),
new Segment("rightpanel"),
new Segment("details")
]);
const urlPath = stringifyPath(path);
assert.equal(urlPath, "/session/1/rooms/a,b,c/1/details");
},
"parse grid url path with focused empty tile": assert => { "parse grid url path with focused empty tile": assert => {
const segments = parseUrlPath("/session/1/rooms/a,b,c/3"); const segments = parseUrlPath("/session/1/rooms/a,b,c/3");
assert.equal(segments.length, 3); assert.equal(segments.length, 3);
@ -263,18 +283,21 @@ export function tests() {
new Segment("session", 1), new Segment("session", 1),
new Segment("rooms", ["a", "b", "c"]), new Segment("rooms", ["a", "b", "c"]),
new Segment("room", "b"), new Segment("room", "b"),
new Segment("rightpanel", true),
new Segment("details", true) new Segment("details", true)
]); ]);
const segments = parseUrlPath("/session/1/open-room/a", path); const segments = parseUrlPath("/session/1/open-room/a", path);
assert.equal(segments.length, 4); assert.equal(segments.length, 5);
assert.equal(segments[0].type, "session"); assert.equal(segments[0].type, "session");
assert.equal(segments[0].value, "1"); assert.equal(segments[0].value, "1");
assert.equal(segments[1].type, "rooms"); assert.equal(segments[1].type, "rooms");
assert.deepEqual(segments[1].value, ["a", "b", "c"]); assert.deepEqual(segments[1].value, ["a", "b", "c"]);
assert.equal(segments[2].type, "room"); assert.equal(segments[2].type, "room");
assert.equal(segments[2].value, "a"); assert.equal(segments[2].value, "a");
assert.equal(segments[3].type, "details"); assert.equal(segments[3].type, "rightpanel");
assert.equal(segments[3].value, true); assert.equal(segments[3].value, true);
assert.equal(segments[4].type, "details");
assert.equal(segments[4].value, true);
}, },
"parse open-room action setting a room in an empty tile": assert => { "parse open-room action setting a room in an empty tile": assert => {
const nav = new Navigation(allowsChild); const nav = new Navigation(allowsChild);