diff --git a/examples/nextjs-client/.gitignore b/examples/nextjs-client/.gitignore new file mode 100644 index 000000000..5ef6a5207 --- /dev/null +++ b/examples/nextjs-client/.gitignore @@ -0,0 +1,41 @@ +# 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* + +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts diff --git a/examples/nextjs-client/.stackblitzrc b/examples/nextjs-client/.stackblitzrc new file mode 100644 index 000000000..4ba8da047 --- /dev/null +++ b/examples/nextjs-client/.stackblitzrc @@ -0,0 +1,4 @@ +{ + "startCommand": "npm run dev", + "env": {} +} diff --git a/examples/nextjs-client/README.md b/examples/nextjs-client/README.md new file mode 100644 index 000000000..07a56795d --- /dev/null +++ b/examples/nextjs-client/README.md @@ -0,0 +1,5 @@ +# Next.js - Lens Client Integration Example + +This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). + +[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/lens-protocol/lens-sdk/tree/next/examples/nextjs-client) diff --git a/examples/nextjs-client/next.config.ts b/examples/nextjs-client/next.config.ts new file mode 100644 index 000000000..5e891cf00 --- /dev/null +++ b/examples/nextjs-client/next.config.ts @@ -0,0 +1,7 @@ +import type { NextConfig } from 'next'; + +const nextConfig: NextConfig = { + /* config options here */ +}; + +export default nextConfig; diff --git a/examples/nextjs-client/package.json b/examples/nextjs-client/package.json new file mode 100644 index 000000000..ebfd1b5f0 --- /dev/null +++ b/examples/nextjs-client/package.json @@ -0,0 +1,24 @@ +{ + "name": "nextjs-client", + "version": "0.1.0", + "private": true, + "scripts": { + "dev": "next dev", + "build": "next build", + "start": "next start", + "lint": "next lint" + }, + "dependencies": { + "@lens-protocol/client": "canary", + "next": "15.1.3", + "react": "^19.0.0", + "react-dom": "^19.0.0", + "simpledotcss": "^2.3.3" + }, + "devDependencies": { + "@types/node": "^20", + "@types/react": "^19", + "@types/react-dom": "^19", + "typescript": "^5" + } +} diff --git a/examples/nextjs-client/src/app/client.ts b/examples/nextjs-client/src/app/client.ts new file mode 100644 index 000000000..da7b42593 --- /dev/null +++ b/examples/nextjs-client/src/app/client.ts @@ -0,0 +1,5 @@ +import { PublicClient, testnet } from '@lens-protocol/client'; + +export const client = PublicClient.create({ + environment: testnet, +}); diff --git a/examples/nextjs-client/src/app/favicon.ico b/examples/nextjs-client/src/app/favicon.ico new file mode 100644 index 000000000..718d6fea4 Binary files /dev/null and b/examples/nextjs-client/src/app/favicon.ico differ diff --git a/examples/nextjs-client/src/app/globals.css b/examples/nextjs-client/src/app/globals.css new file mode 100644 index 000000000..e3734be15 --- /dev/null +++ b/examples/nextjs-client/src/app/globals.css @@ -0,0 +1,42 @@ +:root { + --background: #ffffff; + --foreground: #171717; +} + +@media (prefers-color-scheme: dark) { + :root { + --background: #0a0a0a; + --foreground: #ededed; + } +} + +html, +body { + max-width: 100vw; + overflow-x: hidden; +} + +body { + color: var(--foreground); + background: var(--background); + font-family: Arial, Helvetica, sans-serif; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +* { + box-sizing: border-box; + padding: 0; + margin: 0; +} + +a { + color: inherit; + text-decoration: none; +} + +@media (prefers-color-scheme: dark) { + html { + color-scheme: dark; + } +} diff --git a/examples/nextjs-client/src/app/layout.tsx b/examples/nextjs-client/src/app/layout.tsx new file mode 100644 index 000000000..52be21520 --- /dev/null +++ b/examples/nextjs-client/src/app/layout.tsx @@ -0,0 +1,31 @@ +import type { Metadata } from 'next'; +import { Geist, Geist_Mono } from 'next/font/google'; +import 'simpledotcss/simple.min.css'; +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: 'Next.js - Lens Client Integration', + description: 'Generated by create next app', +}; + +export default function RootLayout({ + children, +}: Readonly<{ + children: React.ReactNode; +}>) { + return ( + +
{children} + + ); +} diff --git a/examples/nextjs-client/src/app/page.tsx b/examples/nextjs-client/src/app/page.tsx new file mode 100644 index 000000000..7662857cc --- /dev/null +++ b/examples/nextjs-client/src/app/page.tsx @@ -0,0 +1,26 @@ +import { AccountsOrderBy, PageSize } from '@lens-protocol/client'; +import { fetchAccounts } from '@lens-protocol/client/actions'; +import { client } from './client'; + +export default async function Home() { + const result = await fetchAccounts(client, { + orderBy: AccountsOrderBy.AccountScore, + pageSize: PageSize.Ten, + }); + + if (result.isErr()) { + returnTop 10 Accounts by Account Score:
+ +