Upload Test component

src/app/testing/page.tsx

@@ -1,13 +1,14 @@
 "use client";
 
+import Test from "@/components/widgets/Test/Test";
+
 export default function TestingPage() {
     return (
         <>
             <main>
                 <div className="text-center space-y-3 pt-10">
-                    <h1 className="font-bold text-[30px]">This is the testing page for Weejets.</h1>
-                    <p>Just import your created widget here for testing.</p>
                 </div>
+                <Test/>
             </main>
         </>
     )

src/components/widgets/Test/Test.json

@@ -0,0 +1,6 @@
+{
+  "id": "Test",
+  "title": "Test",
+  "description": "Just testing",
+  "author": "Wint3r"
+}

src/components/widgets/Test/Test.tsx

@@ -0,0 +1,24 @@
+"add client";
+
+import React, { useEffect, useState } from 'react';
+
+const RealTimeClock: React.FC = () => {
+  const [time, setTime] = useState<string>(new Date().toLocaleTimeString());
+
+  useEffect(() => {
+    const intervalId = setInterval(() => {
+      setTime(new Date().toLocaleTimeString());
+    }, 1000); // Update every second
+
+    return () => clearInterval(intervalId); // Cleanup on component unmount
+  }, []);
+
+  return (
+    <div style={{ textAlign: 'center', fontSize: '2em', marginTop: '20px' }}>
+      <h2>Real-Time Clock</h2>
+      <p>{time}</p>
+    </div>
+  );
+};
+
+export default RealTimeClock;

src/data/Test.json

@@ -0,0 +1,7 @@
+{
+  "id": "Test",
+  "title": "Test",
+  "description": "Just testing",
+  "author": "Wint3r",
+  "code": "/widgets/Test/Test.tsx"
+}