[NTP Next] Prototype

.storybook/main.ts

@@ -22,7 +22,11 @@ const slashStoriesIndexer: Indexer = {
 const config: StorybookConfig = {
   stories: process.env.STORYBOOK_STORYPATH
     ? [`../${process.env.STORYBOOK_STORYPATH}`]
-    : ['../components/**/stories/*.tsx', '../components/**/*.stories.tsx'],
+    : [
+      '../components/**/stories/*.tsx',
+      '../components/**/*.stories.tsx',
+      '../browser/resources/**/stories/*.tsx'
+    ],
   typescript: {
     check: false,
     reactDocgen: false,

browser/about_flags.cc

@@ -535,6 +535,13 @@ const flags_ui::FeatureEntry::FeatureVariation kZCashFeatureVariations[] = {
           kOsDesktop,                                                          \
           FEATURE_VALUE_TYPE(features::kBraveNtpSearchWidget),                 \
       },                                                                       \
+      {                                                                        \
+          "brave-use-updated-ntp",                                             \
+          "Use the updated New Tab Page",                                      \
+          "Uses an updated version of the New Tab Page",                       \
+          kOsDesktop,                                                          \
+          FEATURE_VALUE_TYPE(features::kUseUpdatedNTP),                        \
+      },                                                                       \
       {                                                                        \
           "brave-adblock-cname-uncloaking",                                    \
           "Enable CNAME uncloaking",                                           \

browser/brave_browser_features.cc

@@ -9,6 +9,10 @@
 
 namespace features {
 
+BASE_FEATURE(kUseUpdatedNTP,
+             "BraveUseUpdatedNewTabPage",
+             base::FEATURE_DISABLED_BY_DEFAULT);
+
 // Cleanup Session Cookies on browser restart if Session Restore is enabled.
 BASE_FEATURE(kBraveCleanupSessionCookiesOnSessionRestore,
              "BraveCleanupSessionCookiesOnSessionRestore",

browser/brave_browser_features.h

@@ -13,6 +13,7 @@
 
 namespace features {
 
+BASE_DECLARE_FEATURE(kUseUpdatedNTP);
 BASE_DECLARE_FEATURE(kBraveCleanupSessionCookiesOnSessionRestore);
 BASE_DECLARE_FEATURE(kBraveCopyCleanLinkByDefault);
 BASE_DECLARE_FEATURE(kBraveCopyCleanLinkFromJs);

browser/brave_content_browser_client.cc

@@ -90,6 +90,7 @@
 #include "brave/components/decentralized_dns/content/decentralized_dns_navigation_throttle.h"
 #include "brave/components/google_sign_in_permission/google_sign_in_permission_throttle.h"
 #include "brave/components/google_sign_in_permission/google_sign_in_permission_util.h"
+#include "brave/components/ntp_background_images/browser/mojom/ntp_background_images.mojom.h"
 #include "brave/components/playlist/common/buildflags/buildflags.h"
 #include "brave/components/playlist/common/features.h"
 #include "brave/components/request_otr/common/buildflags/buildflags.h"
@@ -234,6 +235,7 @@ using extensions::ChromeContentBrowserClientExtensionsPart;
 #if !BUILDFLAG(IS_ANDROID)
 #include "brave/browser/new_tab/new_tab_shows_navigation_throttle.h"
 #include "brave/browser/ui/geolocation/brave_geolocation_permission_tab_helper.h"
+#include "brave/browser/ui/webui/brave_new_tab_page_refresh/brave_new_tab_page_ui.h"
 #include "brave/browser/ui/webui/brave_news_internals/brave_news_internals_ui.h"
 #include "brave/browser/ui/webui/brave_rewards/rewards_page_top_ui.h"
 #include "brave/browser/ui/webui/brave_rewards/rewards_panel_ui.h"
@@ -666,14 +668,23 @@ void BraveContentBrowserClient::RegisterWebUIInterfaceBrokers(
           .Add<brave_new_tab_page::mojom::PageHandlerFactory>()
           .Add<brave_news::mojom::BraveNewsController>();
 
+  auto ntp_refresh_registration =
+      registry.ForWebUI<BraveNewTabPageUI>()
+          .Add<brave_new_tab_page_refresh::mojom::NewTabPageHandler>()
+          .Add<brave_rewards::mojom::RewardsPageHandler>()
+          .Add<
+              ntp_background_images::mojom::SponsoredRichMediaAdEventHandler>();
+
 #if BUILDFLAG(ENABLE_BRAVE_VPN)
   if (brave_vpn::IsBraveVPNFeatureEnabled()) {
     ntp_registration.Add<brave_vpn::mojom::ServiceHandler>();
+    ntp_refresh_registration.Add<brave_vpn::mojom::ServiceHandler>();
   }
 #endif
 
   if (base::FeatureList::IsEnabled(features::kBraveNtpSearchWidget)) {
     ntp_registration.Add<searchbox::mojom::PageHandler>();
+    ntp_refresh_registration.Add<searchbox::mojom::PageHandler>();
   }
 
   if (base::FeatureList::IsEnabled(

browser/resources/brave_new_tab_page_refresh/BUILD.gn

@@ -0,0 +1,32 @@
+# Copyright (c) 2025 The Brave Authors. All rights reserved.
+# This Source Code Form is subject to the terms of the Mozilla Public
+# 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("//brave/components/common/typescript.gni")
+import("//mojo/public/tools/bindings/mojom.gni")
+
+assert(!is_android)
+
+transpile_web_ui("resources") {
+  entry_points = [ [
+        "brave_new_tab_page",
+        rebase_path("brave_new_tab_page.tsx"),
+      ] ]
+  resource_name = "brave_new_tab_page"
+  output_module = true
+  deps = [
+    "//brave/browser/ui/webui/brave_new_tab_page_refresh:mojom_js",
+    "//brave/components/brave_ads/core/mojom:mojom_js",
+    "//brave/components/brave_rewards/core/mojom:webui_js",
+    "//brave/components/brave_vpn/common/mojom:mojom_js",
+    "//brave/components/ntp_background_images/browser/mojom:mojom_js",
+  ]
+}
+
+pack_web_resources("generated_resources") {
+  resource_name = "brave_new_tab_page"
+  output_dir =
+      "$root_gen_dir/brave/browser/resources/brave_new_tab_page_refresh"
+  deps = [ ":resources" ]
+}