add readtoken when in readonly mode (#1382)

webapp/src/app.tsx

@@ -158,7 +158,7 @@ const App = React.memo((): JSX.Element => {
                                 <Route path='/change_password'>
                                     <ChangePasswordPage/>
                                 </Route>
-                                <Route path='/shared/:boardId?/:viewId?'>
+                                <Route path='/shared/:boardId?/:viewId?/:cardId?'>
                                     <BoardPage readonly={true}/>
                                 </Route>
                                 <Route
@@ -180,7 +180,7 @@ const App = React.memo((): JSX.Element => {
                                         return null
                                     }}
                                 />
-                                <Route path='/workspace/:workspaceId/shared/:boardId?/:viewId?'>
+                                <Route path='/workspace/:workspaceId/shared/:boardId?/:viewId?/:cardId?'>
                                     <BoardPage readonly={true}/>
                                 </Route>
                                 <Route

webapp/src/components/viewMenu.tsx

@@ -30,7 +30,10 @@ const ViewMenu = React.memo((props: Props) => {
     const match = useRouteMatch()
 
     const showView = useCallback((viewId) => {
-        const newPath = generatePath(match.path, {...match.params, viewId: viewId || ''})
+        let newPath = generatePath(match.path, {...match.params, viewId: viewId || ''})
+        if (props.readonly) {
+            newPath += `?r=${Utils.getReadToken()}`
+        }
         history.push(newPath)
     }, [match, history])
 

webapp/src/components/workspace.tsx

@@ -13,6 +13,7 @@ import {getClientConfig, setClientConfig} from '../store/clientConfig'
 
 import wsClient, {WSClient} from '../wsclient'
 import {ClientConfig} from '../config/clientConfig'
+import {Utils} from '../utils'
 
 import CenterPanel from './centerPanel'
 import EmptyCenterPanel from './emptyCenterPanel'
@@ -37,7 +38,10 @@ function CenterContent(props: Props) {
 
     const showCard = useCallback((cardId?: string) => {
         const params = {...match.params, cardId}
-        const newPath = generatePath(match.path, params)
+        let newPath = generatePath(match.path, params)
+        if (props.readonly) {
+            newPath += `?r=${Utils.getReadToken()}`
+        }
         history.push(newPath)
     }, [match, history])
 

webapp/src/octoClient.ts

@@ -41,12 +41,6 @@ class OctoClient {
         localStorage.setItem('focalboardSessionId', value)
     }
 
-    private readToken(): string {
-        const queryString = new URLSearchParams(window.location.search)
-        const readToken = queryString.get('r') || ''
-        return readToken
-    }
-
     constructor(serverUrl?: string, public workspaceId = '0') {
         this.serverUrl = serverUrl
     }
@@ -168,7 +162,7 @@ class OctoClient {
 
     async getSubtree(rootId?: string, levels = 2, workspaceID?: string): Promise<Block[]> {
         let path = this.workspacePath(workspaceID) + `/blocks/${encodeURIComponent(rootId || '')}/subtree?l=${levels}`
-        const readToken = this.readToken()
+        const readToken = Utils.getReadToken()
         if (readToken) {
             path += `&read_token=${readToken}`
         }
@@ -406,7 +400,7 @@ class OctoClient {
 
     async getFileAsDataUrl(rootId: string, fileId: string): Promise<string> {
         let path = '/files/workspaces/' + this.workspaceId + '/' + rootId + '/' + fileId
-        const readToken = this.readToken()
+        const readToken = Utils.getReadToken()
         if (readToken) {
             path += `?read_token=${readToken}`
         }

webapp/src/utils.ts

@@ -504,6 +504,12 @@ class Utils {
     static isDesktop(): boolean {
         return Utils.isDesktopApp() && Utils.isVersionGreaterThanOrEqualTo(Utils.getDesktopVersion(), '5.0.0')
     }
+
+    static getReadToken(): string {
+        const queryString = new URLSearchParams(window.location.search)
+        const readToken = queryString.get('r') || ''
+        return readToken
+    }
 }
 
 export {Utils}