feat: 🎸 updated older structure and added infinite scroll

Author: Pratham82

2024 Prep/machine_coding/react/src/App.css

@@ -1,7 +1,7 @@
 #root {
   max-width: 1280px;
   margin: 0 auto;
-  text-align: center;
+  /* text-align: center; */
 }
 
 .logo {

2024 Prep/machine_coding/react/src/App.tsx

@@ -1,35 +1,15 @@
-import reactLogo from './assets/react.svg'
-import viteLogo from '/vite.svg'
 import './App.css'
-import { useFetch } from './hooks'
-import { Loader } from './components'
+import { FileExplorer } from './components'
+import { fileExplorerData } from './data'
 
 function App() {
-  const { data, isLoading, isError } = useFetch(
-    'https://jsonplaceholder.typicode.com/posts?_limit=10'
-  )
-
-  if (isLoading) {
-    return <Loader />
-  }
   return (
-    <>
-      <div>
-        <a href="https://vitejs.dev" target="_blank">
-          <img src={viteLogo} className="logo" alt="Vite logo" />
-        </a>
-        <a href="https://react.dev" target="_blank">
-          <img src={reactLogo} className="logo react" alt="React logo" />
-        </a>
-      </div>
+    <div className="container">
       <h1>Vite + React</h1>
-
       <div>
-        {data.map(({ id, title }) => (
-          <div key={id}>{title}</div>
-        ))}
+        <FileExplorer data={fileExplorerData} />
       </div>
-    </>
+    </div>
   )
 }
 

2024 Prep/machine_coding/react/src/components/InfinteScroll.tsx renamed to 2024 Prep/machine_coding/react/src/components/InfiniteScroll.tsx

@@ -1,11 +1,10 @@
-import React, { useState, useEffect, useRef } from 'react'
+import { useState, useEffect, useRef } from 'react'
 import Loader from './Loader'
 import axios from 'axios'
 
-Loader
 const URL = 'https://jsonplaceholder.typicode.com/posts'
 
-export default function App() {
+export default function InfiniteScroll() {
   const [data, setData] = useState([])
   const [currentPage, setCurrentPage] = useState(1)
   const observerTarget = useRef(null)

2024 Prep/machine_coding/react/src/main.tsx

@@ -6,5 +6,5 @@ import './index.css'
 ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
     <App />
-  </React.StrictMode>,
+  </React.StrictMode>
 )