Jira Cloud side-bar component

The left sidebar in Jira Cloud is brilliant! Can be temporary if you just hover over it, or fixed if you click the top-right button. The temporary pane overlays the current page and the fixed one moves the page to the right of the left pane.

I suggest Atlassian includes this as a AtlastKit component, or just publishes the source code for it.

Or do you know of a similar component that can be used in a Forge Custom UI in a jira:globalAge or projectPage?

I want to use it for a configuration form for the Jira Cloud App we are developing.

@dag.rende
I’m glad that you like the sidebar’s design :grin:

I’d like to understand your usecase a bit better. You want to use this sidebar in your forge app. And the forge app has multiple global pages or project pages. Is that right?

Our app is a single page app in a jira:globalPage. One page in the app has a diagram to the left and a config form to the right.
We’d like the config form to behave like the page side bar in the Jira project kanban board, for instance.
In our app the diagram is the main thing, but the user should be able to easily access the config form. In some cases the user only wants to change a single config, and then hovering over the form would be sufficient, to let the form slide out after making the change. In other cases the user wants to change many setting in the form, and then the form should stay open until the user is satisfied, clicking the round button with a > symbol to let the form slide out.

This is just like the current sidebar works, except that we want it on the right side.
We may implement the slider ourselves, but having you making the component would guarantee that it works like the user is used to.

Hi @dag.rende

Its available here Atlaskit by Atlassian
Although in your case you may have to modify it a bit to make it slide from left, borders and the chevrons etc.
Good luck!

Unfortunately the atlaskit side navigation component does not handle any interactive slide in/out behavior. That is what I needed most. Or have I missed something?
It may be possible use the side navigation component and add the sliding behavior ourselves, but that’s not a piece of cake.

I tried to look at the source code of the side-navigation component, but got the message “We can’t let you see this page To access this page, you may need to log in with another account”. What is needed in order to see the source code?

Yes thats right you may have to modify it yourself. :frowning: