Env Var Fix (#3006)

Co-authored-by: jusrhee <justin@porter.run>

dashboard/src/main/home/cluster-dashboard/env-groups/ExpandedEnvGroupDashboard.tsx

@@ -25,11 +25,15 @@ const EnvGroupDashboard = (props: PropsType) => {
   const params = useParams<{ name: string }>();
   const { currentProject } = useContext(Context);
   const [expandedEnvGroup, setExpandedEnvGroup] = useState<any>();
+  const isTabActive = () => {
+    return !document.hidden;
+  };
 
   const {
     data: envGroups,
     isLoading: listEnvGroupsLoading,
     isError,
+    refetch,
   } = useQuery<any[]>(
     ["envGroupList", currentProject.id, namespace, props.currentCluster.id],
     async () => {
@@ -52,13 +56,16 @@ const EnvGroupDashboard = (props: PropsType) => {
       } catch (err) {
         throw err;
       }
+    },
+    {
+      enabled: false, // Initially disable the query
     }
   );
 
   useEffect(() => {
     const name = params.name;
 
-    if (!envGroups) {
+    if (!envGroups || !isTabActive()) {
       return;
     }
 
@@ -67,6 +74,11 @@ const EnvGroupDashboard = (props: PropsType) => {
     setExpandedEnvGroup(envGroup);
   }, [envGroups, params]);
 
+  useEffect(() => {
+    if (isTabActive()) {
+      refetch(); // Run the query when the component mounts and the tab is active
+    }
+  }, []);
   if (listEnvGroupsLoading) {
     return (
       <Placeholder>