Skip to content

Commit 888fddf

Browse files
author
waleed
committed
improvement(chat): deployed chat no longer uses subdomains, uses sim.ai/chat/[identifier]
1 parent ace83eb commit 888fddf

4 files changed

Lines changed: 164 additions & 1 deletion

File tree

‎apps/sim/app/chat/[identifier]/chat.css‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
/**
2+
* Chat Subdomain Light Mode Overrides
3+
*
4+
* This file overrides dark mode utility classes to force light mode appearance
5+
* in the chat subdomain. It uses CSS variables defined in globals.css.
6+
*
7+
* The layout.tsx already applies the 'light' class which sets all the light
8+
* theme CSS variables from globals.css, so we don't need to redefine them here.
9+
*/
10+
11+
/* Background Color Overrides */
12+
.chat-light-wrapper :is(.dark\:bg-black) {
13+
background-color: hsl(var(--secondary));
14+
}
15+
16+
.chat-light-wrapper :is(.dark\:bg-gray-900) {
17+
background-color: hsl(var(--background));
18+
}
19+
20+
.chat-light-wrapper :is(.dark\:bg-gray-800) {
21+
background-color: hsl(var(--secondary));
22+
}
23+
24+
.chat-light-wrapper :is(.dark\:bg-gray-700) {
25+
background-color: hsl(var(--accent));
26+
}
27+
28+
.chat-light-wrapper :is(.dark\:bg-gray-600) {
29+
background-color: hsl(var(--muted));
30+
}
31+
32+
.chat-light-wrapper :is(.dark\:bg-gray-300) {
33+
background-color: hsl(var(--primary));
34+
}
35+
36+
/* Text Color Overrides */
37+
.chat-light-wrapper :is(.dark\:text-gray-100) {
38+
color: hsl(var(--primary));
39+
}
40+
41+
.chat-light-wrapper :is(.dark\:text-gray-200) {
42+
color: hsl(var(--foreground));
43+
}
44+
45+
.chat-light-wrapper :is(.dark\:text-gray-300) {
46+
color: hsl(var(--muted-foreground));
47+
}
48+
49+
.chat-light-wrapper :is(.dark\:text-gray-400) {
50+
color: hsl(var(--muted-foreground));
51+
}
52+
53+
.chat-light-wrapper :is(.dark\:text-neutral-600) {
54+
color: hsl(var(--muted-foreground));
55+
}
56+
57+
.chat-light-wrapper :is(.dark\:text-blue-400) {
58+
color: var(--brand-accent-hex);
59+
}
60+
61+
/* Border Color Overrides */
62+
.chat-light-wrapper :is(.dark\:border-gray-700) {
63+
border-color: hsl(var(--border));
64+
}
65+
66+
.chat-light-wrapper :is(.dark\:border-gray-800) {
67+
border-color: hsl(var(--border));
68+
}
69+
70+
.chat-light-wrapper :is(.dark\:border-gray-600) {
71+
border-color: hsl(var(--border));
72+
}
73+
74+
.chat-light-wrapper :is(.dark\:divide-gray-700) > * + * {
75+
border-color: hsl(var(--border));
76+
}
77+
78+
/* Hover State Overrides */
79+
.chat-light-wrapper :is(.dark\:hover\:bg-gray-800\/60:hover) {
80+
background-color: hsl(var(--card-hover));
81+
}
82+
83+
/* Code Block Overrides */
84+
.chat-light-wrapper pre:is(.dark\:bg-black) {
85+
background-color: hsl(var(--workflow-dots));
86+
}
87+
88+
.chat-light-wrapper code:is(.dark\:bg-gray-700) {
89+
background-color: hsl(var(--accent));
90+
}
91+
92+
.chat-light-wrapper code:is(.dark\:text-gray-200) {
93+
color: hsl(var(--foreground));
94+
}
95+
96+
/* Special Components */
97+
/* Tooltip overrides - keep tooltips dark with light text for consistency */
98+
.chat-light-wrapper [data-radix-tooltip-content] {
99+
background-color: hsl(0 0% 3.9%) !important;
100+
color: hsl(0 0% 98%) !important;
101+
}
102+
103+
/* Force light color scheme */
104+
.chat-light-wrapper {
105+
color-scheme: light !important;
106+
}

‎apps/sim/app/chat/[identifier]/layout.tsx‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
'use client'
2+
3+
import { ThemeProvider } from 'next-themes'
4+
import './chat.css'
5+
6+
export default function ChatLayout({ children }: { children: React.ReactNode }) {
7+
return (
8+
<ThemeProvider
9+
attribute='class'
10+
forcedTheme='light'
11+
enableSystem={false}
12+
disableTransitionOnChange
13+
>
14+
<div className='light chat-light-wrapper' style={{ colorScheme: 'light' }}>
15+
{children}
16+
</div>
17+
</ThemeProvider>
18+
)
19+
}

‎apps/sim/app/conditional-theme-provider.tsx‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
'use client'
2+
3+
import { usePathname } from 'next/navigation'
4+
import type { ThemeProviderProps } from 'next-themes'
5+
import { ThemeProvider as NextThemesProvider } from 'next-themes'
6+
7+
export function ConditionalThemeProvider({ children, ...props }: ThemeProviderProps) {
8+
const pathname = usePathname()
9+
10+
// Force light mode for certain pages
11+
const forcedTheme =
12+
pathname === '/' ||
13+
pathname === '/homepage' ||
14+
pathname.startsWith('/login') ||
15+
pathname.startsWith('/signup') ||
16+
pathname.startsWith('/terms') ||
17+
pathname.startsWith('/privacy') ||
18+
pathname.startsWith('/invite') ||
19+
pathname.startsWith('/verify') ||
20+
pathname.startsWith('/changelog') ||
21+
pathname.startsWith('/chat')
22+
? 'light'
23+
: undefined
24+
25+
return (
26+
<NextThemesProvider
27+
attribute='class'
28+
defaultTheme='system'
29+
enableSystem
30+
disableTransitionOnChange
31+
storageKey='sim-theme'
32+
forcedTheme={forcedTheme}
33+
{...props}
34+
>
35+
{children}
36+
</NextThemesProvider>
37+
)
38+
}

‎apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/control-bar/components/deploy-modal/components/chat-deploy/hooks/use-identifier-validation.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,4 +80,4 @@ export function useIdentifierValidation(
8080
}, [identifier, originalIdentifier, isEditingExisting])
8181

8282
return { isChecking, error, isValid }
83-
}
83+
}

0 commit comments

Comments
 (0)