style: alpha4 style tweaks (#299)

apps/client/src/common/components/input/text-input/TextInput.tsx

@@ -6,7 +6,7 @@ import { Size } from '../../../models/Util.type';
 
 import useReactiveTextInput from './useReactiveTextInput';
 
-interface TextInputProps {
+interface BaseProps {
   isTextArea?: boolean;
   isFullHeight?: boolean;
   size?: Size;
@@ -15,13 +15,18 @@ interface TextInputProps {
   submitHandler: (field: EventEditorSubmitActions, newValue: string) => void;
 }
 
+interface TextAreaProps {
+  isTextArea: true;
+  resize?: 'horizontal' | 'vertical' | 'none';
+}
+
+type TextInputProps = BaseProps & TextAreaProps;
+
 export default function TextInput(props: TextInputProps) {
-  const { isTextArea, isFullHeight, size = 'sm', field, initialText = '', submitHandler } = props;
+  const { isTextArea, isFullHeight, size = 'sm', field, initialText = '', submitHandler, resize = 'none' } = props;
   const inputRef = useRef(null);
 
-  const submitCallback = useCallback((newValue: string) =>
-      submitHandler(field, newValue)
-    ,[field, submitHandler]);
+  const submitCallback = useCallback((newValue: string) => submitHandler(field, newValue), [field, submitHandler]);
 
   const textInputProps = useReactiveTextInput(initialText, submitCallback, { submitOnEnter: true });
   const textAreaProps = useReactiveTextInput(initialText, submitCallback);
@@ -30,18 +35,13 @@ export default function TextInput(props: TextInputProps) {
     <Textarea
       ref={inputRef}
       size={size}
+      resize='none'
       variant='ontime-filled'
       {...textAreaProps}
       style={{ height: isFullHeight ? '100%' : undefined }}
       data-testid='input-textarea'
     />
   ) : (
-    <Input
-      ref={inputRef}
-      size={size}
-      variant='ontime-filled'
-      {...textInputProps}
-      data-testid='input-textfield'
-    />
+    <Input ref={inputRef} size={size} variant='ontime-filled' {...textInputProps} data-testid='input-textfield' />
   );
 }