ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2024-12-15 00:23:34 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'upstream/development' into sa/sync-tokens-meta

Browse Source
This commit is contained in:
Nouman Tahir 2023-01-24 19:37:10 +05:00
commit 4543c36af1
5 changed files with 159 additions and 157 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/editorElements/selectCommunityModal/container/selectCommunityModalContainer.js
View File

@ -30,7 +30,7 @@ const SelectCommunityModalContainer = ({ onPressCommunity, currentAccount, onClo
callSubscribedCommunities();
}, []);
const callTopCommunities = () => dispatch(fetchCommunities('', 15, '', 'rank'));
const callTopCommunities = () => dispatch(fetchCommunities('', 15, null, 'rank'));
const callSubscribedCommunities = () => {
if (

115
src/components/editorElements/selectCommunityModal/view/selectCommunityModalView.js
View File

@ -1,115 +0,0 @@
import React from 'react';
import { View, Text, ScrollView, FlatList, Platform } from 'react-native';
import { injectIntl } from 'react-intl';
import CommunityCard from '../../../communityCard';
import { SearchInput } from '../../../searchInput';
import { Separator } from '../../../basicUIElements';
import globalStyles from '../../../../globalStyles';
import styles from './selectCommunityModalStyles';
const SelectCommunityModalView = ({
topCommunities,
subscribedCommunities,
onPressCommunity,
onChangeSearch,
onPressCloseForSearch,
searchedCommunities,
showSearchedCommunities,
currentAccount,
onCloseModal,
intl,
}) => {
return (
<ScrollView style={{ flex: 1 }} showsVerticalScrollIndicator={false}>
<SearchInput
style={Platform.OS === 'android' && styles.searchInput}
onChangeText={onChangeSearch}
placeholder="search"
autoFocus={false}
backEnabled={true}
onBackPress={onCloseModal}
/>
{showSearchedCommunities ? (
<FlatList
ItemSeparatorComponent={() => <Separator />}
showsVerticalScrollIndicator={false}
style={styles.searchedFlatList}
data={searchedCommunities}
keyExtractor={(item, index) => index.toString()}
renderItem={({ item, index, separators }) => (
<CommunityCard
community={item}
key={index.toString()}
onPress={onPressCommunity}
separators={separators}
/>
)}
/>
) : (
<>
<Text style={[globalStyles.label, styles.title]}>
{intl.formatMessage({ id: 'editor.my_blog' }).toUpperCase()}
</Text>
<CommunityCard
community={{
name: currentAccount.name,
title: intl.formatMessage({ id: 'editor.my_blog' }),
}}
onPress={() => onPressCommunity(null)}
/>
{subscribedCommunities && (
<View>
<Text style={[globalStyles.label, styles.title]}>
{intl.formatMessage({ id: 'editor.my_communities' }).toUpperCase()}
</Text>
<FlatList
ItemSeparatorComponent={() => <Separator />}
showsVerticalScrollIndicator={false}
data={subscribedCommunities}
keyExtractor={(item, index) => index.toString()}
renderItem={({ item, index, separators }) => {
const community = { name: item[0], title: item[1] };
return (
<CommunityCard
community={community}
key={community.name}
onPress={onPressCommunity}
separators={separators}
/>
);
}}
/>
</View>
)}
{!topCommunities.loading && !topCommunities.error && topCommunities.data?.length > 0 && (
<View>
<Text style={[globalStyles.label, styles.title]}>
{intl.formatMessage({ id: 'editor.top_communities' }).toUpperCase()}
</Text>
<FlatList
ItemSeparatorComponent={() => <Separator />}
showsVerticalScrollIndicator={false}
data={topCommunities.data}
keyExtractor={(item, index) => index.toString()}
renderItem={({ item, index, separators }) => (
<CommunityCard
community={item}
key={item.name}
onPress={onPressCommunity}
separators={separators}
/>
)}
/>
</View>
)}
</>
)}
<View style={{ height: 40 }} />
</ScrollView>
);
};
export default injectIntl(SelectCommunityModalView);

120
src/components/editorElements/selectCommunityModal/view/selectCommunityModalView.tsx Normal file
View File

@ -0,0 +1,120 @@
import React, { useState } from 'react';
import { Text, Platform, SectionList } from 'react-native';
import { injectIntl } from 'react-intl';
import CommunityCard from '../../../communityCard';
import { SearchInput } from '../../../searchInput';
import { Separator } from '../../../basicUIElements';
import globalStyles from '../../../../globalStyles';
import styles from './selectCommunityModalStyles';
import { useEffect } from 'react';
const SelectCommunityModalView = ({
topCommunities,
subscribedCommunities,
onPressCommunity,
onChangeSearch,
onPressCloseForSearch,
searchedCommunities,
showSearchedCommunities,
currentAccount,
onCloseModal,
intl,
}) => {
const [sections, setSections] = useState<any[]>([]);
useEffect(()=>{
const _sections:any[] = [];
if (showSearchedCommunities) {
_sections.push({
data:searchedCommunities
})
} else {
if (subscribedCommunities) {
_sections.push({
sectionTitle: intl.formatMessage({ id: 'editor.my_communities' }).toUpperCase(),
data: subscribedCommunities.map((item) => ({ name: item[0], title: item[1] }))
})
}
if (!topCommunities.isLoading && !topCommunities.error && topCommunities.data?.length > 0) {
_sections.push({
sectionTitle: intl.formatMessage({ id: 'editor.top_communities' }).toUpperCase(),
data: topCommunities.data
})
}
}
setSections(_sections);
}, [showSearchedCommunities, subscribedCommunities, topCommunities, searchedCommunities])
const _listHeader = (
<>
<SearchInput
style={Platform.OS === 'android' && styles.searchInput}
onChangeText={onChangeSearch}
placeholder="search"
autoFocus={false}
backEnabled={true}
onBackPress={onCloseModal}
/>
{
!showSearchedCommunities && (
<>
<Text style={[globalStyles.label, styles.title]}>
{intl.formatMessage({ id: 'editor.my_blog' }).toUpperCase()}
</Text>
<CommunityCard
community={{
name: currentAccount.name,
title: intl.formatMessage({ id: 'editor.my_blog' }),
}}
onPress={() => onPressCommunity(null)}
/>
</>
)
}
</>
)
const _renderSectionHeader = ({ section }) => (
<Text style={[globalStyles.label, styles.title]}>
{section.sectionTitle}
</Text>
)
const _renderItem = ({ item, index, separators }) => (
<CommunityCard
community={item}
key={index.toString()}
onPress={onPressCommunity}
separators={separators}
/>
)
return (
<SectionList
style={{ flex: 1 }}
stickySectionHeadersEnabled={false}
sections={sections}
ItemSeparatorComponent={() => <Separator />}
ListHeaderComponent={_listHeader}
renderSectionHeader={_renderSectionHeader}
renderItem={_renderItem}
keyExtractor={(item, index) => index.toString()}
showsVerticalScrollIndicator={false} />
);
};
export default injectIntl(SelectCommunityModalView);

8
src/components/editorElements/tagInput/view/tagInputView.tsx
View File

@ -30,11 +30,9 @@ const TagInput = ({ value, handleTagChanged, intl, isPreviewActive, autoFocus, s
useEffect(() => {
// read and add tag items
if (typeof value === 'string') {
setTags(value.split(' '));
} else {
setTags(value);
}
const _tags = typeof value === 'string' ? value.split(' ') : value;
setTags(_tags.filter(t=>!!t));
}, [value]);
const _verifyTagsUpdate = (tags: string[]) => {

71
src/components/markdownEditor/view/markdownEditorView.tsx
View File

@ -40,7 +40,7 @@ import applySnippet from '../children/formats/applySnippet';
import { MainButton } from '../../mainButton';
import isAndroidOreo from '../../../utils/isAndroidOreo';
import { OptionsModal } from '../../atoms';
import { UsernameAutofillBar } from '../children/usernameAutofillBar';
// import { UsernameAutofillBar } from '../children/usernameAutofillBar';
import applyUsername from '../children/formats/applyUsername';
import { walkthrough } from '../../../redux/constants/walkthroughConstants';
import { MediaInsertData } from '../../uploadsGalleryModal/container/uploadsGalleryModal';
@ -50,10 +50,6 @@ import { useAppSelector } from '../../../hooks';
// const MIN_BODY_INPUT_HEIGHT = 300;
// These variable keep track of body text input state,
// this helps keep load on minimal compared to both useState and useRef;
let bodyText = '';
let bodySelection = { start: 0, end: 0 };
const MarkdownEditorView = ({
paramFiles,
@ -87,12 +83,14 @@ const MarkdownEditorView = ({
const [showDraftLoadButton, setShowDraftLoadButton] = useState(false);
const [isEditing, setIsEditing] = useState(false);
const [insertedMediaUrls, setInsertedMediaUrls] = useState([]);
const [isDraftUpdated, setIsDraftupdated] = useState(false);
// const [isDraftUpdated, setIsDraftupdated] = useState(false);
const inputRef = useRef<any>(null);
const clearRef = useRef<any>(null);
const insertLinkModalRef = useRef<any>(null);
const tooltipRef = useRef<any>(null);
const bodyTextRef = useRef('');
const bodySelectionRef = useRef({ start: 0, end: 0 })
const isVisibleAccountsBottomSheet = useSelector(
(state) => state.ui.isVisibleAccountsBottomSheet,
@ -102,13 +100,13 @@ const MarkdownEditorView = ({
const headerText = post && (post.summary || postBodySummary(post, 150, Platform.OS));
useEffect(() => {
bodyText = '';
bodySelection = { start: 0, end: 0 };
bodyTextRef.current = '';
bodySelectionRef.current = { start: 0, end: 0 };
}, []);
useEffect(() => {
if (!isPreviewActive) {
_setTextAndSelection({ selection: bodySelection, text: bodyText });
_setTextAndSelection({ selection: bodySelectionRef.current, text: bodyTextRef.current });
}
}, [isPreviewActive]);
@ -124,7 +122,7 @@ const MarkdownEditorView = ({
}, [onLoadDraftPress]);
useEffect(() => {
if (bodyText === '' && draftBody !== '') {
if (bodyTextRef.current === '' && draftBody !== '') {
const draftBodyLength = draftBody.length;
_setTextAndSelection({
selection: { start: draftBodyLength, end: draftBodyLength },
@ -166,7 +164,7 @@ const MarkdownEditorView = ({
}, [isLoading]);
useEffect(() => {
bodyText = draftBody;
bodyTextRef.current = draftBody;
}, [draftBody]);
useEffect(() => {
@ -184,8 +182,8 @@ const MarkdownEditorView = ({
const _onApplyUsername = (username) => {
applyUsername({
text: bodyText,
selection: bodySelection,
text: bodyTextRef.current,
selection: bodySelectionRef.current,
setTextAndSelection: _setTextAndSelection,
username,
});
@ -195,9 +193,9 @@ const MarkdownEditorView = ({
debounce(() => {
console.log('setting is editing to', false);
setIsEditing(false);
handleBodyChange(bodyText);
handleFormUpdate('body', bodyText);
const urls = extractImageUrls({ body: bodyText });
handleBodyChange(bodyTextRef.current);
handleFormUpdate('body', bodyTextRef.current);
const urls = extractImageUrls({ body: bodyTextRef.current });
if (urls.length !== insertedMediaUrls.length) {
setInsertedMediaUrls(urls);
}
@ -209,13 +207,14 @@ const MarkdownEditorView = ({
const _changeText = useCallback(
(input) => {
// check if draft is just loaded or is updated. Fix for username bar auto loading when draft ends with a username
if (draftBody && !isDraftUpdated && draftBody !== input) {
setIsDraftupdated(true);
}
bodyText = input;
// if (draftBody && !isDraftUpdated && draftBody !== input) {
// console.log("Updating draft state")
// setIsDraftupdated(true);
// }
bodyTextRef.current = input;
if (!isEditing) {
console.log('force setting is editing to true', true);
console.log('force setting isEditing to true', true);
setIsEditing(true);
}
@ -225,7 +224,7 @@ const MarkdownEditorView = ({
);
const _handleOnSelectionChange = async (event) => {
bodySelection = event.nativeEvent.selection;
bodySelectionRef.current = event.nativeEvent.selection;
};
// eslint-disable-next-line react-hooks/exhaustive-deps
@ -236,7 +235,7 @@ const MarkdownEditorView = ({
});
const _updateSelection = () => {
bodySelection = _selection;
bodySelectionRef.current = _selection;
inputRef?.current?.setNativeProps({
selection: _selection,
});
@ -260,8 +259,8 @@ const MarkdownEditorView = ({
const _renderPreview = () => (
<ScrollView style={styles.previewContainer}>
{bodyText ? (
<PostBody body={renderPostBody(bodyText, true, Platform.OS !== 'ios')} />
{bodyTextRef.current ? (
<PostBody body={renderPostBody(bodyTextRef.current, true, Platform.OS !== 'ios')} />
) : (
<Text>...</Text>
)}
@ -270,8 +269,8 @@ const MarkdownEditorView = ({
const _handleOnSnippetReceived = (snippetText) => {
applySnippet({
text: bodyText,
selection: bodySelection,
text: bodyTextRef.current,
selection: bodySelectionRef.current,
setTextAndSelection: _setTextAndSelection,
snippetText: `\n${snippetText}\n`,
});
@ -281,8 +280,8 @@ const MarkdownEditorView = ({
const _handleMediaInsert = (mediaArray: MediaInsertData[]) => {
if (mediaArray.length) {
applyMediaLink({
text: bodyText,
selection: bodySelection,
text: bodyTextRef.current,
selection: bodySelectionRef.current,
setTextAndSelection: _setTextAndSelection,
items: mediaArray,
});
@ -291,8 +290,8 @@ const MarkdownEditorView = ({
const _handleOnAddLinkPress = () => {
insertLinkModalRef.current?.showModal({
selectedText: bodyText.slice(bodySelection.start, bodySelection.end),
selection: bodySelection,
selectedText: bodyTextRef.current.slice(bodySelectionRef.current.start, bodySelectionRef.current.end),
selection: bodySelectionRef.current,
});
inputRef?.current?.blur();
};
@ -303,7 +302,7 @@ const MarkdownEditorView = ({
const _handleInsertLink = ({ snippetText, selection }) => {
applySnippet({
text: bodyText,
text: bodyTextRef.current,
selection,
setTextAndSelection: _setTextAndSelection,
snippetText,
@ -427,13 +426,13 @@ const MarkdownEditorView = ({
const _innerContent = (
<>
{isAndroidOreo() ? _editorWithoutScroll : _editorWithScroll}
{isDraftUpdated && (
{/* {isDraftUpdated && (
<UsernameAutofillBar
text={bodyText}
selection={bodySelection}
onApplyUsername={_onApplyUsername}
/>
)}
)} */}
{_renderFloatingDraftButton()}
@ -448,8 +447,8 @@ const MarkdownEditorView = ({
handleOnClearPress={() => clearRef.current.show()}
handleOnMarkupButtonPress={(item) => {
item.onPress({
text: bodyText,
selection: bodySelection,
text: bodyTextRef.current,
selection: bodySelectionRef.current,
setTextAndSelection: _setTextAndSelection,
item,
});