Merge pull request #148 from codelitdev/medialit-package

Medialit package

Author: rajat1saxena

.changeset/shaggy-cooks-love.md

@@ -0,0 +1,5 @@
+---
+"medialit": patch
+---
+
+First version of MediaLit nodejs sdk

eslint.config.mjs

@@ -14,7 +14,7 @@ export default defineConfig([
     "**/node_modules",
     "**/dist",
     "**/components/ui/**",
-    "apps/web/.next/**",
+    "**/.next/**",
     ".migrations/**",
   ]),
   { files: ["**/*.{js,mjs,cjs,ts,jsx,tsx}"], plugins: { js }, extends: ["js/recommended"] },

examples/next-app-router/.env

@@ -0,0 +1 @@
+MEDIALIT_API_KEY=test

examples/next-app-router/.gitignore

@@ -0,0 +1,42 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# env files (can opt-in for committing if needed)
+!.env
+.env.*
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

examples/next-app-router/README.md

@@ -0,0 +1,34 @@
+This is a [Next.js](https://nextjs.org) project which demonstrates the usage of `medialit` package.
+
+## Getting Started
+
+First, add the MediaLit API key to `.env` file in the root directory:
+
+```env
+MEDIALIT_API_KEY=your_api_key_here
+```
+
+Then, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!

examples/next-app-router/app/api/media/route.ts

@@ -0,0 +1,70 @@
+import { NextRequest } from "next/server";
+import { MediaLit } from "medialit";
+
+const client = new MediaLit();
+
+export async function GET(request: NextRequest) {
+    const searchParams = request.nextUrl.searchParams;
+    const mediaId = searchParams.get("mediaId");
+
+    if (!mediaId) {
+        return Response.json(
+            { error: "Media ID is required" },
+            { status: 400 },
+        );
+    }
+
+    try {
+        const media = await client.get(mediaId);
+        return Response.json(media);
+    } catch (error) {
+        if (error instanceof Error) {
+            return Response.json({ error: error.message }, { status: 500 });
+        }
+        return Response.json(
+            { error: "An unknown error occurred" },
+            { status: 500 },
+        );
+    }
+}
+
+export async function POST() {
+    try {
+        const presignedUrl = await client.getPresignedUploadUrl();
+        return Response.json({ presignedUrl });
+    } catch (error) {
+        if (error instanceof Error) {
+            console.log("Error getting presigned URL:", error);
+            return Response.json({ error: error.message }, { status: 500 });
+        }
+        return Response.json(
+            { error: "An unknown error occurred" },
+            { status: 500 },
+        );
+    }
+}
+
+export async function DELETE(request: NextRequest) {
+    const searchParams = request.nextUrl.searchParams;
+    const mediaId = searchParams.get("mediaId");
+
+    if (!mediaId) {
+        return Response.json(
+            { error: "Media ID is required" },
+            { status: 400 },
+        );
+    }
+
+    try {
+        await client.delete(mediaId);
+        return Response.json({ success: true });
+    } catch (error) {
+        if (error instanceof Error) {
+            return Response.json({ error: error.message }, { status: 500 });
+        }
+        return Response.json(
+            { error: "An unknown error occurred" },
+            { status: 500 },
+        );
+    }
+}

examples/next-app-router/app/favicon.ico

@@ -0,0 +1,26 @@
+@import "tailwindcss";
+
+:root {
+    --background: #ffffff;
+    --foreground: #171717;
+}
+
+@theme inline {
+    --color-background: var(--background);
+    --color-foreground: var(--foreground);
+    --font-sans: var(--font-geist-sans);
+    --font-mono: var(--font-geist-mono);
+}
+
+@media (prefers-color-scheme: dark) {
+    :root {
+        --background: #0a0a0a;
+        --foreground: #ededed;
+    }
+}
+
+body {
+    background: var(--background);
+    color: var(--foreground);
+    font-family: Arial, Helvetica, sans-serif;
+}

examples/next-app-router/app/globals.css

@@ -0,0 +1,34 @@
+import type { Metadata } from "next";
+import { Geist, Geist_Mono } from "next/font/google";
+import "./globals.css";
+
+const geistSans = Geist({
+    variable: "--font-geist-sans",
+    subsets: ["latin"],
+});
+
+const geistMono = Geist_Mono({
+    variable: "--font-geist-mono",
+    subsets: ["latin"],
+});
+
+export const metadata: Metadata = {
+    title: "Create Next App",
+    description: "Generated by create next app",
+};
+
+export default function RootLayout({
+    children,
+}: Readonly<{
+    children: React.ReactNode;
+}>) {
+    return (
+        <html lang="en">
+            <body
+                className={`${geistSans.variable} ${geistMono.variable} antialiased`}
+            >
+                {children}
+            </body>
+        </html>
+    );
+}

examples/next-app-router/app/layout.tsx

@@ -0,0 +1,25 @@
+import MediaUploadForm from "@/components/MediaUploadForm";
+
+export default function Home() {
+    return (
+        <div className="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20">
+            <main className="flex flex-col gap-[32px] row-start-2 items-center sm:items-start w-full max-w-2xl">
+                <div className="text-center sm:text-left w-full">
+                    <h1 className="text-4xl font-bold mb-4">MediaLit Demo</h1>
+                    <p className="text-gray-600 dark:text-gray-300 mb-8">
+                        This demo shows how to use the MediaLit package to
+                        handle media files. Upload an image to see:
+                    </p>
+                    <ul className="text-left list-disc list-inside space-y-2 mb-8">
+                        <li>Direct upload using presigned URLs</li>
+                        <li>Automatic thumbnail generation</li>
+                        <li>Media information retrieval</li>
+                        <li>File deletion</li>
+                    </ul>
+                </div>
+
+                <MediaUploadForm />
+            </main>
+        </div>
+    );
+}