Dashboard Overview

Layout Structure

The Yaplet dashboard follows a consistent layout across all pages, designed to keep you productive without getting lost.

Sidebar (Left)

The sidebar is your main navigation hub. It's always visible on desktop and collapsible on mobile. It contains:

• Logo and shift timer at the top — the shift timer shows your active shift if your organization uses Shifts
• Search button — opens a global search palette to quickly jump to any page
• Navigation menu — organized into labeled groups (see below)
• User menu at the bottom — access your profile, settings, and organization switching

Notification Bell

Next to the logo at the top of the sidebar, you'll find a bell icon. This is your notification center — it shows a red badge when you have unread notifications.

Hover over the bell to open the notifications popover. Each notification displays a title, optional description, a timestamp, and a color-coded icon. You may receive notifications about:

• Subscription updates — plan changes, trial expiration, billing events
• Platform updates — new features, maintenance notices, important announcements
• Organization messages — direct notifications sent by your organization's owner or admins (e.g., shift reminders, policy changes, team announcements). See Sending Notifications on the Organizations page for details.

If a notification includes a link, click it or press View to navigate directly to the relevant page. You can dismiss individual notifications with the X button, or clear everything at once with Dismiss all.

Content Area (Center)

The main content area takes up the remaining space. Most pages follow this structure:

• Navbar at the top with the page title, an optional back button, and action buttons on the right
• Content sections below, using a consistent card and section pattern

Some pages like the Inbox use a multi-panel layout with a list panel, chat panel, and a details sidebar — all responsive across screen sizes.

Navigation Menu

The sidebar menu is organized into seven groups, in this order. Everything inside them is gated by your role and permissions.

The Brand Section

Between Communications and Marketing sits Brand: a tinted, bounded panel holding everything that belongs to one public identity. Its top row carries the brand's own name and icon, and that row is a header rather than a link — clicking it opens and closes the section. The pages beneath it carry no icons and are grouped by three labelled dividers, Content, Automation and Configuration.

Collapsed to the narrow icon rail, the brand does not hide behind a hover flyout the way Inbox and Newsletter do. The brand's own tile opens its Overview, and each of its other pages gets a tile of its own, so every one of them stays a single click away.

Every Yaplet account is created with one brand already in place, so this section is never empty and is not something you set up.

Switching Between Brands

Only one brand is shown in the menu at a time. Once you have two or more, a Switch brand row appears at the bottom of the panel, next to ＋ New brand.

Picking a different brand switches the menu. If you were standing on something that belongs to a brand — one of its pages, the widget designer, a help article or a documentation page — you are also taken to the new brand's Overview. If you were on an organization-level page such as the Inbox, only the menu changes.

Which brand is current is decided in this order: the page you are on, when it belongs to a brand; otherwise the last brand you picked, which is remembered for a year; otherwise your organization's default brand.

An account with a single brand looks simpler throughout: no Switch brand row and no brands table on Home. Page headings never carry the brand's name, however many brands you have — the brand appears in the breadcrumb trail above the heading and in the browser tab title, nowhere else.

Addresses That No Longer Exist

Global Search

Press the Search button in the sidebar (or use the keyboard shortcut) to open the command palette. It uses fuzzy search across all available navigation items, letting you quickly jump to any page without clicking through menus.

User Menu

Click your avatar at the bottom-left of the sidebar to open the user dropdown. From here you can:

• Toggle dark mode — switch between light and dark themes
• View your balance and top up Yaplet credits
• Open user settings — update your profile, avatar, and preferences
• Set your status — toggle between Online and Offline so your team knows your availability
• Manage shifts — start or end a shift (if your organization uses Shifts)
• Switch organizations — if you belong to multiple teams, switch between them instantly
• Sign out

Page Navigation

Many dashboard pages use a shared navigation system to manage contextual navigation:

• Back button — when you navigate into a detail view (e.g., opening a specific ticket or campaign), a back arrow appears in the top navbar to return to the parent page
• Breadcrumbs — some pages display breadcrumb trails to show where you are in the hierarchy

This makes it easy to drill into details and get back without losing your place.

Toast Notifications

Actions across the dashboard trigger toast notifications — small popups that appear in the corner of your screen to confirm success or report errors. For example:

• Saving settings → "Settings saved successfully"
• An API error → "Something went wrong"
• Switching organizations → "Switched to [org name]"

Toasts disappear automatically after a few seconds. They use color-coded styling: "success" for confirmations, "error" for failures, and "warning" for important notices.

Keyboard Shortcuts

The dashboard supports keyboard shortcuts for common actions:

Responsive Design

The dashboard adapts to your screen size:

• Mobile — the sidebar collapses into a toggle menu, and multi-panel pages show one panel at a time
• Tablet — sidebar is accessible, and two-panel layouts are shown side by side
• Desktop — full sidebar, all panels visible (e.g., the Inbox shows list + chat + details simultaneously)

Permission-Based Access

Every feature in the dashboard is gated by permissions tied to your role within the organization. If a page or menu item requires a permission you don't have, it simply won't appear. Page-level permissions are also enforced server-side, so even direct URL access is protected.

Overview Page

Home → Overview is the account-level dashboard. It gives you a real-time snapshot of the whole organization — key metrics, team activity, AI performance and account status — in one place.

Setup Checklist

If you're new to Yaplet, a setup checklist appears at the top of the page. It is visible to the organization owner and disappears once every step is done. Home's list covers only the organization-wide steps:

• Get Started — set your profile picture, visit the Inbox, and visit the Visitors page
• Go Further — bonus steps that introduce the newsletter, Engagement, Reports, Session Replays, Shifts and Security

The four steps that belong to a brand — customise your chat widget, install it on your site, teach your AI, and publish your first help article — moved to a Set up this brand card at the bottom of each brand's own Overview. Completion is still tracked once per organization, so every brand shows the same four ticks. A progress bar shows how far you are, and once every essential step is finished a brief celebration animation plays.

Brands Table

With two or more brands, Home gains a Brands table comparing them side by side: name, public web address, chat widget, Vex bot, number of knowledge sources and number of indexed items. There is deliberately no separate brand list page anywhere else, so this table is where you see them all at once. An account with a single brand doesn't get the table.

Key Metrics

A row of five stat cards gives you an instant overview:

Each card is clickable and takes you to the relevant page (Inbox, Reports, Tickets, or Visitors).

Widget Activity

Shows which widgets had conversations in the last 7 days, each with its chat and visitor count on a progress bar. With more than one brand, every row is badged with the brand its widget belongs to. Clicking a row opens that widget's designer; there is no "all widgets" link, because the list page it pointed at no longer exists.

Team Workload

Displays your team's live availability and chat distribution. You can see which agents are online, how many active chats each one is handling, and their average response time. Each agent row links to their individual report.

Recent Conversations

Lists the latest conversations across all widgets. Each row links directly to that chat in the Inbox. New unassigned chats are highlighted with a badge.

AI Chatbot (7d)

A performance snapshot of every AI bot in the account over the past 7 days, including:

• Total AI responses
• Success and failure rates
• Number of chats handled by AI vs. total chats
• A daily trend chart showing successful vs. failed responses

Subscription & Usage

Three cards at the bottom show your account status:

• Current Plan — your active subscription plan and renewal date
• AI Credits Used — total credit consumption for the current billing period, broken down by LLM, Embedding, and Voice usage
• Limits — seats, chat widgets and newsletter subscribers used against your plan's allowances

Each Brand Has Its Own Overview

Brand → Overview is the hub for a single brand, and it is where the AI setup wizard runs. A brand-new account is taken there automatically the first time the owner signs in. It shows who the brand is and whether anyone is on the site right now, a "needs your attention" card that only appears when something is actually wrong, four figures for the week, how the AI has been doing over the last 30 days together with the questions it could not answer, every channel customers can reach the brand on, and cards for its Knowledge, Products and Automation.

Explore the Dashboard