diff --git a/mattermost-plugin/webapp/webpack.config.js b/mattermost-plugin/webapp/webpack.config.js index eabbdaa8c..bfe44a94e 100644 --- a/mattermost-plugin/webapp/webpack.config.js +++ b/mattermost-plugin/webapp/webpack.config.js @@ -118,7 +118,7 @@ module.exports = { options: { name: '[name].[ext]', outputPath: 'static', - publicPath: '/plugins/focalboard/static/', + publicPath: '/static/', }, }, { diff --git a/webapp/src/app.tsx b/webapp/src/app.tsx index 34d49e9a1..794584fe3 100644 --- a/webapp/src/app.tsx +++ b/webapp/src/app.tsx @@ -1,6 +1,6 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import React, {useEffect} from 'react' +import React, {useEffect, useMemo} from 'react' import { Router, Redirect, @@ -40,45 +40,8 @@ import {UserSettings} from './userSettings' declare let window: IAppWindow -export const history = createBrowserHistory({basename: Utils.getFrontendBaseURL()}) - const UUID_REGEX = new RegExp(/^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}$/) -if (Utils.isDesktop() && Utils.isFocalboardPlugin()) { - window.addEventListener('message', (event: MessageEvent) => { - if (event.origin !== window.location.origin) { - return - } - - const pathName = event.data.message?.pathName - if (!pathName || !pathName.startsWith(window.frontendBaseURL)) { - return - } - - Utils.log(`Navigating Boards to ${pathName}`) - history.replace(pathName.replace(window.frontendBaseURL, '')) - }) -} - -const browserHistory: typeof history = { - ...history, - push: (path: string, state?: unknown) => { - if (Utils.isDesktop() && Utils.isFocalboardPlugin()) { - window.postMessage( - { - type: 'browser-history-push', - message: { - path: `${window.frontendBaseURL}${path}`, - }, - }, - window.location.origin, - ) - } else { - history.push(path, state) - } - }, -} - const App = React.memo((): JSX.Element => { const language = useAppSelector(getLanguage) const loggedIn = useAppSelector(getLoggedIn) @@ -86,6 +49,44 @@ const App = React.memo((): JSX.Element => { const me = useAppSelector(getMe) const dispatch = useAppDispatch() + const browserHistory: ReturnType = useMemo(() => { + const history = createBrowserHistory({basename: Utils.getFrontendBaseURL()}) + + if (Utils.isDesktop() && Utils.isFocalboardPlugin()) { + window.addEventListener('message', (event: MessageEvent) => { + if (event.origin !== window.location.origin) { + return + } + + const pathName = event.data.message?.pathName + if (!pathName || !pathName.startsWith(window.frontendBaseURL)) { + return + } + + Utils.log(`Navigating Boards to ${pathName}`) + history.replace(pathName.replace(window.frontendBaseURL, '')) + }) + } + return { + ...history, + push: (path: string, state?: unknown) => { + if (Utils.isDesktop() && Utils.isFocalboardPlugin()) { + window.postMessage( + { + type: 'browser-history-push', + message: { + path: `${window.frontendBaseURL}${path}`, + }, + }, + window.location.origin, + ) + } else { + history.push(path, state) + } + }, + } + }, []) + useEffect(() => { dispatch(fetchLanguage()) dispatch(fetchMe()) @@ -95,7 +96,7 @@ const App = React.memo((): JSX.Element => { if (Utils.isFocalboardPlugin()) { useEffect(() => { if (window.frontendBaseURL) { - history.replace(window.location.pathname.replace(window.frontendBaseURL, '')) + browserHistory.replace(window.location.pathname.replace(window.frontendBaseURL, '')) } }, []) } @@ -137,9 +138,7 @@ const App = React.memo((): JSX.Element => { > - +
diff --git a/webapp/src/components/__snapshots__/shareBoardComponent.test.tsx.snap b/webapp/src/components/__snapshots__/shareBoardComponent.test.tsx.snap index 3e206da69..6a47bd23f 100644 --- a/webapp/src/components/__snapshots__/shareBoardComponent.test.tsx.snap +++ b/webapp/src/components/__snapshots__/shareBoardComponent.test.tsx.snap @@ -41,11 +41,11 @@ exports[`src/components/shareBoardComponent return shareBoardComponent and click > - http://localhost/plugins/focalboard/workspace/1/shared/1/1?r=oneToken + http://localhost/workspace/1/shared/1/1?r=oneToken +
+
+ +
+
+ + +`; + +exports[`src/components/shareBoardComponent should match snapshot with sharing and subpath 1`] = ` +
+
+
+ +
+
+
+
+ Anyone with the link can view this board and all cards in it. +
+
+
+
+
+
+ + http://localhost/test-subpath/plugins/boards/workspace/1/shared/1/1?r=oneToken
`; + +exports[`src/components/shareBoardComponent should match snapshot with sharing and without workspaceId and subpath 1`] = ` +
+
+
+ +
+
+
+
+ Anyone with the link can view this board and all cards in it. +
+
+
+
+
+
+ + http://localhost/test-subpath/plugins/boards/shared/1/1?r=oneToken + + +
+
+ +
+
+
+
+`; diff --git a/webapp/src/components/shareBoardComponent.test.tsx b/webapp/src/components/shareBoardComponent.test.tsx index 8233ecdb4..57b341a87 100644 --- a/webapp/src/components/shareBoardComponent.test.tsx +++ b/webapp/src/components/shareBoardComponent.test.tsx @@ -23,8 +23,10 @@ const viewId = boardId jest.mock('../octoClient') jest.mock('../utils') + const mockedOctoClient = mocked(client, true) const mockedUtils = mocked(Utils, true) + let params = {} jest.mock('react-router', () => { const originalModule = jest.requireActual('react-router') @@ -45,14 +47,24 @@ const board = TestBlockFactory.createBoard() board.id = boardId describe('src/components/shareBoardComponent', () => { + const w = (window as any) + const oldBaseURL = w.baseURL + beforeEach(() => { jest.clearAllMocks() + mockedUtils.buildURL.mockImplementation((path) => (w.baseURL || '') + path) + params = { boardId, viewId, workspaceId, } }) + + afterEach(() => { + w.baseURL = oldBaseURL + }) + test('should match snapshot', async () => { mockedOctoClient.getSharing.mockResolvedValue(undefined) let container @@ -215,4 +227,48 @@ describe('src/components/shareBoardComponent', () => { expect(mockedUtils.createGuid).toBeCalledTimes(1) expect(container).toMatchSnapshot() }) + + test('should match snapshot with sharing and without workspaceId and subpath', async () => { + w.baseURL = '/test-subpath/plugins/boards' + const sharing:ISharing = { + id: boardId, + enabled: true, + token: 'oneToken', + } + params = { + boardId, + viewId, + } + mockedOctoClient.getSharing.mockResolvedValue(sharing) + let container + await act(async () => { + const result = render(wrapDNDIntl( + ), {wrapper: MemoryRouter}) + container = result.container + }) + expect(container).toMatchSnapshot() + }) + + test('should match snapshot with sharing and subpath', async () => { + w.baseURL = '/test-subpath/plugins/boards' + const sharing:ISharing = { + id: boardId, + enabled: true, + token: 'oneToken', + } + mockedOctoClient.getSharing.mockResolvedValue(sharing) + let container + await act(async () => { + const result = render(wrapDNDIntl( + ), {wrapper: MemoryRouter}) + container = result.container + }) + expect(container).toMatchSnapshot() + }) }) diff --git a/webapp/src/components/shareBoardComponent.tsx b/webapp/src/components/shareBoardComponent.tsx index 014c77f12..474eef985 100644 --- a/webapp/src/components/shareBoardComponent.tsx +++ b/webapp/src/components/shareBoardComponent.tsx @@ -79,18 +79,18 @@ const ShareBoardComponent = React.memo((props: Props): JSX.Element => { shareUrl.searchParams.set('r', readToken) if (match.params.workspaceId) { - const newPath = generatePath('/plugins/focalboard/workspace/:workspaceId/shared/:boardId/:viewId', { + const newPath = generatePath('/workspace/:workspaceId/shared/:boardId/:viewId', { boardId: match.params.boardId, viewId: match.params.viewId, workspaceId: match.params.workspaceId, }) - shareUrl.pathname = newPath + shareUrl.pathname = Utils.buildURL(newPath) } else { const newPath = generatePath('/shared/:boardId/:viewId', { boardId: match.params.boardId, viewId: match.params.viewId, }) - shareUrl.pathname = newPath + shareUrl.pathname = Utils.buildURL(newPath) } return ( diff --git a/webapp/src/pages/welcome/__snapshots__/welcomePage.test.tsx.snap b/webapp/src/pages/welcome/__snapshots__/welcomePage.test.tsx.snap index cf01a17e9..427267ccd 100644 --- a/webapp/src/pages/welcome/__snapshots__/welcomePage.test.tsx.snap +++ b/webapp/src/pages/welcome/__snapshots__/welcomePage.test.tsx.snap @@ -19,12 +19,54 @@ exports[`pages/welcome Welcome Page shows Explore Page 1`] = ` Boards Welcome Image Boards Welcome Image + +
+
+
+`; + +exports[`pages/welcome Welcome Page shows Explore Page with subpath 1`] = ` +
+
+
+

+ Welcome To Boards +

+
+ Boards is a project management tool that helps define, organize, track and manage work across teams, using a familiar kanban board view +
+ Boards Welcome Image + Boards Welcome Image