commit 4ebde477b91ca17bde6837c052f3fbd00828ce30
parent 40c57cde8d8753612c9dec4f69807bd8876fe154
Author: Reem H <42309026+reemhamz@users.noreply.github.com>
Date: Tue, 28 Oct 2025 10:02:49 +0000
Bug 1984996 - Reset timer widget when it's disabled and re-enabled from context menu. r=home-newtab-reviewers,npypchenko
Differential Revision: https://phabricator.services.mozilla.com/D270115
Diffstat:
2 files changed, 78 insertions(+), 2 deletions(-)
diff --git a/browser/extensions/newtab/content-src/components/Widgets/Widgets.jsx b/browser/extensions/newtab/content-src/components/Widgets/Widgets.jsx
@@ -2,13 +2,13 @@
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at http://mozilla.org/MPL/2.0/. */
-import React from "react";
+import React, { useEffect, useRef } from "react";
import { useDispatch, useSelector } from "react-redux";
import { Lists } from "./Lists/Lists";
import { FocusTimer } from "./FocusTimer/FocusTimer";
import { MessageWrapper } from "content-src/components/MessageWrapper/MessageWrapper";
import { WidgetsFeatureHighlight } from "../DiscoveryStreamComponents/FeatureHighlight/WidgetsFeatureHighlight";
-import { actionCreators as ac } from "common/Actions.mjs";
+import { actionCreators as ac, actionTypes as at } from "common/Actions.mjs";
const PREF_WIDGETS_LISTS_ENABLED = "widgets.lists.enabled";
const PREF_WIDGETS_SYSTEM_LISTS_ENABLED = "widgets.system.lists.enabled";
@@ -19,6 +19,8 @@ const PREF_FEEDS_SECTION_TOPSTORIES = "feeds.section.topstories";
function Widgets() {
const prefs = useSelector(state => state.Prefs.values);
const { messageData } = useSelector(state => state.Messages);
+ const timerType = useSelector(state => state.TimerWidget.timerType);
+ const timerData = useSelector(state => state.TimerWidget);
const dispatch = useDispatch();
const nimbusListsEnabled = prefs.widgetsConfig?.listsEnabled;
@@ -42,6 +44,44 @@ function Widgets() {
const recommendedStoriesEnabled = prefs[PREF_FEEDS_SECTION_TOPSTORIES];
+ // track previous timerEnabled state to detect when it becomes disabled
+ const prevTimerEnabledRef = useRef(timerEnabled);
+
+ // Reset timer when it becomes disabled
+ useEffect(() => {
+ const wasTimerEnabled = prevTimerEnabledRef.current;
+ const isTimerEnabled = timerEnabled;
+ const originalTime = timerType === "focus" ? 1500 : 300;
+
+ // Only reset if timer was enabled and is now disabled
+ if (wasTimerEnabled && !isTimerEnabled && timerData) {
+ // Reset both focus and break timers to their initial durations
+ dispatch(
+ ac.AlsoToMain({
+ type: at.WIDGETS_TIMER_RESET,
+ data: {
+ timerType,
+ duration: originalTime,
+ initialDuration: originalTime,
+ },
+ })
+ );
+
+ // Set the timer type back to "focus"
+ dispatch(
+ ac.AlsoToMain({
+ type: at.WIDGETS_TIMER_SET_TYPE,
+ data: {
+ timerType: "focus",
+ },
+ })
+ );
+ }
+
+ // Update the ref to track current state
+ prevTimerEnabledRef.current = isTimerEnabled;
+ }, [timerEnabled, timerData, dispatch, timerType]);
+
function handleUserInteraction(widgetName) {
const prefName = `widgets.${widgetName}.interaction`;
const hasInteracted = prefs[prefName];
diff --git a/browser/extensions/newtab/data/content/activity-stream.bundle.js b/browser/extensions/newtab/data/content/activity-stream.bundle.js
@@ -13834,6 +13834,8 @@ function Widgets() {
const {
messageData
} = (0,external_ReactRedux_namespaceObject.useSelector)(state => state.Messages);
+ const timerType = (0,external_ReactRedux_namespaceObject.useSelector)(state => state.TimerWidget.timerType);
+ const timerData = (0,external_ReactRedux_namespaceObject.useSelector)(state => state.TimerWidget);
const dispatch = (0,external_ReactRedux_namespaceObject.useDispatch)();
const nimbusListsEnabled = prefs.widgetsConfig?.listsEnabled;
const nimbusTimerEnabled = prefs.widgetsConfig?.timerEnabled;
@@ -13842,6 +13844,40 @@ function Widgets() {
const listsEnabled = (nimbusListsTrainhopEnabled || nimbusListsEnabled || prefs[PREF_WIDGETS_SYSTEM_LISTS_ENABLED]) && prefs[PREF_WIDGETS_LISTS_ENABLED];
const timerEnabled = (nimbusTimerTrainhopEnabled || nimbusTimerEnabled || prefs[PREF_WIDGETS_SYSTEM_TIMER_ENABLED]) && prefs[PREF_WIDGETS_TIMER_ENABLED];
const recommendedStoriesEnabled = prefs[PREF_FEEDS_SECTION_TOPSTORIES];
+
+ // track previous timerEnabled state to detect when it becomes disabled
+ const prevTimerEnabledRef = (0,external_React_namespaceObject.useRef)(timerEnabled);
+
+ // Reset timer when it becomes disabled
+ (0,external_React_namespaceObject.useEffect)(() => {
+ const wasTimerEnabled = prevTimerEnabledRef.current;
+ const isTimerEnabled = timerEnabled;
+ const originalTime = timerType === "focus" ? 1500 : 300;
+
+ // Only reset if timer was enabled and is now disabled
+ if (wasTimerEnabled && !isTimerEnabled && timerData) {
+ // Reset both focus and break timers to their initial durations
+ dispatch(actionCreators.AlsoToMain({
+ type: actionTypes.WIDGETS_TIMER_RESET,
+ data: {
+ timerType,
+ duration: originalTime,
+ initialDuration: originalTime
+ }
+ }));
+
+ // Set the timer type back to "focus"
+ dispatch(actionCreators.AlsoToMain({
+ type: actionTypes.WIDGETS_TIMER_SET_TYPE,
+ data: {
+ timerType: "focus"
+ }
+ }));
+ }
+
+ // Update the ref to track current state
+ prevTimerEnabledRef.current = isTimerEnabled;
+ }, [timerEnabled, timerData, dispatch, timerType]);
function handleUserInteraction(widgetName) {
const prefName = `widgets.${widgetName}.interaction`;
const hasInteracted = prefs[prefName];
