diff --git a/web/src/beta/features/Editor/index.tsx b/web/src/beta/features/Editor/index.tsx
index 98c507a183..c50d5fbeb0 100644
--- a/web/src/beta/features/Editor/index.tsx
+++ b/web/src/beta/features/Editor/index.tsx
@@ -179,11 +179,6 @@ const Editor: React.FC<Props> = ({ sceneId, projectId, workspaceId, tab }) => {
     handleWidgetEditorToggle,
   });
 
-  const handleTabChange = useCallback(
-    () => storyPanelRef.current?.handleCurrentPageChange(undefined),
-    [storyPanelRef],
-  );
-
   return (
     <DndProvider>
       <Wrapper>
@@ -192,7 +187,6 @@ const Editor: React.FC<Props> = ({ sceneId, projectId, workspaceId, tab }) => {
           projectId={projectId}
           workspaceId={workspaceId}
           currentTab={tab}
-          onTabChange={handleTabChange}
         />
         <MainSection>
           {leftPanel && (
diff --git a/web/src/beta/features/Navbar/index.tsx b/web/src/beta/features/Navbar/index.tsx
index ab1e10a534..b6f91322a5 100644
--- a/web/src/beta/features/Navbar/index.tsx
+++ b/web/src/beta/features/Navbar/index.tsx
@@ -11,7 +11,6 @@ type Props = {
   isDashboard?: boolean;
   currentTab?: Tab;
   page?: "editor" | "settings";
-  onTabChange?: () => void;
 };
 
 export const Tabs = ["map", "story", "widgets", "publish"] as const;
@@ -30,7 +29,6 @@ const Navbar: React.FC<Props> = ({
   currentTab = "map",
   isDashboard = false,
   page = "editor",
-  onTabChange,
 }) => {
   const {
     currentProject,
@@ -50,7 +48,6 @@ const Navbar: React.FC<Props> = ({
     currentTab,
     sceneId,
     page,
-    onTabChange,
   });
 
   return (
diff --git a/web/src/beta/features/Navbar/useRightSection.tsx b/web/src/beta/features/Navbar/useRightSection.tsx
index 8de3bce1ea..38e67feb3d 100644
--- a/web/src/beta/features/Navbar/useRightSection.tsx
+++ b/web/src/beta/features/Navbar/useRightSection.tsx
@@ -11,12 +11,11 @@ type Props = {
   currentTab?: Tab;
   sceneId?: string;
   page: "editor" | "settings";
-  onTabChange?: () => void;
 };
 
-const useRightSide = ({ currentTab, page, sceneId, onTabChange }: Props) => {
+const useRightSide = ({ currentTab, page, sceneId }: Props) => {
   const t = useT();
-  const handleEditorNavigation = useEditorNavigation({ sceneId, onTabChange });
+  const handleEditorNavigation = useEditorNavigation({ sceneId });
 
   const rightSide = useMemo(() => {
     if (page === "editor") {
diff --git a/web/src/beta/features/ProjectSettings/innerPages/PublicSettings/index.tsx b/web/src/beta/features/ProjectSettings/innerPages/PublicSettings/index.tsx
index 7592f461b4..ef656edc6e 100644
--- a/web/src/beta/features/ProjectSettings/innerPages/PublicSettings/index.tsx
+++ b/web/src/beta/features/ProjectSettings/innerPages/PublicSettings/index.tsx
@@ -1,4 +1,4 @@
-import { useMemo } from "react";
+import { useCallback, useMemo, useState } from "react";
 
 import { Story } from "@reearth/services/api/storytellingApi/utils";
 import { useT } from "@reearth/services/i18n";
@@ -60,6 +60,7 @@ const PublicSettings: React.FC<Props> = ({
   onUpdateProjectAlias,
 }) => {
   const t = useT();
+  const [selectedTab, selectTab] = useState(currentStory ? currentStory.id : "map");
 
   const menu = useMemo(
     () => [
@@ -67,29 +68,37 @@ const PublicSettings: React.FC<Props> = ({
         id: "map",
         title: t("Map"),
         linkTo: `/settings/project/${project.id}/public/`,
-        active: !currentStory,
+        active: selectedTab === "map",
       },
       ...stories.map(s => ({
         id: s.id,
         title: s.title,
         linkTo: `/settings/project/${project.id}/public/${s.id}`,
-        active: s.id === currentStory?.id,
+        active: selectedTab === s.id,
       })),
     ],
-    [stories, project.id, currentStory, t],
+    [stories, selectedTab, project.id, t],
   );
 
+  const handleTabChange = useCallback((tab: string) => selectTab(tab), []);
+
   return (
     <InnerPage wide>
       <InnerMenu>
         {menu.map(s => (
-          <MenuItem key={s.id} text={s.title} active={s.active} linkTo={s.linkTo} />
+          <MenuItem
+            key={s.id}
+            text={s.title}
+            active={s.active}
+            linkTo={s.linkTo}
+            onClick={() => handleTabChange(s.id)}
+          />
         ))}
       </InnerMenu>
       <SettingsWrapper>
         {project.isArchived ? (
           <ArchivedSettingNotice />
-        ) : currentStory ? (
+        ) : selectedTab === currentStory?.id ? (
           <PublicSettingsDetail
             key={currentStory.id}
             settingsItem={currentStory}
diff --git a/web/src/beta/features/PublishedVisualizer/hooks.ts b/web/src/beta/features/PublishedVisualizer/hooks.ts
index b98a2635cd..43d29cc1b9 100644
--- a/web/src/beta/features/PublishedVisualizer/hooks.ts
+++ b/web/src/beta/features/PublishedVisualizer/hooks.ts
@@ -110,12 +110,12 @@ export default (alias?: string) => {
       return {
         align: align ?? "start",
         padding: {
-          top: padding?.top ?? 6,
-          bottom: padding?.bottom ?? 6,
-          left: padding?.left ?? 6,
-          right: padding?.right ?? 6,
+          top: padding?.top || 6,
+          bottom: padding?.bottom || 6,
+          left: padding?.left || 6,
+          right: padding?.right || 6,
         },
-        gap: area?.gap ?? 6,
+        gap: area?.gap || 6,
         widgets: areaWidgets || [],
         background: area?.background as string | undefined,
         centered: area?.centered,
diff --git a/web/src/beta/hooks/navigationHooks.ts b/web/src/beta/hooks/navigationHooks.ts
index 7cd1a1950b..2dccd9a0b8 100644
--- a/web/src/beta/hooks/navigationHooks.ts
+++ b/web/src/beta/hooks/navigationHooks.ts
@@ -3,22 +3,15 @@ import { useNavigate } from "react-router-dom";
 
 import { Tab } from "@reearth/beta/features/Navbar";
 
-export const useEditorNavigation = ({
-  sceneId,
-  onTabChange,
-}: {
-  sceneId?: string;
-  onTabChange?: () => void;
-}) => {
+export const useEditorNavigation = ({ sceneId }: { sceneId?: string }) => {
   const navigate = useNavigate();
 
   const handleNavigate = useCallback(
     (tab: Tab) => {
       if (!sceneId) return;
-      onTabChange?.();
       navigate(`/scene/${sceneId}/${tab}`);
     },
-    [sceneId, onTabChange, navigate],
+    [sceneId, navigate],
   );
 
   return sceneId ? handleNavigate : undefined;
diff --git a/web/src/beta/lib/core/StoryPanel/hooks.ts b/web/src/beta/lib/core/StoryPanel/hooks.ts
index 04cb5a895f..7f4fdd576b 100644
--- a/web/src/beta/lib/core/StoryPanel/hooks.ts
+++ b/web/src/beta/lib/core/StoryPanel/hooks.ts
@@ -199,6 +199,11 @@ export default (
     };
   }, [currentPageId, selectedStory?.pages, visualizer, handleLayerReset]);
 
+  // Reset parent of core's current page on StoryPanel unmount
+  useEffect(() => {
+    return () => onCurrentPageChange?.();
+  }, [onCurrentPageChange]);
+
   return {
     pageInfo,
     selectedPageId,