diff --git a/web/app/components/workflow/skill/context.tsx b/web/app/components/workflow/skill/context.tsx
index e286b411d8..7e9291717f 100644
--- a/web/app/components/workflow/skill/context.tsx
+++ b/web/app/components/workflow/skill/context.tsx
@@ -1,45 +1,21 @@
 'use client'
 
-import {
-  useEffect,
-  useMemo,
-  useRef,
-} from 'react'
-import { useStore as useAppStore } from '@/app/components/app/store'
-import {
-  createSkillEditorStore,
-  SkillEditorContext,
-} from './store'
+import type { SkillEditorStore } from './store'
+import { useRef } from 'react'
+import { createSkillEditorStore, SkillEditorContext } from './store'
 
-/**
- * SkillEditorProvider
- *
- * Provides the SkillEditor store to all child components.
- * The store is created once per mount and persists across view switches.
- * When appId changes, the store is reset.
- */
-export type SkillEditorProviderProps = {
+type SkillEditorProviderProps = {
   children: React.ReactNode
 }
 
-export const SkillEditorProvider = ({ children }: SkillEditorProviderProps) => {
-  // Create store once using useMemo (stable across re-renders)
-  const store = useMemo(() => createSkillEditorStore(), [])
+export function SkillEditorProvider({ children }: SkillEditorProviderProps): React.ReactElement {
+  const storeRef = useRef<SkillEditorStore | undefined>(undefined)
 
-  const appDetail = useAppStore(s => s.appDetail)
-  const appId = appDetail?.id
-  const prevAppIdRef = useRef<string | undefined>(undefined)
-
-  // Reset store when appId changes
-  useEffect(() => {
-    if (prevAppIdRef.current !== undefined && prevAppIdRef.current !== appId)
-      store.getState().reset()
-
-    prevAppIdRef.current = appId
-  }, [appId, store])
+  if (!storeRef.current)
+    storeRef.current = createSkillEditorStore()
 
   return (
-    <SkillEditorContext.Provider value={store}>
+    <SkillEditorContext.Provider value={storeRef.current}>
       {children}
     </SkillEditorContext.Provider>
   )