aboutsummaryrefslogtreecommitdiff
path: root/src/components/comments/MentionInputControlled.tsx
diff options
context:
space:
mode:
authorIvan Chen <ivan@tagg.id>2021-06-25 20:58:56 -0400
committerGitHub <noreply@github.com>2021-06-25 20:58:56 -0400
commit5480267b285812c094246bb941c6deaf83f53ff5 (patch)
tree17f2e23576c000bcc90d840d14b8abc3bb9bec24 /src/components/comments/MentionInputControlled.tsx
parent981051448fee6197544383e535fea7a72827d41d (diff)
parentdcf45600b6e2be7820ed2d8c0f44603624f1e719 (diff)
Merge pull request #475 from IvanIFChen/tma948-video-playback
[TMA-948] Viewing Videos
Diffstat (limited to 'src/components/comments/MentionInputControlled.tsx')
-rw-r--r--src/components/comments/MentionInputControlled.tsx70
1 files changed, 65 insertions, 5 deletions
diff --git a/src/components/comments/MentionInputControlled.tsx b/src/components/comments/MentionInputControlled.tsx
index 2fd2b41d..0965e318 100644
--- a/src/components/comments/MentionInputControlled.tsx
+++ b/src/components/comments/MentionInputControlled.tsx
@@ -1,13 +1,23 @@
-import React, {FC, MutableRefObject, useMemo, useRef, useState} from 'react';
+import React, {
+ FC,
+ MutableRefObject,
+ Ref,
+ useMemo,
+ useRef,
+ useState,
+} from 'react';
import {
NativeSyntheticEvent,
+ StyleProp,
Text,
TextInput,
+ TextInputProps,
TextInputSelectionChangeEventData,
View,
+ ViewStyle,
} from 'react-native';
import {
- MentionInputProps,
+ PatternPartType,
MentionPartType,
Suggestion,
} from 'react-native-controlled-mentions/dist/types';
@@ -20,7 +30,30 @@ import {
parseValue,
} from 'react-native-controlled-mentions/dist/utils';
-const MentionInputControlled: FC<MentionInputProps> = ({
+type PartType = MentionPartType | PatternPartType;
+
+type MentionInputControlledProps = Omit<TextInputProps, 'onChange'> & {
+ value: string;
+ onChange: (value: string) => any;
+
+ partTypes?: PartType[];
+
+ inputRef?: Ref<TextInput>;
+
+ containerStyle?: StyleProp<ViewStyle>;
+
+ addComment?: () => any | null;
+
+ NewText?: FC<any>;
+
+ theme?: 'dark' | 'white';
+
+ keyboardVisible?: boolean;
+
+ comment?: string;
+};
+
+const MentionInputControlled: FC<MentionInputControlledProps> = ({
value,
onChange,
@@ -32,6 +65,16 @@ const MentionInputControlled: FC<MentionInputProps> = ({
onSelectionChange,
+ addComment,
+
+ NewText,
+
+ theme = 'white',
+
+ keyboardVisible = true,
+
+ comment = '',
+
...textInputProps
}) => {
const textInput = useRef<TextInput | null>(null);
@@ -147,7 +190,24 @@ const MentionInputControlled: FC<MentionInputProps> = ({
return validRegex().test(testString);
};
- return (
+ return NewText ? (
+ <NewText
+ {...textInputProps}
+ containerStyle={containerStyle}
+ validateInput={validateInput}
+ keyboardText={keyboardText}
+ partTypes={partTypes}
+ renderMentionSuggestions={renderMentionSuggestions}
+ handleTextInputRef={handleTextInputRef}
+ onChangeInput={onChangeInput}
+ handleSelectionChange={handleSelectionChange}
+ parts={parts}
+ addComment={addComment}
+ theme={theme}
+ keyboardVisible={keyboardVisible}
+ comment={comment}
+ />
+ ) : (
<View style={containerStyle}>
{validateInput(keyboardText)
? (
@@ -195,4 +255,4 @@ const MentionInputControlled: FC<MentionInputProps> = ({
);
};
-export {MentionInputControlled};
+export default MentionInputControlled;