Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Reorganize settings webui #20160

Merged
merged 3 commits into from
Sep 14, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 9 additions & 7 deletions browser/resources/settings/brave_overrides/basic_page.ts
Original file line number Diff line number Diff line change
Expand Up @@ -231,8 +231,9 @@ RegisterPolymerTemplateModifications({
sectionSocialBlocking.setAttribute('is', 'dom-if')
sectionSocialBlocking.setAttribute('restamp', true)
sectionSocialBlocking.setAttribute('if', '[[showPage_(pageVisibility.socialBlocking)]]')
sectionSocialBlocking.content.appendChild(createSectionElement(
sectionSocialBlocking.content.appendChild(createNestedSectionElement(
'socialBlocking',
'shields',
'socialBlocking',
'settings-social-blocking-page',
{
Expand Down Expand Up @@ -268,8 +269,9 @@ RegisterPolymerTemplateModifications({
sectionNewTab.setAttribute('is', 'dom-if')
sectionNewTab.setAttribute('restamp', true)
sectionNewTab.setAttribute('if', '[[showPage_(pageVisibility.newTab)]]')
sectionNewTab.content.appendChild(createSectionElement(
sectionNewTab.content.appendChild(createNestedSectionElement(
'newTab',
'getStarted',
'braveNewTab',
'settings-brave-new-tab-page',
{
Expand All @@ -294,21 +296,21 @@ RegisterPolymerTemplateModifications({
// Get Started at top
let last = basicPageEl.insertAdjacentElement('afterbegin',
sectionGetStarted)
// Insert New Tab
last = last.insertAdjacentElement('afterend', sectionNewTab)
// Move Appearance item
const sectionAppearance = getSectionElement(actualTemplate.content,
'appearance')
last = last.insertAdjacentElement('afterend', sectionAppearance)
// Insert New Tab
last = last.insertAdjacentElement('afterend', sectionNewTab)
// Insert shields
last = last.insertAdjacentElement('afterend', sectionShields)
// Insert nested Social Blocking under shields
last = last.insertAdjacentElement('afterend', sectionSocialBlocking)
// Insert Rewards
if (sectionRewards) {
last = last.insertAdjacentElement('afterend', sectionRewards)
}
// Insert Social Blocking
last = last.insertAdjacentElement('afterend', sectionSocialBlocking)
// Move privacy section to after social blocking
// Move privacy section to after rewards
const sectionPrivacy = getSectionElement(actualTemplate.content, 'privacy')
last = last.insertAdjacentElement('afterend', sectionPrivacy)
// Insert sync
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@ RegisterPolymerTemplateModifications({
<settings-brave-personalization-options prefs="{{prefs}}">
</settings-brave-personalization-options>
`)
// Removed because we need to locate metrics reportng option between ours at our settings-brave-personalization-options
metricsReportingControl.remove()
}

// searchSugestToggle is moved to search engines section.
Expand Down
58 changes: 24 additions & 34 deletions browser/resources/settings/brave_overrides/settings_menu.ts
Original file line number Diff line number Diff line change
Expand Up @@ -237,26 +237,24 @@ RegisterPolymerTemplateModifications({
'getStarted'
)
peopleEl.insertAdjacentElement('afterend', getStartedEl)

// Move Appearance item
const appearanceBrowserEl = getMenuElement(templateContent, '/appearance')
getStartedEl.insertAdjacentElement('afterend', appearanceBrowserEl)

// Add New Tab item
const newTabEl = createMenuElement(
loadTimeData.getString('braveNewTab'),
'/newTab',
'window-tab-new',
'newTab'
)
appearanceBrowserEl.insertAdjacentElement('afterend', newTabEl)
// Add Shields item
const shieldsEl = createMenuElement(
loadTimeData.getString('braveShieldsTitle'),
'/shields',
'shield-done',
'shields',
)
newTabEl.insertAdjacentElement('afterend', shieldsEl)
appearanceBrowserEl.insertAdjacentElement('afterend', shieldsEl)

// Add privacy item
const privacyEl = getMenuElement(templateContent, '/privacy')
shieldsEl.insertAdjacentElement('afterend', privacyEl)

// Add Rewards item
const isBraveRewardsSupported = loadTimeData.getBoolean('isBraveRewardsSupported')
let rewardsEl = undefined
Expand All @@ -267,34 +265,35 @@ RegisterPolymerTemplateModifications({
'product-bat-outline',
'rewards',
)
shieldsEl.insertAdjacentElement('afterend', rewardsEl)
privacyEl.insertAdjacentElement('afterend', rewardsEl)
}
// Add Embed Blocking item
const embedEl = createMenuElement(
loadTimeData.getString('socialBlocking'),
'/socialBlocking',
'thumb-down',
'socialBlocking',

// Add web3 item
const web3El = createMenuElement(
loadTimeData.getString('braveWeb3'),
'/web3',
'product-brave-wallet',
'wallet',
)
if (isBraveRewardsSupported) {
rewardsEl.insertAdjacentElement('afterend', embedEl)
rewardsEl.insertAdjacentElement('afterend', web3El)
} else {
shieldsEl.insertAdjacentElement('afterend', embedEl)
privacyEl.insertAdjacentElement('afterend', web3El)
}
// Add privacy
const privacyEl = getMenuElement(templateContent, '/privacy')
embedEl.insertAdjacentElement('afterend', privacyEl)

// Add Sync item
const syncEl = createMenuElement(
loadTimeData.getString('braveSync'),
'/braveSync',
'product-sync',
'braveSync',
)
privacyEl.insertAdjacentElement('afterend', syncEl)
// Move search item
web3El.insertAdjacentElement('afterend', syncEl)

// Add search item
const searchEl = getMenuElement(templateContent, '/search')
syncEl.insertAdjacentElement('afterend', searchEl)

// Add Extensions item
const extensionEl = createMenuElement(
loadTimeData.getString('braveDefaultExtensions'),
Expand All @@ -304,23 +303,14 @@ RegisterPolymerTemplateModifications({
)
searchEl.insertAdjacentElement('afterend', extensionEl)


const web3El = createMenuElement(
loadTimeData.getString('braveWeb3'),
'/web3',
'product-brave-wallet',
'wallet',
)

// Add leo item
const leoAssistantEl = createMenuElement(
loadTimeData.getString('leoAssistant'),
'/leo-assistant',
'product-brave-leo',
'leoAssistant',
)

extensionEl.insertAdjacentElement('afterend', web3El)
web3El.insertAdjacentElement('afterend', leoAssistantEl)
extensionEl.insertAdjacentElement('afterend', leoAssistantEl)

// Move autofill to advanced
const autofillEl = getMenuElement(templateContent, '/autofill')
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,19 @@
sub-label="$i18n{statsUsagePingEnabledDesc}"
on-settings-boolean-control-change="onStatsUsagePingEnabledChange_">
</settings-toggle-button>
<settings-toggle-button id="metricsReportingControl"
class="hr"
pref="[[metricsReportingPref_]]"
label="$i18n{enablePersonalizationLogging}"
sub-label="$i18n{enablePersonalizationLoggingDesc}" no-set-pref
on-settings-boolean-control-change="onMetricsReportingChange_">
<template is="dom-if" if="[[showRestartForMetricsReporting_]]" restamp>
<cr-button on-click="restartBrowser_" id="restart"
slot="more-actions">
$i18n{restart}
</cr-button>
</template>
</settings-toggle-button>
<div hidden="[[!isRequestOTRFeatureEnabled_]]" class="settings-box">
<div class="start" id="labelWrapper">
<div class="label">$i18n{requestOTRLabel}</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
// You can obtain one at https://mozilla.org/MPL/2.0/.

import {SettingsToggleButtonElement} from '/shared/settings/controls/settings_toggle_button.js';
import {MetricsReporting} from '/shared/settings/privacy_page/privacy_page_browser_proxy.js';
import {WebUiListenerMixin, WebUiListenerMixinInterface} from 'chrome://resources/cr_elements/web_ui_listener_mixin.js';
import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';

Expand All @@ -22,6 +23,7 @@ export interface SettingsBravePersonalizationOptions {
$: {
p3aEnabled: SettingsToggleButtonElement,
statsUsagePingEnabled: SettingsToggleButtonElement,
metricsReportingControl: SettingsToggleButtonElement,
}
}

Expand Down Expand Up @@ -65,6 +67,15 @@ export class SettingsBravePersonalizationOptions extends SettingsBravePersonaliz
return {};
},
},
metricsReportingPref_: {
type: Object,
value() {
// TODO(dbeam): this is basically only to appease PrefControlMixin.
// Maybe add a no-validate attribute instead? This makes little sense.
return {};
},
},
showRestartForMetricsReporting_: Boolean,
isRequestOTRFeatureEnabled_: {
readOnly: true,
type: Boolean,
Expand All @@ -91,6 +102,8 @@ export class SettingsBravePersonalizationOptions extends SettingsBravePersonaliz
private webRTCPolicy_: String;
private p3aEnabledPref_: Object;
private statsUsagePingEnabledPref_: Object;
private metricsReportingPref_: chrome.settingsPrivate.PrefObject<boolean>;
private showRestartForMetricsReporting_: boolean;
private requestOTRActions_: Object[];
private requestOTRAction_: String;

Expand All @@ -107,6 +120,11 @@ export class SettingsBravePersonalizationOptions extends SettingsBravePersonaliz
this.browserProxy_.getP3AEnabled().then(
(enabled: boolean) => setP3AEnabledPref(enabled));

const setMetricsReportingPref = (metricsReporting: MetricsReporting) =>
this.setMetricsReportingPref_(metricsReporting);
this.addWebUiListener('metrics-reporting-change', setMetricsReportingPref);
this.browserProxy_.getMetricsReporting().then(setMetricsReportingPref);

const setStatsUsagePingEnabledPref = (enabled: boolean) => this.setStatsUsagePingEnabledPref_(enabled);
this.addWebUiListener(
'stats-usage-ping-enabled-changed', setStatsUsagePingEnabledPref);
Expand Down Expand Up @@ -140,6 +158,38 @@ export class SettingsBravePersonalizationOptions extends SettingsBravePersonaliz
this.browserProxy_.setStatsUsagePingEnabled(this.$.statsUsagePingEnabled.checked);
}

// Metrics related code is copied from
// chrome/browser/resources/settings/privacy_page/personalization_options.ts as
// we hide that upstream option and put it in our this page.
onMetricsReportingChange_() {
const enabled = this.$.metricsReportingControl.checked;
this.browserProxy_.setMetricsReportingEnabled(enabled);
}

setMetricsReportingPref_(metricsReporting: MetricsReporting) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks like this was copied from the upstream code. It might be worth leaving comment about where it's from.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added

const hadPreviousPref = this.metricsReportingPref_.value !== undefined;
const pref: chrome.settingsPrivate.PrefObject<boolean> = {
key: '',
type: chrome.settingsPrivate.PrefType.BOOLEAN,
value: metricsReporting.enabled,
};
if (metricsReporting.managed) {
pref.enforcement = chrome.settingsPrivate.Enforcement.ENFORCED;
pref.controlledBy = chrome.settingsPrivate.ControlledBy.USER_POLICY;
}

// Ignore the next change because it will happen when we set the pref.
this.metricsReportingPref_ = pref;

// TODO(dbeam): remember whether metrics reporting was enabled when Chrome
// started.
if (metricsReporting.managed) {
this.showRestartForMetricsReporting_ = false;
} else if (hadPreviousPref) {
this.showRestartForMetricsReporting_ = true;
}
}

shouldShowRestart_(enabled: boolean) {
return enabled != this.browserProxy_.wasPushMessagingEnabledAtStartup();
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
// License, v. 2.0. If a copy of the MPL was not distributed with this file,
// you can obtain one at https://mozilla.org/MPL/2.0/.

import {MetricsReporting} from '/shared/settings/privacy_page/privacy_page_browser_proxy.js';
import {sendWithPromise} from 'chrome://resources/js/cr.js';
import {loadTimeData} from '../i18n_setup.js';

Expand All @@ -12,6 +13,8 @@ export interface BravePrivacyBrowserProxy {
getStatsUsagePingEnabled(): Promise<boolean>
setStatsUsagePingEnabled(value: boolean): void
wasPushMessagingEnabledAtStartup(): boolean
setMetricsReportingEnabled(enabled: boolean): void
getMetricsReporting(): Promise<MetricsReporting>;
}

export class BravePrivacyBrowserProxyImpl implements BravePrivacyBrowserProxy {
Expand All @@ -35,6 +38,14 @@ export class BravePrivacyBrowserProxyImpl implements BravePrivacyBrowserProxy {
return loadTimeData.getBoolean('pushMessagingEnabledAtStartup');
}

setMetricsReportingEnabled(enabled: boolean) {
chrome.send('setMetricsReportingEnabled', [enabled]);
}

getMetricsReporting() {
return sendWithPromise('getMetricsReporting');
}

static getInstance(): BravePrivacyBrowserProxyImpl {
return instance || (instance = new BravePrivacyBrowserProxyImpl())
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -44,33 +44,6 @@
</div>
</div>
</div>
<settings-toggle-button
class="cr-row"
pref="{{prefs.brave.shields.stats_badge_visible}}"
label="$i18n{showStatsBlockedBadgeLabel}">
</settings-toggle-button>
<settings-toggle-button
class="cr-row"
pref="{{prefs.brave.de_amp.enabled}}"
label="$i18n{deAmpSettingLabel}"
sub-label="$i18n{deAmpSettingSubLabel}"
learn-more-url="$i18n{deAmpLearnMoreURL}">
</settings-toggle-button>
<template is="dom-if" if="[[isDebounceFeatureEnabled_]]">
<settings-toggle-button
class="cr-row"
pref="{{prefs.brave.debounce.enabled}}"
label="$i18n{debounceSettingLabel}"
sub-label="$i18n{debounceSettingSubLabel}"
learn-more-url="$i18n{debounceLearnMoreURL}">
</settings-toggle-button>
</template>
<settings-toggle-button
class="cr-row"
pref="{{prefs.brave.reduce_language}}"
label="$i18n{reduceLanguageControlLabel}"
sub-label="$i18n{reduceLanguageDesc}">
</settings-toggle-button>
<div class="settings-box">
<div class="start">$i18n{adControlLabel}</div>
<select id="adControlType" class="md-select"
Expand Down Expand Up @@ -150,3 +123,32 @@
</settings-subpage>
</template>
</settings-animated-pages>
<div hidden="[[isAdBlockRoute_]]">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

q. I'm curious why this was added. Was it removed accidentally?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This page is used for two screen.

  • brave://settings/shields
  • brave://settings/shields/filters

Above second screen is shown when we click Content filtering option.
Then, isAdBlockRoute_ gives true and we need to hide all except filter subpage(adblck-subpage element).

<settings-toggle-button
class="cr-row"
pref="{{prefs.brave.shields.stats_badge_visible}}"
label="$i18n{showStatsBlockedBadgeLabel}">
</settings-toggle-button>
<settings-toggle-button
class="cr-row"
pref="{{prefs.brave.de_amp.enabled}}"
label="$i18n{deAmpSettingLabel}"
sub-label="$i18n{deAmpSettingSubLabel}"
learn-more-url="$i18n{deAmpLearnMoreURL}">
</settings-toggle-button>
<template is="dom-if" if="[[isDebounceFeatureEnabled_]]">
<settings-toggle-button
class="cr-row"
pref="{{prefs.brave.debounce.enabled}}"
label="$i18n{debounceSettingLabel}"
sub-label="$i18n{debounceSettingSubLabel}"
learn-more-url="$i18n{debounceLearnMoreURL}">
</settings-toggle-button>
</template>
<settings-toggle-button
class="cr-row"
pref="{{prefs.brave.reduce_language}}"
label="$i18n{reduceLanguageControlLabel}"
sub-label="$i18n{reduceLanguageDesc}">
</settings-toggle-button>
</div>