From db2f75ae1f5a6ca198cdacab025064f1769c24fc Mon Sep 17 00:00:00 2001
From: Tom Hacohen <tom@stosb.com>
Date: Mon, 1 Jun 2020 11:46:26 +0300
Subject: [PATCH] Fix item UIDs with illegal url characters in them by
 urlescaping them.

Fixes #47.
---
 src/Journals/journalView.tsx |  4 ++--
 src/Pim/PimMain.tsx          |  6 +++---
 src/Pim/index.tsx            | 37 +++++++++++++++++++-----------------
 3 files changed, 25 insertions(+), 22 deletions(-)

diff --git a/src/Journals/journalView.tsx b/src/Journals/journalView.tsx
index 9ef8891..1c69819 100644
--- a/src/Journals/journalView.tsx
+++ b/src/Journals/journalView.tsx
@@ -31,7 +31,7 @@ export function journalView(JournalList: any, JournalItem: any) {
       const uid = contact.uid;
 
       this.props.history!.push(
-        routeResolver.getRoute('journals._id.items._id', { journalUid: this.props.journal.uid, itemUid: uid }));
+        routeResolver.getRoute('journals._id.items._id', { journalUid: this.props.journal.uid, itemUid: encodeURIComponent(uid) }));
     }
 
     public render() {
@@ -53,7 +53,7 @@ export function journalView(JournalList: any, JournalItem: any) {
             render={({ match }) => {
 
               return (
-                <JournalItem item={items[`${match.params.journalUid}|${match.params.itemUid}`]} />
+                <JournalItem item={items[`${match.params.journalUid}|${decodeURIComponent(match.params.itemUid)}`]} />
               );
             }}
           />
diff --git a/src/Pim/PimMain.tsx b/src/Pim/PimMain.tsx
index 6067001..eb70ac9 100644
--- a/src/Pim/PimMain.tsx
+++ b/src/Pim/PimMain.tsx
@@ -65,7 +65,7 @@ class PimMain extends React.PureComponent<PropsType> {
 
   public eventClicked(event: ICAL.Event) {
     // FIXME:Hack
-    const itemUid = `${(event as any).journalUid}|${event.uid}`;
+    const itemUid = `${(event as any).journalUid}|${encodeURIComponent(event.uid)}`;
 
     this.props.history!.push(
       routeResolver.getRoute('pim.events._id', { itemUid }));
@@ -73,7 +73,7 @@ class PimMain extends React.PureComponent<PropsType> {
 
   public taskClicked(event: ICAL.Event) {
     // FIXME:Hack
-    const itemUid = `${(event as any).journalUid}|${event.uid}`;
+    const itemUid = `${(event as any).journalUid}|${encodeURIComponent(event.uid)}`;
 
     this.props.history!.push(
       routeResolver.getRoute('pim.tasks._id.edit', { itemUid }));
@@ -81,7 +81,7 @@ class PimMain extends React.PureComponent<PropsType> {
 
   public contactClicked(contact: ContactType) {
     // FIXME:Hack
-    const itemUid = `${(contact as any).journalUid}|${contact.uid}`;
+    const itemUid = `${(contact as any).journalUid}|${encodeURIComponent(contact.uid)}`;
 
     this.props.history!.push(
       routeResolver.getRoute('pim.contacts._id', { itemUid }));
diff --git a/src/Pim/index.tsx b/src/Pim/index.tsx
index f37e28f..1a20130 100644
--- a/src/Pim/index.tsx
+++ b/src/Pim/index.tsx
@@ -153,21 +153,24 @@ const CollectionRoutes = withStyles(styles)(withRouter(
           <Route
             path={routeResolver.getRoute(props.routePrefix + '._id.edit')}
             exact
-            render={({ match }) => (
-              <Container style={{ maxWidth: '30rem' }}>
-                {(match.params.itemUid in props.items) &&
-                  <ComponentEdit
-                    initialCollection={(props.items[match.params.itemUid] as any).journalUid}
-                    item={props.items[match.params.itemUid]}
-                    collections={props.collections}
-                    onSave={props.onItemSave}
-                    onDelete={props.onItemDelete}
-                    onCancel={props.onItemCancel}
-                    history={props.history}
-                  />
-                }
-              </Container>
-            )}
+            render={({ match }) => {
+              const itemUid = decodeURIComponent(match.params.itemUid);
+              return (
+                <Container style={{ maxWidth: '30rem' }}>
+                  {(itemUid in props.items) &&
+                    <ComponentEdit
+                      initialCollection={(props.items[itemUid] as any).journalUid}
+                      item={props.items[itemUid]}
+                      collections={props.collections}
+                      onSave={props.onItemSave}
+                      onDelete={props.onItemDelete}
+                      onCancel={props.onItemCancel}
+                      history={props.history}
+                    />
+                  }
+                </Container>
+              );
+            }}
           />
           <Route
             path={routeResolver.getRoute(props.routePrefix + '._id.log')}
@@ -176,7 +179,7 @@ const CollectionRoutes = withStyles(styles)(withRouter(
               <Container>
                 <ItemChangeLog
                   syncInfo={props.syncInfo}
-                  paramItemUid={match.params.itemUid}
+                  paramItemUid={decodeURIComponent(match.params.itemUid)}
                 />
               </Container>
             )}
@@ -216,7 +219,7 @@ const CollectionRoutes = withStyles(styles)(withRouter(
                     Edit
                   </Button>
                 </div>
-                <ComponentView item={props.items[match.params.itemUid]} />
+                <ComponentView item={props.items[decodeURIComponent(match.params.itemUid)]} />
               </Container>
             )}
           />