Merge branch 'staging' into fix/navsettingsbutton

apps/mail/actions/settings.ts

@@ -22,12 +22,9 @@ export async function saveUserSettings(settings: UserSettings) {
   try {
     const userId = await getAuthenticatedUserId();
     if (!userId) throw new Error('No user ID found');
-    console.error(settings, 'before');
 
     settings = validateSettings(settings);
 
-    console.error(settings, 'after');
-
     const timestamp = new Date();
 
     const [existingSettings] = await db

apps/mail/app/(routes)/settings/appearance/page.tsx

@@ -42,7 +42,7 @@ export default function AppearancePage() {
   const form = useForm<z.infer<typeof formSchema>>({
     resolver: zodResolver(formSchema),
     defaultValues: {
-      colorTheme: settings?.colorTheme || '',
+      colorTheme: settings?.colorTheme || theme,
     },
   });
 
@@ -55,6 +55,7 @@ export default function AppearancePage() {
 
     function update() {
       setTheme(newTheme);
+      form.setValue('colorTheme', newTheme as z.infer<typeof formSchema>['colorTheme']);
     }
 
     if (document.startViewTransition && nextResolvedTheme !== resolvedTheme) {
@@ -109,7 +110,7 @@ export default function AppearancePage() {
           <form id="appearance-form" onSubmit={form.handleSubmit(onSubmit)} className="space-y-8">
             <div className="space-y-4">
               <div className="max-w-sm space-y-2">
-                {settings.colorTheme ? (
+                {settings.colorTheme || theme ? (
                   <FormField
                     control={form.control}
                     name="colorTheme"
@@ -120,9 +121,8 @@ export default function AppearancePage() {
                           <Select
                             onValueChange={(value) => {
                               handleThemeChange(value);
-                              field.onChange(value);
                             }}
-                            defaultValue={settings.colorTheme}
+                            defaultValue={form.getValues().colorTheme}
                           >
                             <SelectTrigger>
                               <SelectValue placeholder="Select theme">

apps/mail/app/api/auth/settings/route.ts

@@ -31,8 +31,7 @@ export const GET = async (req: NextRequest) => {
     .where(eq(userSettings.userId, userId))
     .limit(1);
 
-  // Returning null here when there are no settings so we can use the default settings with timezone from the browser
-  if (!result) return NextResponse.json({ settings: defaultUserSettings }, { status: 200 });
+  if (!result) return NextResponse.json({ ...defaultUserSettings }, { status: 200 });
 
   const settings = userSettingsSchema.parse(result.settings);
 

apps/mail/components/mail/mail-iframe.tsx

@@ -17,7 +17,7 @@ export function MailIframe({ html, senderEmail }: { html: string; senderEmail: s
     [settings, senderEmail],
   );
   const [cspViolation, setCspViolation] = useState(false);
-  const [imagesEnabled, setImagesEnabled] = useState(false);
+  const [imagesEnabled, setImagesEnabled] = useState(settings?.externalImages || true);
   const iframeRef = useRef<HTMLIFrameElement>(null);
   const [height, setHeight] = useState(0);
   const { resolvedTheme } = useTheme();

apps/mail/components/ui/app-sidebar.tsx

@@ -120,11 +120,9 @@ export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
           className={`mt-auto flex w-full flex-col ${state !== 'collapsed' ? 'px-0 md:px-2' : ''}`}
         >
           <SidebarContent className="py-0 pt-0">
-            <SidebarGroup className="mb-0 pb-0">
-              <SidebarMenu>
-                <GoldenTicketModal />
-              </SidebarMenu>
-            </SidebarGroup>
+            <div className="px-2">
+              <GoldenTicketModal />
+            </div>
 
             <NavMain items={bottomNavItems} />
           </SidebarContent>

apps/mail/components/ui/nav-main.tsx

@@ -420,7 +420,7 @@ export function NavMain({ items }: NavMainProps) {
               <div className="mr-0 pr-0">
                 <div
                   className={cn(
-                    'hide-scrollbar flex h-full max-h-[15vh] flex-row flex-wrap gap-2 overflow-scroll sm:max-h-none',
+                    'hide-scrollbar flex h-full max-h-[13vh] flex-row flex-wrap gap-2 overflow-scroll sm:max-h-[16vh]',
                   )}
                 >
                   {labels.map((label) => (

apps/mail/components/ui/sidebar.tsx

@@ -278,7 +278,7 @@ const SidebarGroup = React.forwardRef<HTMLDivElement, React.ComponentProps<'div'
       <div
         ref={ref}
         data-sidebar="group"
-        className={cn('relative flex w-full min-w-0 flex-col md:p-2', className)}
+        className={cn('relative flex w-full min-w-0 flex-col !pt-0 md:p-2', className)}
         {...props}
       />
     );

packages/db/src/user_settings_default.ts

@@ -4,7 +4,7 @@ export const defaultUserSettings = {
   language: 'en',
   timezone: 'UTC',
   dynamicContent: false,
-  externalImages: false,
+  externalImages: true,
   customPrompt: '',
   trustedSenders: [],
   isOnboarded: false,