Customizing Your Dashboard Layout

Your dashboard is a personal workspace designed to surface the metrics and insights most relevant to your role and workflow. This guide walks you through every aspect of dashboard customization, from adding your first widget to creating multi-view dashboard configurations for different purposes.

Customization is not just about aesthetics—it's about building a dashboard that makes you faster, smarter, and more effective at procurement intelligence. A well-designed dashboard answers your questions at a glance without navigation, filters, or digging.

Why Customize Your Dashboard?

The default dashboard layout is designed for general procurement professionals, showing a balanced mix of performance metrics, market intelligence, and opportunity discovery. However, your specific needs vary based on:

Your role:

• Executives: High-level KPIs, trends, strategic insights
• Analysts: Detailed data, competitive intelligence, market research
• Proposal Managers: Pipeline, deadlines, team activity, workload
• Business Development: Opportunity discovery, agency targeting, relationship tracking

Your market focus:

• Specialized firms: Widgets filtered to specific categories (e.g., IT Services only)
• Diversified firms: Broad market coverage with category breakdowns
• Geographic focus: Widgets filtered to specific regions or agencies

Your workflow:

• Daily ops: Real-time metrics (Bid Statistics, Pipeline, Team Activity)
• Strategic planning: Historical analysis (Trends, Win Rate, Competitor Analysis)
• Reporting: Export-friendly widgets (tables, charts with clear data)

A customized dashboard transforms raw data into actionable intelligence aligned with your specific context.

---

Dashboard Editing Basics

Entering Edit Mode

To customize your dashboard, you must first enter Edit Mode:

Method 1: Button Click the Edit Dashboard button in the top-right corner of the dashboard toolbar.

Method 2: Keyboard Press to toggle Edit Mode.

Visual indicators when in Edit Mode:

• Widget headers show drag handles (six dots)
• Widget borders become dashed
• X button appears on each widget (remove)
• Resize handles appear on widget corners
• Toolbar shows Save and Cancel buttons

Exiting Edit Mode

Save changes:

• Click Save Dashboard button (green checkmark)
• Keyboard:

Discard changes:

• Click Cancel button (red X)
• Keyboard:
• Navigate away without saving (you'll be prompted to confirm)

Auto-save (optional setting): Enable auto-save to save changes every 30 seconds while in Edit Mode: Dashboard toolbar → Settings (gear icon) → Enable Auto-Save

---

Adding Widgets

Opening the Widget Catalog

Click + Add Widget button in the dashboard toolbar (or press ).

The Widget Catalog modal opens, showing all available widgets organized by category:

• Market Overview (6 widgets)
• Bid Performance (6 widgets)
• Competitive Intelligence (6 widgets)
• Opportunity Discovery (6 widgets)
• Insights & AI (6 widgets)
• Quick Actions (6 widgets)

Search widgets: Use the search box at the top to filter by name or description. For example, search "competitor" to find all competitive intelligence widgets.

Filter by category: Click category tabs to show only widgets in that category.

Preview widget: Hover over any widget card to see:

• Widget description
• Configuration options available
• Data refresh rate
• Example screenshot

Adding a Widget to Your Dashboard

Quick add (keyboard power users): Press to open the command palette, type widget name (e.g., "win rate"), and press Enter to add instantly without opening full catalog.

Widget Placement Strategies

Top-left quadrant: Most visible area (first thing you see). Place your single most important metric here.

• Executives: Overall Win Rate or Pipeline Value
• Analysts: Market Snapshot or Competitor Analysis
• Proposal Managers: Bid Statistics or Submission Timeline

Left column: Secondary priority metrics. You scan left-to-right, so left column gets attention after top-left.

Right column: Contextual or supporting information. Good for Quick Actions widgets (Recent Documents, Notifications).

Below the fold (requires scrolling): Detailed analytics or infrequently checked widgets. Enable lazy loading for these to improve initial load time.

Example executive layout:

[Win Rate]  [Pipeline Value]  [Market Snapshot]
[Trends]    [Bid Statistics]  [Upcoming Deadlines]
[Competitor Analysis]         [Smart Recommendations]

Top row = critical KPIs, middle row = supporting metrics, bottom row = strategic intel and opportunities.

---

Moving and Resizing Widgets

Moving Widgets

Drag and drop (mouse):

Keyboard navigation (accessibility):

Snap-to-grid behavior:

Widgets snap to grid cells (12-column grid system). You cannot position widgets between grid lines—they always align to the grid for consistent layouts.

Collision handling:

When you drag a widget over another widget:

• Option 1 (Swap): If widgets are the same size, they swap positions
• Option 2 (Push): If different sizes, other widgets are pushed aside to make room
• Option 3 (Reflow): If no room, entire layout reflows to fit all widgets

Visual indicators show how the layout will change before you release (ghost outlines).

Resizing Widgets

Drag resize handles (mouse):

Minimum and maximum sizes:

Each widget has minimum and maximum sizes:

• Minimum: Ensures content remains readable (typically 2×2 grid cells)
• Maximum: Prevents widgets from dominating the dashboard (typically 6×4 grid cells)

You cannot resize beyond these limits—resize handle stops at min/max boundaries.

Aspect ratio:

Some widgets maintain aspect ratio (e.g., pie charts remain circular). Dragging a corner handle proportionally scales both width and height.

Other widgets (e.g., tables) resize independently in width and height.

Responsive behavior:

Widget size is relative to grid, not absolute pixels. When you resize your browser window, widgets scale proportionally to maintain layout.

On mobile devices (<768px), all widgets automatically become full-width regardless of desktop size settings.

---

Removing Widgets

Deleting a Widget

Mouse method:

Keyboard method:

Confirmation:

By default, widgets are removed immediately without confirmation (undo is available—see below).

Enable confirmation prompts if you prefer: Dashboard Settings → Editing → Confirm Before Removing Widgets

Undo removal:

If you accidentally remove a widget:

• Press to undo (works for last 10 actions)
• Or click + Add Widget to re-add from catalog

Removed widgets do not lose their configuration. If you remove "Win Rate Analysis" with specific filters, then re-add it, the filters are restored from your profile.

Remove All Widgets

To clear your entire dashboard:

Dashboard toolbar → Settings (gear icon) → Advanced → Remove All Widgets

Warning: This removes all widgets but preserves your saved dashboard views (accessible from view dropdown). You can restore default layout or build from scratch.

---

Widget Configuration

Each widget has configuration options accessible via the settings icon (gear) in the widget header.

Opening Widget Settings

Click the gear icon in the top-right corner of any widget (appears on hover in view mode, always visible in edit mode).

Settings panel opens as a modal or side panel (depending on widget complexity).

Common Configuration Options

While each widget has unique options (see Widget Catalog), most share these common settings:

Time Range

Controls the time period for data aggregation:

Filters

Apply filters to focus on specific data:

• Categories: Show only specific procurement categories (e.g., IT Services, Construction)
• Agencies: Filter to specific government agencies
• Value range: Minimum/maximum opportunity value
• Team members: Filter to specific proposal managers or analysts
• Status: Active, completed, or all

Filters persist across sessions (saved to your profile) until you clear them.

Refresh Rate

Control how often the widget updates:

• Real-time: WebSocket updates (30 seconds for most widgets)
• Automatic: Polling intervals (5 minutes, 15 minutes, 1 hour)
• Manual: Only refresh when you click the refresh icon

Faster refresh = more API calls = slightly slower overall dashboard. For strategic widgets you check infrequently, set to Manual refresh to improve performance.

Display Options

Customize how data is presented:

• Chart type: Pie vs. bar vs. table (for widgets supporting multiple visualizations)
• Metric: Count vs. value vs. both
• Sort order: Ascending, descending, alphabetical
• Top N: Show top 5, 10, 20, or all items
• Color scheme: Default, high contrast, color blind friendly

Export Settings

Configure default export format:

• Format: CSV, Excel, PDF, PNG
• Include: Data only, visualization only, or both
• Filters: Apply current filters or export all data

Alerts (available on select widgets)

Set up alerts for threshold breaches:

• Win Rate Analysis: Alert if win rate drops below 25%
• Pipeline Overview: Alert if pipeline value falls below $5M
• Risk Alerts: Email notifications for new critical risks

Alerts appear as toast notifications in-app and optionally via email.

Widget-Specific Configuration

Market Trends widget:

• Granularity: Daily, weekly, or monthly data points
• Comparison: Overlay previous year or previous period data
• Smoothing: Apply moving average trendline (7-day, 30-day)

Competitor Analysis widget:

• Ranking metric: Wins, bids, market share, or total value won
• Competitor set: Top 5, top 10, or custom selection
• Include teaming: Show when competitors team together vs. compete

Pricing Analysis widget:

• Outlier filter: Exclude bids >100% over or under winning price (reduces noise)
• Include wins: Show all bids or only losses (focus on improvement opportunities)
• Confidence interval: Show price range or single estimate

Refer to the Widget Catalog for complete configuration options for each widget.

Saving Widget Configuration

Widget settings save automatically when you close the settings panel. Changes apply immediately (widget refreshes with new configuration).

Reset to defaults:

Widget Settings → Advanced → Reset to Default Configuration

This clears all customizations (time range, filters, display options) and restores factory defaults.

---

Creating Saved Dashboard Views

Dashboard Views let you create multiple dashboard configurations for different purposes, then switch between them instantly.

Use Cases for Multiple Views

By role or task:

• Executive View: High-level KPIs for leadership reviews (6-8 widgets)
• Deep Dive View: Detailed analytics for research and analysis (15+ widgets)
• Reporting View: Export-friendly widgets for monthly reports

By time or context:

• Daily Standup View: Real-time metrics for morning pipeline review
• Weekly Strategy View: Trends and competitive intelligence for planning meetings
• Quarterly Review View: Historical performance and forecasting widgets

By specialization:

• IT Services View: All widgets filtered to IT Services category
• DOD View: All widgets filtered to Department of Defense agency
• West Coast View: Geographic filter for West Coast opportunities

Creating a New Dashboard View

View limits:

You can create up to 10 saved views per user. This prevents proliferation of redundant views and encourages thoughtful organization.

If you hit the limit, delete unused views: View dropdown → Manage Views → Delete.

Switching Between Views

Dropdown menu:

Dashboard toolbar → View dropdown → Select view name

Dashboard immediately reloads with the selected view's layout and widget configuration. Switching is instant (widgets load from cache if recently viewed).

Keyboard shortcut:

→ Switch to View 1 → Switch to View 2 ... → Switch to View 9

Views are numbered in the order they appear in the dropdown. Assign your most-used views to positions 1-3 for fastest access.

Default view:

Set which view loads when you open the dashboard:

View dropdown → Manage Views → Set [View Name] as Default

Your default view loads automatically when you log in or navigate to the dashboard from elsewhere in Cothon.

Editing Saved Views

Update existing view:

Rename view:

View dropdown → Manage Views → Rename [View Name]

Duplicate view:

To create a variation of an existing view:

View dropdown → Manage Views → Duplicate [View Name]

This creates a copy (e.g., "Executive View (Copy)") that you can modify independently.

Delete view:

View dropdown → Manage Views → Delete [View Name]

Confirm deletion. This action is permanent (cannot undo). The view is removed from the dropdown and its configuration is deleted.

You cannot delete the default "Base View" (factory default layout). You can reset it to factory settings but not delete it entirely.

---

Dashboard Grid System

Understanding the grid system helps you create well-organized, visually balanced layouts.

12-Column Grid

The dashboard uses a 12-column grid system (similar to Bootstrap):

• 12 columns across the width of the dashboard container
• Infinite rows (vertical scrolling)
• Gutter: 16px spacing between grid cells

Widget sizing is specified in grid columns:

• Small widget: 2-3 columns (e.g., single KPI, small chart)
• Medium widget: 4-6 columns (e.g., detailed chart, short table)
• Large widget: 8-12 columns (e.g., full-width table, complex multi-series chart)

Example layout:

12 columns total width
├─ [Widget A: 4 cols] [Widget B: 4 cols] [Widget C: 4 cols]  ← Row 1 (4+4+4=12)
├─ [Widget D: 6 cols] [Widget E: 6 cols]                      ← Row 2 (6+6=12)
├─ [Widget F: 12 cols]                                        ← Row 3 (full width)
└─ [Widget G: 3 cols] [Widget H: 3 cols] [Widget I: 6 cols]  ← Row 4 (3+3+6=12)

Responsive breakpoints:

Auto-layout algorithm:

When you add or move widgets, the grid uses an auto-layout algorithm to maintain clean layouts:

1. Fill left-to-right: Widgets placed in leftmost available position
2. Top-to-bottom: New rows created when no space in current row
3. Minimize height: Algorithm tries to minimize total dashboard height (fewer scrolls)
4. Avoid orphans: Single small widgets on a row are discouraged; algorithm tries to pair them

You can override auto-layout by manually dragging widgets to specific positions.

Grid Alignment and Spacing

Alignment:

Widgets align to the grid automatically. You cannot position a widget "between" grid columns—it snaps to the nearest column boundary.

Vertical spacing:

Rows have 16px vertical spacing (same as column gutters). This creates visual separation without excessive whitespace.

Compact mode:

Reduce spacing for more information density:

Dashboard Settings → Appearance → Enable Compact Mode

Compact mode reduces gutters from 16px to 8px and row spacing from 16px to 12px. This fits approximately 20% more widgets on screen but feels more cramped.

Recommended for:

• Large external monitors (27"+)
• Users who prioritize information density over visual breathing room
• Dashboards with many small widgets

Not recommended for:

• Laptop screens (<15")
• Users who find dense layouts overwhelming
• Dashboards with many large chart widgets (they need space to be readable)

---

Advanced Layout Techniques

Grouping Related Widgets

Create visual groups of related widgets for easier scanning:

Technique 1: Proximity

Place related widgets adjacent to each other (side-by-side or stacked vertically). For example:

[Win Rate]    [Bid Statistics]    ← Bid Performance Group
[Pipeline]    [Submission Timeline]

[Competitor]  [HHI Index]         ← Competitive Intel Group
[Incumbent]   [Win/Loss]

Users intuitively recognize spatial groupings without explicit labels.

Technique 2: Section Headers (available with Dashboard Headers setting)

Enable section headers to create explicit groups:

Dashboard Settings → Appearance → Enable Section Headers

Then insert section header widgets:

[Section Header: "Bid Performance"]
[Win Rate]    [Bid Statistics]    [Pipeline]

[Section Header: "Competitive Intelligence"]
[Competitor]  [HHI Index]         [Incumbent]

Section headers are non-data widgets that display a title and optional description. They help organize dashboards with 12+ widgets.

Technique 3: Color Coding

Apply custom background colors to widgets in the same group:

Widget Settings → Appearance → Background Color → Choose color

For example:

• Bid Performance widgets: Light blue background
• Competitive Intel widgets: Light orange background
• Opportunity widgets: Light green background

Subtle color differentiation (pastel shades) creates visual grouping without being distracting.

Hierarchical Layouts

Organize widgets by importance (primary, secondary, tertiary):

Primary (Top-left, large):

1-3 widgets representing the most critical metrics. These should be:

• Large (6+ columns)
• At the top of the dashboard (above the fold)
• Updated in real-time or frequently (5-minute refresh)

Example: Pipeline Value (primary KPI for executives)

Secondary (Left column, medium):

4-6 widgets providing supporting context for primary metrics. These should be:

• Medium size (4-6 columns)
• Located in the left or center columns (high visibility)
• Refreshed regularly (15-minute refresh)

Example: Win Rate, Bid Statistics, Market Snapshot

Tertiary (Right column or below fold, small-medium):

Remaining widgets providing detailed analysis or infrequent-check information:

• Small-medium size (2-4 columns)
• Located right column or below the scroll line
• Refreshed on-demand or hourly (less time-sensitive)

Example: Recent Documents, Notifications, Trend Predictions

Visual example:

[Primary: Pipeline Value - 12 cols, full width, top]

[Secondary: Win Rate - 4 cols]  [Secondary: Bid Stats - 4 cols]  [Tertiary: Notifications - 4 cols]
[Secondary: Market Snapshot - 4 cols]  [Secondary: Trends - 8 cols]

[Tertiary: Competitor Analysis - 6 cols]  [Tertiary: Recent Docs - 6 cols]

This creates a clear visual hierarchy: Eye drawn to top (Pipeline Value), then scans left-to-right through secondary metrics, then explores tertiary information if needed.

Responsive Design Considerations

Design your dashboard to work across device sizes:

Desktop-first approach:

Design for your primary device (likely desktop), then verify it adapts well to smaller screens.

Test responsive behavior:

Use browser developer tools to preview how your dashboard looks at different screen sizes:

1. Open DevTools (F12 or Cmd+Option+I)
2. Click device toolbar icon (phone/tablet icon)
3. Select different devices (iPhone, iPad, etc.) to see how layout responds

Mobile optimization tips:

• Limit widget count: 6-8 widgets maximum on mobile (vertical stack gets long)
• Simplify charts: Use "Mobile-friendly" chart option in widget settings (simpler visuals)
• Larger text: Enable "Mobile text scaling" to increase font sizes on small screens
• Touch-friendly controls: Ensure buttons and controls are large enough to tap (iOS requires 44×44px minimum)

Create a dedicated "Mobile View" saved view optimized for phone screens rather than trying to make desktop layout work everywhere.

Progressive disclosure:

On mobile, use collapsible widgets to save screen space:

Widget Settings → Mobile → Enable Collapse on Mobile

Widget shows only the title and primary metric on mobile. Tap to expand full widget. This lets you fit more widgets on screen while keeping detail accessible.

---

Sharing Dashboard Layouts

Share your dashboard layout with team members to standardize views across your organization.

Exporting a Dashboard Layout

Exported layout includes:

• Widget selection (which widgets are present)
• Widget positions and sizes
• Widget configuration (time ranges, filters, display options)
• View metadata (name, description, created date)

Exported layout does NOT include:

• Actual data (layout only, no cached data)
• User-specific settings (notification preferences, etc.)
• Organization-specific customizations (custom fields, etc.)

Importing a Dashboard Layout

Imported view appears in your View dropdown. You can rename, modify, or delete it like any saved view.

Compatibility:

Imported layouts are compatible across Cothon versions as long as the widgets exist in both versions. If the export includes a widget not available in your version (e.g., new widget from future release), that widget is skipped with a warning.

Team Templates

Organization admins can create dashboard templates available to all team members:

Admin workflow:

1. Admin creates optimal dashboard layout for specific role (e.g., "Proposal Manager Template")
2. Admin uploads template to organization settings
3. Template appears in all users' View dropdown as "Template: [Name]"

User workflow:

1. User selects "Template: Proposal Manager" from View dropdown
2. Template loads as a new view (does not overwrite existing views)
3. User can use as-is or customize further

Templates are read-only (users cannot modify the template itself) but users can duplicate and customize their own copy.

Common templates:

Organizations typically create templates for:

• Executive Dashboard: High-level KPIs for leadership
• Analyst Dashboard: Detailed data and competitive intelligence
• Proposal Manager Dashboard: Pipeline and deadline tracking
• Business Development Dashboard: Opportunity discovery and agency targeting

---

Resetting to Default Layout

If your dashboard becomes cluttered or you want a fresh start:

Reset Current View

Dashboard toolbar → View dropdown → Reset Current View to Default

This resets the active view to the factory default layout (the dashboard you see on first login). Your other saved views are unaffected.

Confirmation prompt:

"Reset 'Executive View' to default layout? This will remove all widgets and restore the factory default. This action cannot be undone."

Click Confirm to proceed.

Reset All Views

To reset your entire dashboard configuration:

Dashboard Settings → Advanced → Reset All Dashboard Views

This deletes all saved views and resets the base view to factory default. Use this if you want to start completely fresh.

Warning: This action is destructive and cannot be undone. You will lose all saved dashboard views. Consider exporting your current layouts before resetting if you might want to restore them later.

Factory Default Layout

The factory default layout includes:

Row 1:

• Bid Statistics (4 cols)
• Win Rate Analysis (4 cols)
• Market Snapshot (4 cols)

Row 2:

• Pipeline Overview (6 cols)
• Market Trends (6 cols)

Row 3:

• Smart Recommendations (6 cols)
• Expiring Soon (6 cols)

Row 4:

• Competitor Analysis (12 cols, full width)

This balanced layout covers performance tracking (Bid Statistics, Win Rate, Pipeline), market intelligence (Market Snapshot, Trends), opportunity discovery (Smart Recommendations, Expiring Soon), and competitive analysis (Competitor Analysis).

It's designed for general procurement professionals without role-specific optimization. Most users customize this layout after 1-2 weeks of use.

---

Performance Optimization

Large dashboards (15+ widgets) can slow down, especially on older devices or slow networks. Follow these optimization strategies:

Lazy Loading

Enable lazy loading to defer data loading for below-the-fold widgets:

Dashboard Settings → Performance → Enable Lazy Loading

How it works:

1. Dashboard initially loads only widgets visible above the fold (no scrolling)
2. As you scroll down, widgets load data just before they come into view
3. User perception: Dashboard loads much faster (2 seconds vs. 5+ seconds)

Trade-off:

Brief loading spinner when scrolling to new widgets (1-2 second delay). Acceptable for most users in exchange for much faster initial load.

Best for:

• Dashboards with 12+ widgets
• Slow network connections
• Mobile devices (limited bandwidth)

Not recommended for:

• Dashboards with <8 widgets (no benefit, adds complexity)
• Users who frequently scroll through entire dashboard (repeated loading delays)

Caching Strategy

Adjust cache duration based on how frequently data changes:

Real-time widgets (Bid Statistics, Pipeline, Team Activity):

• Cache: 30 seconds (frequent updates essential)

Daily operations widgets (Win Rate, Market Snapshot, Expiring Soon):

• Cache: 5 minutes (balance freshness and performance)

Strategic widgets (Competitor Analysis, Market Trends, HHI Index):

• Cache: 1 hour (data changes slowly)

Set per-widget cache duration:

Widget Settings → Caching → Cache Duration → Select duration

Aggressive caching:

For maximum performance, enable aggressive caching:

Dashboard Settings → Performance → Aggressive Caching

This increases all cache durations by 4x (e.g., 5-minute cache becomes 20 minutes). Use when performance is critical and data freshness is less important.

Widget Count Optimization

Fewer is faster:

Each widget = separate API call + rendering cost. Benchmark:

• 6 widgets: ~1 second load time
• 12 widgets: ~2-3 second load time
• 18 widgets: ~4-5 second load time
• 24+ widgets: >5 second load time

Audit unused widgets:

Every month, review your dashboard usage:

Dashboard Settings → Analytics → Widget Usage Report

This shows:

• Widgets you've never clicked (remove these)
• Widgets you rarely view (candidates for removal)
• Widgets you check daily (keep these)

Remove widgets you haven't interacted with in 30 days—they're clutter without value.

Create focused views instead of one mega-dashboard:

Instead of a 20-widget dashboard trying to show everything, create multiple 8-10 widget views:

• Daily Ops View: 8 widgets for daily check-ins
• Weekly Strategy View: 10 widgets for strategic planning
• Monthly Reporting View: 10 widgets optimized for export and reports

Switch between views as needed. Each view is faster to load than one massive dashboard.

Chart Complexity

Complex charts (multi-series line charts, scatter plots with 1000+ points, detailed tables) render slowly.

Simplification strategies:

1. Limit data points: Show "Top 10" instead of "All" in rankings
2. Reduce series: Show "Count only" instead of "Count + Value" on trends
3. Enable data aggregation: Group by week instead of day to reduce points
4. Use summary views: Show table on click (modal) instead of embedding large table in widget

Widget-specific settings:

• Market Trends: Granularity → Monthly (vs. Daily)
• Pricing Analysis: Outlier filter → ±100% (removes extreme data points)
• Competitor Analysis: Top N → 10 (vs. 50)

Chart type selection:

Some chart types render faster than others:

When possible, choose faster chart types. Reserve tables for drill-down modals (click widget to open detailed table) rather than embedding in dashboard.

---

Keyboard Shortcuts Reference

Power users can navigate and customize the dashboard entirely via keyboard:

Navigation

• - Move focus to next widget
• - Move focus to previous widget
• - Expand focused widget to full-screen
• - Close full-screen widget or exit Edit Mode

Editing

• - Toggle Edit Mode
• - Save dashboard changes
• - Undo last edit action
• - Remove focused widget
• - Enter Move Mode for focused widget (use arrow keys to move)
• - Enter Resize Mode for focused widget (use arrow keys to resize)

Widget Actions

• - Refresh all widgets
• - Refresh focused widget only
• - Export focused widget
• - Open configuration for focused widget

Dashboard Views

• - Switch to view 1-9
• - Create new view
• - Export current view

Widget Catalog

• - Open widget catalog
• - Open command palette (search widgets and actions)

Print this reference:

Dashboard Settings → Help → Print Keyboard Shortcuts

Generates a printable PDF of all shortcuts.

---

Troubleshooting

Dashboard Not Saving

Symptom: You click Save but changes don't persist after logout.

Possible causes:

1. Browser cookies disabled: Cothon requires cookies for authentication and saving preferences.

   • Solution: Enable cookies in browser settings.

2. Incognito/private mode: Private browsing doesn't persist data.

   • Solution: Use normal browsing mode.

3. Network error: Save request failed to reach server.

   • Solution: Check internet connection; try saving again.

4. Storage quota exceeded: Your browser has reached storage limit.

   • Solution: Clear browser cache/storage; remove old saved views.

Verification:

After saving, open browser DevTools → Application → Local Storage → cothon.com → Look for key dashboardConfig:userId. If present, save succeeded. If missing, investigate causes above.

Widgets Not Loading

Symptom: Widget shows "Loading..." indefinitely or "Failed to load data".

Possible causes:

1. API error: Backend request failed.

   • Solution: Check widget-specific error message (hover over error icon). Try refreshing widget.

2. Network timeout: Slow connection or large dataset.

   • Solution: Increase timeout in widget settings or reduce data scope (smaller time range, fewer filters).

3. Insufficient permissions: You lack access to the data the widget requests.

   • Solution: Contact organization admin to adjust permissions.

4. No data available: Widget is configured for data that doesn't exist (e.g., Win Rate Analysis with 0 bids).

   • Solution: Widget will show "No data" message. This is expected—continue using platform to accumulate data.

Debugging:

Open DevTools → Network tab → Refresh widget → Look for failed requests (red, 4xx/5xx status codes). Check response for error details.

Layout Breaks After Adding Widget

Symptom: Widgets overlap, appear outside dashboard bounds, or layout looks broken.

Possible causes:

1. Browser rendering bug: Rare issue with grid layout in older browsers.

   • Solution: Refresh page. If persists, try different browser (Chrome, Firefox, Safari).

2. Conflicting browser extension: Extension modifying page CSS.

   • Solution: Disable extensions one-by-one to identify culprit. Report to Cothon support.

3. Corrupted layout state: Rare caching issue.

   • Solution: Dashboard Settings → Advanced → Clear Layout Cache → Refresh page.

Nuclear option:

Reset dashboard to default layout (see "Resetting to Default Layout" section). This always resolves layout corruption.

Widget Shows Outdated Data

Symptom: Widget data hasn't updated in hours despite refresh.

Possible causes:

1. Cache not invalidated: Widget is serving stale cache.

   • Solution: Click refresh icon on widget (circular arrow). If persists, clear browser cache.

2. Automatic refresh disabled: Widget set to manual refresh only.

   • Solution: Widget Settings → Refresh → Set to Automatic (5 minutes or 15 minutes).

3. Backend data hasn't updated: Source data genuinely hasn't changed.

   • Solution: Check "Last updated" timestamp in widget footer. If recent, data is up-to-date even if unchanged.

Force refresh:

Hold Shift while clicking refresh icon to bypass cache and force fresh API call.

---

FAQ

---

Next Steps

Now that you've mastered dashboard customization, explore specific widget categories to optimize your dashboard content:

• Market Overview Widgets - Market intelligence and trend analysis
• Bid Performance Widgets - Win rate, pipeline, and effort tracking
• Competitive Intelligence Widgets - Competitor analysis and positioning

Or dive deeper into platform features:

• Analytics - Advanced analytics beyond dashboard widgets
• Settings & Preferences - Platform-wide customization options