11// src/contexts/EnvironmentContext.tsx
22import React , {
3- createContext ,
4- useContext ,
5- useEffect ,
6- useState ,
7- useCallback ,
8- ReactNode ,
9- } from "react" ;
10- import { useHistory } from "react-router-dom" ;
11- import { getEnvironmentById } from "../services/environments.service" ;
12- import { Environment } from "../types/environment.types" ;
13-
14- interface EnvironmentContextType {
15- environment : Environment | null ;
16- loading : boolean ;
17- error : string | null ;
18- refresh : ( ) => void ;
3+ createContext ,
4+ useContext ,
5+ useEffect ,
6+ useState ,
7+ useCallback ,
8+ ReactNode ,
9+ } from "react" ;
10+ import { useHistory } from "react-router-dom" ;
11+ import {
12+ getEnvironmentById ,
13+ getEnvironments ,
14+ } from "../services/environments.service" ;
15+ import { Environment } from "../types/environment.types" ;
16+
17+ interface EnvironmentContextState {
18+ environment : Environment | null ;
19+ environments : Environment [ ] ;
20+ isLoadingEnvironment : boolean ;
21+ isLoadingEnvironments : boolean ;
22+ error : string | null ;
23+ }
24+
25+ const EnvironmentContext = createContext < EnvironmentContextState | undefined > (
26+ undefined
27+ ) ;
28+
29+ export const useEnvironmentContext = ( ) => {
30+ const context = useContext ( EnvironmentContext ) ;
31+ if ( ! context ) {
32+ throw new Error (
33+ "useEnvironmentContext must be used within an EnvironmentProvider"
34+ ) ;
1935 }
20-
21- const EnvironmentContext = createContext < EnvironmentContextType | undefined > ( undefined ) ;
22-
23- export const useEnvironmentContext = ( ) => {
24- const context = useContext ( EnvironmentContext ) ;
25- if ( ! context ) {
26- throw new Error ( "useEnvironmentContext must be used within an EnvironmentProvider" ) ;
36+ return context ;
37+ } ;
38+
39+ interface ProviderProps {
40+ envId : string ;
41+ children : ReactNode ;
42+ }
43+
44+ export const EnvironmentProvider : React . FC < ProviderProps > = ( {
45+ envId,
46+ children,
47+ } ) => {
48+ const [ environment , setEnvironment ] = useState < Environment | null > ( null ) ;
49+ const [ environments , setEnvironments ] = useState < Environment [ ] > ( [ ] ) ;
50+
51+ // Separate loading states
52+ const [ isLoadingEnvironment , setIsLoadingEnvironment ] =
53+ useState < boolean > ( true ) ;
54+ const [ isLoadingEnvironments , setIsLoadingEnvironments ] =
55+ useState < boolean > ( true ) ;
56+
57+ const [ error , setError ] = useState < string | null > ( null ) ;
58+ const history = useHistory ( ) ;
59+
60+ const fetchEnvironment = useCallback ( async ( ) => {
61+ setIsLoadingEnvironment ( true ) ;
62+ try {
63+ const data = await getEnvironmentById ( envId ) ;
64+ console . log ( "Environment data:" , data ) ;
65+ setEnvironment ( data ) ;
66+ } catch ( err ) {
67+ setError ( "Environment not found or failed to load" ) ;
68+ history . push ( "/404" ) ; // or a centralized error route
69+ } finally {
70+ setIsLoadingEnvironment ( false ) ;
2771 }
28- return context ;
29- } ;
30-
31- interface ProviderProps {
32- envId : string ;
33- children : ReactNode ;
34- }
35-
36- export const EnvironmentProvider : React . FC < ProviderProps > = ( { envId, children } ) => {
37- const [ environment , setEnvironment ] = useState < Environment | null > ( null ) ;
38- const [ loading , setLoading ] = useState < boolean > ( true ) ;
39- const [ error , setError ] = useState < string | null > ( null ) ;
40- const history = useHistory ( ) ;
41-
42- const fetchEnvironment = useCallback ( async ( ) => {
43- setLoading ( true ) ;
44- setError ( null ) ;
45- try {
46- const data = await getEnvironmentById ( envId ) ;
47- console . log ( "Environment data:" , data ) ;
48- setEnvironment ( data ) ;
49- } catch ( err ) {
50- setError ( "Environment not found or failed to load" ) ;
51- history . push ( "/404" ) ; // or a centralized error route
52- } finally {
53- setLoading ( false ) ;
54- }
55- } , [ envId , history ] ) ;
56-
57- useEffect ( ( ) => {
58- fetchEnvironment ( ) ;
59- } , [ fetchEnvironment ] ) ;
60-
61- const value : EnvironmentContextType = {
62- environment,
63- loading,
64- error,
65- refresh : fetchEnvironment ,
66- } ;
67-
68- return (
69- < EnvironmentContext . Provider value = { value } >
70- { children }
71- </ EnvironmentContext . Provider >
72- ) ;
72+ } , [ envId , history ] ) ;
73+
74+ const fetchEnvironments = useCallback ( async ( ) => {
75+ setIsLoadingEnvironments ( true ) ;
76+ try {
77+ const data = await getEnvironments ( ) ;
78+ console . log ( "Environments data:" , data ) ;
79+ setEnvironments ( data ) ;
80+ } catch ( err ) {
81+ setError ( "Failed to load environments list" ) ;
82+ } finally {
83+ setIsLoadingEnvironments ( false ) ;
84+ }
85+ } , [ ] ) ;
86+
87+ useEffect ( ( ) => {
88+ fetchEnvironment ( ) ;
89+ fetchEnvironments ( ) ;
90+ } , [ fetchEnvironment , fetchEnvironments ] ) ;
91+
92+
93+ const value : EnvironmentContextState = {
94+ environment,
95+ environments,
96+ isLoadingEnvironment,
97+ isLoadingEnvironments,
98+ error,
7399 } ;
74-
100+
101+ return (
102+ < EnvironmentContext . Provider value = { value } >
103+ { children }
104+ </ EnvironmentContext . Provider >
105+ ) ;
106+ } ;
0 commit comments