(feat): add reply box to messages

(feat): update methanium ui
(fix): user data caching
(fix): other random stuff
(qol): update todo

apps/web/src/components/modals/basic.tsx

@@ -29,7 +29,7 @@ export function Basic({
       render={<div />}
       nativeButton={false}
       variant="outline"
-      className="animate-in fade-in duration-300 h-auto w-full justify-start gap-2.5 rounded-xl min-h-12.5!"
+      className="outline-none! animate-in fade-in duration-300 h-auto w-full justify-start gap-2.5 rounded-xl min-h-12.5!"
     >
       <div className="relative shrink-0 overflow-visible">
         <Avatar>

apps/web/src/components/modals/profile.tsx

@@ -24,7 +24,7 @@ export default function Profile({ user }: { user: User }) {
       <Text value={user.About || ""} />
       <Button
         className="h-auto justify-start gap-1.5 px-0 py-1 text-base font-medium text-white no-underline hover:no-underline"
-        variant="link"
+        variant="ghost"
         aria-expanded={showAdvancedInformation}
         onClick={() => setShowAdvancedInformation((show) => !show)}
       >

apps/web/src/components/navbar.tsx

@@ -43,16 +43,21 @@ export default function Navbar({ forMobile }: { forMobile: boolean }) {
   return (
     <div
       data-tauri-drag-region
-      className={`${forMobile && "border-b"} w-full shrink-0 gap-2 h-13.5 flex items-center justify-between`}
+      className={`${forMobile && "border-b"} pl-px w-full shrink-0 gap-2 h-13.5 flex items-center justify-between`}
     >
       <div className="flex items-center justify-center gap-2">
         {forMobile ? (
           <SidebarTrigger
-            className="w-9 h-9! aspect-square rounded-lg ml-2"
-            variant="outline"
-          >
-            <ArrowLeft className="size-4.5" />
-          </SidebarTrigger>
+            render={({ onClick }) => (
+              <Button
+                onClick={onClick}
+                className="w-9 h-9! ml-2"
+                variant="ghost"
+              >
+                <ArrowLeft className="size-4.5" />
+              </Button>
+            )}
+          />
         ) : (
           <>
             <Button
@@ -80,10 +85,11 @@ export default function Navbar({ forMobile }: { forMobile: boolean }) {
               ) : (
                 <Popover open={userInfoOpen} onOpenChange={setUserInfoOpen}>
                   <PopoverTrigger
-                    render={
+                    render={({ onClick }) => (
                       <Button
+                        onClick={onClick}
                         variant="link"
-                        className="px-0! text-foreground"
+                        className="text-foreground px-0! border-0! bg-none! bg-transparent!"
                         style={{
                           textDecorationLine: "none",
                         }}
@@ -92,7 +98,7 @@ export default function Navbar({ forMobile }: { forMobile: boolean }) {
                           {user?.Display}
                         </p>
                       </Button>
-                    }
+                    )}
                   />
                   <PopoverContent side="bottom">
                     <Profile user={user} />
@@ -191,7 +197,7 @@ export function MobileNavbar() {
             navigate({ to: "/" });
             setOpenMobile(false);
           }}
-          className="text-foreground w-12 h-12 aspect-square rounded-xl flex flex-col gap-1 border-0! hover:bg-transparent!"
+          className="text-foreground w-12 h-12 aspect-square rounded-xl flex flex-col gap-1 border-0! bg-none! bg-transparent!"
           variant="link"
         >
           <House className="size-4.5" />
@@ -202,7 +208,7 @@ export function MobileNavbar() {
             navigate({ to: "/settings" });
             setOpenMobile(false);
           }}
-          className="text-foreground w-12 h-12 aspect-square rounded-xl flex flex-col gap-1 border-0! hover:bg-transparent!"
+          className="text-foreground w-12 h-12 aspect-square rounded-xl flex flex-col gap-1 border-0! bg-none! bg-transparent!"
           variant="link"
         >
           <Settings className="size-4.5" />

apps/web/src/components/sidebar.tsx

@@ -298,7 +298,7 @@ export default function Sidebar() {
           data-sidebar="sidebar"
           data-slot="sidebar"
           data-mobile="true"
-          className="fixed inset-y-0 left-0 z-50 w-screen bg-sidebar p-0 text-sidebar-foreground transition-[transform,opacity] duration-150 ease-linear"
+          className="fixed inset-y-0 left-0 z-50 w-screen bg-sidebar p-0 text-sidebar-foreground"
           style={{
             transform: openMobile ? "translateX(0)" : "translateX(-100%)",
             opacity: openMobile ? 1 : 0,

apps/web/src/features/conversation/list/body.tsx

@@ -31,7 +31,7 @@ export default function List() {
       <div
         ref={scrollRef}
         id="conversation-list"
-        className="overflow-y-auto flex-1 h-full"
+        className="overflow-y-auto flex-1 h-full p-px"
       >
         {items === null ? (
           <div className="flex items-center justify-center pt-5">

apps/web/src/routes/app/home.tsx

@@ -136,7 +136,7 @@ function AddConversationButton() {
           <Button onClick={onClick}>Add Conversation</Button>
         )}
       />
-      <DialogContent>
+      <DialogContent showCloseButton={false}>
         <DialogHeader>
           <DialogTitle>New Conversation</DialogTitle>
         </DialogHeader>