fix: line breaks in reflections

Signed-off-by: Matt Krick <[email protected]>
ParabolInc · Jan 31, 2025 · 8ed784b · 8ed784b
1 parent f893226
commit 8ed784b
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 40 deletions.
diff --git a/packages/client/components/SendCommentButton.tsx b/packages/client/components/SendCommentButton.tsx
@@ -1,44 +1,9 @@
-import styled from '@emotion/styled'
 import {ArrowUpward} from '@mui/icons-material'
-import {PALETTE} from '~/styles/paletteV3'
 import {MenuPosition} from '../hooks/useCoords'
 import useTooltip from '../hooks/useTooltip'
-import PlainButton from './PlainButton/PlainButton'
 
 export type CommentSubmitState = 'idle' | 'typing'
 
-const StyledPlainButton = styled(PlainButton, {
-  shouldForwardProp: (prop) => !['commentSubmitState'].includes(prop)
-})<{commentSubmitState: CommentSubmitState}>(({commentSubmitState}) => ({
-  display: 'flex',
-  alignItems: 'center',
-  justifyContent: 'center',
-  backgroundColor: commentSubmitState === 'idle' ? PALETTE.SLATE_200 : PALETTE.SKY_500,
-  transition: 'background-color 0.1s ease',
-  borderRadius: '100%',
-  height: 32,
-  width: 32,
-  margin: 8,
-  ':hover, :focus, :active': {
-    backgroundColor: commentSubmitState === 'idle' ? PALETTE.SLATE_200 : PALETTE.SKY_600
-  },
-  opacity: 1,
-  ':hover,:focus': {
-    opacity: 1
-  }
-}))
-
-const SendIcon = styled(ArrowUpward, {
-  shouldForwardProp: (prop) => !['commentSubmitState'].includes(prop)
-})<{commentSubmitState: CommentSubmitState}>(({commentSubmitState}) => ({
-  opacity: 1,
-  transition: 'color 0.1s ease',
-  color: commentSubmitState === 'idle' ? PALETTE.SLATE_500 : PALETTE.WHITE,
-  height: 20,
-  width: 20,
-  margin: 4
-}))
-
 interface Props {
   commentSubmitState: CommentSubmitState
   onSubmit: () => void
@@ -57,16 +22,20 @@ const SendCommentButton = (props: Props) => {
 
   return (
     <>
-      <StyledPlainButton
+      <button
+        data-disabled={commentSubmitState === 'idle'}
+        className='m-2 flex h-8 w-8 shrink-0 cursor-pointer items-center justify-center rounded-full bg-sky-500 transition-colors hover:bg-sky-600 focus:bg-sky-600 active:bg-sky-600 data-disabled:bg-slate-200'
         onClick={onSubmit}
         onMouseEnter={openTooltip}
         onMouseLeave={closeTooltip}
-        commentSubmitState={commentSubmitState}
         disabled={isDisabled}
         ref={tipRef}
       >
-        <SendIcon commentSubmitState={commentSubmitState} />
-      </StyledPlainButton>
+        <ArrowUpward
+          data-disabled={commentSubmitState === 'idle'}
+          className='m-1 h-5 w-5 text-white transition-colors data-disabled:text-slate-500'
+        />
+      </button>
       {tooltipPortal(<div>{'Send comment'}</div>)}
     </>
   )

diff --git a/packages/client/components/promptResponse/TipTapEditor.tsx b/packages/client/components/promptResponse/TipTapEditor.tsx
@@ -33,7 +33,7 @@ export const TipTapEditor = (props: Props) => {
         ref={ref as any}
         {...rest}
         editor={editor}
-        className={cn('min-h-10 break-all px-4 text-sm leading-none', className)}
+        className={cn('min-h-10 px-4 text-sm leading-none', className)}
       />
     </>
   )