Console for Web Apps
The Console provides an easy-to-use, lightweight interface that allows end users of the OS1 Platform to access Apps and Solutions developed by multiple developers. The User Interface (UI) of the Console (also known as the Console UI) features a persistent and customizable header that allows them to navigate between each App, raise support requests, and manage user preferences.
OS1 Developers can provide this experience to their end-users by integrating their apps and solutions with the Console UI, eliminating the need for custom implementation of login, logout, user navigation functionality, and preference management. Learn more on how about integrating apps with the Console using the Console SDK.
Stay up to date with the Console library versions
It's important to ensure that all apps within a solution are using the same version of the console library. This is required to maintain a cohesive user experience across all apps within a solution. We also recommend using the latest version of the console library so that end customers can access new features.
The Console provides a single sign-in where users are routed directly into their solution from a URL that’s been created for their organization. Users do not have to sign in again when navigating between apps.

OS1 platform has the social login enabled that allows users to access OS1 applications seamlessly using your existing Google or Microsoft accounts. This feature simplifies the login process by removing the need for multiple passwords or OTPs, enhancing overall login experience for your tenants/customers.
Key features include:
- Enabled by Default: Social login options are available for all tenants without any additional setup.
- Works with Email and Mobile Logins: Your customers can continue to use login with Google or Microsoft along with email and mobile OTP-based logins.
- Same Login Experience Everywhere: You have a consistent and simple login process across all OS1 applications, including DispatchOne, which improves your workflow and efficiency.
- Customize Login Settings: As an admin, you can easily enable or disable social login options to fit your business needs.
Social login is enabled by default for all tenants, allowing you to access OS1 applications using your existing Google or Microsoft accounts.
- Navigate to the OS1 sign-in page via <https:www.tenant/orgname.getos1.com>
2. Both Sign in with Google and Sign in with Microsoft options are available by default.
3. Upon selecting a social login option, you are redirected to the respective authentication page.
4. You enter your credentials on the chosen provider's page.
5. You’ll be redirected to your OS1 dashboard after logging in if you are an authorized user.
Note: If you are not an authorized user, an error message stating “not a registered user” appears, along with options to retry or return to the login page.
You can enable or disable the default login options in the Console UI settings if you have admin access. To customize the settings, follow the below steps:
- Sign in to the OS1 platform.
2. Go to the Console navigation bar and click Settings.
3. Find Sign-In Settings under the System Apps section. Note that you’ll need business owner privileges to make changes.
4. Click Edit Settings to modify the login page settings.
5. Uncheck any sign-in options you want to disable, and make sure at least one method remains active.
6. Review your selections and click Save Changes to apply the updates.
7. After saving, look for a confirmation message. Log out and return to the sign-in screen to ensure the login options reflect your changes.
When a tenant subscribes to multiple solutions, Console provides the option for users to select a default solution to navigate to upon logging in. Users can confirm their selection by clicking Save.

The default solution can be changed and saved in the User Preferences in the profile drop-down.
Developers can customize the Console UI header by adding different types of controls including a textbox, search box, auto-complete, and more. This allows developers to tailor the header controls to suit the specific needs of their application. For detailed instructions on customizing your header, refer to the Integration with Console UI guide.

Solution developers can choose to display their logo in the header of the Console. The logo will appear next to the 'hamburger' menu in the console header. To add a logo, developers can use the Artifacts API and upload it as an icon with a size of 40X40px. Refer to the Managing App and Solution Artifacts developer guide for detailed instructions.
In-addition to the logo, the name of solution will also be displayed next to the logo. The display name provided while registering the solution will be used as the solution name.
Tenants can choose to display their logo in the console header, next to their user profile. To upload their logo, tenants should contact the OS1 support team using the Contact Us option and provide their logo. The logo should have a height and width of 24px each, as per the aspect ratio.
Customers can use the side navigation menu in the console header to navigate between apps and explore sub-menu options. However, clicking on an app will only show its sub-menu, not its landing page. If an app has a landing page of its own then the developers must add the landing page as an option within the app's menu attribute. Refer to the Registering your App guide on how to update the app menu.

The Console provides end users with an option to choose what happens when they click on an app in the side navigation menu. Upon opening an app for the first time, users will be prompted to select whether they would like to open it in a new tab or the current window. Additionally, users can update their default solution if applicable. These preference can be saved and modified in User Preferences in the profile drop-down.

We provide a text area for users to describe their issues in detail and an option to upload screenshots to help clarify their concerns. Upon submission, a ticket is automatically created to track the support request.
- A text area describing the user's issues in detail
- An option to upload a screenshot that may help clarify a user's issue.
This will then create a ticket to track the support request.

The console provides a centralized settings panel that displays settings for system apps and apps in a solution. To include apps in the centralized settings, developers can follow the instructions provided in the Register Your Solution developer guide. Once these settings are configured, users can easily access them within the console's sidebar, located at the lower right.
Centralized Settings Behavior
The settings icon will not appear in the sidebar if there aren't any apps for a user to configure.
The centralized settings feature system apps, including predefined system apps such as payments, and apps associated with subscribed solutions.
The example below shows System Apps if the Payment Gateways app was enabled.
Timezone Settings
Initially, the time zone is set to the end user’s preferences and they can personalize it as needed. The updated timezone is stored in the browser’s local storage for future sessions.

Integrating with Console
Developers can use the Console UI SDK to integrate Console UI into their applications.
The integration facilitates authentication, authorization, and seamless navigation for app users. For step-by-step instructions on integrating with the Console UI, refer to the How to: Integrate your application with the Console UI.