{"record":{"id":"8badea9c4ada231e","repo":"sickn33/agentic-awesome-skills","slug":"missing-appprovider","errorCode":null,"errorMessage":"Missing AppProvider","messagePattern":"Missing AppProvider","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"skills/fp-react/SKILL.md","lineNumber":525,"sourceCode":"    updateUser: (id: string, data: Partial<User>) => Promise<User>\n  }\n  analytics: {\n    track: (event: string, data?: object) => void\n  }\n}\n\n// Create context\nconst DepsContext = createContext<AppDependencies | null>(null)\n\n// Provider\nfunction AppProvider({ deps, children }: { deps: AppDependencies; children: ReactNode }) {\n  return <DepsContext.Provider value={deps}>{children}</DepsContext.Provider>\n}\n\n// Hook to use dependencies\nfunction useDeps(): AppDependencies {\n  const deps = useContext(DepsContext)\n  if (!deps) throw new Error('Missing AppProvider')\n  return deps\n}\n```\n\n### Use in Components\n\n```typescript\nfunction UserProfile({ userId }: { userId: string }) {\n  const { api, analytics } = useDeps()\n  const [user, setUser] = useState<RemoteData<Error, User>>(notAsked())\n\n  useEffect(() => {\n    setUser(loading())\n    api.getUser(userId)\n      .then(u => {\n        setUser(success(u))\n        analytics.track('user_viewed', { userId })\n      })","sourceCodeStart":507,"sourceCodeEnd":543,"githubUrl":"https://github.com/sickn33/agentic-awesome-skills/blob/58d857988fcfac6986206bca2b2fe223aa437e4b/skills/fp-react/SKILL.md#L507-L543","documentation":"Thrown by the useDeps hook in the fp-react skill when useContext(DepsContext) returns falsy — the component using the hook is rendered outside the matching <DepsContext.Provider>. It is the classic 'provider missing' invariant for React context.","triggerScenarios":"Calling useDeps() in a component that is not a descendant of <AppProvider> (or is rendered into a different React root, e.g. a modal portal or test renderer created without the provider).","commonSituations":"New components mounted outside the provider tree; unit tests with render() that forget wrapper: AppProvider; multiple React copies so the context instance differs between provider and consumer; portals to document.body.","solutions":["Wrap the app (or the specific subtree/test render) in <AppProvider> so the context is populated","For portals and separate roots, re-wrap the portal content in the provider","Ensure only one copy of React/context module (check for duplicate node_modules)"],"exampleFix":"// before\nconst deps = useContext(DepsContext)\nif (!deps) throw new Error('Missing AppProvider')\n\n// after: make the invariant unmissable at render time\nfunction useDeps(): AppDependencies {\n  const deps = useContext(DepsContext)\n  if (!deps) throw new Error('useDeps must be used inside <AppProvider>')\n  return deps\n}\n// and in tests:\nrender(<AppProvider><MyComponent /></AppProvider>)","handlingStrategy":"type-guard","validationCode":"// In tests, always render with the provider:\nrender(<AppProvider><Component /></AppProvider>)","typeGuard":"const hasDeps = (d: unknown): d is AppDependencies =>\n  typeof d === 'object' && d !== null && 'api' in d","tryCatchPattern":null,"preventionTips":["Always pass wrapper to test renderers","Wrap portal subtrees in the provider","Keep a single React copy in the dependency tree"],"tags":["react","context","provider","hooks"],"backgroundTag":"missing-context-provider","analyzedSha":"58d857988fcfac6986206bca2b2fe223aa437e4b","analyzedAt":"2026-08-26T11:55:59.350Z","schemaVersion":2},"datasetVersion":"2026-08-26T14:46:13.012Z"}