Initial Commit

* Implements Basic Routing and API * Implements Package.json file select and json parse * Displays Project Name, Version & Desc from the package.json * Fetch all package details using npm registry API and map it based on package name
2023-05-13 11:17:27 +05:30
commit fc0064f6a0
19 changed files with 388 additions and 0 deletions
--- a/routes/[name].tsx
+++ b/routes/[name].tsx
@@ -0,0 +1,5 @@
+import { PageProps } from "$fresh/server.ts";
+
+export default function Greet(props: PageProps) {
+  return <div>Hello {props.params.name}</div>;
+}
--- a/routes/analyze.tsx
+++ b/routes/analyze.tsx
@@ -0,0 +1,39 @@
+import { Handlers, PageProps } from "$fresh/server.ts";
+import ListPackageDetails from "../islands/ListPackageDetails.tsx";
+import { handler as fetchPackages  } from "./api/npm.ts";
+
+export const handler: Handlers<any> = {
+  async POST(req, ctx) {
+    const form = await req.formData();
+    const fileData = form.get("packagefile") as File;
+    const packagejson = await parsePackageJson(fileData);
+    const packages = {...packagejson.dependencies, ...packagejson.devDependencies};
+    const {name, version, description} = packagejson
+    return ctx.render({packages, name, version, description});
+  },
+};
+
+const parsePackageJson = (fileData: File) => {
+  return new Promise<any>((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsText(fileData);
+    reader.addEventListener("load", (event: any) => {
+      resolve(JSON.parse(reader.result as string));
+    });
+  });
+};
+
+export default function Analyze({ data }: PageProps<any>) {
+    const {packages, name, version, description} = data;
+  return (
+    <div>
+      Analyzer
+      <ListPackageDetails 
+        packages={packages} 
+        projectname={name} 
+        projectversion={version}
+        projectdesc={description}
+      ></ListPackageDetails>
+    </div>
+  );
+}
--- a/routes/api/npm.ts
+++ b/routes/api/npm.ts
@@ -0,0 +1,30 @@
+import { Handlers } from "$fresh/server.ts";
+
+export const handler: Handlers<any, { data: any }> = {
+    async POST(_req, ctx) {
+        const requestPackages: Object = await _req.json();
+        // Loop through items
+        console.log(typeof requestPackages)
+        let packageUrls: any[] = [];
+        for (let packageName in requestPackages) {
+            packageUrls = [
+                ...packageUrls,
+                `https://registry.npmjs.org/${packageName}`
+            ];
+        }
+
+        const packageDetailsResponse = await fetchPackageDetails(packageUrls);
+        const packageDetails = Object.keys(requestPackages).map((packageName, index) => {
+            return {
+                [packageName]: packageDetailsResponse[index]
+            }
+        })
+        return Response.json({ packageDetails });
+    },
+};
+
+async function fetchPackageDetails(packageUrls: any[]) {
+    return await Promise.all(
+        packageUrls.map(url => fetch(url).then(res => res.json()))
+    )
+}
--- a/routes/api/npmregistry.ts
+++ b/routes/api/npmregistry.ts
@@ -0,0 +1,9 @@
+import { Handlers } from "$fresh/server.ts";
+
+export const handler: Handlers<any, { data: string }> = {
+  async GET(_req, ctx) {
+    const registryResponse = await fetch('https://registry.npmjs.org/@angular/core');
+    const data = await registryResponse.json();
+    return Response.json({data});
+  },
+};
--- a/routes/index.tsx
+++ b/routes/index.tsx
@@ -0,0 +1,16 @@
+import { Head } from "$fresh/runtime.ts";
+import { Handlers } from "$fresh/server.ts";
+import UploadButton from "../islands/UploadButton.tsx";
+
+export default function Home() {
+  return (
+    <>
+      <Head>
+        <title>Package Analyzer</title>
+      </Head>
+      <div>
+        <UploadButton></UploadButton>
+      </div>
+    </>
+  );
+}