From 038bc586e46382e8984f6fd2fcbabe16bb56f19b Mon Sep 17 00:00:00 2001 From: Sadaqat Ali <48380998+aliseyalvi@users.noreply.github.com> Date: Mon, 15 Apr 2024 17:16:24 +0500 Subject: [PATCH 01/11] * used BasicHeader instead of new SimpleHeader --- src/components/index.tsx | 2 -- src/components/simpleHeader/simpleHeader.tsx | 26 ------------------- .../simpleHeader/simpleHeaderStyles.ts | 26 ------------------- src/config/locales/en-US.json | 3 ++- .../profileEdit/screen/profileEditScreen.js | 5 ++-- 5 files changed, 4 insertions(+), 58 deletions(-) delete mode 100644 src/components/simpleHeader/simpleHeader.tsx delete mode 100644 src/components/simpleHeader/simpleHeaderStyles.ts diff --git a/src/components/index.tsx b/src/components/index.tsx index 28b90f7631..7c96b4e0a4 100644 --- a/src/components/index.tsx +++ b/src/components/index.tsx @@ -105,7 +105,6 @@ import TextBoxWithCopy from './textBoxWithCopy/textBoxWithCopy'; import WebViewModal from './webViewModal/webViewModal'; import OrDivider from './orDivider/orDividerView'; import PostTranslationModal from './post-translation-modal/postTranslationModal'; -import SimpleHeader from './simpleHeader/simpleHeader'; // Basic UI Elements import { @@ -258,5 +257,4 @@ export { WebViewModal, OrDivider, PostTranslationModal, - SimpleHeader, }; diff --git a/src/components/simpleHeader/simpleHeader.tsx b/src/components/simpleHeader/simpleHeader.tsx deleted file mode 100644 index ea8fdaa939..0000000000 --- a/src/components/simpleHeader/simpleHeader.tsx +++ /dev/null @@ -1,26 +0,0 @@ -import React from 'react'; -import { SafeAreaView, View } from 'react-native'; -import { IconButton } from '../index'; - -import styles from './simpleHeaderStyles'; - -const SimpleHeader = ({ onBackPress }: any) => { - return ( - - - - - - - - - - ); -}; - -export default SimpleHeader; diff --git a/src/components/simpleHeader/simpleHeaderStyles.ts b/src/components/simpleHeader/simpleHeaderStyles.ts deleted file mode 100644 index 9e63b056cb..0000000000 --- a/src/components/simpleHeader/simpleHeaderStyles.ts +++ /dev/null @@ -1,26 +0,0 @@ -import EStyleSheet from 'react-native-extended-stylesheet'; - -export default EStyleSheet.create({ - container: { - flex: 1, - flexDirection: 'column', - backgroundColor: '$primaryBackgroundColor', - }, - safeArea: { - backgroundColor: '$primaryBackgroundColor', - }, - headerRow: { - width: '$deviceWidth', - flexDirection: 'row', - justifyContent: 'space-between', - backgroundColor: '$primaryBackgroundColor', - paddingVertical: 8, - }, - backIconContainer: { - marginLeft: 20, - }, - backIcon: { - fontSize: 24, - color: '$iconColor', - }, -}); diff --git a/src/config/locales/en-US.json b/src/config/locales/en-US.json index 4691cc07dd..4528f27fd0 100644 --- a/src/config/locales/en-US.json +++ b/src/config/locales/en-US.json @@ -304,7 +304,8 @@ "display_name": "Display Name", "about": "About", "location": "Location", - "website": "Website" + "website": "Website", + "edit_profile": "Edit Profile" } }, "settings": { diff --git a/src/screens/profileEdit/screen/profileEditScreen.js b/src/screens/profileEdit/screen/profileEditScreen.js index 20eb5ce743..33f3803fe3 100644 --- a/src/screens/profileEdit/screen/profileEditScreen.js +++ b/src/screens/profileEdit/screen/profileEditScreen.js @@ -9,7 +9,7 @@ import { ProfileEditContainer } from '../../../containers'; import { AvatarHeader, ProfileEditForm } from '../../../components'; import { OptionsModal } from '../../../components/atoms'; import styles from './profileEditScreenStyles'; -import { SimpleHeader } from '../../../components/index'; +import { BasicHeader } from '../../../components/index'; class ProfileEditScreen extends PureComponent { /* Props @@ -57,10 +57,9 @@ class ProfileEditScreen extends PureComponent { isUploading, saveEnabled, handleOnSubmit, - navigation, }) => ( - navigation.goBack()} /> + Date: Tue, 16 Apr 2024 17:17:21 +0500 Subject: [PATCH 02/11] * added avatar change option in edit profile screen * fixed a bug while updating cover image --- .../avatarHeader/avatarHeaderStyles.js | 15 ++- .../avatarHeader/avatarHeaderView.js | 91 ++++++++----------- .../profileEditForm/profileEditFormStyles.ts | 9 +- .../profileEditForm/profileEditFormView.tsx | 61 +++++++------ src/config/locales/en-US.json | 4 +- src/containers/profileEditContainer.js | 8 ++ .../profileEdit/screen/profileEditScreen.js | 2 +- 7 files changed, 102 insertions(+), 88 deletions(-) diff --git a/src/components/avatarHeader/avatarHeaderStyles.js b/src/components/avatarHeader/avatarHeaderStyles.js index 9acafbef31..7ca5cdec56 100644 --- a/src/components/avatarHeader/avatarHeaderStyles.js +++ b/src/components/avatarHeader/avatarHeaderStyles.js @@ -1,21 +1,25 @@ import EStyleSheet from 'react-native-extended-stylesheet'; export default EStyleSheet.create({ + headerView: { + backgroundColor: '$primaryBackgroundColor', + }, headerContainer: { flexDirection: 'row', paddingTop: 8, + paddingBottom: 8, paddingHorizontal: 24, - paddingBottom: 24, alignItems: 'center', + justifyContent: 'center', + backgroundColor: '$primaryBackgroundColor', }, backIcon: { color: '$white', }, wrapper: { - marginLeft: 16, - flexDirection: 'row', justifyContent: 'center', alignItems: 'center', + backgroundColor: '$primaryBackgroundColor', }, textWrapper: { marginLeft: 24, @@ -26,9 +30,10 @@ export default EStyleSheet.create({ fontWeight: 'bold', }, username: { - color: '$white', - fontSize: 12, marginTop: 4, + fontSize: 16, + color: '$primaryDarkText', + fontWeight: '600', }, addIcon: { color: '$white', diff --git a/src/components/avatarHeader/avatarHeaderView.js b/src/components/avatarHeader/avatarHeaderView.js index ddaed7708c..cfb1ce07e0 100644 --- a/src/components/avatarHeader/avatarHeaderView.js +++ b/src/components/avatarHeader/avatarHeaderView.js @@ -1,7 +1,5 @@ import React from 'react'; -import { View, Text, SafeAreaView, TouchableOpacity } from 'react-native'; -import { useNavigation } from '@react-navigation/native'; -import LinearGradient from 'react-native-linear-gradient'; +import { View, Text, TouchableOpacity } from 'react-native'; import { UserAvatar } from '../userAvatar'; import { IconButton } from '../iconButton'; @@ -9,55 +7,42 @@ import { IconButton } from '../iconButton'; // Styles import styles from './avatarHeaderStyles'; -const AvatarHeader = - ({ username, name, reputation, avatarUrl, showImageUploadActions, isUploading }) => - () => { - const navigation = useNavigation(); +const AvatarHeader = ({ + username, + name, + reputation, + avatarUrl, + showImageUploadActions, + isUploading, +}) => { + return ( + + + + + + - return ( - - - - - - - - - - - - {!!name && {name}} - {`@${username} (${reputation})`} - - - - - - ); - }; + + {!!name && {name}} + {`@${username} (${reputation})`} + + + + ); +}; export default AvatarHeader; diff --git a/src/components/profileEditForm/profileEditFormStyles.ts b/src/components/profileEditForm/profileEditFormStyles.ts index a5a07c1c14..ba9aa22631 100644 --- a/src/components/profileEditForm/profileEditFormStyles.ts +++ b/src/components/profileEditForm/profileEditFormStyles.ts @@ -12,6 +12,13 @@ export default EStyleSheet.create({ height: 30, marginTop: 8, }, + imgLabel: { + marginTop: 8, + marginBottom: 8, + fontSize: 14, + color: '$primaryDarkText', + fontWeight: '500', + }, label: { marginTop: 8, fontSize: 14, @@ -19,7 +26,7 @@ export default EStyleSheet.create({ fontWeight: '500', }, formItem: { - marginBottom: 20, + marginBottom: 12, }, coverImg: { borderRadius: 5, diff --git a/src/components/profileEditForm/profileEditFormView.tsx b/src/components/profileEditForm/profileEditFormView.tsx index 0876cb4856..a711dd8951 100644 --- a/src/components/profileEditForm/profileEditFormView.tsx +++ b/src/components/profileEditForm/profileEditFormView.tsx @@ -55,35 +55,42 @@ const ProfileEditFormView = ({ contentContainerStyle={styles.contentContainer} enableOnAndroid={true} > - - - {isUploading && ( - + + {intl.formatMessage({ + id: 'profile.edit.cover_img', + })} + + + - )} - - - + {isUploading && ( + + )} + + + {formData.map((item) => ( diff --git a/src/config/locales/en-US.json b/src/config/locales/en-US.json index 4528f27fd0..13e27cd6b3 100644 --- a/src/config/locales/en-US.json +++ b/src/config/locales/en-US.json @@ -305,7 +305,9 @@ "about": "About", "location": "Location", "website": "Website", - "edit_profile": "Edit Profile" + "edit_profile": "Edit Profile", + "cover_img": "Cover Image", + "profile_img": "Profile Image" } }, "settings": { diff --git a/src/containers/profileEditContainer.js b/src/containers/profileEditContainer.js index 601f5dbfff..b94f8fa917 100644 --- a/src/containers/profileEditContainer.js +++ b/src/containers/profileEditContainer.js @@ -82,6 +82,14 @@ class ProfileEditContainer extends Component { .then((res) => { if (res.data && res.data.url) { this.setState({ [action]: res.data.url, isUploading: false, saveEnabled: true }); + } else if (res && res.url) { + this.setState({ [action]: res.url, isUploading: false, saveEnabled: true }); + } else { + throw Error( + intl.formatMessage({ + id: 'alert.unknow_error', + }), + ); } }) .catch((error) => { diff --git a/src/screens/profileEdit/screen/profileEditScreen.js b/src/screens/profileEdit/screen/profileEditScreen.js index 33f3803fe3..7ca73ed789 100644 --- a/src/screens/profileEdit/screen/profileEditScreen.js +++ b/src/screens/profileEdit/screen/profileEditScreen.js @@ -6,7 +6,7 @@ import get from 'lodash/get'; import { gestureHandlerRootHOC } from 'react-native-gesture-handler'; import { ProfileEditContainer } from '../../../containers'; -import { AvatarHeader, ProfileEditForm } from '../../../components'; +import { AvatarHeader, ProfileEditForm } from '../../../components/index'; import { OptionsModal } from '../../../components/atoms'; import styles from './profileEditScreenStyles'; import { BasicHeader } from '../../../components/index'; From 4ecf73a2eb332e5ee2ea6c39bb19d2cb998d26ce Mon Sep 17 00:00:00 2001 From: Sadaqat Ali <48380998+aliseyalvi@users.noreply.github.com> Date: Wed, 17 Apr 2024 08:43:20 +0500 Subject: [PATCH 03/11] changed AvatarHeader to EditAvatar --- src/components/avatarHeader/index.js | 3 --- .../avatarHeaderView.js => editAvatar/editAvatar.tsx} | 6 +++--- .../editAvatarStyles.ts} | 0 src/components/index.tsx | 4 ++-- src/screens/profileEdit/screen/profileEditScreen.js | 4 ++-- 5 files changed, 7 insertions(+), 10 deletions(-) delete mode 100644 src/components/avatarHeader/index.js rename src/components/{avatarHeader/avatarHeaderView.js => editAvatar/editAvatar.tsx} (92%) rename src/components/{avatarHeader/avatarHeaderStyles.js => editAvatar/editAvatarStyles.ts} (100%) diff --git a/src/components/avatarHeader/index.js b/src/components/avatarHeader/index.js deleted file mode 100644 index 6ea71cf706..0000000000 --- a/src/components/avatarHeader/index.js +++ /dev/null @@ -1,3 +0,0 @@ -import AvatarHeader from './avatarHeaderView'; - -export { AvatarHeader }; diff --git a/src/components/avatarHeader/avatarHeaderView.js b/src/components/editAvatar/editAvatar.tsx similarity index 92% rename from src/components/avatarHeader/avatarHeaderView.js rename to src/components/editAvatar/editAvatar.tsx index cfb1ce07e0..90779211a2 100644 --- a/src/components/avatarHeader/avatarHeaderView.js +++ b/src/components/editAvatar/editAvatar.tsx @@ -5,9 +5,9 @@ import { UserAvatar } from '../userAvatar'; import { IconButton } from '../iconButton'; // Styles -import styles from './avatarHeaderStyles'; +import styles from './editAvatarStyles'; -const AvatarHeader = ({ +const EditAvatar = ({ username, name, reputation, @@ -45,4 +45,4 @@ const AvatarHeader = ({ ); }; -export default AvatarHeader; +export default EditAvatar; diff --git a/src/components/avatarHeader/avatarHeaderStyles.js b/src/components/editAvatar/editAvatarStyles.ts similarity index 100% rename from src/components/avatarHeader/avatarHeaderStyles.js rename to src/components/editAvatar/editAvatarStyles.ts diff --git a/src/components/index.tsx b/src/components/index.tsx index 7c96b4e0a4..1b757c7d42 100644 --- a/src/components/index.tsx +++ b/src/components/index.tsx @@ -1,4 +1,4 @@ -import { AvatarHeader } from './avatarHeader'; +import EditAvatar from './editAvatar/editAvatar'; import { AccountsBottomSheet } from './accountsBottomSheet'; import { BasicHeader } from './basicHeader'; import { BoostIndicatorAnimation, PulseAnimation, SpinIndicator } from './animations'; @@ -132,7 +132,7 @@ import { } from './basicUIElements'; export { - AvatarHeader, + EditAvatar, AccountsBottomSheet, BasicHeader, BeneficiaryModal, diff --git a/src/screens/profileEdit/screen/profileEditScreen.js b/src/screens/profileEdit/screen/profileEditScreen.js index 7ca73ed789..ff9da3d213 100644 --- a/src/screens/profileEdit/screen/profileEditScreen.js +++ b/src/screens/profileEdit/screen/profileEditScreen.js @@ -6,7 +6,7 @@ import get from 'lodash/get'; import { gestureHandlerRootHOC } from 'react-native-gesture-handler'; import { ProfileEditContainer } from '../../../containers'; -import { AvatarHeader, ProfileEditForm } from '../../../components/index'; +import { EditAvatar, ProfileEditForm } from '../../../components/index'; import { OptionsModal } from '../../../components/atoms'; import styles from './profileEditScreenStyles'; import { BasicHeader } from '../../../components/index'; @@ -60,7 +60,7 @@ class ProfileEditScreen extends PureComponent { }) => ( - Date: Wed, 17 Apr 2024 09:01:30 +0500 Subject: [PATCH 04/11] increased editAvatar size --- src/components/editAvatar/editAvatar.tsx | 8 ++++---- src/components/editAvatar/editAvatarStyles.ts | 10 +++++----- .../profileEditForm/profileEditFormStyles.ts | 8 ++++---- src/components/profileEditForm/profileEditFormView.tsx | 7 +++---- src/components/userAvatar/view/userAvatarView.tsx | 5 ++++- 5 files changed, 20 insertions(+), 18 deletions(-) diff --git a/src/components/editAvatar/editAvatar.tsx b/src/components/editAvatar/editAvatar.tsx index 90779211a2..30c2b302ec 100644 --- a/src/components/editAvatar/editAvatar.tsx +++ b/src/components/editAvatar/editAvatar.tsx @@ -22,7 +22,7 @@ const EditAvatar = ({ diff --git a/src/components/editAvatar/editAvatarStyles.ts b/src/components/editAvatar/editAvatarStyles.ts index 7ca5cdec56..9c2b46c280 100644 --- a/src/components/editAvatar/editAvatarStyles.ts +++ b/src/components/editAvatar/editAvatarStyles.ts @@ -40,14 +40,14 @@ export default EStyleSheet.create({ textAlign: 'center', }, addButton: { - backgroundColor: '$iconColor', - width: 20, - height: 20, - borderRadius: 20 / 2, + backgroundColor: '$primaryBlue', + width: 25, + height: 25, + borderRadius: 25 / 2, borderColor: '$white', borderWidth: 1, position: 'absolute', bottom: 0, - left: 45, + left: 90, }, }); diff --git a/src/components/profileEditForm/profileEditFormStyles.ts b/src/components/profileEditForm/profileEditFormStyles.ts index ba9aa22631..f1a7c35b62 100644 --- a/src/components/profileEditForm/profileEditFormStyles.ts +++ b/src/components/profileEditForm/profileEditFormStyles.ts @@ -41,10 +41,10 @@ export default EStyleSheet.create({ textAlign: 'center', }, addButton: { - backgroundColor: '$iconColor', - width: 20, - height: 20, - borderRadius: 20 / 2, + backgroundColor: '$primaryBlue', + width: 25, + height: 25, + borderRadius: 25 / 2, borderColor: '$white', borderWidth: 1, position: 'absolute', diff --git a/src/components/profileEditForm/profileEditFormView.tsx b/src/components/profileEditForm/profileEditFormView.tsx index a711dd8951..bf7539168b 100644 --- a/src/components/profileEditForm/profileEditFormView.tsx +++ b/src/components/profileEditForm/profileEditFormView.tsx @@ -55,7 +55,6 @@ const ProfileEditFormView = ({ contentContainerStyle={styles.contentContainer} enableOnAndroid={true} > - {intl.formatMessage({ @@ -84,10 +83,10 @@ const ProfileEditFormView = ({ diff --git a/src/components/userAvatar/view/userAvatarView.tsx b/src/components/userAvatar/view/userAvatarView.tsx index 17b1955816..2ab0ac261e 100644 --- a/src/components/userAvatar/view/userAvatarView.tsx +++ b/src/components/userAvatar/view/userAvatarView.tsx @@ -24,7 +24,7 @@ import DEFAULT_IMAGE from '../../../assets/avatar_default.png'; interface UserAvatarProps { username: string; avatarUrl?: string; - size?: 'xl'; + size?: 'xl' | 'xxl'; style?: ViewStyle; disableSize?: boolean; noAction?: boolean; @@ -65,6 +65,9 @@ const UserAvatarView = ({ if (size === 'xl') { _size = 64; } + if (size === 'xxl') { + _size = 128; + } } return ( From d29c216bdc6cd7c352eb8b93c4a4716354f601b4 Mon Sep 17 00:00:00 2001 From: Sadaqat Ali <48380998+aliseyalvi@users.noreply.github.com> Date: Wed, 17 Apr 2024 16:53:08 +0500 Subject: [PATCH 05/11] changed default source to placeholder --- src/components/profileSummary/view/profileSummaryView.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/profileSummary/view/profileSummaryView.js b/src/components/profileSummary/view/profileSummaryView.js index 10c611229f..f5a6672ff8 100644 --- a/src/components/profileSummary/view/profileSummaryView.js +++ b/src/components/profileSummary/view/profileSummaryView.js @@ -188,7 +188,7 @@ class ProfileSummaryView extends PureComponent { style={styles.longImage} source={coverImageUrl} contentFit="cover" - defaultSource={isDarkTheme ? DARK_COVER_IMAGE : LIGHT_COVER_IMAGE} + placeholder={isDarkTheme ? DARK_COVER_IMAGE : LIGHT_COVER_IMAGE} /> From 80780e5cdb9d070058bf9e3d4d5ad3b582f2583b Mon Sep 17 00:00:00 2001 From: Sadaqat Ali <48380998+aliseyalvi@users.noreply.github.com> Date: Wed, 17 Apr 2024 17:06:46 +0500 Subject: [PATCH 06/11] * used reverse header instead of basic header * removed username and reputation --- src/components/editAvatar/editAvatar.tsx | 18 ++---------------- .../profileEdit/screen/profileEditScreen.js | 4 ++-- 2 files changed, 4 insertions(+), 18 deletions(-) diff --git a/src/components/editAvatar/editAvatar.tsx b/src/components/editAvatar/editAvatar.tsx index 30c2b302ec..3ac3d256d7 100644 --- a/src/components/editAvatar/editAvatar.tsx +++ b/src/components/editAvatar/editAvatar.tsx @@ -1,20 +1,11 @@ import React from 'react'; -import { View, Text, TouchableOpacity } from 'react-native'; - +import { View, TouchableOpacity } from 'react-native'; import { UserAvatar } from '../userAvatar'; import { IconButton } from '../iconButton'; - // Styles import styles from './editAvatarStyles'; -const EditAvatar = ({ - username, - name, - reputation, - avatarUrl, - showImageUploadActions, - isUploading, -}) => { +const EditAvatar = ({ username, avatarUrl, showImageUploadActions, isUploading }) => { return ( @@ -36,11 +27,6 @@ const EditAvatar = ({ size={18} /> - - - {!!name && {name}} - {`@${username} (${reputation})`} - ); diff --git a/src/screens/profileEdit/screen/profileEditScreen.js b/src/screens/profileEdit/screen/profileEditScreen.js index ff9da3d213..16b0a38dc0 100644 --- a/src/screens/profileEdit/screen/profileEditScreen.js +++ b/src/screens/profileEdit/screen/profileEditScreen.js @@ -6,7 +6,7 @@ import get from 'lodash/get'; import { gestureHandlerRootHOC } from 'react-native-gesture-handler'; import { ProfileEditContainer } from '../../../containers'; -import { EditAvatar, ProfileEditForm } from '../../../components/index'; +import { EditAvatar, Header, ProfileEditForm } from '../../../components/index'; import { OptionsModal } from '../../../components/atoms'; import styles from './profileEditScreenStyles'; import { BasicHeader } from '../../../components/index'; @@ -59,7 +59,7 @@ class ProfileEditScreen extends PureComponent { handleOnSubmit, }) => ( - +
Date: Wed, 17 Apr 2024 17:27:30 +0500 Subject: [PATCH 07/11] submit edit profile automatically after img upload --- src/containers/profileEditContainer.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/containers/profileEditContainer.js b/src/containers/profileEditContainer.js index b94f8fa917..e6073eb5c9 100644 --- a/src/containers/profileEditContainer.js +++ b/src/containers/profileEditContainer.js @@ -81,9 +81,15 @@ class ProfileEditContainer extends Component { uploadImage(media, currentAccount.name, sign) .then((res) => { if (res.data && res.data.url) { - this.setState({ [action]: res.data.url, isUploading: false, saveEnabled: true }); + this.setState({ [action]: res.data.url, isUploading: false }, () => { + // submit after img upload + this._handleOnSubmit(); + }); } else if (res && res.url) { - this.setState({ [action]: res.url, isUploading: false, saveEnabled: true }); + this.setState({ [action]: res.url, isUploading: false }, () => { + // submit after img upload + this._handleOnSubmit(); + }); } else { throw Error( intl.formatMessage({ From f5a01cba583ea8b6f06aca74db6dbeaa6d33133e Mon Sep 17 00:00:00 2001 From: Sadaqat Ali <48380998+aliseyalvi@users.noreply.github.com> Date: Wed, 17 Apr 2024 17:46:29 +0500 Subject: [PATCH 08/11] fixed cover img cache not updating in profile screen --- src/components/profileSummary/view/profileSummaryStyles.js | 3 +-- src/components/profileSummary/view/profileSummaryView.js | 3 ++- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/profileSummary/view/profileSummaryStyles.js b/src/components/profileSummary/view/profileSummaryStyles.js index 999db83b7e..7c4281052a 100644 --- a/src/components/profileSummary/view/profileSummaryStyles.js +++ b/src/components/profileSummary/view/profileSummaryStyles.js @@ -11,12 +11,11 @@ export default EStyleSheet.create({ }, longImage: { borderRadius: 5, - height: 60, + height: 65, marginTop: 16, marginBottom: 12, alignSelf: 'stretch', maxWidth: '$deviceWidth - 24', - backgroundColor: '#296CC0', }, footer: { width: '$deviceWidth - 14', diff --git a/src/components/profileSummary/view/profileSummaryView.js b/src/components/profileSummary/view/profileSummaryView.js index f5a6672ff8..bd09d74328 100644 --- a/src/components/profileSummary/view/profileSummaryView.js +++ b/src/components/profileSummary/view/profileSummaryView.js @@ -148,7 +148,7 @@ class ProfileSummaryView extends PureComponent { ? require('../../../assets/dark_cover_image.png') : require('../../../assets/default_cover_image.png'); } else { - coverImageUrl = { uri: coverImageUrl }; + coverImageUrl = { uri: coverImageUrl, cacheKey: coverImageUrl + new Date() }; } // compile dropdown options @@ -185,6 +185,7 @@ class ProfileSummaryView extends PureComponent { )} Date: Thu, 18 Apr 2024 11:07:23 +0500 Subject: [PATCH 09/11] prevent back navigate after avatar and cover is updated --- src/components/profileEditForm/profileEditFormView.tsx | 4 ++-- src/containers/profileEditContainer.js | 10 ++++++---- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/src/components/profileEditForm/profileEditFormView.tsx b/src/components/profileEditForm/profileEditFormView.tsx index bf7539168b..61d5589654 100644 --- a/src/components/profileEditForm/profileEditFormView.tsx +++ b/src/components/profileEditForm/profileEditFormView.tsx @@ -25,7 +25,7 @@ interface ProfileEditFormProps { coverUrl: string; formData: any; handleOnItemChange: () => void; - handleOnSubmit: () => void; + handleOnSubmit: ({ goBack }: { goBack: boolean }) => void; intl: any; isDarkTheme: boolean; isLoading: boolean; @@ -116,7 +116,7 @@ const ProfileEditFormView = ({ handleOnSubmit({ goBack: true })} iconName="save" iconType="MaterialIcons" iconColor="white" diff --git a/src/containers/profileEditContainer.js b/src/containers/profileEditContainer.js index e6073eb5c9..d1fee50648 100644 --- a/src/containers/profileEditContainer.js +++ b/src/containers/profileEditContainer.js @@ -83,12 +83,12 @@ class ProfileEditContainer extends Component { if (res.data && res.data.url) { this.setState({ [action]: res.data.url, isUploading: false }, () => { // submit after img upload - this._handleOnSubmit(); + this._handleOnSubmit({ goBack: false }); }); } else if (res && res.url) { this.setState({ [action]: res.url, isUploading: false }, () => { // submit after img upload - this._handleOnSubmit(); + this._handleOnSubmit({ goBack: false }); }); } else { throw Error( @@ -158,7 +158,7 @@ class ProfileEditContainer extends Component { } }; - _handleOnSubmit = async () => { + _handleOnSubmit = async ({ goBack }) => { const { currentAccount, pinCode, dispatch, navigation, intl, route } = this.props; const { name, location, website, about, coverUrl, avatarUrl, pinned } = this.state; @@ -186,7 +186,9 @@ class ProfileEditContainer extends Component { dispatch(setAvatarCacheStamp(new Date().getTime())); this.setState({ isLoading: false }); route.params.fetchUser(); - navigation.goBack(); + if (!!goBack) { + navigation.goBack(); + } } catch (err) { Alert.alert( intl.formatMessage({ From 51a5116d4e2258f8f3f16dce774f7214904371d3 Mon Sep 17 00:00:00 2001 From: Sadaqat Ali <48380998+aliseyalvi@users.noreply.github.com> Date: Fri, 19 Apr 2024 19:12:59 +0500 Subject: [PATCH 10/11] use proxifyImageSrc for displaying cover img --- .../profileSummary/view/profileSummaryView.js | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/src/components/profileSummary/view/profileSummaryView.js b/src/components/profileSummary/view/profileSummaryView.js index bd09d74328..41016a8016 100644 --- a/src/components/profileSummary/view/profileSummaryView.js +++ b/src/components/profileSummary/view/profileSummaryView.js @@ -19,17 +19,14 @@ import DARK_COVER_IMAGE from '../../../assets/dark_cover_image.png'; // Components import { TextWithIcon } from '../../basicUIElements'; import { PercentBar } from '../../percentBar'; -import { IconButton } from '../../iconButton'; import { DropdownButton } from '../../dropdownButton'; // Utils import { makeCountFriendly } from '../../../utils/formatter'; -import { getCoverImageUrl } from '../../../utils/image'; +import { proxifyImageSrc } from '@ecency/render-helper'; // Styles import styles from './profileSummaryStyles'; -import { TextButton } from '../../buttons'; -import { Icon } from '../..'; import getWindowDimensions from '../../../utils/getWindowDimensions'; const DEVICE_WIDTH = getWindowDimensions().width; @@ -127,6 +124,7 @@ class ProfileSummaryView extends PureComponent { const rcPowerText = `Resource Credits: ${percentRC}% ${rcPowerHoursText || ''}`; const link = get(about, 'website', ''); const location = get(about, 'location', ''); + const coverImage = get(about, 'cover_image', ''); const ABOUT_DATA = [ { id: 1, text: date, icon: 'calendar' }, @@ -141,14 +139,19 @@ class ProfileSummaryView extends PureComponent { const followButtonText = intl.formatMessage({ id: !isFollowing ? 'user.follow' : 'user.unfollow', }); - let coverImageUrl = getCoverImageUrl(username); + let coverImageUrl = proxifyImageSrc( + coverImage, + 360, + 240, + Platform.OS !== 'ios' ? 'webp' : 'match', + ); if (!coverImageUrl) { coverImageUrl = isDarkTheme ? require('../../../assets/dark_cover_image.png') : require('../../../assets/default_cover_image.png'); } else { - coverImageUrl = { uri: coverImageUrl, cacheKey: coverImageUrl + new Date() }; + coverImageUrl = { uri: coverImageUrl }; } // compile dropdown options @@ -185,7 +188,7 @@ class ProfileSummaryView extends PureComponent { )} Date: Fri, 19 Apr 2024 19:25:25 +0500 Subject: [PATCH 11/11] * changed edit icon color to white * show loader on edit icon instead of img * increased size of edit icon --- src/components/editAvatar/editAvatar.tsx | 5 +++-- src/components/editAvatar/editAvatarStyles.ts | 8 ++++---- .../profileEditForm/profileEditFormStyles.ts | 8 ++++---- .../profileEditForm/profileEditFormView.tsx | 16 +++++++--------- 4 files changed, 18 insertions(+), 19 deletions(-) diff --git a/src/components/editAvatar/editAvatar.tsx b/src/components/editAvatar/editAvatar.tsx index 3ac3d256d7..934c4b5bd9 100644 --- a/src/components/editAvatar/editAvatar.tsx +++ b/src/components/editAvatar/editAvatar.tsx @@ -9,16 +9,17 @@ const EditAvatar = ({ username, avatarUrl, showImageUploadActions, isUploading } return ( - + - + - {isUploading && ( - - )} -