udittyagi

import React from 'react';
import Comp3 from './comp3';
import Comp4 from './comp4';

const Comp2 = () => (
  <div className="comp2">
    Comp2
    <div className="compContainer">
      <Comp3 />
      <Comp4 />

udittyagi

import React from 'react';
import { useUser } from './user';

const Comp4 = () => {
  const [user, changeUser] = useUser();
  return (
    <div className="comp3">
      Comp4
      <hr />
      <p>{user && user.id}</p>

udittyagi

import React from 'react';
import { useUser } from './user';

const Comp3 = () => {
  const [user] = useUser();
  return (
    <div className="comp3">
      Comp3
      <hr />
      <p>{user && user.id}</p>

udittyagi

import React, {
  useState,
  useEffect,
  useContext,
  useCallback,
  useMemo
} from 'react'
import axios from 'axios'

const UserContext = React.createContext(undefined);

udittyagi

import React from 'react';
import Comp2 from './comp2';

const Comp1 = () => (
  <div className="comp1">
    Comp1
    <Comp2 />
  </div>
)

udittyagi

import React, {useState} from 'react';

import Comp1 from './comp1';
import { UserProvider } from './user'
import './App.css';

function App() {
  const [number, setNumber] = useState(0);

  const changeNumberHandler = () => {

udittyagi

import React, {
  useState,
  useEffect,
  useContext,
} from 'react'
import axios from 'axios'

const UserContext = React.createContext(undefined);

const UserProvider = ({

udittyagi

import React, { useEffect, useState } from 'react';
import axios from 'axios';

import Image from './image'
import useIO from './useIO'
import fallbackImage from './assets/logo.svg'

function LazyLoadImg() {
  const [data, setData] = useState([])

udittyagi

useEffect(() => {
    entries.forEach(entry => {
      if (entry.isIntersecting) {
        let lazyImage = entry.target;
        lazyImage.src = lazyImage.dataset.src;
        lazyImage.classList.remove("lazy");
        observer.unobserve(lazyImage);
      }
    })
  }, [entries, observer])

udittyagi

useEffect(() => {
    if (data.length) {
      let img = Array.from(document.getElementsByClassName('lazy'));
      setElements(img)
    }
  }, [data, setElements])