From 8fe45b63b112b7b0fe6b8ff62489c2eb1b14a92e Mon Sep 17 00:00:00 2001
From: Liam Fitzgerald <liam@urizen.co>
Date: Thu, 17 Sep 2020 11:54:07 +1000
Subject: [PATCH] publish: refactor for new sidebar

---
 .../views/apps/publish/PublishResource.tsx    | 38 +++++++++++++++++++
 .../apps/publish/components/lib/Note.tsx      |  7 ++--
 .../publish/components/lib/NoteNavigation.tsx |  4 +-
 .../publish/components/lib/NotePreview.tsx    |  2 +-
 .../publish/components/lib/NoteRoutes.tsx     |  6 ++-
 .../apps/publish/components/lib/Notebook.tsx  |  8 +++-
 .../publish/components/lib/NotebookPosts.tsx  |  2 +
 .../publish/components/lib/NotebookRoutes.tsx | 21 +++++-----
 .../apps/publish/components/lib/new-post.tsx  |  3 +-
 9 files changed, 72 insertions(+), 19 deletions(-)
 create mode 100644 pkg/interface/src/views/apps/publish/PublishResource.tsx

diff --git a/pkg/interface/src/views/apps/publish/PublishResource.tsx b/pkg/interface/src/views/apps/publish/PublishResource.tsx
new file mode 100644
index 000000000..e1eab7956
--- /dev/null
+++ b/pkg/interface/src/views/apps/publish/PublishResource.tsx
@@ -0,0 +1,38 @@
+import React from "react";
+
+import GlobalApi from "~/logic/api/global";
+import { StoreState } from "~/logic/store/type";
+import { Association } from "~/types";
+import { RouteComponentProps } from "react-router-dom";
+import { NotebookRoutes } from "./components/lib/NotebookRoutes";
+
+type PublishResourceProps = StoreState & {
+  association: Association;
+  api: GlobalApi;
+  baseUrl: string;
+} & RouteComponentProps;
+
+export function PublishResource(props: PublishResourceProps) {
+  const { association, api, baseUrl, notebooks } = props;
+  const appPath = association["app-path"];
+  const [, ship, book] = appPath.split("/");
+  const notebook = notebooks[ship][book];
+  const notebookContacts = props.contacts[association["group-path"]];
+
+  return (
+    <NotebookRoutes
+      api={api}
+      ship={ship}
+      book={book}
+      contacts={props.contacts}
+      groups={props.groups}
+      notebook={notebook}
+      notebookContacts={notebookContacts}
+      rootUrl={baseUrl}
+      baseUrl={`${baseUrl}/resource/publish/${ship}/${book}`}
+      history={props.history}
+      match={props.match}
+      location={props.location}
+    />
+  );
+}
diff --git a/pkg/interface/src/views/apps/publish/components/lib/Note.tsx b/pkg/interface/src/views/apps/publish/components/lib/Note.tsx
index d3cf8d928..0469425ff 100644
--- a/pkg/interface/src/views/apps/publish/components/lib/Note.tsx
+++ b/pkg/interface/src/views/apps/publish/components/lib/Note.tsx
@@ -24,6 +24,7 @@ interface NoteProps {
   api: GlobalApi;
   hideAvatars: boolean;
   hideNicknames: boolean;
+  rootUrl?: string;
 }
 
 export function Note(props: NoteProps & RouteComponentProps) {
@@ -33,12 +34,12 @@ export function Note(props: NoteProps & RouteComponentProps) {
     api.publish.fetchNote(ship, book, noteId);
   }, [ship, book, noteId]);
 
-  const baseUrl = `/~publish/notebook/${props.ship}/${props.book}`;
+  const rootUrl = props.rootUrl || `/~publish/notebook/${props.ship}/${props.book}`;
 
   const deletePost = async () => {
     setDeleting(true);
     await api.publish.delNote(ship.slice(1), book, noteId);
-    props.history.push(baseUrl);
+    props.history.push(rootUrl);
   };
 
   const comments = note?.comments || [];
@@ -77,7 +78,7 @@ export function Note(props: NoteProps & RouteComponentProps) {
       gridRowGap={4}
       mx="auto"
     >
-      <Link to={baseUrl}>
+      <Link to={rootUrl}>
         <Text>{"<- Notebook Index"}</Text>
       </Link>
       <Col>
diff --git a/pkg/interface/src/views/apps/publish/components/lib/NoteNavigation.tsx b/pkg/interface/src/views/apps/publish/components/lib/NoteNavigation.tsx
index 83fc0772d..d754474a4 100644
--- a/pkg/interface/src/views/apps/publish/components/lib/NoteNavigation.tsx
+++ b/pkg/interface/src/views/apps/publish/components/lib/NoteNavigation.tsx
@@ -54,7 +54,7 @@ export function NoteNavigation(props: NoteNavigationProps) {
   }
 
   if (next) {
-    nextUrl = `/~publish/notebook/${props.ship}/${props.book}/note/${props.nextId}`;
+    nextUrl = `${props.prevId}`;
     nextComponent = (
       <NavigationItem
         title={next.title}
@@ -64,7 +64,7 @@ export function NoteNavigation(props: NoteNavigationProps) {
     );
   }
   if (prev) {
-    prevUrl = `/~publish/notebook/${props.ship}/${props.book}/note/${props.prevId}`;
+    prevUrl = `${props.prevId}`;
     prevComponent = (
       <NavigationItem
         title={prev.title}
diff --git a/pkg/interface/src/views/apps/publish/components/lib/NotePreview.tsx b/pkg/interface/src/views/apps/publish/components/lib/NotePreview.tsx
index 17aa2d9d8..110cf39c8 100644
--- a/pkg/interface/src/views/apps/publish/components/lib/NotePreview.tsx
+++ b/pkg/interface/src/views/apps/publish/components/lib/NotePreview.tsx
@@ -38,7 +38,7 @@ export function NotePreview(props: NotePreviewProps) {
   }
   const date = moment(note["date-created"]).fromNow();
   //const popout = props.popout ? "popout/" : "";
-  const url = `/~publish/notebook/${props.host}/${props.book}/note/${note["note-id"]}`;
+  const url = `${props.book}/note/${note["note-id"]}`;
 
   return (
     <Link to={url}>
diff --git a/pkg/interface/src/views/apps/publish/components/lib/NoteRoutes.tsx b/pkg/interface/src/views/apps/publish/components/lib/NoteRoutes.tsx
index e97105ab1..b472a8209 100644
--- a/pkg/interface/src/views/apps/publish/components/lib/NoteRoutes.tsx
+++ b/pkg/interface/src/views/apps/publish/components/lib/NoteRoutes.tsx
@@ -16,12 +16,16 @@ interface NoteRoutesProps {
   notebook: Notebook;
   contacts: Contacts;
   api: GlobalApi;
+  hideNicknames: boolean;
+  hideAvatars: boolean;
+  baseUrl?: string;
+  rootUrl?: string;
 }
 
 export function NoteRoutes(props: NoteRoutesProps & RouteComponentProps) {
   const { ship, book, noteId } = props;
 
-  const baseUrl = `/~publish/notebook/${ship}/${book}/note/${noteId}`;
+  const baseUrl = props.baseUrl || `/~publish/notebook/${ship}/${book}/note/${noteId}`;
 
   const relativePath = (path: string) => `${baseUrl}${path}`;
   return (
diff --git a/pkg/interface/src/views/apps/publish/components/lib/Notebook.tsx b/pkg/interface/src/views/apps/publish/components/lib/Notebook.tsx
index 86c94dabc..8c9520ca0 100644
--- a/pkg/interface/src/views/apps/publish/components/lib/Notebook.tsx
+++ b/pkg/interface/src/views/apps/publish/components/lib/Notebook.tsx
@@ -38,6 +38,8 @@ interface NotebookProps {
   contacts: Rolodex;
   groups: Groups;
   hideNicknames: boolean;
+  baseUrl: string;
+  rootUrl: string;
 }
 
 export function Notebook(props: NotebookProps & RouteComponentProps) {
@@ -56,6 +58,8 @@ export function Notebook(props: NotebookProps & RouteComponentProps) {
   const notes = notebook?.notes || {};
   const showNickname = contact?.nickname && !props.hideNicknames;
 
+  const relativePath = (p: string) => props.baseUrl + p;
+
   return (
     <Box
       pt={4}
@@ -68,7 +72,7 @@ export function Notebook(props: NotebookProps & RouteComponentProps) {
       gridColumnGap={3}
     >
       <Box display={["block", "none"]} gridColumn={["1/2", "1/3"]}>
-        <Link to="/~publish">{"<- All Notebooks"}</Link>
+        <Link to={props.rootUrl}>{"<- All Notebooks"}</Link>
       </Box>
       <Box>
         <Text> {notebook?.title}</Text>
@@ -80,7 +84,7 @@ export function Notebook(props: NotebookProps & RouteComponentProps) {
       </Box>
       <Row justifyContent={["flex-start", "flex-end"]}>
         {isWriter && (
-          <Link to={`/~publish/notebook/${ship}/${book}/new`}>
+          <Link to={relativePath('/new')}>
             <Button primary border>
               New Post
             </Button>
diff --git a/pkg/interface/src/views/apps/publish/components/lib/NotebookPosts.tsx b/pkg/interface/src/views/apps/publish/components/lib/NotebookPosts.tsx
index 26e388b06..9972c3abc 100644
--- a/pkg/interface/src/views/apps/publish/components/lib/NotebookPosts.tsx
+++ b/pkg/interface/src/views/apps/publish/components/lib/NotebookPosts.tsx
@@ -10,6 +10,7 @@ interface NotebookPostsProps {
   notes: Notes;
   host: string;
   book: string;
+  baseUrl: string;
   hideNicknames?: boolean;
 }
 
@@ -30,6 +31,7 @@ export function NotebookPosts(props: NotebookPostsProps) {
             note={note}
             contact={props.contacts[note.author.substr(1)]}
             hideNicknames={props.hideNicknames}
+            baseUrl={props.baseUrl}
           />
         );
       })}
diff --git a/pkg/interface/src/views/apps/publish/components/lib/NotebookRoutes.tsx b/pkg/interface/src/views/apps/publish/components/lib/NotebookRoutes.tsx
index ff0dc905b..160a8e9bd 100644
--- a/pkg/interface/src/views/apps/publish/components/lib/NotebookRoutes.tsx
+++ b/pkg/interface/src/views/apps/publish/components/lib/NotebookRoutes.tsx
@@ -8,19 +8,18 @@ import { Groups } from "../../../../types/group-update";
 import { Contacts, Rolodex } from "../../../../types/contact-update";
 import Notebook from "./Notebook";
 import NewPost from "./new-post";
-import { NoteRoutes } from './NoteRoutes';
+import { NoteRoutes } from "./NoteRoutes";
 
 interface NotebookRoutesProps {
   api: GlobalApi;
   ship: string;
   book: string;
-  notes: any;
   notebook: INotebook;
   notebookContacts: Contacts;
   contacts: Rolodex;
   groups: Groups;
-  hideAvatars: boolean;
-  hideNicknames: boolean;
+  baseUrl?: string;
+  rootUrl?: string;
 }
 
 export function NotebookRoutes(
@@ -33,8 +32,8 @@ export function NotebookRoutes(
     api.publish.fetchNotebook(ship, book);
   }, [ship, book]);
 
-
-  const baseUrl = `/~publish/notebook/${ship}/${book}`;
+  const baseUrl = props.baseUrl || `/~publish/notebook/${ship}/${book}`;
+  const rootUrl = props.rootUrl || '/~publish';
 
   const relativePath = (path: string) => `${baseUrl}${path}`;
   return (
@@ -43,7 +42,7 @@ export function NotebookRoutes(
         path={baseUrl}
         exact
         render={(routeProps) => {
-          return <Notebook {...props} />;
+          return <Notebook {...props} rootUrl={rootUrl} baseUrl={baseUrl}  />;
         }}
       />
       <Route
@@ -55,6 +54,7 @@ export function NotebookRoutes(
             book={book}
             ship={ship}
             notebook={notebook}
+            baseUrl={baseUrl}
           />
         )}
       />
@@ -63,8 +63,11 @@ export function NotebookRoutes(
         render={(routeProps) => {
           const { noteId } = routeProps.match.params;
           const note = notebook?.notes[noteId];
+          const noteUrl = relativePath(`/note/${noteId}`);
           return (
             <NoteRoutes
+              rootUrl={baseUrl}
+              baseUrl={noteUrl}
               api={api}
               book={book}
               ship={ship}
@@ -72,8 +75,8 @@ export function NotebookRoutes(
               notebook={notebook}
               note={note}
               contacts={notebookContacts}
-              hideAvatars={props.hideAvatars}
-              hideNicknames={props.hideNicknames}
+              hideAvatars={false}
+              hideNicknames={false}
               {...routeProps}
             />
           );
diff --git a/pkg/interface/src/views/apps/publish/components/lib/new-post.tsx b/pkg/interface/src/views/apps/publish/components/lib/new-post.tsx
index c0e26905e..706f2779d 100644
--- a/pkg/interface/src/views/apps/publish/components/lib/new-post.tsx
+++ b/pkg/interface/src/views/apps/publish/components/lib/new-post.tsx
@@ -12,6 +12,7 @@ interface NewPostProps {
   book: string;
   ship: string;
   notebook: Notebook;
+  baseUrl: string;
 }
 
 export default function NewPost(props: NewPostProps & RouteComponentProps) {
@@ -42,7 +43,7 @@ export default function NewPost(props: NewPostProps & RouteComponentProps) {
       await waiter((p) => {
         return !!p?.notebook?.notes[noteId];
       });
-      history.push(`/~publish/notebook/${ship}/${book}/note/${noteId}`);
+      history.push(`${props.baseUrl}/note/${noteId}`);
     } catch (e) {
       console.error(e);
       actions.setStatus({ error: "Posting note failed" });