Implement basic web composer

1 files changed, 54 insertions, 0 deletions

diff --git a/src/view/com/composer/text-input/TextInput.tsx b/src/view/com/composer/text-input/TextInput.tsx
new file mode 100644
index 000000000..3c5dacf80
--- /dev/null
+++ b/src/view/com/composer/text-input/TextInput.tsx
@@ -0,0 +1,54 @@
+import React from 'react'
+import {StyleProp, TextStyle} from 'react-native'
+import PasteInput, {
+  PastedFile,
+  PasteInputRef,
+} from '@mattermost/react-native-paste-input'
+import {usePalette} from '../../../lib/hooks/usePalette'
+
+export type TextInputRef = PasteInputRef
+
+interface TextInputProps {
+  testID: string
+  innerRef: React.Ref<TextInputRef>
+  placeholder: string
+  style: StyleProp<TextStyle>
+  onChangeText: (str: string) => void
+  onPaste: (err: string | undefined, uris: string[]) => void
+}
+
+export function TextInput({
+  testID,
+  innerRef,
+  placeholder,
+  style,
+  onChangeText,
+  onPaste,
+  children,
+}: React.PropsWithChildren<TextInputProps>) {
+  const pal = usePalette('default')
+  const onPasteInner = (err: string | undefined, files: PastedFile[]) => {
+    if (err) {
+      onPaste(err, [])
+    } else {
+      onPaste(
+        undefined,
+        files.map(f => f.uri),
+      )
+    }
+  }
+  return (
+    <PasteInput
+      testID={testID}
+      ref={innerRef}
+      multiline
+      scrollEnabled
+      onChangeText={(str: string) => onChangeText(str)}
+      onPaste={onPasteInner}
+      placeholder={placeholder}
+      placeholderTextColor={pal.colors.textLight}
+      style={style}>
+      {children}
+    </PasteInput>
+  )
+}