diff --git a/src/layout/MobileCalculatorPage.jsx b/src/layout/MobileCalculatorPage.jsx
index 83f8c3c1e..10351b1a1 100644
--- a/src/layout/MobileCalculatorPage.jsx
+++ b/src/layout/MobileCalculatorPage.jsx
@@ -276,7 +276,7 @@ function MobileBottomMenu(props) {
function MobileTreeNavigationHolder(props) {
const { metadata, type, buttonHeight } = props;
// Try to find the current focus in the tree.
- const [searchParams] = useSearchParams();
+ const [searchParams, setSearchParams] = useSearchParams();
const focus = searchParams.get("focus");
@@ -354,6 +354,11 @@ function MobileTreeNavigationHolder(props) {
margin: 0,
fontWeight: i === breadcrumbs.length - 1 ? "normal" : "lighter",
}}
+ onClick={() => {
+ let newSearch = new URLSearchParams(searchParams);
+ newSearch.set("focus", breadcrumb.name);
+ setSearchParams(newSearch);
+ }}
>
{breadcrumb.label}
{i < breadcrumbs.length - 1 && (
diff --git a/src/pages/PolicyPage.jsx b/src/pages/PolicyPage.jsx
index 9f24aa178..75b8c4849 100644
--- a/src/pages/PolicyPage.jsx
+++ b/src/pages/PolicyPage.jsx
@@ -19,6 +19,7 @@ import { Helmet } from "react-helmet";
import SearchParamNavButton from "../controls/SearchParamNavButton";
import style from "../style";
import DeprecationModal from "../modals/DeprecationModal";
+import { impactKeys } from "../pages/policy/output/ImpactTypes.jsx";
export function ParameterSearch(props) {
const { metadata, callback } = props;
@@ -155,15 +156,53 @@ export default function PolicyPage(props) {
);
} else if (isOutput) {
- middle = (
- <>
+ const POLICY_OUTPUT_TREE = getPolicyOutputTree(metadata.countryId);
+ const validFocusValues = impactKeys;
+ const stripped_focus = focus.replace("policyOutput.", "");
+
+ // Check if the current focus is within validFocusValues
+ if (
+ focus === "policyOutput.policyBreakdown" ||
+ focus === "policyOutput.codeReproducibility" ||
+ validFocusValues.includes(stripped_focus)
+ ) {
+ middle = (