update settings buttons

Author: sutigit

src/client/components/ChatV2/ChatV2.tsx

@@ -234,7 +234,6 @@ export const ChatV2 = () => {
           height: '100%',
         }}
       >
-
         <Box
           sx={{
             position: 'sticky',
@@ -253,11 +252,16 @@ export const ChatV2 = () => {
             <IconButton onClick={() => setSettingsModalOpen(true)} title="Settings">
               <Settings></Settings>
             </IconButton> */}
-          <SettingsButton startIcon={<SettingsIcon />}>Keskustelun asetukset</SettingsButton>
           {/* <SettingsButton startIcon={<AddCommentIcon />}>Alustus</SettingsButton> */}
-          <SettingsButton startIcon={<EmailIcon />}>Tallenna sähköpostina</SettingsButton>
-          <SettingsButton startIcon={<DeleteIcon />}>Tyhjennä</SettingsButton>
-          {/* {courseId ? <Link to={'/v2'}>CurreChat</Link> : <Link to={'/v2/sandbox'}>Ohtu Sandbox</Link>} */}
+          <SettingsButton startIcon={<SettingsIcon />} onClick={() => console.log('clicked')}>
+            Keskustelun asetukset
+          </SettingsButton>
+          <SettingsButton startIcon={<EmailIcon />} onClick={() => console.log('clicked')}>
+            Tallenna sähköpostina
+          </SettingsButton>
+          <SettingsButton startIcon={<DeleteIcon />} onClick={handleReset}>
+            Tyhjennä
+          </SettingsButton>
         </Box>
 
         <Conversation messages={messages} completion={completion} fileSearchResult={fileSearchResult} />

src/client/components/ChatV2/Conversation.tsx

@@ -3,7 +3,7 @@ import { Message } from '../../types'
 import ReactMarkdown from 'react-markdown'
 import remarkGfm from 'remark-gfm'
 import { FileSearchResult } from '../../../shared/types'
-import { PöhinäLogo } from './generics/PohinaLogo'
+import { ConversationSplash } from './generics/ConversationSplash'
 
 const MessageItem = ({ message }: { message: Message }) => (
   <Box
@@ -22,7 +22,7 @@ const MessageItem = ({ message }: { message: Message }) => (
 
 export const Conversation = ({ messages, completion, fileSearchResult }: { messages: Message[]; completion: string; fileSearchResult: FileSearchResult }) => (
   <Box sx={{ flex: 1, display: 'flex', flexDirection: 'column', gap: 3, width: '70%', minWidth: 600, margin: 'auto', paddingBottom: '5rem' }}>
-    {messages.length === 0 && <PöhinäLogo />}
+    {messages.length === 0 && <ConversationSplash />}
     {messages.map((message, idx) => (
       <MessageItem key={idx} message={message} />
     ))}

src/client/components/ChatV2/generics/PohinaLogo.tsx renamed to src/client/components/ChatV2/generics/ConversationSplash.tsx

@@ -1,10 +1,12 @@
 import { Box, Typography } from '@mui/material'
-import { Assistant } from '@mui/icons-material'
+import hyLogo from '../../../assets/hy_logo.svg'
 
-export const PöhinäLogo = () => (
+
+export const ConversationSplash = () => (
   <Box
     sx={{
       display: 'flex',
+      flexDirection: 'column',
       justifyContent: 'center',
       alignItems: 'center',
       height: '40rem',
@@ -18,7 +20,9 @@ export const PöhinäLogo = () => (
       },
     }}
   >
-    <Assistant sx={{ fontSize: 160, color: '#efefef', marginBottom: '2rem' }} />
-    <Typography>Aloite keskustelu läettämällä viesti...</Typography>
+    <img src={hyLogo} alt="University of Helsinki" width="240" style={{ opacity: 0.1, marginBottom: '2rem' }} />
+    <Typography fontStyle="italic" color="rgba(0,0,0,0.5)">
+      Aloita keskustelu läettämällä viesti...
+    </Typography>
   </Box>
 )

src/client/components/ChatV2/generics/SettingsButton.tsx

@@ -1,9 +1,10 @@
 import type { ReactNode } from 'react'
 import { Button } from '@mui/material'
 
-export default function SettingsButton({ children, startIcon }: { children: ReactNode; startIcon?: ReactNode }) {
+export default function SettingsButton({ children, startIcon, onClick }: { children: ReactNode; startIcon?: ReactNode; onClick: () => any }) {
   return (
     <Button
+      onClick={onClick}
       startIcon={startIcon}
       sx={{
         textTransform: 'none',