feat: enable light mode and add theme toggle in sidebar

[Siddhartha-singh01]

Fixes

Fixes #2372

Type of Change • Bug fix • New feature • Breaking change • Documentation • Other: UI/UX enhancement

Description

This PR adds Light Mode support along with a theme toggle in the sidebar. Users can now switch between light and dark themes easily, improving accessibility and overall user experience. The selected theme persists across sessions.

Testing • Manually tested theme switching between Light and Dark modes • Verified styles across main pages and components • Checked persistence on page reload • Ensured no visual regressions in existing dark mode

Reviewers can focus on: • UI consistency in light mode • Sidebar toggle behavior • Theme persistence logic

Checklist • Code follows project style guidelines • Self-reviewed my changes • Tests added/updated (not applicable for UI-only change) • No new warnings introduced • I confirm that I have read and agree to the terms outlined in the CLA

[vercel[bot]]

@Siddhartha-singh01 is attempting to deploy a commit to the Sim Team on Vercel.

A member of the Team first needs to authorize it.

[greptile-apps[bot]]

Greptile Overview

Greptile Summary

This PR enables light mode support and adds a theme toggle to the workspace sidebar.

Key changes:

• Removed forced dark theme on workspace pages by changing forcedTheme from 'dark' to undefined when not on light-mode pages
• Added theme toggle button in the sidebar footer navigation that switches between light and dark modes using next-themes
• Theme preference persists across sessions via the existing sim-theme localStorage key

The implementation leverages the existing next-themes provider configuration and follows established patterns in the codebase. The sidebar wrapper already has suppressHydrationWarning to handle theme-related hydration concerns.

Confidence Score: 5/5

• This PR is safe to merge - minimal, well-contained changes that follow existing patterns
• The changes are simple and focused: one line change in the theme provider and a small addition to the sidebar. The implementation uses the existing next-themes infrastructure correctly and follows established codebase patterns.
• No files require special attention

Important Files Changed

File Analysis

Filename	Score	Overview
apps/sim/app/_shell/providers/theme-provider.tsx	5/5	Changed forcedTheme from forcing 'dark' on workspace pages to undefined, enabling user-controlled theme switching.
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx	5/5	Added theme toggle in footer navigation using useTheme hook from next-themes with Sun/Moon icons.

Sequence Diagram

sequenceDiagram
    participant User
    participant Sidebar
    participant useTheme
    participant ThemeProvider
    participant localStorage

    User->>Sidebar: Clicks theme toggle button
    Sidebar->>useTheme: setTheme('light' or 'dark')
    useTheme->>ThemeProvider: Update theme context
    ThemeProvider->>localStorage: Store theme in 'sim-theme'
    ThemeProvider->>Document: Apply 'light' or 'dark' class to html
    Document-->>User: UI updates to selected theme