2 files changed, 48 insertions, 0 deletions
diff --git a/islands/ListPackageDetails.tsx b/islands/ListPackageDetails.tsx
new file mode 100644
index 0000000..3b7c36f
--- /dev/null
+++ b/islands/ListPackageDetails.tsx
@@ -0,0 +1,31 @@
+import { useEffect, useState } from "preact/hooks";
+
+export default function ListPackageDetails(props: any) {
+    const [packages, setPacakges] = useState(props.packages);
+    const [projectName, setProjectName] = useState(props.projectname);
+    const [projectVersion, setProjectVersion] = useState(props.projectversion);
+    const [projectDesc, setProjectDesc] = useState(props.projectdesc);
+    const [isLoading, setIsLoading] = useState(false);
+    useEffect(() => {
+        fetchRegistry();
+    }, [packages])
+
+    const fetchRegistry = async () => {
+        setIsLoading(true);
+        const response = await fetch("/api/npm", {
+            method: 'POST',
+            body: JSON.stringify(packages)
+        });
+        const data = await response.json();
+        setIsLoading(false);
+    }
+
+    return (
+        <div>
+            <h3>{projectName}</h3>
+            <h4>{projectVersion}</h4>
+            <h5>{projectDesc}</h5>
+            {isLoading ? <>Loading</> : <>Data</>}
+        </div>
+    )
+}
+\ No newline at end of file
diff --git a/islands/UploadButton.tsx b/islands/UploadButton.tsx
new file mode 100644
index 0000000..a23766d
--- /dev/null
+++ b/islands/UploadButton.tsx
@@ -0,0 +1,17 @@
+import {JSX} from 'preact';
+
+export default function UploadButton(props: JSX.HTMLAttributes<HTMLInputElement>) {
+
+    return(
+        <form action="/analyze" method="post" encType="multipart/form-data">
+            <input 
+            {...props}
+            name="packagefile"
+            type="file"
+            accept={".json"}
+            // onChange={getFileData}
+        />
+        <button type="submit">Submit</button>
+        </form>
+    );
+}
+\ No newline at end of file