diff options
| author | Oskar Nyberg <oskar@mullvad.net> | 2022-07-15 17:02:32 +0200 |
|---|---|---|
| committer | Oskar Nyberg <oskar@mullvad.net> | 2022-07-22 14:36:04 +0200 |
| commit | 1f21fe2f1c0bacfe3a13d7f9e791efec307fe180 (patch) | |
| tree | bc387eb00026f4b3c45aa70a0139ceebd890f8a7 | |
| parent | d79cb0d9744d675b1815729269862c5a44f043d4 (diff) | |
| download | mullvadvpn-1f21fe2f1c0bacfe3a13d7f9e791efec307fe180.tar.xz mullvadvpn-1f21fe2f1c0bacfe3a13d7f9e791efec307fe180.zip | |
Remove Advanced Settings and Preferences
| -rw-r--r-- | gui/src/renderer/components/AdvancedSettings.tsx | 257 | ||||
| -rw-r--r-- | gui/src/renderer/components/AdvancedSettingsStyles.tsx | 20 | ||||
| -rw-r--r-- | gui/src/renderer/components/Preferences.tsx | 571 | ||||
| -rw-r--r-- | gui/src/renderer/components/PreferencesStyles.tsx | 24 | ||||
| -rw-r--r-- | gui/src/renderer/containers/AdvancedSettingsPage.tsx | 86 | ||||
| -rw-r--r-- | gui/src/renderer/containers/PreferencesPage.tsx | 65 |
6 files changed, 0 insertions, 1023 deletions
diff --git a/gui/src/renderer/components/AdvancedSettings.tsx b/gui/src/renderer/components/AdvancedSettings.tsx deleted file mode 100644 index b00fc77f4c..0000000000 --- a/gui/src/renderer/components/AdvancedSettings.tsx +++ /dev/null @@ -1,257 +0,0 @@ -import * as React from 'react'; -import { sprintf } from 'sprintf-js'; - -import { strings } from '../../config.json'; -import { TunnelProtocol } from '../../shared/daemon-rpc-types'; -import { messages } from '../../shared/gettext'; -import { - StyledNavigationScrollbars, - StyledSelectorForFooter, - StyledTunnelProtocolContainer, -} from './AdvancedSettingsStyles'; -import * as AppButton from './AppButton'; -import { AriaDescription, AriaInput, AriaInputGroup, AriaLabel } from './AriaGroup'; -import * as Cell from './cell'; -import { ISelectorItem } from './cell/Selector'; -import CustomDnsSettings from './CustomDnsSettings'; -import { BackAction } from './KeyboardNavigation'; -import { Layout, SettingsContainer } from './Layout'; -import { ModalAlert, ModalAlertType, ModalMessage } from './Modal'; -import { NavigationBar, NavigationContainer, NavigationItems, TitleBarItem } from './NavigationBar'; -import SettingsHeader, { HeaderTitle } from './SettingsHeader'; -import Switch from './Switch'; - -type OptionalTunnelProtocol = TunnelProtocol | undefined; - -interface IProps { - enableIpv6: boolean; - blockWhenDisconnected: boolean; - tunnelProtocol?: TunnelProtocol; - setEnableIpv6: (value: boolean) => void; - setBlockWhenDisconnected: (value: boolean) => void; - setTunnelProtocol: (value: OptionalTunnelProtocol) => void; - onViewWireguardSettings: () => void; - onViewOpenVpnSettings: () => void; - onViewSplitTunneling: () => void; - onClose: () => void; -} - -interface IState { - showConfirmBlockWhenDisconnectedAlert: boolean; -} - -export default class AdvancedSettings extends React.Component<IProps, IState> { - public state = { - showConfirmBlockWhenDisconnectedAlert: false, - }; - - private blockWhenDisconnectedRef = React.createRef<Switch>(); - - private tunnelProtocolItems: Array<ISelectorItem<OptionalTunnelProtocol>>; - - public constructor(props: IProps) { - super(props); - - this.tunnelProtocolItems = [ - { - label: messages.gettext('Automatic'), - value: undefined, - }, - { - label: strings.wireguard, - value: 'wireguard', - }, - { - label: strings.openvpn, - value: 'openvpn', - }, - ]; - } - - public render() { - return ( - <BackAction action={this.props.onClose}> - <Layout> - <SettingsContainer> - <NavigationContainer> - <NavigationBar> - <NavigationItems> - <TitleBarItem> - { - // TRANSLATORS: Title label in navigation bar - messages.pgettext('advanced-settings-nav', 'Advanced') - } - </TitleBarItem> - </NavigationItems> - </NavigationBar> - - <StyledNavigationScrollbars> - <SettingsHeader> - <HeaderTitle> - {messages.pgettext('advanced-settings-view', 'Advanced')} - </HeaderTitle> - </SettingsHeader> - - <AriaInputGroup> - <Cell.Container> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('advanced-settings-view', 'Enable IPv6')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch - isOn={this.props.enableIpv6} - onChange={this.props.setEnableIpv6} - /> - </AriaInput> - </Cell.Container> - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {messages.pgettext( - 'advanced-settings-view', - 'Enable IPv6 communication through the tunnel.', - )} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - </AriaInputGroup> - - <AriaInputGroup> - <Cell.Container> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('advanced-settings-view', 'Always require VPN')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch - ref={this.blockWhenDisconnectedRef} - isOn={this.props.blockWhenDisconnected} - onChange={this.setBlockWhenDisconnected} - /> - </AriaInput> - </Cell.Container> - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {messages.pgettext( - 'advanced-settings-view', - 'If you disconnect or quit the app, this setting will block your internet.', - )} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - </AriaInputGroup> - - {(window.env.platform === 'linux' || window.env.platform === 'win32') && ( - <Cell.CellButtonGroup> - <Cell.CellButton onClick={this.props.onViewSplitTunneling}> - <Cell.Label>{strings.splitTunneling}</Cell.Label> - <Cell.Icon height={12} width={7} source="icon-chevron" /> - </Cell.CellButton> - </Cell.CellButtonGroup> - )} - - <AriaInputGroup> - <StyledTunnelProtocolContainer> - <StyledSelectorForFooter - title={messages.pgettext('advanced-settings-view', 'Tunnel protocol')} - values={this.tunnelProtocolItems} - value={this.props.tunnelProtocol} - onSelect={this.onSelectTunnelProtocol} - /> - </StyledTunnelProtocolContainer> - </AriaInputGroup> - - <Cell.CellButtonGroup> - <Cell.CellButton - onClick={this.props.onViewWireguardSettings} - disabled={this.props.tunnelProtocol === 'openvpn'}> - <Cell.Label> - {sprintf( - // TRANSLATORS: %(wireguard)s will be replaced with the string "WireGuard" - messages.pgettext('advanced-settings-view', '%(wireguard)s settings'), - { wireguard: strings.wireguard }, - )} - </Cell.Label> - <Cell.Icon height={12} width={7} source="icon-chevron" /> - </Cell.CellButton> - - <Cell.CellButton - onClick={this.props.onViewOpenVpnSettings} - disabled={this.props.tunnelProtocol === 'wireguard'}> - <Cell.Label> - {sprintf( - // TRANSLATORS: %(openvpn)s will be replaced with the string "OpenVPN" - messages.pgettext('advanced-settings-view', '%(openvpn)s settings'), - { openvpn: strings.openvpn }, - )} - </Cell.Label> - <Cell.Icon height={12} width={7} source="icon-chevron" /> - </Cell.CellButton> - </Cell.CellButtonGroup> - - <CustomDnsSettings /> - </StyledNavigationScrollbars> - </NavigationContainer> - </SettingsContainer> - - {this.renderConfirmBlockWhenDisconnectedAlert()} - </Layout> - </BackAction> - ); - } - - private renderConfirmBlockWhenDisconnectedAlert = () => { - return ( - <ModalAlert - isOpen={this.state.showConfirmBlockWhenDisconnectedAlert} - type={ModalAlertType.caution} - buttons={[ - <AppButton.RedButton key="confirm" onClick={this.confirmEnableBlockWhenDisconnected}> - {messages.gettext('Enable anyway')} - </AppButton.RedButton>, - <AppButton.BlueButton key="back" onClick={this.hideConfirmBlockWhenDisconnectedAlert}> - {messages.gettext('Back')} - </AppButton.BlueButton>, - ]} - close={this.hideConfirmBlockWhenDisconnectedAlert}> - <ModalMessage> - {messages.pgettext( - 'advanced-settings-view', - 'Attention: enabling this will always require a Mullvad VPN connection in order to reach the internet.', - )} - </ModalMessage> - <ModalMessage> - {messages.pgettext( - 'advanced-settings-view', - 'The app’s built-in kill switch is always on. This setting will additionally block the internet if clicking Disconnect or Quit.', - )} - </ModalMessage> - </ModalAlert> - ); - }; - - private setBlockWhenDisconnected = (newValue: boolean) => { - if (newValue) { - this.setState({ showConfirmBlockWhenDisconnectedAlert: true }); - } else { - this.props.setBlockWhenDisconnected(false); - } - }; - - private hideConfirmBlockWhenDisconnectedAlert = () => { - this.setState({ showConfirmBlockWhenDisconnectedAlert: false }); - }; - - private confirmEnableBlockWhenDisconnected = () => { - this.setState({ showConfirmBlockWhenDisconnectedAlert: false }); - this.props.setBlockWhenDisconnected(true); - }; - - private onSelectTunnelProtocol = (protocol?: TunnelProtocol) => { - this.props.setTunnelProtocol(protocol); - }; -} diff --git a/gui/src/renderer/components/AdvancedSettingsStyles.tsx b/gui/src/renderer/components/AdvancedSettingsStyles.tsx deleted file mode 100644 index 06a0103855..0000000000 --- a/gui/src/renderer/components/AdvancedSettingsStyles.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import styled from 'styled-components'; - -import Selector from './cell/Selector'; -import { NavigationScrollbars } from './NavigationBar'; - -export const StyledSelectorContainer = styled.div({ - flex: 0, -}); - -export const StyledSelectorForFooter = (styled(Selector)({ - marginBottom: 0, -}) as unknown) as new <T>() => Selector<T>; - -export const StyledTunnelProtocolContainer = styled(StyledSelectorContainer)({ - marginBottom: '20px', -}); - -export const StyledNavigationScrollbars = styled(NavigationScrollbars)({ - flex: 1, -}); diff --git a/gui/src/renderer/components/Preferences.tsx b/gui/src/renderer/components/Preferences.tsx deleted file mode 100644 index 001f367f87..0000000000 --- a/gui/src/renderer/components/Preferences.tsx +++ /dev/null @@ -1,571 +0,0 @@ -import * as React from 'react'; -import { sprintf } from 'sprintf-js'; - -import { IDnsOptions } from '../../shared/daemon-rpc-types'; -import { messages } from '../../shared/gettext'; -import { formatMarkdown } from '../markdown-formatter'; -import * as AppButton from './AppButton'; -import { AriaDescription, AriaDetails, AriaInput, AriaInputGroup, AriaLabel } from './AriaGroup'; -import * as Cell from './cell'; -import InfoButton from './InfoButton'; -import { BackAction } from './KeyboardNavigation'; -import { Layout } from './Layout'; -import { ModalAlert, ModalAlertType, ModalMessage } from './Modal'; -import { - NavigationBar, - NavigationContainer, - NavigationItems, - NavigationScrollbars, - TitleBarItem, -} from './NavigationBar'; -import { - StyledContainer, - StyledContent, - StyledInfoIcon, - StyledSeparator, -} from './PreferencesStyles'; -import SettingsHeader, { HeaderTitle } from './SettingsHeader'; - -export interface IProps { - autoStart: boolean; - autoConnect: boolean; - allowLan: boolean; - showBetaReleases: boolean; - isBeta: boolean; - enableSystemNotifications: boolean; - monochromaticIcon: boolean; - startMinimized: boolean; - unpinnedWindow: boolean; - dns: IDnsOptions; - setAutoStart: (autoStart: boolean) => void; - setEnableSystemNotifications: (flag: boolean) => void; - setAutoConnect: (autoConnect: boolean) => void; - setAllowLan: (allowLan: boolean) => void; - setShowBetaReleases: (showBetaReleases: boolean) => void; - setStartMinimized: (startMinimized: boolean) => void; - setMonochromaticIcon: (monochromaticIcon: boolean) => void; - setUnpinnedWindow: (unpinnedWindow: boolean) => void; - setDnsOptions: (dns: IDnsOptions) => Promise<void>; - onClose: () => void; -} - -interface IState { - showKillSwitchInfo: boolean; -} - -export default class Preferences extends React.Component<IProps, IState> { - public state = { showKillSwitchInfo: false }; - - public render() { - return ( - <BackAction action={this.props.onClose}> - <Layout> - <StyledContainer> - <NavigationContainer> - <NavigationBar> - <NavigationItems> - <TitleBarItem> - { - // TRANSLATORS: Title label in navigation bar - messages.pgettext('preferences-nav', 'Preferences') - } - </TitleBarItem> - </NavigationItems> - </NavigationBar> - - <NavigationScrollbars> - <SettingsHeader> - <HeaderTitle>{messages.pgettext('preferences-view', 'Preferences')}</HeaderTitle> - </SettingsHeader> - - <StyledContent> - <Cell.CellButton onClick={this.showKillSwitchInfo}> - <AriaInputGroup> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Kill switch')} - </Cell.InputLabel> - </AriaLabel> - <StyledInfoIcon /> - <AriaInput> - <Cell.Switch isOn disabled /> - </AriaInput> - </AriaInputGroup> - </Cell.CellButton> - <StyledSeparator height={20} /> - - <AriaInputGroup> - <Cell.Container> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Launch app on start-up')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch - isOn={this.props.autoStart} - onChange={this.props.setAutoStart} - /> - </AriaInput> - </Cell.Container> - </AriaInputGroup> - <StyledSeparator /> - - <AriaInputGroup> - <Cell.Container> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Auto-connect')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch - isOn={this.props.autoConnect} - onChange={this.props.setAutoConnect} - /> - </AriaInput> - </Cell.Container> - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {messages.pgettext( - 'preferences-view', - 'Automatically connect to a server when the app launches.', - )} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - </AriaInputGroup> - - <AriaInputGroup> - <Cell.Container disabled={this.props.dns.state === 'custom'}> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Block ads')} - </Cell.InputLabel> - </AriaLabel> - <AriaDetails> - <InfoButton> - <ModalMessage> - {messages.pgettext( - 'preferences-view', - 'When enabled, this feature stops the device from contacting certain known ad domains.', - )} - </ModalMessage> - <ModalMessage> - {messages.pgettext( - 'preferences-view', - 'Warning: This might cause issues on certain websites, services, and programs.', - )} - </ModalMessage> - </InfoButton> - </AriaDetails> - <AriaInput> - <Cell.Switch - isOn={ - this.props.dns.state === 'default' && - this.props.dns.defaultOptions.blockAds - } - onChange={this.setBlockAds} - /> - </AriaInput> - </Cell.Container> - </AriaInputGroup> - <StyledSeparator /> - <AriaInputGroup> - <Cell.Container disabled={this.props.dns.state === 'custom'}> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Block trackers')} - </Cell.InputLabel> - </AriaLabel> - <AriaDetails> - <InfoButton> - <ModalMessage> - {messages.pgettext( - 'preferences-view', - 'When enabled, this feature stops the device from contacting certain domains known to track users.', - )} - </ModalMessage> - <ModalMessage> - {messages.pgettext( - 'preferences-view', - 'Warning: This might cause issues on certain websites, services, and programs.', - )} - </ModalMessage> - </InfoButton> - </AriaDetails> - <AriaInput> - <Cell.Switch - isOn={ - this.props.dns.state === 'default' && - this.props.dns.defaultOptions.blockTrackers - } - onChange={this.setBlockTrackers} - /> - </AriaInput> - </Cell.Container> - </AriaInputGroup> - <StyledSeparator /> - <AriaInputGroup> - <Cell.Container disabled={this.props.dns.state === 'custom'}> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Block malware')} - </Cell.InputLabel> - </AriaLabel> - <AriaDetails> - <InfoButton> - <ModalMessage> - {messages.pgettext( - 'preferences-view', - 'When enabled, this feature stops the device from contacting certain domains known to host malware.', - )} - </ModalMessage> - <ModalMessage> - {messages.pgettext( - 'preferences-view', - 'Warning: This is not an anti-virus and should not be treated as such, this is just an extra layer of protection.', - )} - </ModalMessage> - </InfoButton> - </AriaDetails> - <AriaInput> - <Cell.Switch - isOn={ - this.props.dns.state === 'default' && - this.props.dns.defaultOptions.blockMalware - } - onChange={this.setBlockMalware} - /> - </AriaInput> - </Cell.Container> - </AriaInputGroup> - <StyledSeparator /> - <AriaInputGroup> - <Cell.Container disabled={this.props.dns.state === 'custom'}> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Block adult content')} - </Cell.InputLabel> - </AriaLabel> - <AriaDetails> - <InfoButton - message={messages.pgettext( - 'preferences-view', - 'When enabled, this feature stops the device from contacting certain websites and services known to host adult content.', - )} - /> - </AriaDetails> - <AriaInput> - <Cell.Switch - isOn={ - this.props.dns.state === 'default' && - this.props.dns.defaultOptions.blockAdultContent - } - onChange={this.setBlockAdultContent} - /> - </AriaInput> - </Cell.Container> - </AriaInputGroup> - <StyledSeparator /> - <AriaInputGroup> - <Cell.Container disabled={this.props.dns.state === 'custom'}> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Block gambling')} - </Cell.InputLabel> - </AriaLabel> - <AriaDetails> - <InfoButton - message={messages.pgettext( - 'preferences-view', - 'When enabled, this feature stops the device from contacting certain websites and services known to host gambling content.', - )} - /> - </AriaDetails> - <AriaInput> - <Cell.Switch - isOn={ - this.props.dns.state === 'default' && - this.props.dns.defaultOptions.blockGambling - } - onChange={this.setBlockGambling} - /> - </AriaInput> - </Cell.Container> - {this.props.dns.state === 'custom' && <CustomDnsEnabledFooter />} - </AriaInputGroup> - - {this.props.dns.state !== 'custom' && <StyledSeparator height={20} />} - - <AriaInputGroup> - <Cell.Container> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Local network sharing')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch isOn={this.props.allowLan} onChange={this.props.setAllowLan} /> - </AriaInput> - </Cell.Container> - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {messages.pgettext( - 'preferences-view', - 'Allows access to other devices on the same network for sharing, printing etc.', - )} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - </AriaInputGroup> - - <AriaInputGroup> - <Cell.Container> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Notifications')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch - isOn={this.props.enableSystemNotifications} - onChange={this.props.setEnableSystemNotifications} - /> - </AriaInput> - </Cell.Container> - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {messages.pgettext( - 'preferences-view', - 'Enable or disable system notifications. The critical notifications will always be displayed.', - )} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - </AriaInputGroup> - - <AriaInputGroup> - <Cell.Container> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Monochromatic tray icon')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch - isOn={this.props.monochromaticIcon} - onChange={this.props.setMonochromaticIcon} - /> - </AriaInput> - </Cell.Container> - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {messages.pgettext( - 'preferences-view', - 'Use a monochromatic tray icon instead of a colored one.', - )} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - </AriaInputGroup> - - {(window.env.platform === 'win32' || - (window.env.platform === 'darwin' && window.env.development)) && ( - <AriaInputGroup> - <Cell.Container> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Unpin app from taskbar')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch - isOn={this.props.unpinnedWindow} - onChange={this.props.setUnpinnedWindow} - /> - </AriaInput> - </Cell.Container> - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {messages.pgettext( - 'preferences-view', - 'Enable to move the app around as a free-standing window.', - )} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - </AriaInputGroup> - )} - - {this.props.unpinnedWindow && ( - <React.Fragment> - <AriaInputGroup> - <Cell.Container> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Start minimized')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch - isOn={this.props.startMinimized} - onChange={this.props.setStartMinimized} - /> - </AriaInput> - </Cell.Container> - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {messages.pgettext( - 'preferences-view', - 'Show only the tray icon when the app starts.', - )} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - </AriaInputGroup> - </React.Fragment> - )} - - <AriaInputGroup> - <Cell.Container disabled={this.props.isBeta}> - <AriaLabel> - <Cell.InputLabel> - {messages.pgettext('preferences-view', 'Beta program')} - </Cell.InputLabel> - </AriaLabel> - <AriaInput> - <Cell.Switch - isOn={this.props.showBetaReleases} - onChange={this.props.setShowBetaReleases} - /> - </AriaInput> - </Cell.Container> - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {this.props.isBeta - ? messages.pgettext( - 'preferences-view', - 'This option is unavailable while using a beta version.', - ) - : messages.pgettext( - 'preferences-view', - 'Enable to get notified when new beta versions of the app are released.', - )} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - </AriaInputGroup> - </StyledContent> - </NavigationScrollbars> - </NavigationContainer> - </StyledContainer> - - <ModalAlert - isOpen={this.state.showKillSwitchInfo} - message={messages.pgettext( - 'preferences-view', - 'The app has a built in kill switch that is enabled by default and cannot be disabled. This is to prevent your traffic from leaking outside of the VPN tunnel if your network suddenly stops working or if the tunnel fails for any reason. Mullvad automatically protects your data until your connection is reestablished.', - )} - type={ModalAlertType.info} - buttons={[ - <AppButton.BlueButton key="back" onClick={this.hideKillSwitchInfo}> - {messages.gettext('Got it!')} - </AppButton.BlueButton>, - ]} - close={this.hideKillSwitchInfo} - /> - </Layout> - </BackAction> - ); - } - - private setBlockAds = async (enabled: boolean) => { - await this.props.setDnsOptions({ - ...this.props.dns, - defaultOptions: { - ...this.props.dns.defaultOptions, - blockAds: enabled, - }, - }); - }; - - private setBlockTrackers = async (enabled: boolean) => { - await this.props.setDnsOptions({ - ...this.props.dns, - defaultOptions: { - ...this.props.dns.defaultOptions, - blockTrackers: enabled, - }, - }); - }; - - private setBlockMalware = async (enabled: boolean) => { - await this.props.setDnsOptions({ - ...this.props.dns, - defaultOptions: { - ...this.props.dns.defaultOptions, - blockMalware: enabled, - }, - }); - }; - - private setBlockAdultContent = async (enabled: boolean) => { - await this.props.setDnsOptions({ - ...this.props.dns, - defaultOptions: { - ...this.props.dns.defaultOptions, - blockAdultContent: enabled, - }, - }); - }; - - private setBlockGambling = async (enabled: boolean) => { - await this.props.setDnsOptions({ - ...this.props.dns, - defaultOptions: { - ...this.props.dns.defaultOptions, - blockGambling: enabled, - }, - }); - }; - - private showKillSwitchInfo = () => { - this.setState({ showKillSwitchInfo: true }); - }; - - private hideKillSwitchInfo = () => { - this.setState({ showKillSwitchInfo: false }); - }; -} - -function CustomDnsEnabledFooter() { - const customDnsFeatureName = messages.pgettext('advanced-settings-view', 'Use custom DNS server'); - - // TRANSLATORS: This is displayed when the custom DNS setting is turned on which makes the block - // TRANSLATORS: ads/trackers settings disabled. The text enclosed in "**" will appear bold. - // TRANSLATORS: Advanced settings refer to the name of the page with the title "Advanced". - // TRANSLATORS: Available placeholders: - // TRANSLATORS: %(customDnsFeatureName)s - The name displayed next to the custom DNS toggle. - const blockingDisabledText = messages.pgettext( - 'preferences-view', - 'Disable **%(customDnsFeatureName)s** (under Advanced settings) to activate these settings.', - ); - - return ( - <Cell.Footer> - <AriaDescription> - <Cell.FooterText> - {formatMarkdown(sprintf(blockingDisabledText, { customDnsFeatureName }))} - </Cell.FooterText> - </AriaDescription> - </Cell.Footer> - ); -} diff --git a/gui/src/renderer/components/PreferencesStyles.tsx b/gui/src/renderer/components/PreferencesStyles.tsx deleted file mode 100644 index 81ee5c1928..0000000000 --- a/gui/src/renderer/components/PreferencesStyles.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import styled from 'styled-components'; - -import { colors } from '../../config.json'; -import { InfoIcon } from './InfoButton'; -import { Container } from './Layout'; - -export const StyledContainer = styled(Container)({ - backgroundColor: colors.darkBlue, -}); - -export const StyledContent = styled.div({ - display: 'flex', - flexDirection: 'column', - flex: 1, - marginBottom: '2px', -}); - -export const StyledSeparator = styled.div((props: { height?: number }) => ({ - height: `${props.height ?? 1}px`, -})); - -export const StyledInfoIcon = styled(InfoIcon)({ - marginRight: '16px', -}); diff --git a/gui/src/renderer/containers/AdvancedSettingsPage.tsx b/gui/src/renderer/containers/AdvancedSettingsPage.tsx deleted file mode 100644 index 203067f1af..0000000000 --- a/gui/src/renderer/containers/AdvancedSettingsPage.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import { connect } from 'react-redux'; - -import { TunnelProtocol } from '../../shared/daemon-rpc-types'; -import log from '../../shared/logging'; -import RelaySettingsBuilder from '../../shared/relay-settings-builder'; -import AdvancedSettings from '../components/AdvancedSettings'; -import withAppContext, { IAppContext } from '../context'; -import { IHistoryProps, withHistory } from '../lib/history'; -import { RoutePath } from '../lib/routes'; -import { RelaySettingsRedux } from '../redux/settings/reducers'; -import { IReduxState, ReduxDispatch } from '../redux/store'; - -const mapStateToProps = (state: IReduxState) => { - const tunnelProtocol = mapRelaySettingsToProtocol(state.settings.relaySettings); - - return { - enableIpv6: state.settings.enableIpv6, - blockWhenDisconnected: state.settings.blockWhenDisconnected, - tunnelProtocol, - }; -}; - -const mapRelaySettingsToProtocol = (relaySettings: RelaySettingsRedux) => { - if ('normal' in relaySettings) { - const { tunnelProtocol } = relaySettings.normal; - return tunnelProtocol === 'any' ? undefined : tunnelProtocol; - // since the GUI doesn't display custom settings, just display the default ones. - // If the user sets any settings, then those will be applied. - } else if ('customTunnelEndpoint' in relaySettings) { - return undefined; - } else { - throw new Error('Unknown type of relay settings.'); - } -}; - -const mapDispatchToProps = (_dispatch: ReduxDispatch, props: IHistoryProps & IAppContext) => { - return { - onClose: () => { - props.history.pop(); - }, - - setTunnelProtocol: async (tunnelProtocol: TunnelProtocol | undefined) => { - const relayUpdate = RelaySettingsBuilder.normal() - .tunnel.tunnelProtocol((config) => { - if (tunnelProtocol) { - config.tunnelProtocol.exact(tunnelProtocol); - } else { - config.tunnelProtocol.any(); - } - }) - .build(); - try { - await props.app.updateRelaySettings(relayUpdate); - } catch (e) { - const error = e as Error; - log.error('Failed to update tunnel protocol constraints', error.message); - } - }, - - setEnableIpv6: async (enableIpv6: boolean) => { - try { - await props.app.setEnableIpv6(enableIpv6); - } catch (e) { - const error = e as Error; - log.error('Failed to update enable IPv6', error.message); - } - }, - - setBlockWhenDisconnected: async (blockWhenDisconnected: boolean) => { - try { - await props.app.setBlockWhenDisconnected(blockWhenDisconnected); - } catch (e) { - const error = e as Error; - log.error('Failed to update block when disconnected', error.message); - } - }, - - onViewWireguardSettings: () => props.history.push(RoutePath.wireguardSettings), - onViewOpenVpnSettings: () => props.history.push(RoutePath.openVpnSettings), - onViewSplitTunneling: () => props.history.push(RoutePath.splitTunneling), - }; -}; - -export default withAppContext( - withHistory(connect(mapStateToProps, mapDispatchToProps)(AdvancedSettings)), -); diff --git a/gui/src/renderer/containers/PreferencesPage.tsx b/gui/src/renderer/containers/PreferencesPage.tsx deleted file mode 100644 index be2dce9373..0000000000 --- a/gui/src/renderer/containers/PreferencesPage.tsx +++ /dev/null @@ -1,65 +0,0 @@ -import { connect } from 'react-redux'; - -import { IDnsOptions } from '../../shared/daemon-rpc-types'; -import log from '../../shared/logging'; -import Preferences from '../components/Preferences'; -import withAppContext, { IAppContext } from '../context'; -import { IHistoryProps, withHistory } from '../lib/history'; -import { IReduxState, ReduxDispatch } from '../redux/store'; - -const mapStateToProps = (state: IReduxState) => ({ - autoStart: state.settings.autoStart, - allowLan: state.settings.allowLan, - showBetaReleases: state.settings.showBetaReleases, - isBeta: state.version.isBeta, - autoConnect: state.settings.guiSettings.autoConnect, - enableSystemNotifications: state.settings.guiSettings.enableSystemNotifications, - monochromaticIcon: state.settings.guiSettings.monochromaticIcon, - startMinimized: state.settings.guiSettings.startMinimized, - unpinnedWindow: state.settings.guiSettings.unpinnedWindow, - dns: state.settings.dns, -}); - -const mapDispatchToProps = (_dispatch: ReduxDispatch, props: IHistoryProps & IAppContext) => { - return { - onClose: () => { - props.history.pop(); - }, - setEnableSystemNotifications: (flag: boolean) => { - props.app.setEnableSystemNotifications(flag); - }, - setAutoStart: async (autoStart: boolean) => { - try { - await props.app.setAutoStart(autoStart); - } catch (e) { - const error = e as Error; - log.error(`Cannot set auto-start: ${error.message}`); - } - }, - setAutoConnect: (autoConnect: boolean) => { - props.app.setAutoConnect(autoConnect); - }, - setAllowLan: (allowLan: boolean) => { - void props.app.setAllowLan(allowLan); - }, - setShowBetaReleases: (showBetaReleases: boolean) => { - void props.app.setShowBetaReleases(showBetaReleases); - }, - setStartMinimized: (startMinimized: boolean) => { - props.app.setStartMinimized(startMinimized); - }, - setMonochromaticIcon: (monochromaticIcon: boolean) => { - props.app.setMonochromaticIcon(monochromaticIcon); - }, - setUnpinnedWindow: (unpinnedWindow: boolean) => { - props.app.setUnpinnedWindow(unpinnedWindow); - }, - setDnsOptions: (dns: IDnsOptions) => { - return props.app.setDnsOptions(dns); - }, - }; -}; - -export default withAppContext( - withHistory(connect(mapStateToProps, mapDispatchToProps)(Preferences)), -); |
