Encode ids as URI component

This commit is contained in:
RMidhunSuresh 2022-11-25 11:13:47 +05:30
parent 12e378eb62
commit e9053372d6
No known key found for this signature in database
3 changed files with 24 additions and 10 deletions

View File

@ -144,7 +144,7 @@ export class URLRouter<T extends {session: string | boolean}> implements IURLRou
openRoomActionUrl(roomId: string): string { openRoomActionUrl(roomId: string): string {
// not a segment to navigation knowns about, so append it manually // not a segment to navigation knowns about, so append it manually
const urlPath = `${this._stringifyPath(this._navigation.path.until("session"))}/open-room/${roomId}`; const urlPath = `${this._stringifyPath(this._navigation.path.until("session"))}/open-room/${encodeURIComponent(roomId)}`;
return this._history.pathAsUrl(urlPath); return this._history.pathAsUrl(urlPath);
} }

View File

@ -147,7 +147,7 @@ export function parseUrlPath(urlPath: string, currentNavPath: Path<SegmentType>,
segments.push(new Segment("empty-grid-tile", selectedIndex)); segments.push(new Segment("empty-grid-tile", selectedIndex));
} }
} else if (type === "open-room") { } else if (type === "open-room") {
const roomId = iterator.next().value; const roomId = decodeURIComponent(iterator.next().value);
if (!roomId) { break; } if (!roomId) { break; }
const rooms = currentNavPath.get("rooms"); const rooms = currentNavPath.get("rooms");
if (rooms) { if (rooms) {
@ -176,7 +176,7 @@ export function parseUrlPath(urlPath: string, currentNavPath: Path<SegmentType>,
} else if (type === "details" || type === "members") { } else if (type === "details" || type === "members") {
pushRightPanelSegment(segments, type); pushRightPanelSegment(segments, type);
} else if (type === "member") { } else if (type === "member") {
const userId = iterator.next().value; const userId = decodeURIComponent(iterator.next().value);
if (!userId) { break; } if (!userId) { break; }
pushRightPanelSegment(segments, type, userId); pushRightPanelSegment(segments, type, userId);
} else if (type.includes("loginToken")) { } else if (type.includes("loginToken")) {
@ -185,7 +185,7 @@ export function parseUrlPath(urlPath: string, currentNavPath: Path<SegmentType>,
segments.push(new Segment("sso", loginToken)); segments.push(new Segment("sso", loginToken));
} 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 = decodeURIComponent(iterator.next().value);
segments.push(new Segment(type, value)); segments.push(new Segment(type, value));
} }
} }
@ -196,19 +196,20 @@ export function stringifyPath(path: Path<SegmentType>): string {
let urlPath = ""; let urlPath = "";
let prevSegment: Segment<SegmentType> | undefined; let prevSegment: Segment<SegmentType> | undefined;
for (const segment of path.segments) { for (const segment of path.segments) {
const encodedSegmentValue = encodeSegmentValue(segment.value);
switch (segment.type) { switch (segment.type) {
case "rooms": case "rooms":
urlPath += `/rooms/${segment.value.join(",")}`; urlPath += `/rooms/${(encodedSegmentValue as string[]).join(",")}`;
break; break;
case "empty-grid-tile": case "empty-grid-tile":
urlPath += `/${segment.value}`; urlPath += `/${encodedSegmentValue}`;
break; break;
case "room": case "room":
if (prevSegment?.type === "rooms") { if (prevSegment?.type === "rooms") {
const index = prevSegment.value.indexOf(segment.value); const index = prevSegment.value.indexOf(segment.value);
urlPath += `/${index}`; urlPath += `/${index}`;
} else { } else {
urlPath += `/${segment.type}/${segment.value}`; urlPath += `/${segment.type}/${encodedSegmentValue}`;
} }
break; break;
case "right-panel": case "right-panel":
@ -217,8 +218,8 @@ export function stringifyPath(path: Path<SegmentType>): string {
continue; continue;
default: default:
urlPath += `/${segment.type}`; urlPath += `/${segment.type}`;
if (segment.value && segment.value !== true) { if (encodedSegmentValue && encodedSegmentValue !== true) {
urlPath += `/${segment.value}`; urlPath += `/${encodedSegmentValue}`;
} }
} }
prevSegment = segment; prevSegment = segment;
@ -226,6 +227,19 @@ export function stringifyPath(path: Path<SegmentType>): string {
return urlPath; return urlPath;
} }
function encodeSegmentValue(value: SegmentType[keyof SegmentType]) {
if (typeof value === "boolean") {
// Nothing to encode for boolean
return value;
}
else if (Array.isArray(value)) {
return value.map(v => encodeURIComponent(v));
}
else {
return encodeURIComponent(value);
}
}
export function tests() { export function tests() {
function createEmptyPath() { function createEmptyPath() {
const nav: Navigation<SegmentType> = new Navigation(allowsChild); const nav: Navigation<SegmentType> = new Navigation(allowsChild);

View File

@ -48,7 +48,7 @@ export class MemberTileViewModel extends ViewModel {
get detailsUrl() { get detailsUrl() {
const roomId = this.navigation.path.get("room").value; const roomId = this.navigation.path.get("room").value;
return `${this.urlRouter.openRoomActionUrl(roomId)}/member/${this._member.userId}`; return `${this.urlRouter.openRoomActionUrl(roomId)}/member/${encodeURIComponent(this._member.userId)}`;
} }
_updatePreviousName(newName) { _updatePreviousName(newName) {