From bc78cef9f66c7d27ad3dac785cd67af9e181927e Mon Sep 17 00:00:00 2001 From: Nastassia Danilova <nastassia.danilova@epicmax.co> Date: Tue, 25 Aug 2020 15:18:19 +0300 Subject: [PATCH 1/3] add checkboxes to user settings --- src/components/settings/profile_settings.tsx | 66 +++++++++++++------- src/components/settings/settings.tsx | 25 ++++++-- src/entities/account.tsx | 10 ++- src/index.tsx | 4 -- 4 files changed, 73 insertions(+), 32 deletions(-) diff --git a/src/components/settings/profile_settings.tsx b/src/components/settings/profile_settings.tsx index 4b23c48..cd0f590 100644 --- a/src/components/settings/profile_settings.tsx +++ b/src/components/settings/profile_settings.tsx @@ -9,6 +9,7 @@ import { oauthThunks } from '../../thunks/oauth' import Icons from '../common/icons/icons' import { withRouter } from 'react-router' import Account from '../../entities/account' +import { Checkbox } from '../common/checkbox/checkbox' interface ProfileSettings { loadCurrentUser: Function, @@ -49,37 +50,40 @@ class ProfileSettingsComponent extends Component<ProfileSettings, ProfileSetting componentDidMount() { if (!this.state.formDataWasSet && this.props.currentUser) { - const { currentUser } = this.props - - this.setState({ - isLoading: false, - formData: { - display_name: currentUser.display_name || '', - note: currentUser.note || '' - }, - formDataWasSet: true - }) + this.preloadForm() } } componentDidUpdate(prevProps: ProfileSettings) { if (!this.state.formDataWasSet && this.props.currentUser) { - const { currentUser } = this.props + this.preloadForm() + } + } - this.setState({ - isLoading: false, - formData: { - display_name: currentUser.display_name || '', - note: currentUser.note || '' - }, - formDataWasSet: true - }) + preloadForm = () => { + const { currentUser: { display_name, note, pleroma } } = this.props + const newFormData = { + display_name: display_name || '', + note: note || '', + hide_followers: pleroma ? pleroma.hide_followers : false, + hide_followers_count: pleroma ? pleroma.hide_followers_count : false, + hide_follows: pleroma ? pleroma.hide_follows : false, + hide_follows_count: pleroma ? pleroma.hide_follows_count : false } + + this.setState({ + isLoading: false, + formData: { ...newFormData }, + formDataWasSet: true + }) } - onInputChange = (e: any, field: string) => { + onInputChange = (e: any, field: string, type?: string) => { this.setState({ - formData: { ...this.state.formData, [field]: e.target.value }, + formData: { + ...this.state.formData, + [field]: type === 'checkbox' ? e.detail.checked : e.target.value + } }) } @@ -165,6 +169,26 @@ class ProfileSettingsComponent extends Component<ProfileSettings, ProfileSetting value={formData.note} onChange={(e: any) => this.onInputChange(e, 'note')} /> + <Checkbox + value={formData.hide_followers} + label="hide_followers" + onChange={(e: any) => this.onInputChange(e, 'hide_followers', 'checkbox')} + /> + <Checkbox + value={formData.hide_followers_count} + label="hide_followers_count" + onChange={(e: any) => this.onInputChange(e, 'hide_followers_count', 'checkbox')} + /> + <Checkbox + value={formData.hide_follows} + label="hide_follows" + onChange={(e: any) => this.onInputChange(e, 'hide_follows', 'checkbox')} + /> + <Checkbox + value={formData.hide_follows_count} + label="hide_follows_count" + onChange={(e: any) => this.onInputChange(e, 'hide_follows_count', 'checkbox')} + /> <button disabled={isLoading} className='button-primary rounded-lg py-2 px-4 mt-4 font-bold text-sm focus:outline-none leading-tight'> diff --git a/src/components/settings/settings.tsx b/src/components/settings/settings.tsx index 149afdc..ac1ffea 100644 --- a/src/components/settings/settings.tsx +++ b/src/components/settings/settings.tsx @@ -1,4 +1,4 @@ -import React, { ReactElement } from 'react' +import React, { ReactElement, useState, useEffect } from 'react' import { IonPage, IonContent } from '@ionic/react' import { FormattedMessage } from 'react-intl' import { NavLink } from 'react-router-dom' @@ -8,9 +8,19 @@ import { Logout } from '../logout/logout' import Icons from '../common/icons/icons' import Account from '../../entities/account' import { Version } from '../version/version' +import { oauthThunks } from '../../thunks/oauth' -export const SettingsComponent = ({ children, currentUser }: { children: ReactElement, currentUser: Account }) => ( - <IonPage className='page-margin px-6 md:pl-0 md:pr-4'> +export const SettingsComponent = ({ children, currentUser, updateCurrentUser }: { children: ReactElement, currentUser: Account, updateCurrentUser: Function }) => { + const [userDataWasFetched, switchFetchedFlag] = useState(false); + + useEffect(() => { + if (!userDataWasFetched) { + switchFetchedFlag(true) + updateCurrentUser() + } + }, [switchFetchedFlag, updateCurrentUser, userDataWasFetched]) + + return (<IonPage className='page-margin px-6 md:pl-0 md:pr-4'> <div style={{height: 'calc(100% - 4rem)'}}> <span className='px-6 cursor-pointer text-3xl leading-normal capitalize mb-8 text'> <FormattedMessage defaultMessage='Settings' id='settings' /> @@ -35,10 +45,13 @@ export const SettingsComponent = ({ children, currentUser }: { children: ReactEl </div> </div> </div> - </IonPage> -) + </IonPage>) +} const mapStateToProps = (state: any) => ({ currentUser: state.users.currentUser, }) -export const Settings = connect(mapStateToProps)(SettingsComponent) +const mapDispatchToProps = (dispatch: Function) => ({ + updateCurrentUser: () => dispatch(oauthThunks.updateCurrentUser()) +}) +export const Settings = connect(mapStateToProps, mapDispatchToProps)(SettingsComponent) diff --git a/src/entities/account.tsx b/src/entities/account.tsx index 666004f..8604e0d 100644 --- a/src/entities/account.tsx +++ b/src/entities/account.tsx @@ -19,9 +19,17 @@ export default class Account { pleroma?: { unread_conversation_count: number unread_notifications_count: number + hide_followers: boolean + hide_followers_count: boolean + hide_follows: boolean + hide_follows_count: boolean } = { unread_conversation_count: 0, - unread_notifications_count: 0 + unread_notifications_count: 0, + hide_followers: false, + hide_followers_count: false, + hide_follows: false, + hide_follows_count: false } constructor (data?: Partial<Account>) { diff --git a/src/index.tsx b/src/index.tsx index d6d4015..a8d75ba 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -92,10 +92,6 @@ const load = async () => { const version = process.env.REACT_APP_VERSION window.VERSION = version ? version.substr(0, 8) : '' - // TODO: check, if we really need all these global variables - window.store = store - window.reducer = reducer - window.pleroma = pleroma mount = ReactDOM.render( <Provider store={store}> -- GitLab From 266a047efe73180f632313eb4badaa721e563f60 Mon Sep 17 00:00:00 2001 From: Nastassia Danilova <nastassia.danilova@epicmax.co> Date: Tue, 25 Aug 2020 16:17:05 +0300 Subject: [PATCH 2/3] labels and translations --- src/components/settings/profile_settings.tsx | 40 +++++++++++++------- src/i18n/en.json | 4 ++ src/i18n/ru.json | 4 ++ 3 files changed, 34 insertions(+), 14 deletions(-) diff --git a/src/components/settings/profile_settings.tsx b/src/components/settings/profile_settings.tsx index cd0f590..934e587 100644 --- a/src/components/settings/profile_settings.tsx +++ b/src/components/settings/profile_settings.tsx @@ -127,6 +127,18 @@ class ProfileSettingsComponent extends Component<ProfileSettings, ProfileSetting this.setState({ isLoading: false }) } + renderInputLabel = (field: string, defaultMessage: string, floating?: boolean) => ( + <IonLabel + className={floating ? '' : 'text'} + position={floating ? 'floating' : undefined } + > + <FormattedMessage + id={`settings.editProfile.${field}`} + defaultMessage={defaultMessage} + /> + </IonLabel> + ) + render() { const { isLoading, formData, previewAvatar, previewHeader } = this.state const { currentUser, className } = this.props @@ -160,35 +172,35 @@ class ProfileSettingsComponent extends Component<ProfileSettings, ProfileSetting </div> </div> <Input - label={<IonLabel position='floating'><FormattedMessage id='settings.editProfile.name' defaultMessage='Name' /></IonLabel>} + label={this.renderInputLabel('name', 'Name', true)} value={formData.display_name} onChange={(e: any) => this.onInputChange(e, 'display_name')} /> <Input - label={<IonLabel position='floating'><FormattedMessage id='settings.editProfile.bio' defaultMessage='Bio' /></IonLabel>} + label={this.renderInputLabel('bio', 'Bio', true)} value={formData.note} onChange={(e: any) => this.onInputChange(e, 'note')} /> - <Checkbox - value={formData.hide_followers} - label="hide_followers" - onChange={(e: any) => this.onInputChange(e, 'hide_followers', 'checkbox')} - /> - <Checkbox - value={formData.hide_followers_count} - label="hide_followers_count" - onChange={(e: any) => this.onInputChange(e, 'hide_followers_count', 'checkbox')} - /> <Checkbox value={formData.hide_follows} - label="hide_follows" + label={this.renderInputLabel('hide_follows', `Don't show who I'm following`)} onChange={(e: any) => this.onInputChange(e, 'hide_follows', 'checkbox')} /> <Checkbox value={formData.hide_follows_count} - label="hide_follows_count" + label={this.renderInputLabel('hide_follows_count', `Don't show follow count`)} onChange={(e: any) => this.onInputChange(e, 'hide_follows_count', 'checkbox')} /> + <Checkbox + value={formData.hide_followers} + label={this.renderInputLabel('hide_followers', `Don't show who's following me`)} + onChange={(e: any) => this.onInputChange(e, 'hide_followers', 'checkbox')} + /> + <Checkbox + value={formData.hide_followers_count} + label={this.renderInputLabel('hide_followers_count', `Don't show follower count`)} + onChange={(e: any) => this.onInputChange(e, 'hide_followers_count', 'checkbox')} + /> <button disabled={isLoading} className='button-primary rounded-lg py-2 px-4 mt-4 font-bold text-sm focus:outline-none leading-tight'> diff --git a/src/i18n/en.json b/src/i18n/en.json index d864ca9..bb7c56f 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -63,6 +63,10 @@ "settings.editProfile": "Edit profile", "settings.editProfile.name": "Name", "settings.editProfile.bio": "Bio", + "settings.editProfile.hide_follows": "Don't show who I'm following", + "settings.editProfile.hide_follows_count": "Don't show follow count", + "settings.editProfile.hide_followers": "Don't show who's following me", + "settings.editProfile.hide_followers_count": "Don't show follower count", "settings.timelineSettings": "Timeline settings", "settings.timeline.hideAttachments": "Hide attachments previews", "settings.timeline.streaming": "Enable automatic streaming of new posts when scrolled to the top", diff --git a/src/i18n/ru.json b/src/i18n/ru.json index 52bebad..e2461c3 100644 --- a/src/i18n/ru.json +++ b/src/i18n/ru.json @@ -63,6 +63,10 @@ "settings.editProfile": "Редактировать профиль", "settings.editProfile.name": "ИмÑ", "settings.editProfile.bio": "БиографиÑ", + "settings.editProfile.hide_follows": "Скрывать за кем Ñ Ñлежу", + "settings.editProfile.hide_follows_count": "Скрывать колличеÑтво читаемых пользователей", + "settings.editProfile.hide_followers": "Скрывать моих подпиÑчиков", + "settings.editProfile.hide_followers_count": "Скрывать количеÑтво моих подпиÑчиков", "settings.timelineSettings": "ÐаÑтройки ленты", "settings.timeline.hideAttachments": "ПрÑтать вложениÑ", "settings.timeline.streaming": "Включить автоматичеÑкую загрузку новых Ñообщений при прокрутке вверх", -- GitLab From ae66e2f506d83809e6b216460a599aef594de0de Mon Sep 17 00:00:00 2001 From: Nastassia Danilova <nastassia.danilova@epicmax.co> Date: Wed, 2 Sep 2020 16:31:10 +0300 Subject: [PATCH 3/3] pleroma-api version --- package-lock.json | 2 +- yarn.lock | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index c5d7342..f20b847 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10063,7 +10063,7 @@ } }, "pleroma-api": { - "version": "git+https://git.pleroma.social/pleroma/pleroma-api.git#410731454db16e28997cdda75ca91afe6d9f03be", + "version": "git+https://git.pleroma.social/pleroma/pleroma-api.git#5c9676517e313789c158afeb3270122c174e4e79", "from": "git+https://git.pleroma.social/pleroma/pleroma-api.git", "requires": { "cross-fetch": "^3.0.1", diff --git a/yarn.lock b/yarn.lock index 4c8e251..b181621 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8013,7 +8013,7 @@ pkg-up@2.0.0: "pleroma-api@git+https://git.pleroma.social/pleroma/pleroma-api.git": version "1.0.0" - resolved "git+https://git.pleroma.social/pleroma/pleroma-api.git#e526f19a6c557d0922a733108ab0a04a169f59a0" + resolved "git+https://git.pleroma.social/pleroma/pleroma-api.git#5c9676517e313789c158afeb3270122c174e4e79" dependencies: cross-fetch "^3.0.1" lodash-es "^4.17.11" -- GitLab