Issue: add the loading page

[shinevue]

There isn't loading component when the page is rendered.

[BlackGhost2693]

import React, { useState, useEffect } from 'react';
import Loading from './Loading';

function App() {
const [loading, setLoading] = useState(true);
const [data, setData] = useState(null);

useEffect(() => {
    // Simulate data fetching
    setTimeout(() => {
        // Here you would fetch your data from an API
        setData("Hello, this is your data!");
        setLoading(false);
    }, 2000); // Simulate a 2-second load time
}, []);

if (loading) {
    return <Loading />;
}

return (
    <div className="App">
        <h1>Data Loaded</h1>
        <p>{data}</p>
    </div>
);

}

export default App;

[7CodeWizard]

import React, { useState, useEffect } from 'react';
import LoadingSpinner from './LoadingSpinner'; // Import the loading spinner

const App = () => {
const [loading, setLoading] = useState(true);

useEffect(() => {
// Simulate an API call
const timer = setTimeout(() => {
setLoading(false);
}, 3000); // 3-second loading

return () => clearTimeout(timer);

}, []);

return (

{loading ? (

) : (

Content Loaded!

)}

);
};

export default App;