{"id":28912546,"url":"https://github.com/oceanprotocol/tokengated-next-chatgpt","last_synced_at":"2025-07-07T12:06:04.666Z","repository":{"id":181945620,"uuid":"665743965","full_name":"oceanprotocol/tokengated-next-chatgpt","owner":"oceanprotocol","description":"Web3 Tokengated Chatbot via OpenAI/Langchain/Hugging Face. Powered by Next, Vercel \u0026 Supabase.","archived":false,"fork":false,"pushed_at":"2023-10-07T02:05:05.000Z","size":2509,"stargazers_count":24,"open_issues_count":6,"forks_count":12,"subscribers_count":6,"default_branch":"main","last_synced_at":"2025-06-21T20:11:50.794Z","etag":null,"topics":["ai","nfts","subscriptions","tokengating","web2","web3"],"latest_commit_sha":null,"homepage":"https://tokengated-next-chatgpt.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/oceanprotocol.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2023-07-12T22:50:10.000Z","updated_at":"2025-02-08T01:16:55.000Z","dependencies_parsed_at":"2023-07-18T06:58:12.497Z","dependency_job_id":null,"html_url":"https://github.com/oceanprotocol/tokengated-next-chatgpt","commit_stats":null,"previous_names":["oceanprotocol/tokengated-next-chatgpt"],"tags_count":0,"template":false,"template_full_name":"supabase-community/vercel-ai-chatbot","purl":"pkg:github/oceanprotocol/tokengated-next-chatgpt","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oceanprotocol%2Ftokengated-next-chatgpt","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oceanprotocol%2Ftokengated-next-chatgpt/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oceanprotocol%2Ftokengated-next-chatgpt/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oceanprotocol%2Ftokengated-next-chatgpt/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/oceanprotocol","download_url":"https://codeload.github.com/oceanprotocol/tokengated-next-chatgpt/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oceanprotocol%2Ftokengated-next-chatgpt/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264075397,"owners_count":23553506,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ai","nfts","subscriptions","tokengating","web2","web3"],"created_at":"2025-06-21T20:11:51.928Z","updated_at":"2025-07-07T12:06:04.653Z","avatar_url":"https://github.com/oceanprotocol.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ca href=\"https://tokengated-next-chatgpt.vercel.app/\"\u003e\n  \u003cimg src=\"docs/assets/tokengated_chatbot.png\"/\u003e\n  \u003ch1 align=\"center\"\u003eOcean Protocol Tokengated Chatbot\u003c/h1\u003e\n\u003c/a\u003e\n\n\u003cp align=\"center\"\u003e\n  A Web3 powered, Ocean Protocol tokengated, open-source AI chatbot app template built with Next.js, the Vercel AI SDK, OpenAI, and Supabase.\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"#features\"\u003e\u003cstrong\u003eFeatures\u003c/strong\u003e\u003c/a\u003e ·\n  \u003ca href=\"#web3-powered\"\u003e\u003cstrong\u003eWeb3 Powered\u003c/strong\u003e\u003c/a\u003e ·\n  \u003ca href=\"#model-providers\"\u003e\u003cstrong\u003eModel Providers\u003c/strong\u003e\u003c/a\u003e ·\n  \u003ca href=\"#security warning\"\u003e\u003cstrong\u003eSecurity Warning\u003c/strong\u003e\u003c/a\u003e ·  \n  \u003ca href=\"#deploy-vercel-app\"\u003e\u003cstrong\u003eDeploy Vercel App\u003c/strong\u003e\u003c/a\u003e ·\n  \u003ca href=\"#publish-datatoken\"\u003e\u003cstrong\u003ePublish Datatoken\u003c/strong\u003e\u003c/a\u003e ·\n  \u003ca href=\"#running-locally\"\u003e\u003cstrong\u003eRunning locally\u003c/strong\u003e\u003c/a\u003e ·\n  \u003ca href=\"#authors\"\u003e\u003cstrong\u003eAuthors\u003c/strong\u003e\u003c/a\u003e\n\u003c/p\u003e\n\u003cbr/\u003e\n\n## Features\n\n- Create a Web3 Tokengated app where users gain access by [purchasing a DataNFT](https://market.oceanprotocol.com/asset/did:op:6897592e137286774c718ddcb5c3e5177aba5575d868a2f997ebfa3ffaa5213a) on the [Mumbai Network](#publish-datatoken).\n- Sign a Web3 transaction to identify yourself and login via a custom [Supabase Web3Auth](#supabase-web3auth).\n- Prompt OpenAI (default), Anthropic, Hugging Face, or custom AI chat models and/or LangChain\n- Chat History with [Supabase Postgres DB](https://supabase.com)\n- [Next.js](https://nextjs.org) App Router\n- React Server Components (RSCs), Suspense, and Server Actions\n- [Vercel AI SDK](https://sdk.vercel.ai/docs) for streaming chat UI\n- [shadcn/ui](https://ui.shadcn.com)\n  - Styling with [Tailwind CSS](https://tailwindcss.com)\n  - [Radix UI](https://radix-ui.com) for headless component primitives\n  - Icons from [Phosphor Icons](https://phosphoricons.com)\n- [Rainbowkit](https://www.rainbowkit.com/) and [Wagmi](https://wagmi.sh/) as wallet providers and React hooks\n- [Ethers.js](https://docs.ethers.org/v5/) and [Infura](https://app.infura.io/) for the low-level work\n\n## Web3 Powered\n\nWith a few clicks, you can deploy a Web3 enabled, tokengated, AI dApp that uses Ocean Protocol's DataNFT to prove ownership and access of the application.\n\nWhat does this do?\n1. Provides users with access by purchasing a DataNFT from the [Ocean Marketplace](https://market.oceanprotocol.com/).\n2. Allows users to login and authorize with an off-chain Web3 signature.\n\n## Model Providers\n\nThis template ships with OpenAI `gpt-3.5-turbo` as the default. However, thanks to the [Vercel AI SDK](https://sdk.vercel.ai/docs), you can switch LLM providers to [Anthropic](https://anthropic.com), [Hugging Face](https://huggingface.co), or using [LangChain](https://js.langchain.com) with just a few lines of code.\n\n## Security Warning\n\nFor the Web3 implementation to work, we need to implement **Supabase's service_key** in the app. You can learn more about this by reading the [Supabase Web3Auth](#supabase-web3auth) for more intuition.\n\nIf you are not careful with this as a developer you can easily expose your Supabase's admin role to the user. Please be careful to not expose getServiceSupabase() or NEXT_PUBLIC_SUPABASE_SERVICE_KEY.\n\nWhat does this mean? \n\n**[Never use a service key on the client](https://supabase.com/docs/guides/auth/row-level-security#never-use-a-service-key-on-the-client)**\n\n## Deploy Vercel App\n\nBefore hopping into code, let's launch the app and play with it.\n1. Fork this repository: [tokengated-next-chatgpt](https://github.com/oceanprotocol/tokengated-next-chatgpt/) via Github.\n1. Get a new [OpenAI API key](https://platform.openai.com/apps)\n1. Deploy a new [DB in Supabase](https://supabase.com/dashboard/sign-in)\n1. Setup your `public.users` table inside Supabase. We have provided you a screenshot of what ours looks like so you can configure it in the exact same way. \u003cfigure\u003e\u003cimg src=\"docs/assets/supabase_user_table.png\" alt=\"Create a public.users table\" width=\"640\"/\u003e\u003c/figure\u003e.\n1. Please note that your `public.users.id` should link to your `auth.users.id` record \u003cfigure\u003e\u003cimg src=\"docs/assets/table_users_linked_id.png\" alt=\"Link your public.users.id to auth.users.id\" width=\"640\"/\u003e\u003c/figure\u003e. **Important:** Make sure you make the `id` column nullable.\n1. Setup your Supabase Row-Level Security (RLS) by executing the [scripts located below](#configure-supabase) inside the Supabase SQL Editor.\n1. Get an [infura API key](https://www.infura.io/)\n1. Get a [Wallet Connect Project ID](https://cloud.walletconnect.com/sign-in)\n1. Hop onto Vercel and [Deploy your forked repository](https://vercel.com/new/) as a new Vercel project and configure your environment variables.\n1. Configure your Vercel-\u003eproject-\u003esettings to rebuild `sdk.ts` by overriding the build command with: `yarn generate \u0026\u0026 yarn build`\n1. You should now have all the initial ENV_VARS required to deploy the initial version of the app.\n1. Finally, after Vercel is deployed, update your Supabase's Project: [Authentication / URL Configuration / Site URL](https://supabase.com/dashboard/project/) to be your Vercel's app URL.\n\n```\nOPENAI_API_KEY=your-open-ai-key\nNEXT_PUBLIC_SUPABASE_URL=your-supabase-project-url\nNEXT_PUBLIC_SUPABASE_ANON_KEY=your-supabase-anon-key\nNEXT_PUBLIC_SUPABASE_SERVICE_KEY=your-supabase-service-key\nNEXT_PUBLIC_SUPABASE_JWT_SECRET=your-supabase-jwt-key\nNEXT_PUBLIC_WC2_PROJECT_ID=your-wallet-connect-project-id\nNEXT_PUBLIC_INFURA_API_KEY=your-infura-api-key\nNEXT_PUBLIC_WEB3AUTH_MESSAGE=Please sign this message to confirm your identity. Nonce:\nNEXT_PUBLIC_APP_DOMAN=@yourdomain.com\n```\n_Initial Environment Variables required for Vercel app to work_\n\n## Configure Supabase\nIn the SQL Editor, we're going to create the remainder of the role-level security policies we'll need to keep the DB secure.\n\nYou should already have a `public.users` table from the work you did in [Deploy Vercel App](#deploy-vercel-app)\n\n```\n-- Create view of auth.users and set strict access.\ncreate view public.auth_users as select * from auth.users;\nrevoke all on public.auth_users from anon, authenticated;\n\n-- service-role policy\nCREATE POLICY service_role_access ON public.users\nAS PERMISSIVE FOR ALL\nTO service_role\nUSING (auth.role() = 'service_role')\nWITH CHECK (auth.role() = 'service_role');\n\n-- authenticated user policy\nCREATE POLICY authenticated_users_can_write ON public.users\nAS PERMISSIVE FOR UPDATE\nTO authenticated\nUSING (auth.role() = 'authenticated')\nWITH CHECK (auth.role() = 'authenticated');\n\n-- web3 auth policy\nCREATE POLICY web3_auth ON public.users\nAS PERMISSIVE FOR UPDATE\nTO authenticated\nUSING ((current_setting('request.jwt.claims', true))::json -\u003e\u003e 'address' = address)\nWITH CHECK ((current_setting('request.jwt.claims', true))::json -\u003e\u003e 'address' = address);\n```\n\n## Publish Datatoken\n\nWe recommend using the [Mumbai Testnet](https://www.alchemy.com/overviews/mumbai-testnet) to deploy your datatoken. It will be fast and free.  \n```\nNetwork Name: Mumbai Testnet\nNew RPC URL: https://polygon-mumbai.g.alchemy.com/v2/your-api-key\nChain ID: 80001\nCurrency Symbol: MATIC\nBlock Explorer URL: https://mumbai.polygonscan.com/\n```\n_The Mumbai network_  \n\n1. Let's begin by adding the Mumbai network to your wallet. \n1. Now connect your wallet to the Mumbai network. \u003cfigure\u003e\u003cimg src=\"docs/assets/metamask_add_network.png\" alt=\"Metamask Add Network\" width=\"480\"/\u003e\u003c/figure\u003e\n1. Now get your wallet `0x address` for later.\n1. We need some tokens to make transactions, [collect MATIC from this faucet](https://mumbaifaucet.com/) so we can create the Data token.\n1. Make sure to also [collect OCEAN from this faucet](https://faucet.mumbai.oceanprotocol.com/) so you can also buy some tokens.\n1. Deploy a Datatoken (DT) inside the [OCEAN marketplace](https://market.oceanprotocol.com/). On Step-2, select File-type \"URL\" and use the Vercel url as the address so you can complete the wizard (this architecture doesn't use it). You can now see your datatoken, copy the `0x address`. \u003cfigure\u003e\u003cimg src=\"docs/assets/ocean_publish_datatoken.png\" alt=\"Publish your URL Datatoken\" width=\"640\"/\u003e\u003c/figure\u003e\n1. You have now published a Datatoken. When a user purchases this, they will gain access to our application. So, let's make sure to buy one so we can obtain access to the app after we deploy it.\n\u003cfigure\u003e\u003cimg src=\"docs/assets/your_datatoken.png\" alt=\"Your Datatoken\" width=\"640\"/\u003e\u003c/figure\u003e\n\n### Complete Vercel Configuration\n\nYou can now complete configuring the Vercel app.\n\nGo back to your Vercel-\u003eproject-\u003esettings-\u003eEnvironment Variables and add the rest of them.\n```\nNEXT_PUBLIC_WEB3AUTH_TTL=3600\nNEXT_PUBLIC_DATATOKEN_ADDRESS=0x2eaa179769d1Db4678Ce5FCD93E29F81aD0C5146\nNEXT_PUBLIC_SUBGRAPH_URL=https://v4.subgraph.mumbai.oceanprotocol.com/subgraphs/name/oceanprotocol/ocean-subgraph\n```\n_Ocean Protocol and Datatoken Environment Variables_\n\nUser subscriptions are verified at login based on when the Datatoken was purchased + TTL. Users are only authorized to prompt until the subscription expires.\n\n## Running locally\n\n**Before you start,** make sure you have followed every step from [Deploy Vercel App](#deploy-vercel-app) so your application can be configured correctly.\n\nYou will need to use the environment variables [defined in `.env.example`](.env.example) to run OP's Tokengated AI Chatbot.\n\nCopy the `.env.example` file and populate the required env vars:\n\n```bash\ncp .env.example .env\n```\n\n[Install the Supabase CLI](https://supabase.com/docs/guides/cli) and start the local Supabase stack:\n\n```bash\nnpm install supabase --save-dev\nnpx supabase start\n```\n\nInstall the local dependencies and start dev mode:\n\n```bash\npnpm install\npnpm dev\n```\n\nYour app template should now be running on [localhost:3000](http://localhost:3000/).\n\n## Building GQL SDK\n\nVercel currently does not support `graphql-generate` as part of the build, so you'll have to do this ahead of time.\n\nAs you write more GQL, please run the `yarn generate` command to update your local GQL library and SDK. This will help you maintain good code and avoid type safety issues.\n\nYou can then add the newly built SDK before deploying a new Vercel Build.\n```\nyarn generate\ngit add .\ngit commit -m \"updating gql\"\ngit push\n```\n\n## Additional Readmes\n\nThe following READMEs have been created to provide guidance to the reader.\n1. [Improvements and Ideas](/docs/README_improvements_ideas.md)\n1. [Supabase Web3Auth](/docs/README_web3_auth_supabase.md)\n1. [Web3 Tokens and Networks](/docs/README_web3_tokens_and_networks.md)\n\n## Authors\n\nThis scaffolding is an extension of the fantastic [Vercel AI-Chatbot](https://github.com/supabase-community/vercel-ai-chatbot) project.\n\nOcean Protocol ([@oceanprotocol](https://twitter.com/oceanprotocol)) has provided the work to build a custom Web3 Auth on top of Supabase, token-gated access with a DataNFT, and to provide a Web3 scaffolding to create AI dApps.\n\nSpecial thanks to [@kdetry](https://github.com/kdetry) and [@idiom-bytes](https://github.com/idiom-bytes) for assembling this.\n\nNo sealife was harmed in the making of this repository.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foceanprotocol%2Ftokengated-next-chatgpt","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Foceanprotocol%2Ftokengated-next-chatgpt","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foceanprotocol%2Ftokengated-next-chatgpt/lists"}