ToolJet/docs/versioned_docs/version-2.0.0-beta/app-builder/left-sidebar.md
2023-01-06 13:04:30 +05:30

68 lines
No EOL
1.9 KiB
Markdown

---
id: left-sidebar
title: Left-sidebar
---
Left-sidebar has the following options:
- **Pages**
- **Inspector**
- **Datasources Manager**
- **Debugger**
- **Dark/Light mode switch**
<div style={{textAlign: 'center'}}>
<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/leftsidebar.png" alt="App Builder: Left-sidebar"/>
</div>
## Pages
Pages allows you to have multiple pages in a single application, making your ToolJet applications more robust and user-friendly.
Check the detailed documentation for **[Pages](/docs/tutorial/pages)**.
<div style={{textAlign: 'center'}}>
<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/pages.png" alt="App Builder: Left-sidebar"/>
</div>
## Inspector
The Inspector can be used to inspect the data of the **queries**, properties and values of the **components** that are there on the canvas, ToolJet's global variables and the variables that have been set by the user.
Check the detailed guide on **[using Inspector](/docs/how-to/use-inspector)**.
<div style={{textAlign: 'center'}}>
<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/inspector.png" alt="App Builder: Left-sidebar"/>
</div>
## Datasources Manager
Datasources Manager is used to connect or remove the datasources.
Check the detailed **[Datasources documentation](/docs/data-sources/overview)**.
<div style={{textAlign: 'center'}}>
<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/datasources.png" alt="App Builder: Left-sidebar"/>
</div>
## Debugger
Debugger logs all the errors that are thrown either by the datasource, components, or by wrong query parameters.
<div style={{textAlign: 'center'}}>
<img className="screenshot-full" src="/img/v2-beta/app-builder/leftsidebar/debugger.png" alt="App Builder: Left-sidebar"/>
</div>
## Theme switch
Switch ToolJet into light or dark mode from this button.