brave · emerick · Oct 8, 2021 · Oct 6, 2021
diff --git a/browser/search_engines/private_window_search_engine_provider_service.cc b/browser/search_engines/private_window_search_engine_provider_service.cc
@@ -5,6 +5,7 @@
 
 #include "brave/browser/search_engines/private_window_search_engine_provider_service.h"
 
+#include "brave/browser/search_engines/search_engine_provider_util.h"
 #include "chrome/browser/profiles/profile.h"
 #include "components/prefs/pref_service.h"
 #include "components/search_engines/default_search_manager.h"
@@ -16,6 +17,10 @@ PrivateWindowSearchEngineProviderService(Profile* otr_profile)
     : SearchEngineProviderService(otr_profile) {
   DCHECK(otr_profile->IsIncognitoProfile());
 
+  if (brave::UseAlternativeSearchEngineProviderEnabled(otr_profile)) {
+    brave::SetShowAlternativeSearchEngineProviderToggle(otr_profile);
+  }
+
   const bool use_extension_provider = ShouldUseExtensionSearchProvider();
   otr_profile->GetPrefs()->SetBoolean(prefs::kDefaultSearchProviderByExtension,
                                       use_extension_provider);

diff --git a/browser/search_engines/search_engine_provider_service_factory.cc b/browser/search_engines/search_engine_provider_service_factory.cc
@@ -101,6 +101,8 @@ SearchEngineProviderServiceFactory::ServiceIsCreatedWithBrowserContext() const {
 void SearchEngineProviderServiceFactory::RegisterProfilePrefs(
     user_prefs::PrefRegistrySyncable* registry) {
   registry->RegisterBooleanPref(kUseAlternativeSearchEngineProvider, false);
+  registry->RegisterBooleanPref(kShowAlternativeSearchEngineProviderToggle,
+                                false);
   registry->RegisterBooleanPref(prefs::kDefaultSearchProviderByExtension,
                                 false);
   registry->RegisterBooleanPref(prefs::kAddOpenSearchEngines, false);

diff --git a/browser/search_engines/search_engine_provider_util.cc b/browser/search_engines/search_engine_provider_util.cc
@@ -20,6 +20,11 @@ bool UseAlternativeSearchEngineProviderEnabled(Profile* profile) {
       kUseAlternativeSearchEngineProvider);
 }
 
+bool ShowAlternativeSearchEngineProviderToggleEnabled(Profile* profile) {
+  return profile->GetOriginalProfile()->GetPrefs()->GetBoolean(
+      kShowAlternativeSearchEngineProviderToggle);
+}
+
 void ToggleUseAlternativeSearchEngineProvider(Profile* profile) {
   if (brave::IsRegionForQwant(profile))
     return;
@@ -29,6 +34,14 @@ void ToggleUseAlternativeSearchEngineProvider(Profile* profile) {
       !UseAlternativeSearchEngineProviderEnabled(profile));
 }
 
+void SetShowAlternativeSearchEngineProviderToggle(Profile* profile) {
+  if (brave::IsRegionForQwant(profile))
+    return;
+
+  profile->GetOriginalProfile()->GetPrefs()->SetBoolean(
+      kShowAlternativeSearchEngineProviderToggle, true);
+}
+
 bool IsRegionForQwant(Profile* profile) {
   return TemplateURLPrepopulateData::GetPrepopulatedDefaultSearch(
       profile->GetPrefs())->prepopulate_id ==

diff --git a/browser/search_engines/search_engine_provider_util.h b/browser/search_engines/search_engine_provider_util.h
@@ -16,8 +16,12 @@ namespace brave {
 
 bool UseAlternativeSearchEngineProviderEnabled(Profile* profile);
 
+bool ShowAlternativeSearchEngineProviderToggleEnabled(Profile* profile);
+
 void ToggleUseAlternativeSearchEngineProvider(Profile* profile);
 
+void SetShowAlternativeSearchEngineProviderToggle(Profile* profile);
+
 bool IsRegionForQwant(Profile* profile);
 
 }  // namespace brave

diff --git a/browser/ui/webui/brave_webui_source.cc b/browser/ui/webui/brave_webui_source.cc
@@ -211,6 +211,8 @@ void CustomizeWebUIHTMLSource(const std::string &name,
         // Private Tab - Header Private Window
         { "headerTitle", IDS_BRAVE_PRIVATE_NEW_TAB_PRIVATE_WINDOW },
         { "headerText", IDS_BRAVE_PRIVATE_NEW_TAB_PRIVATE_WINDOW_DESC },
+        { "headerText1", IDS_BRAVE_PRIVATE_NEW_TAB_PRIVATE_WINDOW_DESC1 },
+        { "headerText2", IDS_BRAVE_PRIVATE_NEW_TAB_PRIVATE_WINDOW_DESC2 },
         { "headerButton", IDS_BRAVE_PRIVATE_NEW_TAB_PRIVATE_WINDOW_BUTTON },
 
         // Private Tab - Header Private Window with Tor

diff --git a/browser/ui/webui/new_tab_page/brave_new_tab_message_handler.cc b/browser/ui/webui/new_tab_page/brave_new_tab_message_handler.cc
@@ -123,6 +123,9 @@ base::DictionaryValue GetPrivatePropertiesDictionary(PrefService* prefs) {
   private_data.SetBoolean(
       "useAlternativePrivateSearchEngine",
       prefs->GetBoolean(kUseAlternativeSearchEngineProvider));
+  private_data.SetBoolean(
+      "showAlternativePrivateSearchEngineToggle",
+      prefs->GetBoolean(kShowAlternativeSearchEngineProviderToggle));
   return private_data;
 }
 

diff --git a/common/pref_names.cc b/common/pref_names.cc
@@ -31,6 +31,8 @@ const char kWidevineOptedIn[] = "brave.widevine_opted_in";
 const char kAskWidevineInstall[] = "brave.ask_widevine_install";
 const char kUseAlternativeSearchEngineProvider[] =
     "brave.use_alternate_private_search_engine";
+const char kShowAlternativeSearchEngineProviderToggle[] =
+    "brave.show_alternate_private_search_engine_toggle";
 const char kAlternativeSearchEngineProviderInTor[] =
     "brave.alternate_private_search_engine_in_tor";
 const char kLocationBarIsWide[] = "brave.location_bar_is_wide";

diff --git a/common/pref_names.h b/common/pref_names.h
@@ -26,6 +26,7 @@ extern const char kStatsReportingEnabled[];
 extern const char kWidevineOptedIn[];
 extern const char kAskWidevineInstall[];
 extern const char kUseAlternativeSearchEngineProvider[];
+extern const char kShowAlternativeSearchEngineProviderToggle[];
 extern const char kAlternativeSearchEngineProviderInTor[];
 extern const char kBraveThemeType[];
 extern const char kUseOverriddenBraveThemeType[];

diff --git a/components/brave_new_tab_ui/api/privateTabData.ts b/components/brave_new_tab_ui/api/privateTabData.ts
@@ -14,6 +14,7 @@ import * as Cr from 'chrome://resources/js/cr.m'
 
 export type PrivateTabData = {
   useAlternativePrivateSearchEngine: boolean
+  showAlternativePrivateSearchEngineToggle: boolean
 }
 
 type PrivateTabDataUpdatedHandler = (data: PrivateTabData) => void

diff --git a/components/brave_new_tab_ui/components/private/box/index.ts b/components/brave_new_tab_ui/components/private/box/index.ts
@@ -16,6 +16,18 @@ export const Box = styled('section')<{}>`
   border: 1px solid rgba(255,255,255,0.25);
 `
 
+export const ControlBox = styled('section')<{}>`
+  box-sizing: border-box;
+  -webkit-font-smoothing: antialiased;
+  padding: 10px 20px 10px;
+  border-radius: 12px;
+  border: 1px solid rgba(255,255,255,0.25);
+  display: flex;
+  justify-content: center;
+  width: 60%;
+  margin: 10px auto;
+`
+
 export const HeaderBox = styled('section')<{}>`
   box-sizing: border-box;
   -webkit-font-smoothing: antialiased;
@@ -31,7 +43,7 @@ export const DuckDuckGoImage = styled(DuckDuckGoIcon)`
   box-sizing: border-box;
   display: block;
   width: 40px;
-  margin-bottom: 20px;
+  margin-right: 10px;
 `
 
 export const TorLockImage = styled(TorLockIcon)`
@@ -45,10 +57,14 @@ export const PrivateImage = styled('img')<{}>`
   box-sizing: border-box;
   display: block;
   width: 293px;
+  margin: auto;
+`
 
-  @media screen and (max-width: 1170px) {
-    margin: auto;
-  }
+export const PrivacyEyeImage = styled('img')<{}>`
+  box-sizing: border-box;
+  display: block;
+  width: 73px;
+  margin: auto;
 `
 
 export const TorImage = styled('img')<{}>`
@@ -78,8 +94,9 @@ export const Title = styled(Heading)`
   letter-spacing: 0.02px;
   font-weight: 500;
   color: #fff;
-  margin: 0 0 0px;
+  margin: auto;
 `
+
 export const Text = styled('p')<{}>`
   font-family: ${p => p.theme.fontFamily.body};
   letter-spacing: 0.19px;
@@ -105,14 +122,14 @@ export const PurpleButton = styled(Button as ComponentType<ButtonProps>)`
 `
 export const Link = styled('a')<{}>`
   font-family: ${p => p.theme.fontFamily.heading};
-  font-size: 14px;
-  color: #814EFF;
+  font-size: 15px;
+  color: #fff;
   font-style: normal;
   line-height: 1;
   align-self: center;
   margin: 25px 20px 0 0;
   cursor: pointer;
-  text-decoration: none;
+  text-decoration: underline;
 `
 
 interface FakeButtonProps {

diff --git a/components/brave_new_tab_ui/components/private/grid/index.ts b/components/brave_new_tab_ui/components/private/grid/index.ts
@@ -81,12 +81,63 @@ export const Grid2Columns = styled('section')<{}>`
   }
 `
 
+export const Grid3Columns = styled('section')<{}>`
+  box-sizing: border-box;
+  display: grid;
+  height: 100%;
+  grid-template-columns: 10% 45% 45%;
+  grid-template-areas:
+    "header header header"
+    "image content1 content2";
+
+  grid-auto-rows: auto;
+  grid-gap: 20px 20px;
+  padding: 0;
+  justify-items: center;
+
+  > *:first-child {
+    grid-area: header;
+  }
+
+  > *:nth-child(2) {
+    grid-area: image;
+  }
+
+  > *:nth-child(3) {
+    grid-area: content1;
+  }
+
+  > *:nth-child(4) {
+    grid-area: content2;
+  }
+
+  @media screen and (max-width: 1170px) {
+    grid-template-columns: 460px;
+    justify-content: center;
+    grid-template-areas:
+    "header"
+    "content1"
+    "content2";
+
+    > *:nth-child(2) {
+      display: none;
+    }
+  }
+
+  @media screen and (max-width: 490px) {
+    /* TODO: @cezaraugusto this needs more love */
+    zoom: 0.8;
+  }
+`
+
 export const HeaderGrid = styled('section')<{}>`
   box-sizing: border-box;
   display: grid;
   height: 100%;
-  grid-template-columns: auto 1fr;
-  grid-template-areas: "image content";
+  grid-template-columns: 1fr;
+  grid-template-areas:
+    "image"
+    "content";
 
   grid-auto-rows: auto;
   grid-gap: 50px;
@@ -115,3 +166,16 @@ export const ButtonGroup = styled('footer')<{}>`
   flex: 1;
   justify-content: flex-start;
 `
+
+export const ToggleGroup = styled('footer')<{}>`
+  display: flex;
+  flex: 1;
+  justify-content: space-between;
+  align-items: center;
+`
+
+export const IconText = styled('div')<{}>`
+  display: flex;
+  justify: space-between;
+  align-items: center;
+`
diff --git a/components/brave_new_tab_ui/components/private/index.ts b/components/brave_new_tab_ui/components/private/index.ts
@@ -11,13 +11,23 @@ import {
   Footer
 } from './modal'
 import { Page, PageWrapper } from './page'
-import { Grid, Grid2Columns, HeaderGrid, ButtonGroup } from './grid'
+import {
+  Grid,
+  Grid2Columns,
+  Grid3Columns,
+  HeaderGrid,
+  ButtonGroup,
+  ToggleGroup,
+  IconText
+} from './grid'
 import {
   Box,
   Content,
+  ControlBox,
   HeaderBox,
   DuckDuckGoImage,
   TorLockImage,
+  PrivacyEyeImage,
   PrivateImage,
   TorImage,
   SubTitle,
@@ -39,13 +49,18 @@ export {
   PageWrapper,
   Grid,
   Grid2Columns,
+  Grid3Columns,
   HeaderGrid,
   ButtonGroup,
+  ToggleGroup,
+  IconText,
   Box,
   Content,
+  ControlBox,
   HeaderBox,
   DuckDuckGoImage,
   TorLockImage,
+  PrivacyEyeImage,
   PrivateImage,
   TorImage,
   SubTitle,

diff --git a/components/brave_new_tab_ui/components/private/page/index.ts b/components/brave_new_tab_ui/components/private/page/index.ts
@@ -11,7 +11,7 @@ interface PageProps {
 export const Page = styled('div')<PageProps>`
   box-sizing: border-box;
   -webkit-font-smoothing: antialiased;
-  background: linear-gradient(${p => p.isPrivate ? '#381980' : '#5F0C8A'}, #0C041E);
+  background: linear-gradient(${p => p.isPrivate ? '180deg, #0C041E -8.41%, #4E21B7 98.85%' : '#5F0C8A, #0C041E'});
   min-height: 100vh;
   height: initial;
 `