aboutsummaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
authorBrian Kim <brian@tagg.id>2021-05-11 12:49:30 -0700
committerBrian Kim <brian@tagg.id>2021-05-11 12:49:30 -0700
commitd760f15aa6971c39f028e18a007a5c56f08b6149 (patch)
tree466db58bf218687603e636181b3567e1b2de7f26 /src/components
parentd2ea82d2d568a0d94bf516736da976bf0ba09e21 (diff)
Fixed linter
Diffstat (limited to 'src/components')
-rw-r--r--src/components/comments/AddComment.tsx1
-rw-r--r--src/components/comments/MentionInputControlled.tsx130
2 files changed, 65 insertions, 66 deletions
diff --git a/src/components/comments/AddComment.tsx b/src/components/comments/AddComment.tsx
index 28e1a40e..befaa8fe 100644
--- a/src/components/comments/AddComment.tsx
+++ b/src/components/comments/AddComment.tsx
@@ -7,7 +7,6 @@ import {
TextInput,
View,
} from 'react-native';
-import {MentionInput} from 'react-native-controlled-mentions';
import {TouchableOpacity} from 'react-native-gesture-handler';
import {useDispatch, useSelector} from 'react-redux';
import UpArrowIcon from '../../assets/icons/up_arrow.svg';
diff --git a/src/components/comments/MentionInputControlled.tsx b/src/components/comments/MentionInputControlled.tsx
index 892c9564..6abcb566 100644
--- a/src/components/comments/MentionInputControlled.tsx
+++ b/src/components/comments/MentionInputControlled.tsx
@@ -1,4 +1,4 @@
-import React, { FC, MutableRefObject, useMemo, useRef, useState } from 'react';
+import React, {FC, MutableRefObject, useMemo, useRef, useState} from 'react';
import {
NativeSyntheticEvent,
Text,
@@ -7,10 +7,10 @@ import {
View,
} from 'react-native';
-import {
- MentionInputProps,
- MentionPartType,
- Suggestion
+import {
+ MentionInputProps,
+ MentionPartType,
+ Suggestion,
} from 'react-native-controlled-mentions/dist/types';
import {
defaultMentionTextStyle,
@@ -21,22 +21,20 @@ import {
parseValue,
} from 'react-native-controlled-mentions/dist/utils';
-const MentionInputControlled: FC<MentionInputProps> = (
- {
- value,
- onChange,
+const MentionInputControlled: FC<MentionInputProps> = ({
+ value,
+ onChange,
- partTypes = [],
+ partTypes = [],
- inputRef: propInputRef,
+ inputRef: propInputRef,
- containerStyle,
+ containerStyle,
- onSelectionChange,
+ onSelectionChange,
- ...textInputProps
- },
-) => {
+ ...textInputProps
+}) => {
const textInput = useRef<TextInput | null>(null);
const [selection, setSelection] = useState({start: 0, end: 0});
@@ -45,18 +43,20 @@ const MentionInputControlled: FC<MentionInputProps> = (
const validRegex = () => {
if (partTypes.length === 0) {
- return /.*\@[^ ]*$/;
+ return /.*\@[^ ]*$/;
} else {
- return new RegExp(`.*\@${keywordByTrigger[partTypes[0].trigger]}.*$`);
+ return new RegExp(`.*\@${keywordByTrigger[partTypes[0].trigger]}.*$`);
}
};
- const {
- plainText,
- parts,
- } = useMemo(() => parseValue(value, partTypes), [value, partTypes]);
+ const {plainText, parts} = useMemo(() => parseValue(value, partTypes), [
+ value,
+ partTypes,
+ ]);
- const handleSelectionChange = (event: NativeSyntheticEvent<TextInputSelectionChangeEventData>) => {
+ const handleSelectionChange = (
+ event: NativeSyntheticEvent<TextInputSelectionChangeEventData>,
+ ) => {
setSelection(event.nativeEvent.selection);
onSelectionChange && onSelectionChange(event);
@@ -69,7 +69,9 @@ const MentionInputControlled: FC<MentionInputProps> = (
*/
const onChangeInput = (changedText: string) => {
setKeyboardText(changedText);
- onChange(generateValueFromPartsAndChangedText(parts, plainText, changedText));
+ onChange(
+ generateValueFromPartsAndChangedText(parts, plainText, changedText),
+ );
};
/**
@@ -89,7 +91,9 @@ const MentionInputControlled: FC<MentionInputProps> = (
* - Get updated value
* - Trigger onChange callback with new value
*/
- const onSuggestionPress = (mentionType: MentionPartType) => (suggestion: Suggestion) => {
+ const onSuggestionPress = (mentionType: MentionPartType) => (
+ suggestion: Suggestion,
+ ) => {
const newValue = generateValueWithAddedSuggestion(
parts,
mentionType,
@@ -132,64 +136,60 @@ const MentionInputControlled: FC<MentionInputProps> = (
const renderMentionSuggestions = (mentionType: MentionPartType) => (
<React.Fragment key={mentionType.trigger}>
- {mentionType.renderSuggestions && mentionType.renderSuggestions({
- keyword: keywordByTrigger[mentionType.trigger],
- onSuggestionPress: onSuggestionPress(mentionType),
- })}
+ {mentionType.renderSuggestions &&
+ mentionType.renderSuggestions({
+ keyword: keywordByTrigger[mentionType.trigger],
+ onSuggestionPress: onSuggestionPress(mentionType),
+ })}
</React.Fragment>
);
const validateInput = (testString: string) => {
- return validRegex().test(testString);
- }
+ return validRegex().test(testString);
+ };
return (
<View style={containerStyle}>
- {validateInput(keyboardText) ? (partTypes
- .filter(one => (
- isMentionPartType(one)
- && one.renderSuggestions != null
- && !one.isBottomMentionSuggestionsRender
- )) as MentionPartType[])
- .map(renderMentionSuggestions)
- : null
- }
+ {validateInput(keyboardText)
+ ? (partTypes.filter(
+ (one) =>
+ isMentionPartType(one) &&
+ one.renderSuggestions != null &&
+ !one.isBottomMentionSuggestionsRender,
+ ) as MentionPartType[]).map(renderMentionSuggestions)
+ : null}
<TextInput
multiline
-
{...textInputProps}
-
ref={handleTextInputRef}
-
onChangeText={onChangeInput}
- onSelectionChange={handleSelectionChange}
- >
+ onSelectionChange={handleSelectionChange}>
<Text>
- {parts.map(({text, partType, data}, index) => partType ? (
- <Text
- key={`${index}-${data?.trigger ?? 'pattern'}`}
- style={partType.textStyle ?? defaultMentionTextStyle}
- >
- {text}
- </Text>
- ) : (
- <Text key={index}>{text}</Text>
- ))}
+ {parts.map(({text, partType, data}, index) =>
+ partType ? (
+ <Text
+ key={`${index}-${data?.trigger ?? 'pattern'}`}
+ style={partType.textStyle ?? defaultMentionTextStyle}>
+ {text}
+ </Text>
+ ) : (
+ <Text key={index}>{text}</Text>
+ ),
+ )}
</Text>
</TextInput>
- {validateInput(keyboardText) ? (partTypes
- .filter(one => (
- isMentionPartType(one)
- && one.renderSuggestions != null
- && one.isBottomMentionSuggestionsRender
- )) as MentionPartType[])
- .map(renderMentionSuggestions)
- : null
- }
+ {validateInput(keyboardText)
+ ? (partTypes.filter(
+ (one) =>
+ isMentionPartType(one) &&
+ one.renderSuggestions != null &&
+ one.isBottomMentionSuggestionsRender,
+ ) as MentionPartType[]).map(renderMentionSuggestions)
+ : null}
</View>
);
};
-export { MentionInputControlled }; \ No newline at end of file
+export {MentionInputControlled};