From 99360f7bd90480b0c382014fa7d889aef8c433a4 Mon Sep 17 00:00:00 2001
From: Paul Frazee <pfrazee@gmail.com>
Date: Fri, 27 Jan 2023 00:16:07 -0600
Subject: Implement basic web composer

---
 src/view/com/composer/text-input/TextInput.tsx     | 54 ++++++++++++++++++++++
 src/view/com/composer/text-input/TextInput.web.tsx | 51 ++++++++++++++++++++
 2 files changed, 105 insertions(+)
 create mode 100644 src/view/com/composer/text-input/TextInput.tsx
 create mode 100644 src/view/com/composer/text-input/TextInput.web.tsx

(limited to 'src/view/com/composer/text-input')

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>
+  )
+}
diff --git a/src/view/com/composer/text-input/TextInput.web.tsx b/src/view/com/composer/text-input/TextInput.web.tsx
new file mode 100644
index 000000000..6960bf7ab
--- /dev/null
+++ b/src/view/com/composer/text-input/TextInput.web.tsx
@@ -0,0 +1,51 @@
+import React from 'react'
+import {
+  StyleProp,
+  StyleSheet,
+  TextInput as RNTextInput,
+  TextStyle,
+} from 'react-native'
+import {usePalette} from '../../lib/hooks/usePalette'
+import {addStyle} from '../../lib/addStyle'
+
+export type TextInputRef = RNTextInput
+
+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,
+  children,
+}: React.PropsWithChildren<TextInputProps>) {
+  const pal = usePalette('default')
+  style = addStyle(style, styles.input)
+  return (
+    <RNTextInput
+      testID={testID}
+      ref={innerRef}
+      multiline
+      scrollEnabled
+      onChangeText={(str: string) => onChangeText(str)}
+      placeholder={placeholder}
+      placeholderTextColor={pal.colors.textLight}
+      style={style}>
+      {children}
+    </RNTextInput>
+  )
+}
+
+const styles = StyleSheet.create({
+  input: {
+    minHeight: 140,
+  },
+})
-- 
cgit 1.4.1