JavaScript Timeline
Updated on Oct 30, 2026
Build horizontal scheduling and planning interfaces with time across the screen and resources in rows. Plan jobs, shifts, equipment and project work from hours to months or years with configurable views, drag and drop and your own application data.
Loading the live demo...
Add the Timeline to a plain JavaScript page or a bundled web application without adopting a frontend framework.
The Mobiscroll Timeline is the horizontal scheduling view of the Event Calendar component. Time runs from left to right, while resources such as people, teams, rooms or equipment appear as rows. Unlike the Scheduler's vertical time grid, the Timeline makes it natural to compare assignments across resources and follow work over days, weeks, months or longer periods. It is a configurable UI toolset for building planning experiences, not a predefined resource-management application.
Available for
Show a resource schedule across hours, days, weeks, months, quarters or years. Adjust the visible range and zoom level so users can switch between detailed work and a wider planning overview.
Organize people, teams, sites or equipment into expandable resource groups. Show one event against multiple resources and adapt the resource rows to the structure of your application.
Create, move and resize events on the timeline. Display progress and links between related tasks, with control over the editing interactions your users are allowed to perform.
Use Mobiscroll's MCP server, coding-agent skills and AI-readable examples to give AI coding assistants version-specific Timeline APIs and framework-aware implementation context.
Install the Mobiscroll CLI once, then run the configuration command inside your JavaScript project. It configures access to Mobiscroll's private npm registry and installs the package.
npm install -g @mobiscroll/cli
mobiscroll config javascriptAdd a <div id="timeline"></div> to your page. In an application using a bundler, import the Event Calendar initializer and its styles:
import { eventcalendar } from '@mobiscroll/javascript';
import '@mobiscroll/javascript/dist/css/mobiscroll.min.css';
const weekStart = new Date();
weekStart.setDate(weekStart.getDate() - ((weekStart.getDay() + 6) % 7));
weekStart.setHours(0, 0, 0, 0);
const day = (n) => new Date(weekStart.getFullYear(), weekStart.getMonth(), weekStart.getDate() + n);
const resources = [
{ id: 1, name: 'Installation team' },
{ id: 2, name: 'Inspection team' },
{ id: 3, name: 'Equipment' }
];
const events = [
{ id: 1, title: 'Site preparation', start: day(0), end: day(1), allDay: true, resource: 1 },
{ id: 2, title: 'Equipment installation', start: day(1), end: day(3), allDay: true, resource: [1, 3] },
{ id: 3, title: 'Quality inspection', start: day(3), end: day(4), allDay: true, resource: 2 }
];
eventcalendar('#timeline', {
view: { timeline: { type: 'week', resolutionHorizontal: 'day' } },
selectedDate: weekStart,
resources,
data: events,
dragToCreate: true,
dragToMove: true,
dragToResize: true
});A plain HTML page does not need a bundler or CLI: include a downloaded Mobiscroll JavaScript and CSS package and initialize through mobiscroll.eventcalendar() instead. See the JavaScript installation guide and Timeline documentation.
The code above is an introductory planning scenario. For a different layout or workflow, explore the full Timeline demo gallery below and start from the source of the closest working example.
Build horizontal planning interfaces that make work and resource availability understandable at a glance. The Timeline is a set of configurable views and interactions: start with the work your users need to plan, then adapt the resources, time scale, event content and editing rules to your application.
Mobiscroll Timeline combines the horizontal scheduling layout with controls for resources, event interactions and rendering. Use these building blocks together to create a resource scheduler, planning board or Gantt-style interface around your own data instead of adopting a predetermined process.
Display time from left to right in day, week, month or year views, with time resolution ranging from hours to years. Configure the visible range and switch between zoom levels, such as daily planning and a multi-month overview (Timeline views, time scales, zoom controls).
Show people, teams or assets as rows, and nest them in multi-level hierarchies such as site, building and room. Allow users to expand groups, find resources and reorder the list where the workflow requires it (resource groups, resource filtering, reordering resources).
Display an event against one resource or several resources while retaining the shared event data. Build assignment flows that let users put work onto a team, remove an assignment or assign a person from an external list (assign and unassign work, assign people to events, resource data and assignments).
Draw connections and directional arrows between events, display task progress and customize the information shown inside each task bar (linked events, progress indicators, custom task rendering). These are visual building blocks for project timelines; automatic dependency rescheduling and critical-path calculations are application-side concerns.
Create events and drag them along the timeline, between resources or across different views. Resize durations and control which changes are permitted for a particular event or resource (drag editing, interaction restrictions, external event lists).
Represent work shifts as slots and display tasks within longer-running assignments. Mark time off and unavailable intervals, show buffers before or after events and configure the restrictions that apply when users edit the schedule (shift slots, resource availability, overlap restrictions, buffer time).
Compare a selected resource with the rest of the plan, display aggregate summaries for resource groups and add custom details to resource rows and footers (compare resources, aggregated summaries, resource details). Use these views to explain allocation and workload; your application can supply the underlying capacity calculations.
Adapt event bars, row heights, headers, footers and timeline cells to your own domain. Show progress, status, buffers or resource-specific information in the schedule instead of forcing every workflow into identical event labels (event appearance, custom cells, variable event heights, timeline headers and footers).
Show work that spans multiple days and events that repeat daily, weekly, monthly or yearly. Customize how overlapping events are displayed or switch to a daily event-listing layout when a summarized view is more useful (recurring events, overlapping-event display, daily event listing).
Populate the Timeline from your API, request events as users navigate and load resources while scrolling. Virtualized rendering manages what is visible horizontally and vertically, supporting resource-heavy schedules and longer planning ranges (remote event data, on-demand events, load resources on scroll, large data sets).
Display dates and event times for international teams, including views that show working hours for people in different time zones. Localize labels and date formats, support right-to-left layouts and use the documented Gregorian, Jalali and Hijri calendar options (time-zone meeting planner, localized timeline, calendar systems).
Configure a more focused timeline on smaller screens and use the component's touch and keyboard interactions to support different devices. Mobiscroll provides keyboard and screen-reader support and documents its current WCAG 2.2 A and AA coverage; consult the Event Calendar accessibility guide and accessibility support details for the applicable limitations.
Choose an iOS, Material or Windows theme and adapt the Timeline with custom styling. Print the current view with the separately licensed print module when your license includes it (print and PDF example, printing documentation).
Mobiscroll provides AI Tooling for teams building scheduling and planning interfaces with coding assistants. Its hosted MCP server can supply API context for the Mobiscroll version in your project. Agent skills, framework-specific instructions and AI-readable documentation help assistants distinguish Timeline view configuration, event data, resource hierarchies and editing callbacks when adapting examples.
For plain JavaScript, ask an assistant to configure mobiscroll.eventcalendar() or the JavaScript ESM initializer with view.timeline, your resource data and your event API. Example request: "Build a JavaScript horizontal resource scheduler with equipment in rows and jobs over a two-week period. Use Mobiscroll's current Timeline API, allow drag and drop, and show where my existing API connects."
Claude Code and Codex can use Mobiscroll's plugin and UI skills with its MCP connection. Cursor and GitHub Copilot can use framework-specific instruction files and optionally connect to the MCP server. Follow the AI Tooling setup guide for the supported setup of each assistant.
Mobiscroll documentation and demos are also available in AI-readable formats, including source code and implementation notes. An assistant can use these to find the correct patterns, but developers should still test the resulting planning and scheduling behavior against their application's rules.
Explore working JavaScript Timeline examples for horizontal resource scheduling, project planning, shift management, resource hierarchies and drag-and-drop assignment.
Each demo includes a working implementation and code you can inspect. Start with the example closest to your resource or planning problem, then adapt its data, interactions and rendering. The gallery below contains the Timeline examples available for this framework.
Month View Show all resources in a monthly JavaScript timeline - resources as rows, days as columns, with adjustable daily resolution. 
Time Grid and Timeline Layout Switch between a vertical time grid and a horizontal resource timeline in a JavaScript scheduler - set responsive to show each layout by screen size. 
Print and PDF Export Use the JavaScript Timeline print add-on to print just the timeline view - apply print-optimized styles and export to PDF through the browser. 
Employee Shift Scheduling Plan employee shifts on a JavaScript Timeline - show workers as resource rows with morning and afternoon slots, and manage shifts with a custom add/edit dialog. 
Work Order Scheduling Schedule work orders across grouped resources - drivers, trucks, and contractors - on a JavaScript timeline. 
Timezone Meeting Planner Plan team meetings across multiple time zones using the JavaScript Timeline - show availability, time-off blocks, with events in local time. 
Restaurant Shift Scheduling Build a restaurant shift planning with JavaScript Timeline - organize staff by role, track occupancy per shift, and toggle shifts on or off. 
Meal Planner Build a weekly meal planner with the JavaScript Timeline - meal types as color-coded resource rows, custom add/edit popover for creating or updating meals. 
Dynamic Resource Availability Color-code resource rows and restrict drop zones by task type on a JavaScript Timeline - compatible resources turn green, incompatible ones gray during drag. 
Multi-Classroom Timetable Build a weekly classroom timetable with the JavaScript Timeline - rooms and days listed vertically with hourly slots from 8 AM to 8 PM, Monday to Friday. 
Monthly Timetable View Display a monthly timetable in the JavaScript Timeline - days listed vertically, hours across, with drag-to-create in a single-resource layout. 
Compare Resources Fixed at Top Use the JavaScript Timeline to pin up to 3 resources to a fixed comparison section at the top - compare schedules side by side while the rest scroll below. 
Work Order Assignment Assign work orders to employees on a JavaScript Timeline - keep unassigned orders in a fixed top row while scrolling, and drag to assign without changing time. 
Task Checklist in Events Render a task checklist inside each JavaScript Timeline event card - row heights expand as the list grows, and a popup let users add new subtasks. 
Dual Synchronized Flight Scheduling Use synchronized JavaScript Timeline views to build a flight scheduling UI - drag flights to assign them to aircraft, with fixed event times and conflict detection. 
Task Progress Tracking Show task completion progress on the JavaScript Timeline events with an inline hover slider for live updates and a progress field in the add/edit dialog. 
Shifts and Tasks Display shifts and linked tasks on a JavaScript Timeline - group tasks under parent shifts and restrict movement to each shift's time range. 
Resource Search and Filtering Add live search and filter to a JavaScript Timeline resource header - multi-select by status or group, with a custom empty state and reset. 
External Resource Drag & Drop Drag external resources onto a JavaScript Timeline to add team members, or drag them off to remove them - build crew scheduling and team management. 
Event Grouping & Bulk Actions Group JavaScript Timeline events into collapsible client/quarter blocks and bulk-drag groups - switch between assignee and work-type, on a year view. 
36-Hour Rolling Window Schedule Build a fleet scheduling view on the JavaScript Timeline - a 36-hour rolling window that auto-advances from the current hour. 
Drag People onto Events Build a team assignment interface on the JavaScript Timeline - drag people from an external list onto meetings with conflict validation. 
Truck Dispatch Planning Assign transports on the JavaScript timeline - hide trucks with capacity or time-window conflicts during drag and snap failed drops to the nearest valid slot. 
Day, Week, Month & Year Views Switch between day, week, month, and year views on the JavaScript Timeline - configure visible weekdays, working hours, and time scale per view. 
Multiple Time Scales Configure span and time scale on a JavaScript Timeline - switch day, week, month, quarter, or year views, set resolution, and show or hide empty rows. 
Calendar Zoom Levels Add zoom controls to a JavaScript resource timeline to switch from day/hour detail to monthly/yearly overviews- keeping events centered as the view changes. 
Limit Concurrent Events Set a maximum number of concurrent events on a JavaScript Timeline - cap overlapping events per row and show an overflow indicator for hidden events. 
Event Buffer Time Visualize buffer time on a JavaScript Timeline - show travel time, check-in/out, loading/unloading time, or preparation windows around scheduled events. 
Custom Range Picker View Replace the JavaScript Timeline's default header navigation with a range picker - let users set any custom date range, synced two-way with the timeline. 
Custom Event Ordering Set event order in the JavaScript Timeline - using a per-event order value or a custom ordering function. 
Equal Row Heights Keep all resources the same height on the JavaScript Timeline - overlapping events distribute evenly within each row - CSS override for minimum height. 
Variable Event Height Show JavaScript Timeline events sized to content - resource rows grow to fit the tallest event, keeping text visible in room or resource schedules. 
Daily Event Listing Display events as full-day labels across resources on the JavaScript Timeline - ideal for capacity checks and daily schedule overviews. 
Day/Week View Switcher Build resource schedules with day, work-week, and full-week views on a JavaScript Timeline - switch views from the header to control time-grid detail. 
Data & Display Timezone Set separate data and display timezones on a JavaScript Timeline - configure per-resource event timezone display using Luxon, Moment-timezone, or Day.js. 
Multiple Timezone Support Let users switch the display timezone on the fly via a custom dropdown in the JavaScript Timeline header - data and display timezones are set independently. 
Event Search Sidebar Search and filter JavaScript timeline events in real time - results appear in a sidebar agenda as you type, clicking the event navigates to date. 
External Date Navigation Use a two-panel JavaScript Timeline navigated by an external date picker - selecting a date syncs the timeline and the picker instantly. 
Role-Based Access Implement role-based access in a JavaScript Timeline: managers edit all tasks, employees edit their own, and clients have read-only access. 
Event Appearance & Time Buffers Customize event layouts on a JavaScript Timeline with icons, labels, and colors - visualize before/after buffers for travel, prep, or inspection workflows. 
Custom Cell Content Add workload badges, status icons, and a hover quick-add button to each JavaScript Timeline cell - and cap events per cell. 
Header and Footer Template Customize time-scale headers and add occupancy footers to a JavaScript Timeline - format cells from hour to year and display per-slot utilization. 
Employee Shift Slots Build a JavaScript Timeline with custom shift slot headers - replace hourly intervals with Morning and Afternoon, each with its own time range and color. 
Resource Header Customization Add custom filters, labels, or contextual UI to JavaScript Timeline resource headers - useful for room booking and resource scheduling views. 
Custom Event Tooltip Show native, Mobiscroll popup, or third-party tooltips on the JavaScript timeline events - control hover behavior with event callbacks. 
Resource Row Height Set fixed heights for resource rows, control parent row sizing, and remove bottom gutter spacing on a JavaScript Timeline using CSS overrides. 
Drag, Move & Resize Events Drag to create, move, resize, and delete events on a JavaScript Timeline - toggle each action per event and set snap resolution for all drag operations. 
Drag & Drop Restrictions per Event & Resource Restrict drag, move, and resize on a JavaScript Timeline per event, resource, or globally - lock events in time, fix length, or prevent resource switches. 
Cross-Instance Drag and Drop Drag and drop events between two JavaScript Timeline views to reassign resources or coordinate schedules - enable cross-timeline transfers. 
Prevent Event Overlap Prevent double booking on the JavaScript Timeline - block overlaps per event, per resource, or globally, and show a toast on conflict. 
Schedule from External Lists Drag items from Mobiscroll, SortableJS or Dragula lists onto the JavaScript Timeline to schedule them - drag events back off to unschedule. 
Resource Footers & Revenue Sidebar Add custom resource column footers, a revenue sidebar, and per-day occupancy to a JavaScript resource timeline - all column headers are sortable. 
Resource Grouping & Hierarchy Build a JavaScript resource timeline with collapsible nested groups, pinned resources, and per-group event creation controls. 
Resource Group Aggregate Summaries Show aggregate totals in parent resource rows on a JavaScript Timeline - summary values recalculate as bookings are added, changed, or removed. 
Resource Drag & Drop Reorder Reorder resources on the JavaScript Timeline by drag and drop - each row shows a drag handle, and an update callback runs on drop. 
Dynamic Resource Sort Sort JavaScript Timeline resources by metrics - a header popup ranks trucks by standby, payload, or deadhead time, reordering on event changes. 
Resource Properties Define resource properties on the JavaScript Timeline - set up nested groups, fixed rows, and per-resource drag, resize, and overlap controls. 
Resource Hover Tooltip Hover over a resource row in the JavaScript Timeline to open a tooltip popup with scheduled hours - keeps the timeline view clean. 
Event Data Structure Define event properties for a JavaScript Timeline - titles, dates, colors, resource and slot assignments, recurrence, buffer times, and per-event drag/resize control. 
Linked Events & Dependencies Link JavaScript Timeline events with arrows to visualize task dependencies - set finish-to-start, start-to-finish, start-to-start, and finish-to-finish connections. 
Date Formats Pass JavaScript date objects, ISO 8601 strings, or Moment.js dates to events, marked dates, colors, and labels in the JavaScript Timeline. 
Recurring Events Configure daily, weekly, monthly, and yearly recurring events on the JavaScript Timeline - set recurrence rules, exclude dates with the interactive configurator. 
Load Inline Events Add events to a JavaScript Timeline by passing an inline event array - see how the event object is structured. 
Events from Remote API Populate the JavaScript Timeline with events fetched from a remote API - pass a data array and keep events in sync. 
Load Events on Demand Load timeline events on demand - fetch only the visible time range from a remote or local source using the JavaScript Timeline. 
Virtual Scrolling Load events on scroll with a virtualized JavaScript Timeline - only the visible date range is fetched, keeping large resource timelines responsive. 
Load Resources on Demand Build hierarchical resource scheduling interfaces with on-demand data loading - the JavaScript Timeline fetches child resources. 
Load Resources on Scroll Build responsive large-resource scheduling timelines with the JavaScript Timeline - use virtual scrolling to load only visible resource rows on demand. 
Large Dataset Performance Handle thousands of events and resources in a JavaScript Timeline - virtual scrolling keeps navigation smooth across long date ranges on mobile and desktop. 
Google Calendar Sync Load Google Calendar events onto the JavaScript Timeline - authenticate users, display calendars as resources, and sync changes back to Google Calendar. 
Outlook Calendar Sync Display Outlook Calendar events on a JavaScript Timeline - each calendar as a separate resource row. 
Load Events from Google Calendar Load public Google Calendar events into a JavaScript Timeline - show holiday calendars as resource rows using a Calendar ID and API key. 
CRUD Events Add, edit, move, resize, and delete events on a JavaScript Timeline - drag or double-click to create; set color, dates and all-day options in a dialog. 
Block Past Event Creation Keep past dates read-only on a JavaScript resource timeline - block creation, moving, and resizing, and show a toast for blocked actions. 
Multi-Select & Bulk Event Actions Select multiple events on a JavaScript Timeline by keyboard shortcut or button, then apply bulk delete or update - a side panel tracks the selection. 
Cell Hover Highlight Add row and column hover highlighting to the JavaScript resource timeline - highlight the active resource row and date column on cell hover. 
Custom Time Range Backgrounds Style time range backgrounds and blocked periods on a JavaScript Timeline using CSS classes - mark recurring hours or special days. 
Theme Customization Style the JavaScript Timeline with iOS, Material, or Windows themes - switch light/dark variants, use the theme builder for colors, or apply CSS overrides. 
Resource Row Styling Highlight resource rows on a JavaScript Timeline using background colors or CSS classes - differentiate teams, show status, or style headers and grid sections. 
Gregorian, Jalali & Hijri Use the JavaScript Timeline with Gregorian, Jalali, or Hijri calendar systems - switch by locale to build scheduling interfaces for Persian. 
Event Hooks Explore JavaScript Timeline lifecycle hooks - see hooks fire on event clicks, initialization, and date changes, tracked in a live event log. 
Multi-Language Support Localize the JavaScript Timeline across 37 languages - dates, times, labels, and RTL text direction adapt by locale, with manual override support. 
RTL Layout Build RTL scheduling interfaces with the JavaScript Timeline - set direction or inherit it from locale settings to support right-to-left language users. The Timeline renders the event and resource information supplied by your application. You can use your own data and services without connecting any external calendar account.
Need to bring in your users' calendars? Mobiscroll Connect is the separate calendar connectivity layer for Google Calendar, Outlook, Apple Calendar and CalDAV. It provides account connection, authentication, normalized calendar data and synchronization. Mobiscroll Connect is sold separately and is not required to use the Timeline.
A resource timeline scheduler displays time horizontally and resources vertically, so users can see when people, teams, rooms or equipment are booked or assigned. Mobiscroll's Timeline is a configurable view of its Event Calendar component for building this kind of resource scheduling and planning interface.
The Timeline displays resources in horizontal rows with time running left to right, which is useful for resource allocation and work spanning many days or months. The Scheduler is a vertical time grid organized around hours and days, with resources shown as columns. Both belong to the Event Calendar component. Compare the layouts in the Timeline and time-grid example.
Yes. Use the Timeline view to create a horizontal schedule with resource rows, time columns, draggable events and configurable ranges. It is suitable for resource calendars, allocation boards and planning views, including schedules that extend across multiple weeks or months (range configuration).
It can be used to build a Gantt-style project timeline: display task bars, progress indicators, grouped resources and links between events (task connections, progress display). It is a UI component, not a complete project-management engine with automatic dependency rescheduling, critical-path analysis or resource-leveling algorithms.
Yes. Resources can have nested child resources, allowing a hierarchy such as region, site, building and room. You can expand or collapse groups, customize resource rendering and reorder resources through the UI (resource hierarchies, resource ordering).
Yes. A single event can reference multiple resources and appear in their respective rows while remaining one event in your data. This helps when the same job requires people and equipment at once; see resource assignments.
Yes. Configure event creation, moving and resizing through drag and drop, including moving events between resource rows and dragging work from outside the timeline (drag editing, external drag and drop). You can restrict interactions by event and resource.
The Timeline can visualize resource assignments, display aggregate summaries and apply UI restrictions for invalid time ranges or overlapping events (resource summaries, overlap restrictions). Your application supplies its authoritative capacity rules and validates concurrent changes when saving; the Timeline is not an automatic optimization or booking backend.
Yes. Pass your own events and resources to the component, load them from a remote API and request data as users navigate or scroll. Handle changes using event callbacks to connect the Timeline to your application's persistence logic (remote API events, on-demand loading).
The Timeline uses virtualized horizontal and vertical rendering, and supports loading event or resource data as it becomes relevant. This is designed for resource-heavy schedules without rendering every row and date at once (load resources on scroll, large data example). Performance still depends on the application's data and custom rendering.
Yes. The Timeline supports touch interaction and responsive configuration. You can show a shorter date range or a different layout on smaller screens while keeping more detailed resource planning on larger displays (Timeline view configuration).
Mobiscroll provides keyboard and screen-reader support and documents its alignment with WCAG 2.2 A and AA criteria, but does not claim full AA compliance. For drag-and-drop workflows, provide an accessible alternative such as an edit dialog or assignment form. See Event Calendar keyboard support and WCAG support and limitations.
No. The Timeline is part of commercially licensed Mobiscroll UI, with a free trial to evaluate it. Internal-project and multi-customer SaaS licensing are different; see Mobiscroll pricing.
No. Mobiscroll packages are distributed through Mobiscroll's private npm registry, configured through the Mobiscroll CLI. A downloaded package is also available for supported installation paths. Use the installation guide linked in Getting started for the chosen framework.
Yes. Mobiscroll provides an MCP server, agent skills and framework-specific guidance, along with AI-readable documentation and demo code. The AI Tooling guide describes setup for Claude Code, Codex, Cursor and GitHub Copilot. Generated scheduling logic and UI behavior should be tested in your application.
No. The Timeline uses your own event and resource data. Mobiscroll Connect is a separate product, sold separately, for connecting Google, Outlook, Apple Calendar and CalDAV accounts when external calendar connectivity is needed.
Yes. Mobiscroll offers Calendaring for SaaS licensing for products delivered to multiple customers as well as licenses for internal projects. Compare the Mobiscroll UI license options.
Mobiscroll provides migration guides covering component configuration, event data and implementation patterns: FullCalendar, Bryntum and DHTMLX. Check the relevant features rather than assuming every scheduling or project-management workflow maps one to one.
Yes. A plain HTML page can include a downloaded Mobiscroll JavaScript and CSS package, then initialize the Timeline with mobiscroll.eventcalendar(). No frontend framework, bundler or CLI is required for this path (plain JavaScript installation).
The Timeline is a view of the Event Calendar component in Mobiscroll UI. Internal projects use the appropriate Scheduling & calendaring or broader UI license; software delivered to multiple customers can use Calendaring for SaaS. Licensing and optional features such as the print module vary by package. Compare Mobiscroll UI licenses.
Start with the working Timeline example above, explore the demos and use their source code as a starting point, or follow the AI Tooling guide to work with a coding assistant. The Timeline API and view documentation is available when you need to configure a specific layout or interaction.
Every Mobiscroll component is available the jQuery way, initialized on a jQuery selection.
Native Angular components, not wrappers, that use Angular's own rendering and change detection.
Native React components, not wrappers, built on React's virtual DOM and state management.
Native Vue 3 components, not wrappers, that use Vue's rendering and reactivity model.
You have signed in on a different machine. To keep everything in sync, you have been signed out of this session.
If you need to invite team members, manage seats and accounts you can do it from the licenses page.
We noticed you are logged in on a different machine and have closed your old session.
If you need to invite team members, manage seats and accounts you can do it from the licenses page.