разобрались с чистыми компонетами

src/App.jsx

@@ -2,11 +2,13 @@ import styles from './App.module.scss'
 
 import Header from './components/header'
 import ProductList from './components/list'
+import Timer from './components/timer'
 
 const App = () => {
 	return (
 		<div className={styles.container}>
 			<Header />
+			<Timer />
 			<ProductList />
 		</div>
 	)

src/components/timer/index.jsx

@@ -0,0 +1,21 @@
+import React, { useState, useEffect } from 'react'
+import styles from './index.module.scss'
+
+const Timer = () => {
+    const [seconds, setSeconds] = useState(0);
+    useEffect(() => {
+        const interval = setInterval(() => {
+            setSeconds(prev => prev + 1);
+        }, 1000);
+        return () => {
+            clearInterval(interval);
+        };
+    }, []);
+    return (
+        <div>
+            <h2>Прошло секунд: {seconds}</h2>
+        </div>
+    );
+}
+
+export default Timer