Forge CustomUI stay on page after browser reload

Hi,

is there an option to stay on my last page in my react custom UI project after browser reload?

I know its running inside a iFrame an I don’t get a url, like in a normal react app.

Thank you

I have done something close to what you’re attempting on a Confluence SpacePage module using React Router DOM and Forge Bridge’s view.createHistory(), like this:

import React from 'react';
import { Router, Route, Link } from 'react-router-dom';
import { view } from '@forge/bridge';
import { Tab1, Tab2 } from './components';

const MyForgeModuleApp = () => {
  const history = view.createHistory();
  return (
    <Router history={history}>
      <Link to="/">Tab 1</Link> <Link to="/tab2">Tab 2</Link>
      <Route path="/" exact>
         <Tab1 />
      </Route>
      <Route path="/tab2">
         <Tab2 />
      </Route>
    </Router>
  );
}

This would render Tab1 when the SpacePage is being accessed through the menu, and when the user navigates to Tab2 the history object would update the parent url appending the path provided on the navigate call (i.e.: http://[your-instance-subdomain].atlassian.net/[location-for-your-app-module]/tab2.
Since the parent url has changed, when the user reloads the page, the history object should read the path from the parent url and the router will render the appropriate tab.

But AFAIK not all Forge modules support view.createHistory() so be sure to read the documentation first: https://developer.atlassian.com/platform/forge/custom-ui-bridge/view/#createhistory

2 Likes

@naiara

Thank you for the great answer. I will try and get feedback. :slight_smile:

1 Like