From 009813cbc40bfd186037ccb7f327225357ef34e9 Mon Sep 17 00:00:00 2001 From: muhamedsalih-tw <104364298+muhamedsalih-tw@users.noreply.github.com> Date: Mon, 21 Nov 2022 20:31:49 +0530 Subject: Fix for services self hosted url / Team Id / Include pre-releases not updating (#785) * fix: self hosted team/url options not working properly in edit service form * fix: Include pre-releases toggle not working --- .../settings/services/EditServiceForm.tsx | 12 +- src/components/ui/Tabs/TabItem.tsx | 20 +++- src/components/ui/Tabs/Tabs.js | 71 ----------- src/components/ui/Tabs/Tabs.tsx | 75 ++++++++++++ src/containers/settings/EditServiceScreen.tsx | 132 +++++++++------------ src/containers/settings/EditSettingsScreen.tsx | 1 + 6 files changed, 155 insertions(+), 156 deletions(-) delete mode 100644 src/components/ui/Tabs/Tabs.js create mode 100644 src/components/ui/Tabs/Tabs.tsx (limited to 'src') diff --git a/src/components/settings/services/EditServiceForm.tsx b/src/components/settings/services/EditServiceForm.tsx index b594fcd40..112e5a452 100644 --- a/src/components/settings/services/EditServiceForm.tsx +++ b/src/components/settings/services/EditServiceForm.tsx @@ -293,18 +293,14 @@ class EditServiceForm extends Component { {(recipe.hasTeamId || recipe.hasCustomUrl) && ( {recipe.hasHostedOption && ( - + {intl.formatMessage(messages.useHostedService, { name: recipe.name, })} )} {recipe.hasTeamId && ( - + { )} {recipe.hasCustomUrl && ( - + {form.error === 'url-validation-error' && (

diff --git a/src/components/ui/Tabs/TabItem.tsx b/src/components/ui/Tabs/TabItem.tsx index 631586d62..815dced8c 100644 --- a/src/components/ui/Tabs/TabItem.tsx +++ b/src/components/ui/Tabs/TabItem.tsx @@ -1 +1,19 @@ -export default ({ children }) => <>{children}; +import { Fragment, ReactElement } from 'react'; + +export interface IProps { + children: + | string + | ReactElement + | ( + | boolean + | ReactElement + | ReactElement + )[]; + title?: string; // it is used on Tabs.tsx +} + +function TabItem({ children, title = '' }: IProps): ReactElement { + return {children}; +} + +export default TabItem; diff --git a/src/components/ui/Tabs/Tabs.js b/src/components/ui/Tabs/Tabs.js deleted file mode 100644 index 5d2da6293..000000000 --- a/src/components/ui/Tabs/Tabs.js +++ /dev/null @@ -1,71 +0,0 @@ -import { Children, Component } from 'react'; -import PropTypes from 'prop-types'; -import { observer } from 'mobx-react'; -import classnames from 'classnames'; - -import { oneOrManyChildElements } from '../../../prop-types'; - -class Tab extends Component { - constructor(props) { - super(props); - this.state = { active: this.props.active }; - } - - static propTypes = { - children: oneOrManyChildElements.isRequired, - active: PropTypes.number, - }; - - static defaultProps = { - active: 0, - }; - - switchTab(index) { - this.setState({ active: index }); - } - - render() { - const { children: childElements } = this.props; - const children = childElements.filter(c => !!c); - - if (children.length === 1) { - return

{children}
; - } - - return ( -
-
- {Children.map(children, (child, i) => ( - - ))} -
-
- {Children.map(children, (child, i) => ( -
- {child} -
- ))} -
-
- ); - } -} - -export default observer(Tab); diff --git a/src/components/ui/Tabs/Tabs.tsx b/src/components/ui/Tabs/Tabs.tsx new file mode 100644 index 000000000..2c34d7e24 --- /dev/null +++ b/src/components/ui/Tabs/Tabs.tsx @@ -0,0 +1,75 @@ +import { Children, Component, ReactElement, ReactPortal } from 'react'; +import { observer } from 'mobx-react'; +import classnames from 'classnames'; +import { IProps as TabItemProps } from './TabItem'; + +interface IProps { + children: + | ReactElement + | (boolean | ReactElement)[]; + active?: number; +} + +interface IState { + active: number; +} + +@observer +class Tab extends Component { + constructor(props: IProps) { + super(props); + + this.state = { + active: this.props.active || 0, + }; + } + + switchTab(index: number): void { + this.setState({ active: index }); + } + + render(): ReactElement { + const { children: childElements } = this.props; + const children = Children.toArray(childElements); // removes all null values + + if (children.length === 1) { + return
{children}
; + } + + return ( +
+
+ {Children.map(children, (child, i) => ( + + ))} +
+
+ {Children.map(children, (child, i) => ( +
+ {child} +
+ ))} +
+
+ ); + } +} + +export default Tab; diff --git a/src/containers/settings/EditServiceScreen.tsx b/src/containers/settings/EditServiceScreen.tsx index 09dd19925..05375d352 100644 --- a/src/containers/settings/EditServiceScreen.tsx +++ b/src/containers/settings/EditServiceScreen.tsx @@ -288,27 +288,20 @@ class EditServiceScreen extends Component { }; if (recipe.hasTeamId) { - config.fields = { - ...config.fields, - - team: { - label: intl.formatMessage(messages.team), - placeholder: intl.formatMessage(messages.team), - value: service?.team, - validators: [required], - }, + config.fields.team = { + label: intl.formatMessage(messages.team), + placeholder: intl.formatMessage(messages.team), + value: service?.team, + validators: [required], }; } if (recipe.hasCustomUrl) { - config.fields = { - ...config.fields, - customUrl: { - label: intl.formatMessage(messages.customUrl), - placeholder: "'http://' or 'https://' or 'file:///'", - value: service?.customUrl || recipe.serviceURL, - validators: [required, url], - }, + config.fields.customUrl = { + label: intl.formatMessage(messages.customUrl), + placeholder: "'http://' or 'https://' or 'file:///'", + value: service?.customUrl || recipe.serviceURL, + validators: [required, url], }; } @@ -332,82 +325,71 @@ class EditServiceScreen extends Component { } if (recipe.hasIndirectMessages) { - config.fields = { - ...config.fields, - isIndirectMessageBadgeEnabled: { - label: intl.formatMessage(messages.indirectMessages), - value: service?.isIndirectMessageBadgeEnabled, - default: DEFAULT_SERVICE_SETTINGS.hasIndirectMessages, - type: 'checkbox', - }, + config.fields.isIndirectMessageBadgeEnabled = { + label: intl.formatMessage(messages.indirectMessages), + value: service?.isIndirectMessageBadgeEnabled, + default: DEFAULT_SERVICE_SETTINGS.hasIndirectMessages, + type: 'checkbox', }; } if (recipe.allowFavoritesDelineationInUnreadCount) { - config.fields = { - ...config.fields, - onlyShowFavoritesInUnreadCount: { - label: intl.formatMessage(messages.onlyShowFavoritesInUnreadCount), - value: service?.onlyShowFavoritesInUnreadCount, - default: DEFAULT_APP_SETTINGS.onlyShowFavoritesInUnreadCount, - type: 'checkbox', - }, + config.fields.onlyShowFavoritesInUnreadCount = { + label: intl.formatMessage(messages.onlyShowFavoritesInUnreadCount), + value: service?.onlyShowFavoritesInUnreadCount, + default: DEFAULT_APP_SETTINGS.onlyShowFavoritesInUnreadCount, + type: 'checkbox', }; } if (proxy.isEnabled) { - let serviceProxyConfig: IProxyConfig = {}; - if (service) { - serviceProxyConfig = stores.settings.proxy[service.id] || {}; - } - - config.fields = { - ...config.fields, - proxy: { - name: 'proxy', - label: 'proxy', - fields: { - isEnabled: { - label: intl.formatMessage(messages.enableProxy), - value: serviceProxyConfig.isEnabled, - default: DEFAULT_APP_SETTINGS.proxyFeatureEnabled, - type: 'checkbox', - }, - host: { - label: intl.formatMessage(messages.proxyHost), - value: serviceProxyConfig.host, - default: '', - }, - port: { - label: intl.formatMessage(messages.proxyPort), - value: serviceProxyConfig.port, - default: '', - }, - user: { - label: intl.formatMessage(messages.proxyUser), - value: serviceProxyConfig.user, - default: '', - }, - password: { - label: intl.formatMessage(messages.proxyPassword), - value: serviceProxyConfig.password, - default: '', - type: 'password', - }, + const serviceProxyConfig: IProxyConfig = service + ? stores.settings.proxy[service.id] + : {}; + + config.fields.proxy = { + name: 'proxy', + label: 'proxy', + fields: { + isEnabled: { + label: intl.formatMessage(messages.enableProxy), + value: serviceProxyConfig.isEnabled, + default: DEFAULT_APP_SETTINGS.proxyFeatureEnabled, + type: 'checkbox', + }, + host: { + label: intl.formatMessage(messages.proxyHost), + value: serviceProxyConfig.host, + default: '', + }, + port: { + label: intl.formatMessage(messages.proxyPort), + value: serviceProxyConfig.port, + default: '', + }, + user: { + label: intl.formatMessage(messages.proxyUser), + value: serviceProxyConfig.user, + default: '', + }, + password: { + label: intl.formatMessage(messages.proxyPassword), + value: serviceProxyConfig.password, + default: '', + type: 'password', }, }, }; } - // @ts-ignore: Remove this ignore once mobx-react-form v4 with typescript return new Form(config); } deleteService(): void { - const { deleteService } = this.props.actions.service; const { action } = this.props.params; if (action === 'edit') { + const { deleteService } = this.props.actions.service; const { activeSettings: service } = this.props.stores.services; deleteService({ serviceId: service?.id, @@ -437,8 +419,8 @@ class EditServiceScreen extends Component { } = this.props.stores; const { action } = this.props.params; - let recipe: null | IRecipe = null; - let service: null | Service = null; + let recipe: IRecipe | null = null; + let service: Service | null = null; let isLoading = false; if (action === 'add') { diff --git a/src/containers/settings/EditSettingsScreen.tsx b/src/containers/settings/EditSettingsScreen.tsx index f18eb24a7..2dbd8d2be 100644 --- a/src/containers/settings/EditSettingsScreen.tsx +++ b/src/containers/settings/EditSettingsScreen.tsx @@ -933,6 +933,7 @@ class EditSettingsScreen extends Component { label: intl.formatMessage(messages.beta), value: user.data.beta, default: DEFAULT_APP_SETTINGS.beta, + type: 'checkbox', }, automaticUpdates: { label: intl.formatMessage(messages.automaticUpdates), -- cgit v1.2.3-54-g00ecf