chore: add an initial disclaimer to Unleash AI (#8482)

https://linear.app/unleash/issue/2-2853/add-a-disclaimer-to-the-unleash-ai-chat-window Adds a small, initial disclaimer to Unleash AI chat. ![image](https://github.com/user-attachments/assets/0097bb92-9724-4cef-922e-4c97770fe8e1)
Unleash · Oct 18, 2024 · 5b1e875 · 5b1e875
1 parent ffcfe85
commit 5b1e875
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 2 deletions.
diff --git a/frontend/src/component/ai/AIChat.tsx b/frontend/src/component/ai/AIChat.tsx
@@ -14,6 +14,7 @@ import { AIChatInput } from './AIChatInput';
 import { AIChatMessage } from './AIChatMessage';
 import { AIChatHeader } from './AIChatHeader';
 import { Resizable } from 'component/common/Resizable/Resizable';
+import { AIChatDisclaimer } from './AIChatDisclaimer';
 
 const AI_ERROR_MESSAGE = {
     role: 'assistant',
@@ -176,9 +177,9 @@ export const AIChat = () => {
         <StyledAIChatContainer>
             <StyledResizable
                 handlers={['top-left', 'top', 'left']}
-                minSize={{ width: '270px', height: '200px' }}
+                minSize={{ width: '270px', height: '250px' }}
                 maxSize={{ width: '90vw', height: '90vh' }}
-                defaultSize={{ width: '320px', height: '450px' }}
+                defaultSize={{ width: '320px', height: '500px' }}
                 onResize={() => scrollToEnd({ onlyIfAtEnd: true })}
             >
                 <StyledChat>
@@ -187,6 +188,7 @@ export const AIChat = () => {
                         onClose={() => setOpen(false)}
                     />
                     <StyledChatContent>
+                        <AIChatDisclaimer />
                         <AIChatMessage from='assistant'>
                             Hello, how can I assist you?
                         </AIChatMessage>

diff --git a/frontend/src/component/ai/AIChatDisclaimer.tsx b/frontend/src/component/ai/AIChatDisclaimer.tsx
@@ -0,0 +1,19 @@
+import { styled } from '@mui/material';
+
+const StyledDisclaimer = styled('aside')(({ theme }) => ({
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    textAlign: 'center',
+    width: '100%',
+    color: theme.palette.secondary.dark,
+    fontSize: theme.fontSizes.smallerBody,
+    marginBottom: theme.spacing(2),
+}));
+
+export const AIChatDisclaimer = () => (
+    <StyledDisclaimer>
+        By using this assistant you accept that all data you share in this chat
+        can be shared with OpenAI
+    </StyledDisclaimer>
+);