style improvements

src/SessionMessages/SessionMessage/SessionMessage.tsx

@@ -69,7 +69,9 @@ export const SessionMessage: FC<SessionMessageProps> = ({
           </>
         )}
       </Card>
-      <Divider />
+      {!isLast && (
+        <Divider />
+      )}
     </motion.div>
   );
 };

src/SessionsList/NewSessionButton.tsx

@@ -1,4 +1,4 @@
-import { Button, cn, Divider } from 'reablocks';
+import { Button, cn } from 'reablocks';
 import { FC, PropsWithChildren, ReactNode, useContext } from 'react';
 import { ChatContext } from '@/ChatContext';
 import { Slot } from '@radix-ui/react-slot';

src/SessionsList/SessionsGroup.tsx

@@ -1,23 +1,17 @@
 import { FC, PropsWithChildren, ReactNode, useContext } from 'react';
 import { ChatContext } from '@/ChatContext';
-import { Divider, ListItem, cn } from 'reablocks';
+import { ListItem, cn } from 'reablocks';
 
 interface SessionsGroupProps extends PropsWithChildren {
   /**
    * Heading for the session group.
    */
   heading?: string | ReactNode;
-
-  /**
-   * Divider to render between the children.
-   */
-  divider?: ReactNode;
 }
 
 export const SessionsGroup: FC<SessionsGroupProps> = ({
   heading,
   children,
-  divider = <Divider variant="secondary" />
 }) => {
   const { theme } = useContext(ChatContext);
   return (
@@ -32,7 +26,6 @@ export const SessionsGroup: FC<SessionsGroupProps> = ({
         </ListItem>
       )}
       {children}
-      {divider}
     </>
   );
 };

src/theme.ts

@@ -91,7 +91,7 @@ export const chatTheme: ChatTheme = {
     companion: 'w-full h-full',
     group: 'text-xs text-gray-400 mt-4 hover:bg-transparent mb-1',
     create:
-      'relative mb-4 rounded-[10px] after:-bottom-5 after:w-full after:absolute after:h-px after:content[""] after:bg-gradient-to-r after:from-transparent after:to-transparent after:via-blue-500',
+      'relative mb-4 rounded-[10px]',
     session: {
       base: 'my-1 rounded-[10px] p-2 text-typography hover:bg-gray-800/50 border border-transparent hover:border-gray-700/50',
       active:

stories/Console.stories.tsx

@@ -35,7 +35,6 @@ import { MessageFiles } from '@/SessionMessages';
 import { MessageQuestion } from '@/SessionMessages';
 import { MessageResponse } from '@/SessionMessages';
 import { MessageSources } from '@/SessionMessages';
-import ChatIcon from '@/assets/chat.svg?react';
 import {
   fakeSessions,
   fakeSessionsWithEmbeds,
@@ -1184,7 +1183,7 @@ export const CustomComponents = () => {
           <NewSessionButton>
             <button className="text-blue-500">New Session</button>
           </NewSessionButton>
-          <Divider />
+          <Divider variant="secondary" />
           <SessionGroups>
             {groups =>
               groups.map(({ heading, sessions }) => (