Compare commits

...

47 Commits

Author SHA1 Message Date
Shreyaschorge
f20f65f966 Bump up patch version 2025-07-17 00:07:47 +05:30
Shreyaschorge
a287d55641 set SPONSOR_SIGNER=true 2025-07-16 23:54:44 +05:30
Shreyaschorge
53d6ce6a94 sponsoredSigner -> useSponsoredSigner 2025-07-16 23:27:05 +05:30
Shreyaschorge
ebb8068ade remove update-session route 2025-07-16 23:03:01 +05:30
veganbeef
8124fe5f6c feat: add back og properties 2025-07-16 09:49:19 -07:00
veganbeef
9ea40a5f92 feat: add requiredChains support 2025-07-16 09:46:35 -07:00
veganbeef
e61bc88aaa feat: reapply quickauth changes conditionally 2025-07-16 09:16:58 -07:00
veganbeef
8eabbd3ba1 bump version number for revert 2025-07-16 08:44:39 -07:00
Lucas Myers
f7392dc3cb Merge pull request #20 from neynarxyz/sc/revert-to-5fbd9
revert to 5fbd9
2025-07-16 08:43:43 -07:00
Shreyaschorge
bf563154ca Fix merge conflict issues 2025-07-16 17:50:03 +05:30
Shreyaschorge
196378daeb Revert "format"
This reverts commit 5fbd9c5c09.
2025-07-16 17:33:02 +05:30
Shreyaschorge
89f82253ca Revert "feat: replace next-auth with quick auth"
This reverts commit 86029b2bd9.
2025-07-16 17:32:21 +05:30
Shreyaschorge
c786cabe84 Revert "fix: add back auth-kit"
This reverts commit 16c433a13c.
2025-07-16 17:31:34 +05:30
Shreyaschorge
760efdb96b Revert "format"
This reverts commit 378ea65154.
2025-07-16 17:30:47 +05:30
Shreyaschorge
5fd0e21532 Revert "fix: SIWN dependencies"
This reverts commit 4ba9480832.
2025-07-16 17:28:36 +05:30
Shreyaschorge
0d43b35c28 Revert "Merge pull request #15 from neynarxyz/shreyas-formatting"
This reverts commit b1fdfc19a9, reversing
changes made to b9e2087bd8.
2025-07-16 17:21:12 +05:30
Shreyaschorge
349cdea489 Revert "Merge pull request #18 from neynarxyz/veganbeef/fix-siwn"
This reverts commit 78626c2dc7, reversing
changes made to b1fdfc19a9.
2025-07-16 17:20:36 +05:30
veganbeef
181c364de4 fix: sponsor signer env var 2025-07-15 13:08:55 -07:00
Lucas Myers
78626c2dc7 Merge pull request #18 from neynarxyz/veganbeef/fix-siwn
fix: add back auth-kit
2025-07-15 09:34:40 -07:00
veganbeef
b72198575a Merge branch 'main' into veganbeef/fix-siwn 2025-07-15 09:29:35 -07:00
Lucas Myers
b1fdfc19a9 Merge pull request #15 from neynarxyz/shreyas-formatting
Formatting
2025-07-15 09:25:35 -07:00
veganbeef
4ba9480832 fix: SIWN dependencies 2025-07-15 09:25:08 -07:00
Shreyaschorge
378ea65154 format 2025-07-15 21:38:47 +05:30
Shreyaschorge
b366d97b53 Merge branch 'main' into shreyas-formatting 2025-07-15 21:35:11 +05:30
veganbeef
16c433a13c fix: add back auth-kit 2025-07-14 13:24:55 -07:00
veganbeef
b9e2087bd8 fix: remove duplicate app directory 2025-07-14 13:12:47 -07:00
veganbeef
86029b2bd9 feat: replace next-auth with quick auth 2025-07-14 13:01:46 -07:00
Shreyaschorge
5fbd9c5c09 format 2025-07-15 01:00:59 +05:30
Shreyaschorge
3815f45b44 Merge branch 'main' into shreyas-formatting 2025-07-15 00:00:11 +05:30
Shreyaschorge
c713d53054 Merge pull request #17 from neynarxyz/shreyas/show-modal-on-top
Show Dialog on top to show I am using my phone button
2025-07-14 23:51:52 +05:30
Shreyaschorge
d10bee4d4c Merge branch 'main' into shreyas/show-modal-on-top 2025-07-14 23:51:24 +05:30
veganbeef
44d0c6f905 fix: regex error 2025-07-14 10:03:01 -07:00
Lucas Myers
4f308d3f07 Merge pull request #16 from neynarxyz/veganbeef/deploy-script-update
feat: update deploy script to and manifest generation for simplicity [NEYN-5843]
2025-07-14 09:45:27 -07:00
veganbeef
4b370746cb Merge branch 'main' into veganbeef/deploy-script-update 2025-07-14 09:44:58 -07:00
Shreyaschorge
00fdd21044 remove unnecessary rules 2025-07-14 21:52:14 +05:30
Shreyaschorge
8475b28107 remove console logs 2025-07-14 20:51:03 +05:30
Shreyaschorge
e74b2581df Format after fixing conflicts 2025-07-14 20:04:44 +05:30
Shreyaschorge
505aa54b16 Merge branch 'main' into shreyas-formatting 2025-07-14 18:55:06 +05:30
Shreyaschorge
8de3f598b7 Show modal on top 2025-07-14 16:35:22 +05:30
veganbeef
fb4f8b8b53 feat: set up CI auto publish 2025-07-12 15:21:50 -07:00
veganbeef
5fa624a063 fix: auth kit url update and seed phrase input 2025-07-11 22:28:05 -07:00
Manan
36d2b5d0f7 Merge pull request #13 from neynarxyz/shreyas/neyn-5735-sign-in-connect-farcaster-using-developer-branded-signer
Shreyas/neyn 5735 sign in connect farcaster using developer branded signer
2025-07-11 16:26:45 -07:00
veganbeef
d487a3e8e5 feat: update deploy script to and manifest generation for simplicity 2025-07-11 09:51:42 -07:00
Shreyaschorge
65419a76ee Remove unnecessary file 2025-07-08 00:48:13 +05:30
Shreyaschorge
6b0350d477 Remove AI generated docs 2025-07-07 16:12:17 +05:30
Shreyaschorge
2a1a3d7c40 Correct formating imports 2025-07-07 16:07:33 +05:30
Shreyaschorge
193dffe03a formatting 2025-07-07 14:10:47 +05:30
19 changed files with 1059 additions and 921 deletions

30
.github/workflows/publish.yml vendored Normal file
View File

@@ -0,0 +1,30 @@
name: Publish to npm 🚀
on:
push:
branches:
- main
paths:
- package.json
jobs:
publish:
runs-on: ubuntu-latest
steps:
- name: Check out repository
uses: actions/checkout@v4
- name: Set up Node.js
uses: actions/setup-node@v4
with:
node-version: '20'
registry-url: 'https://registry.npmjs.org'
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
- name: Install dependencies
run: npm ci
- name: Publish to npm
run: npm publish --access public

View File

@@ -6,6 +6,7 @@ import { init } from './init.js';
const args = process.argv.slice(2);
let projectName = null;
let autoAcceptDefaults = false;
let apiKey = null;
// Check for -y flag
const yIndex = args.indexOf('-y');
@@ -14,18 +15,48 @@ if (yIndex !== -1) {
args.splice(yIndex, 1); // Remove -y from args
}
// If there's a remaining argument, it's the project name
if (args.length > 0) {
projectName = args[0];
}
// Parse other arguments
for (let i = 0; i < args.length; i++) {
const arg = args[i];
if (arg === '-p' || arg === '--project') {
if (i + 1 < args.length) {
projectName = args[i + 1];
if (projectName.startsWith('-')) {
console.error('Error: Project name cannot start with a dash (-)');
process.exit(1);
}
args.splice(i, 2); // Remove both the flag and its value
i--; // Adjust index since we removed 2 elements
} else {
console.error('Error: -p/--project requires a project name');
process.exit(1);
}
} else if (arg === '-k' || arg === '--api-key') {
if (i + 1 < args.length) {
apiKey = args[i + 1];
if (apiKey.startsWith('-')) {
console.error('Error: API key cannot start with a dash (-)');
process.exit(1);
}
args.splice(i, 2); // Remove both the flag and its value
i--; // Adjust index since we removed 2 elements
} else {
console.error('Error: -k/--api-key requires an API key');
process.exit(1);
}
}
}
// If -y is used without project name, we still need to ask for project name
// Validate that if -y is used, a project name must be provided
if (autoAcceptDefaults && !projectName) {
// We'll handle this case in the init function by asking only for project name
autoAcceptDefaults = false;
console.error('Error: -y flag requires a project name. Use -p/--project to specify the project name.');
process.exit(1);
}
init(projectName, autoAcceptDefaults).catch((err) => {
init(projectName, autoAcceptDefaults, apiKey).catch((err) => {
console.error('Error:', err);
process.exit(1);
});

View File

@@ -63,7 +63,7 @@ async function queryNeynarApp(apiKey) {
}
// Export the main CLI function for programmatic use
export async function init(projectName = null, autoAcceptDefaults = false) {
export async function init(projectName = null, autoAcceptDefaults = false, apiKey = null) {
printWelcomeMessage();
// Ask about Neynar usage
@@ -101,52 +101,59 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
break;
}
console.log(
'\n🪐 Find your Neynar API key at: https://dev.neynar.com/app\n'
);
let neynarKeyAnswer;
if (autoAcceptDefaults) {
neynarKeyAnswer = { neynarApiKey: null };
// Use provided API key if available, otherwise prompt for it
if (apiKey) {
neynarApiKey = apiKey;
} else {
neynarKeyAnswer = await inquirer.prompt([
{
type: 'password',
name: 'neynarApiKey',
message: 'Enter your Neynar API key (or press enter to skip):',
default: null,
},
]);
}
if (!autoAcceptDefaults) {
console.log(
'\n🪐 Find your Neynar API key at: https://dev.neynar.com/app\n'
);
}
if (neynarKeyAnswer.neynarApiKey) {
neynarApiKey = neynarKeyAnswer.neynarApiKey;
} else {
let useDemoKey;
let neynarKeyAnswer;
if (autoAcceptDefaults) {
useDemoKey = { useDemo: true };
neynarKeyAnswer = { neynarApiKey: null };
} else {
useDemoKey = await inquirer.prompt([
neynarKeyAnswer = await inquirer.prompt([
{
type: 'confirm',
name: 'useDemo',
message: 'Would you like to try the demo Neynar API key?',
default: true,
type: 'password',
name: 'neynarApiKey',
message: 'Enter your Neynar API key (or press enter to skip):',
default: null,
},
]);
}
if (useDemoKey.useDemo) {
console.warn(
'\n⚠ Note: the demo key is for development purposes only and is aggressively rate limited.'
);
console.log(
'For production, please sign up for a Neynar account at https://neynar.com/ and configure the API key in your .env or .env.local file with NEYNAR_API_KEY.'
);
console.log(
`\n${purple}${bright}${italic}Neynar now has a free tier! See https://neynar.com/#pricing for details.\n${reset}`
);
neynarApiKey = 'FARCASTER_V2_FRAMES_DEMO';
if (neynarKeyAnswer.neynarApiKey) {
neynarApiKey = neynarKeyAnswer.neynarApiKey;
} else {
let useDemoKey;
if (autoAcceptDefaults) {
useDemoKey = { useDemo: true };
} else {
useDemoKey = await inquirer.prompt([
{
type: 'confirm',
name: 'useDemo',
message: 'Would you like to try the demo Neynar API key?',
default: true,
},
]);
}
if (useDemoKey.useDemo) {
console.warn(
'\n⚠ Note: the demo key is for development purposes only and is aggressively rate limited.'
);
console.log(
'For production, please sign up for a Neynar account at https://neynar.com/ and configure the API key in your .env or .env.local file with NEYNAR_API_KEY.'
);
console.log(
`\n${purple}${bright}${italic}Neynar now has a free tier! See https://neynar.com/#pricing for details.\n${reset}`
);
neynarApiKey = 'FARCASTER_V2_FRAMES_DEMO';
}
}
}
@@ -222,7 +229,7 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
useTunnel: true,
enableAnalytics: true,
seedPhrase: null,
sponsorSigner: false,
useSponsoredSigner: false,
};
} else {
// If autoAcceptDefaults is false but we have a projectName, we still need to ask for other options
@@ -338,6 +345,36 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
]);
answers.useTunnel = hostingAnswer.useTunnel;
// Ask about Neynar Sponsored Signers / SIWN
const sponsoredSignerAnswer = await inquirer.prompt([
{
type: 'confirm',
name: 'useSponsoredSigner',
message:
'Would you like to write data to Farcaster on behalf of your miniapp users? This involves using Neynar Sponsored Signers and SIWN.\n' +
'\n⚠ A seed phrase is required for this option.\n',
default: false,
},
]);
answers.useSponsoredSigner = sponsoredSignerAnswer.useSponsoredSigner;
if (answers.useSponsoredSigner) {
const { seedPhrase } = await inquirer.prompt([
{
type: 'password',
name: 'seedPhrase',
message: 'Enter your Farcaster custody account seed phrase (required for Neynar Sponsored Signers/SIWN):',
validate: (input) => {
if (!input || input.trim().split(' ').length < 12) {
return 'Seed phrase must be at least 12 words';
}
return true;
},
},
]);
answers.seedPhrase = seedPhrase;
}
// Ask about analytics opt-out
const analyticsAnswer = await inquirer.prompt([
{
@@ -409,13 +446,14 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
delete packageJson.devDependencies;
// Add dependencies
// question: remove auth-client?
packageJson.dependencies = {
'@farcaster/auth-client': '>=0.3.0 <1.0.0',
'@farcaster/auth-kit': '>=0.6.0 <1.0.0',
'@farcaster/miniapp-node': '>=0.1.5 <1.0.0',
'@farcaster/miniapp-sdk': '>=0.1.6 <1.0.0',
'@farcaster/miniapp-wagmi-connector': '^1.0.0',
'@farcaster/mini-app-solana': '>=0.0.17 <1.0.0',
'@farcaster/quick-auth': '>=0.0.7 <1.0.0',
'@neynar/react': '^1.2.5',
'@radix-ui/react-label': '^2.1.1',
'@solana/wallet-adapter-react': '^0.15.38',
@@ -427,7 +465,6 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
'lucide-react': '^0.469.0',
mipd: '^0.0.7',
next: '^15',
'next-auth': '^4.24.11',
react: '^19',
'react-dom': '^19',
'tailwind-merge': '^2.6.0',
@@ -439,18 +476,20 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
};
packageJson.devDependencies = {
'@types/node': '^20',
'@types/react': '^19',
'@types/react-dom': '^19',
'@vercel/sdk': '^1.9.0',
crypto: '^1.0.1',
eslint: '^8',
'eslint-config-next': '15.0.3',
localtunnel: '^2.0.2',
'pino-pretty': '^13.0.0',
postcss: '^8',
tailwindcss: '^3.4.1',
typescript: '^5',
"@types/inquirer": "^9.0.8",
"@types/node": "^20",
"@types/react": "^19",
"@types/react-dom": "^19",
"@vercel/sdk": "^1.9.0",
"crypto": "^1.0.1",
"eslint": "^8",
"eslint-config-next": "15.0.3",
"localtunnel": "^2.0.2",
"pino-pretty": "^13.0.0",
"postcss": "^8",
"tailwindcss": "^3.4.1",
"ts-node": "^10.9.2",
"typescript": "^5"
};
// Add Neynar SDK if selected
@@ -458,6 +497,12 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
packageJson.dependencies['@neynar/nodejs-sdk'] = '^2.19.0';
}
// Add auth-kit and next-auth dependencies if useSponsoredSigner is true
if (answers.useSponsoredSigner) {
packageJson.dependencies['@farcaster/auth-kit'] = '>=0.6.0 <1.0.0';
packageJson.dependencies['next-auth'] = '^4.24.11';
}
fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2));
// Handle .env file
@@ -501,19 +546,19 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
return content;
};
// Regex patterns that match whole lines with export const
// Regex patterns that match whole lines with export const (with TypeScript types)
const patterns = {
APP_NAME: /^export const APP_NAME\s*=\s*['"`][^'"`]*['"`];$/m,
APP_NAME: /^export const APP_NAME\s*:\s*string\s*=\s*['"`][^'"`]*['"`];$/m,
APP_DESCRIPTION:
/^export const APP_DESCRIPTION\s*=\s*['"`][^'"`]*['"`];$/m,
/^export const APP_DESCRIPTION\s*:\s*string\s*=\s*['"`][^'"`]*['"`];$/m,
APP_PRIMARY_CATEGORY:
/^export const APP_PRIMARY_CATEGORY\s*=\s*['"`][^'"`]*['"`];$/m,
APP_TAGS: /^export const APP_TAGS\s*=\s*\[[^\]]*\];$/m,
/^export const APP_PRIMARY_CATEGORY\s*:\s*string\s*=\s*['"`][^'"`]*['"`];$/m,
APP_TAGS: /^export const APP_TAGS\s*:\s*string\[\]\s*=\s*\[[^\]]*\];$/m,
APP_BUTTON_TEXT:
/^export const APP_BUTTON_TEXT\s*=\s*['"`][^'"`]*['"`];$/m,
USE_WALLET: /^export const USE_WALLET\s*=\s*(true|false);$/m,
/^export const APP_BUTTON_TEXT\s*:\s*string\s*=\s*['"`][^'"`]*['"`];$/m,
USE_WALLET: /^export const USE_WALLET\s*:\s*boolean\s*=\s*(true|false);$/m,
ANALYTICS_ENABLED:
/^export const ANALYTICS_ENABLED\s*=\s*(true|false);$/m,
/^export const ANALYTICS_ENABLED\s*:\s*boolean\s*=\s*(true|false);$/m,
};
// Update APP_NAME
@@ -587,10 +632,7 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
console.log('⚠️ constants.ts not found, skipping constants update');
}
fs.appendFileSync(
envPath,
`\nNEXTAUTH_SECRET="${crypto.randomBytes(32).toString('hex')}"`
);
if (useNeynar && neynarApiKey && neynarClientId) {
fs.appendFileSync(envPath, `\nNEYNAR_API_KEY="${neynarApiKey}"`);
fs.appendFileSync(envPath, `\nNEYNAR_CLIENT_ID="${neynarClientId}"`);
@@ -601,9 +643,15 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
}
if (answers.seedPhrase) {
fs.appendFileSync(envPath, `\nSEED_PHRASE="${answers.seedPhrase}"`);
fs.appendFileSync(envPath, `\nSPONSOR_SIGNER="${answers.sponsorSigner}"`);
}
fs.appendFileSync(envPath, `\nUSE_TUNNEL="${answers.useTunnel}"`);
if (answers.useSponsoredSigner) {
fs.appendFileSync(envPath, `\nSPONSOR_SIGNER="true"`);
fs.appendFileSync(
envPath,
`\nNEXTAUTH_SECRET="${crypto.randomBytes(32).toString('hex')}"`
);
}
fs.unlinkSync(envExamplePath);
} else {
@@ -647,6 +695,32 @@ export async function init(projectName = null, autoAcceptDefaults = false) {
fs.rmSync(binPath, { recursive: true, force: true });
}
// Remove NeynarAuthButton directory, NextAuth API routes, and auth directory if useSponsoredSigner is false
if (!answers.useSponsoredSigner) {
console.log('\nRemoving NeynarAuthButton directory, NextAuth API routes, and auth directory (useSponsoredSigner is false)...');
const neynarAuthButtonPath = path.join(projectPath, 'src', 'components', 'ui', 'NeynarAuthButton');
if (fs.existsSync(neynarAuthButtonPath)) {
fs.rmSync(neynarAuthButtonPath, { recursive: true, force: true });
}
// Remove NextAuth API routes
const nextAuthRoutePath = path.join(projectPath, 'src', 'app', 'api', 'auth', '[...nextauth]', 'route.ts');
if (fs.existsSync(nextAuthRoutePath)) {
fs.rmSync(nextAuthRoutePath, { force: true });
// Remove the directory if it's empty
const nextAuthDir = path.dirname(nextAuthRoutePath);
if (fs.readdirSync(nextAuthDir).length === 0) {
fs.rmSync(nextAuthDir, { recursive: true, force: true });
}
}
// Remove src/auth.ts file
const authFilePath = path.join(projectPath, 'src', 'auth.ts');
if (fs.existsSync(authFilePath)) {
fs.rmSync(authFilePath, { force: true });
}
}
// Initialize git repository
console.log('\nInitializing git repository...');
execSync('git init', { cwd: projectPath });

View File

@@ -1,6 +1,6 @@
{
"name": "@neynar/create-farcaster-mini-app",
"version": "1.5.7",
"version": "1.7.6",
"type": "module",
"private": false,
"access": "public",
@@ -31,11 +31,11 @@
],
"scripts": {
"dev": "node scripts/dev.js",
"build": "node scripts/build.js",
"build": "next build",
"build:raw": "next build",
"start": "next start",
"lint": "next lint",
"deploy:vercel": "node scripts/deploy.js",
"deploy:vercel": "ts-node scripts/deploy.ts",
"deploy:raw": "vercel --prod",
"cleanup": "node scripts/cleanup.js"
},

View File

@@ -1,359 +0,0 @@
import { execSync } from "child_process";
import fs from "fs";
import path from "path";
import { fileURLToPath } from "url";
import inquirer from "inquirer";
import dotenv from "dotenv";
import crypto from "crypto";
// Load environment variables in specific order
// First load .env for main config
dotenv.config({ path: ".env" });
async function loadEnvLocal() {
try {
if (fs.existsSync(".env.local")) {
const { loadLocal } = await inquirer.prompt([
{
type: "confirm",
name: "loadLocal",
message:
"Found .env.local, likely created by the install script - would you like to load its values?",
default: false,
},
]);
if (loadLocal) {
console.log("Loading values from .env.local...");
const localEnv = dotenv.parse(fs.readFileSync(".env.local"));
// Copy all values to .env
const envContent = fs.existsSync(".env")
? fs.readFileSync(".env", "utf8") + "\n"
: "";
let newEnvContent = envContent;
for (const [key, value] of Object.entries(localEnv)) {
// Update process.env
process.env[key] = value;
// Add to .env content if not already there
if (!envContent.includes(`${key}=`)) {
newEnvContent += `${key}="${value}"\n`;
}
}
// Write updated content to .env
fs.writeFileSync(".env", newEnvContent);
console.log("✅ Values from .env.local have been written to .env");
}
if (localEnv.SPONSOR_SIGNER) {
process.env.SPONSOR_SIGNER = localEnv.SPONSOR_SIGNER;
}
}
} catch (error) {
// Error reading .env.local, which is fine
console.log("Note: No .env.local file found");
}
}
// TODO: make sure rebuilding is supported
const __dirname = path.dirname(fileURLToPath(import.meta.url));
const projectRoot = path.join(__dirname, "..");
async function validateDomain(domain) {
// Remove http:// or https:// if present
const cleanDomain = domain.replace(/^https?:\/\//, "");
// Basic domain validation
if (
!cleanDomain.match(
/^[a-zA-Z0-9][a-zA-Z0-9-]{1,61}[a-zA-Z0-9](?:\.[a-zA-Z]{2,})+$/
)
) {
throw new Error("Invalid domain format");
}
return cleanDomain;
}
async function queryNeynarApp(apiKey) {
if (!apiKey) {
return null;
}
try {
const response = await fetch(
`https://api.neynar.com/portal/app_by_api_key`,
{
headers: {
"x-api-key": apiKey,
},
}
);
const data = await response.json();
return data;
} catch (error) {
console.error("Error querying Neynar app data:", error);
return null;
}
}
async function generateFarcasterMetadata(domain, webhookUrl) {
const tags = process.env.NEXT_PUBLIC_MINI_APP_TAGS?.split(",");
return {
accountAssociation: {
header: "",
payload: "",
signature: "",
},
frame: {
version: "1",
name: process.env.NEXT_PUBLIC_MINI_APP_NAME,
iconUrl: `https://${domain}/icon.png`,
homeUrl: `https://${domain}`,
imageUrl: `https://${domain}/api/opengraph-image`,
buttonTitle: process.env.NEXT_PUBLIC_MINI_APP_BUTTON_TEXT,
splashImageUrl: `https://${domain}/splash.png`,
splashBackgroundColor: "#f7f7f7",
webhookUrl,
description: process.env.NEXT_PUBLIC_MINI_APP_DESCRIPTION,
primaryCategory: process.env.NEXT_PUBLIC_MINI_APP_PRIMARY_CATEGORY,
tags,
},
};
}
async function main() {
try {
console.log("\n📝 Checking environment variables...");
console.log("Loading values from .env...");
// Load .env.local if user wants to
await loadEnvLocal();
// Get domain from user
const { domain } = await inquirer.prompt([
{
type: "input",
name: "domain",
message:
"Enter the domain where your mini app will be deployed (e.g., example.com):",
validate: async (input) => {
try {
await validateDomain(input);
return true;
} catch (error) {
return error.message;
}
},
},
]);
// Get frame name from user
const { frameName } = await inquirer.prompt([
{
type: "input",
name: "frameName",
message: "Enter the name for your mini app (e.g., My Cool Mini App):",
default: process.env.NEXT_PUBLIC_MINI_APP_NAME,
validate: (input) => {
if (input.trim() === "") {
return "Mini app name cannot be empty";
}
return true;
},
},
]);
// Get button text from user
const { buttonText } = await inquirer.prompt([
{
type: "input",
name: "buttonText",
message: "Enter the text for your mini app button:",
default:
process.env.NEXT_PUBLIC_MINI_APP_BUTTON_TEXT || "Launch Mini App",
validate: (input) => {
if (input.trim() === "") {
return "Button text cannot be empty";
}
return true;
},
},
]);
// Get Neynar configuration
let neynarApiKey = process.env.NEYNAR_API_KEY;
let neynarClientId = process.env.NEYNAR_CLIENT_ID;
let useNeynar = true;
while (useNeynar) {
if (!neynarApiKey) {
const { neynarApiKey: inputNeynarApiKey } = await inquirer.prompt([
{
type: "password",
name: "neynarApiKey",
message:
"Enter your Neynar API key (optional - leave blank to skip):",
default: null,
},
]);
neynarApiKey = inputNeynarApiKey;
} else {
console.log("Using existing Neynar API key from .env");
}
if (!neynarApiKey) {
useNeynar = false;
break;
}
// Try to get client ID from API
if (!neynarClientId) {
const appInfo = await queryNeynarApp(neynarApiKey);
if (appInfo) {
neynarClientId = appInfo.app_uuid;
console.log("✅ Fetched Neynar app client ID");
break;
}
}
// We have a client ID (either from .env or fetched from API), so we can break out of the loop
if (neynarClientId) {
break;
}
// If we get here, the API key was invalid
console.log(
"\n⚠ Could not find Neynar app information. The API key may be incorrect."
);
const { retry } = await inquirer.prompt([
{
type: "confirm",
name: "retry",
message: "Would you like to try a different API key?",
default: true,
},
]);
// Reset for retry
neynarApiKey = null;
neynarClientId = null;
if (!retry) {
useNeynar = false;
break;
}
}
// Generate manifest
console.log("\n🔨 Generating mini app manifest...");
// Determine webhook URL based on environment variables
const webhookUrl =
neynarApiKey && neynarClientId
? `https://api.neynar.com/f/app/${neynarClientId}/event`
: `https://${domain}/api/webhook`;
const metadata = await generateFarcasterMetadata(domain, webhookUrl);
console.log("\n✅ Mini app manifest generated");
// Read existing .env file or create new one
const envPath = path.join(projectRoot, ".env");
let envContent = fs.existsSync(envPath)
? fs.readFileSync(envPath, "utf8")
: "";
// Add or update environment variables
const newEnvVars = [
// Base URL
`NEXT_PUBLIC_URL=https://${domain}`,
// Mini app metadata
`NEXT_PUBLIC_MINI_APP_NAME="${frameName}"`,
`NEXT_PUBLIC_MINI_APP_DESCRIPTION="${
process.env.NEXT_PUBLIC_MINI_APP_DESCRIPTION || ""
}"`,
`NEXT_PUBLIC_MINI_APP_PRIMARY_CATEGORY="${
process.env.NEXT_PUBLIC_MINI_APP_PRIMARY_CATEGORY || ""
}"`,
`NEXT_PUBLIC_MINI_APP_TAGS="${
process.env.NEXT_PUBLIC_MINI_APP_TAGS || ""
}"`,
`NEXT_PUBLIC_MINI_APP_BUTTON_TEXT="${buttonText}"`,
// Analytics
`NEXT_PUBLIC_ANALYTICS_ENABLED="${
process.env.NEXT_PUBLIC_ANALYTICS_ENABLED || "false"
}"`,
// Neynar configuration (if it exists in current env)
...(process.env.NEYNAR_API_KEY
? [`NEYNAR_API_KEY="${process.env.NEYNAR_API_KEY}"`]
: []),
...(neynarClientId ? [`NEYNAR_CLIENT_ID="${neynarClientId}"`] : []),
...(process.env.SPONSOR_SIGNER ?
[`SPONSOR_SIGNER="${process.env.SPONSOR_SIGNER}"`] : []),
// FID (if it exists in current env)
...(process.env.FID ? [`FID="${process.env.FID}"`] : []),
`NEXT_PUBLIC_USE_WALLET="${
process.env.NEXT_PUBLIC_USE_WALLET || "false"
}"`,
// NextAuth configuration
`NEXTAUTH_SECRET="${
process.env.NEXTAUTH_SECRET || crypto.randomBytes(32).toString("hex")
}"`,
`NEXTAUTH_URL="https://${domain}"`,
// Mini app manifest with signature
`MINI_APP_METADATA=${JSON.stringify(metadata)}`,
];
// Filter out empty values and join with newlines
const validEnvVars = newEnvVars.filter((line) => {
const [, value] = line.split("=");
return value && value !== '""';
});
// Update or append each environment variable
validEnvVars.forEach((varLine) => {
const [key] = varLine.split("=");
if (envContent.includes(`${key}=`)) {
envContent = envContent.replace(new RegExp(`${key}=.*`), varLine);
} else {
envContent += `\n${varLine}`;
}
});
// Write updated .env file
fs.writeFileSync(envPath, envContent);
console.log("\n✅ Environment variables updated");
// Run next build
console.log("\nBuilding Next.js application...");
const nextBin = path.normalize(
path.join(projectRoot, "node_modules", ".bin", "next")
);
execSync(`"${nextBin}" build`, {
cwd: projectRoot,
stdio: "inherit",
shell: process.platform === "win32",
});
console.log(
"\n✨ Build complete! Your mini app is ready for deployment. 🪐"
);
console.log(
"📝 Make sure to configure the environment variables from .env in your hosting provider"
);
} catch (error) {
console.error("\n❌ Error:", error.message);
process.exit(1);
}
}
main();

View File

@@ -7,6 +7,7 @@ import inquirer from 'inquirer';
import dotenv from 'dotenv';
import crypto from 'crypto';
import { Vercel } from '@vercel/sdk';
import { APP_NAME, APP_BUTTON_TEXT } from '../src/lib/constants';
const __dirname = path.dirname(fileURLToPath(import.meta.url));
const projectRoot = path.join(__dirname, '..');
@@ -14,32 +15,10 @@ const projectRoot = path.join(__dirname, '..');
// Load environment variables in specific order
dotenv.config({ path: '.env' });
async function generateFarcasterMetadata(domain, webhookUrl) {
const trimmedDomain = domain.trim();
const tags = process.env.NEXT_PUBLIC_MINI_APP_TAGS?.split(',');
return {
frame: {
version: '1',
name: process.env.NEXT_PUBLIC_MINI_APP_NAME,
iconUrl: `https://${trimmedDomain}/icon.png`,
homeUrl: `https://${trimmedDomain}`,
imageUrl: `https://${trimmedDomain}/api/opengraph-image`,
buttonTitle: process.env.NEXT_PUBLIC_MINI_APP_BUTTON_TEXT,
splashImageUrl: `https://${trimmedDomain}/splash.png`,
splashBackgroundColor: '#f7f7f7',
webhookUrl: webhookUrl?.trim(),
description: process.env.NEXT_PUBLIC_MINI_APP_DESCRIPTION,
primaryCategory: process.env.NEXT_PUBLIC_MINI_APP_PRIMARY_CATEGORY,
tags,
},
};
}
async function loadEnvLocal() {
async function loadEnvLocal(): Promise<void> {
try {
if (fs.existsSync('.env.local')) {
const { loadLocal } = await inquirer.prompt([
const { loadLocal }: { loadLocal: boolean } = await inquirer.prompt([
{
type: 'confirm',
name: 'loadLocal',
@@ -54,12 +33,7 @@ async function loadEnvLocal() {
const localEnv = dotenv.parse(fs.readFileSync('.env.local'));
const allowedVars = [
'NEXT_PUBLIC_MINI_APP_NAME',
'NEXT_PUBLIC_MINI_APP_DESCRIPTION',
'NEXT_PUBLIC_MINI_APP_PRIMARY_CATEGORY',
'NEXT_PUBLIC_MINI_APP_TAGS',
'NEXT_PUBLIC_MINI_APP_BUTTON_TEXT',
'NEXT_PUBLIC_ANALYTICS_ENABLED',
'SEED_PHRASE',
'NEYNAR_API_KEY',
'NEYNAR_CLIENT_ID',
'SPONSOR_SIGNER',
@@ -83,12 +57,12 @@ async function loadEnvLocal() {
console.log('✅ Values from .env.local have been written to .env');
}
}
} catch (error) {
} catch (error: unknown) {
console.log('Note: No .env.local file found');
}
}
async function checkRequiredEnvVars() {
async function checkRequiredEnvVars(): Promise<void> {
console.log('\n📝 Checking environment variables...');
console.log('Loading values from .env...');
@@ -98,21 +72,21 @@ async function checkRequiredEnvVars() {
{
name: 'NEXT_PUBLIC_MINI_APP_NAME',
message: 'Enter the name for your frame (e.g., My Cool Mini App):',
default: process.env.NEXT_PUBLIC_MINI_APP_NAME,
validate: (input) =>
default: APP_NAME,
validate: (input: string) =>
input.trim() !== '' || 'Mini app name cannot be empty',
},
{
name: 'NEXT_PUBLIC_MINI_APP_BUTTON_TEXT',
message: 'Enter the text for your frame button:',
default:
process.env.NEXT_PUBLIC_MINI_APP_BUTTON_TEXT ?? 'Launch Mini App',
validate: (input) => input.trim() !== '' || 'Button text cannot be empty',
default: APP_BUTTON_TEXT ?? 'Launch Mini App',
validate: (input: string) =>
input.trim() !== '' || 'Button text cannot be empty',
},
];
const missingVars = requiredVars.filter(
(varConfig) => !process.env[varConfig.name]
varConfig => !process.env[varConfig.name],
);
if (missingVars.length > 0) {
@@ -138,7 +112,7 @@ async function checkRequiredEnvVars() {
const newLine = envContent ? '\n' : '';
fs.appendFileSync(
'.env',
`${newLine}${varConfig.name}="${value.trim()}"`
`${newLine}${varConfig.name}="${value.trim()}"`,
);
}
@@ -158,14 +132,64 @@ async function checkRequiredEnvVars() {
process.env.SPONSOR_SIGNER = sponsorSigner.toString();
if (storeSeedPhrase) {
if (process.env.SEED_PHRASE) {
fs.appendFileSync(
'.env.local',
`\nSPONSOR_SIGNER="${sponsorSigner}"`
`\nSPONSOR_SIGNER="${sponsorSigner}"`,
);
console.log('✅ Sponsor signer preference stored in .env.local');
}
}
// Ask about required chains
const { useRequiredChains } = await inquirer.prompt([
{
type: 'confirm',
name: 'useRequiredChains',
message:
'Does your mini app require support for specific blockchains?\n' +
'If yes, the host will only render your mini app if it supports all the chains you specify.\n' +
'If no, the mini app will be rendered regardless of chain support.',
default: false,
},
]);
let requiredChains: string[] = [];
if (useRequiredChains) {
const { selectedChains } = await inquirer.prompt([
{
type: 'checkbox',
name: 'selectedChains',
message: 'Select the required chains (CAIP-2 identifiers):',
choices: [
{ name: 'Ethereum Mainnet (eip155:1)', value: 'eip155:1' },
{ name: 'Polygon (eip155:137)', value: 'eip155:137' },
{ name: 'Arbitrum One (eip155:42161)', value: 'eip155:42161' },
{ name: 'Optimism (eip155:10)', value: 'eip155:10' },
{ name: 'Base (eip155:8453)', value: 'eip155:8453' },
{ name: 'Solana (solana:mainnet)', value: 'solana:mainnet' },
{ name: 'Solana Devnet (solana:devnet)', value: 'solana:devnet' },
],
},
]);
requiredChains = selectedChains;
}
// Update constants.ts with required chains
const constantsPath = path.join(projectRoot, 'src', 'lib', 'constants.ts');
if (fs.existsSync(constantsPath)) {
let constantsContent = fs.readFileSync(constantsPath, 'utf8');
// Replace the APP_REQUIRED_CHAINS line
const requiredChainsString = JSON.stringify(requiredChains);
constantsContent = constantsContent.replace(
/^export const APP_REQUIRED_CHAINS\s*:\s*string\[\]\s*=\s*\[[^\]]*\];$/m,
`export const APP_REQUIRED_CHAINS: string[] = ${requiredChainsString};`,
);
fs.writeFileSync(constantsPath, constantsContent);
console.log('✅ Required chains updated in constants.ts');
}
}
}
@@ -182,39 +206,43 @@ async function checkRequiredEnvVars() {
}
}
async function getGitRemote() {
async function getGitRemote(): Promise<string | null> {
try {
const remoteUrl = execSync('git remote get-url origin', {
cwd: projectRoot,
encoding: 'utf8',
}).trim();
return remoteUrl;
} catch (error) {
return null;
} catch (error: unknown) {
if (error instanceof Error) {
return null;
}
throw error;
}
}
async function checkVercelCLI() {
async function checkVercelCLI(): Promise<boolean> {
try {
execSync('vercel --version', {
stdio: 'ignore',
shell: process.platform === 'win32',
});
return true;
} catch (error) {
return false;
} catch (error: unknown) {
if (error instanceof Error) {
return false;
}
throw error;
}
}
async function installVercelCLI() {
async function installVercelCLI(): Promise<void> {
console.log('Installing Vercel CLI...');
execSync('npm install -g vercel', {
stdio: 'inherit',
shell: process.platform === 'win32',
});
}
async function getVercelToken() {
async function getVercelToken(): Promise<string | null> {
try {
// Try to get token from Vercel CLI config
const configPath = path.join(os.homedir(), '.vercel', 'auth.json');
@@ -222,8 +250,10 @@ async function getVercelToken() {
const authConfig = JSON.parse(fs.readFileSync(configPath, 'utf8'));
return authConfig.token;
}
} catch (error) {
console.warn('Could not read Vercel token from config file');
} catch (error: unknown) {
if (error instanceof Error) {
console.warn('Could not read Vercel token from config file');
}
}
// Try environment variable
@@ -242,14 +272,17 @@ async function getVercelToken() {
// The token isn't directly exposed, so we'll need to use CLI for some operations
console.log('✅ Verified Vercel CLI authentication');
return null; // We'll fall back to CLI operations
} catch (error) {
throw new Error(
'Not logged in to Vercel CLI. Please run this script again to login.'
);
} catch (error: unknown) {
if (error instanceof Error) {
throw new Error(
'Not logged in to Vercel CLI. Please run this script again to login.',
);
}
throw error;
}
}
async function loginToVercel() {
async function loginToVercel(): Promise<boolean> {
console.log('\n🔑 Vercel Login');
console.log('You can either:');
console.log('1. Log in to an existing Vercel account');
@@ -260,22 +293,22 @@ async function loginToVercel() {
console.log('3. Complete the Vercel account setup in your browser');
console.log('4. Return here once your Vercel account is created\n');
console.log(
'\nNote: you may need to cancel this script with ctrl+c and run it again if creating a new vercel account'
'\nNote: you may need to cancel this script with ctrl+c and run it again if creating a new vercel account',
);
const child = spawn('vercel', ['login'], {
stdio: 'inherit',
});
await new Promise((resolve, reject) => {
child.on('close', (code) => {
await new Promise<void>((resolve, reject) => {
child.on('close', code => {
resolve();
});
});
console.log('\n📱 Waiting for login to complete...');
console.log(
"If you're creating a new account, please complete the Vercel account setup in your browser first."
"If you're creating a new account, please complete the Vercel account setup in your browser first.",
);
for (let i = 0; i < 150; i++) {
@@ -283,11 +316,14 @@ async function loginToVercel() {
execSync('vercel whoami', { stdio: 'ignore' });
console.log('✅ Successfully logged in to Vercel!');
return true;
} catch (error) {
if (error.message.includes('Account not found')) {
} catch (error: unknown) {
if (
error instanceof Error &&
error.message.includes('Account not found')
) {
console.log(' Waiting for Vercel account setup to complete...');
}
await new Promise((resolve) => setTimeout(resolve, 2000));
await new Promise(resolve => setTimeout(resolve, 2000));
}
}
@@ -298,9 +334,14 @@ async function loginToVercel() {
return false;
}
async function setVercelEnvVarSDK(vercelClient, projectId, key, value) {
async function setVercelEnvVarSDK(
vercelClient: Vercel,
projectId: string,
key: string,
value: string | object,
): Promise<boolean> {
try {
let processedValue;
let processedValue: string;
if (typeof value === 'object') {
processedValue = JSON.stringify(value);
} else {
@@ -308,17 +349,26 @@ async function setVercelEnvVarSDK(vercelClient, projectId, key, value) {
}
// Get existing environment variables
const existingVars = await vercelClient.projects.getEnvironmentVariables({
const existingVars = await vercelClient.projects.filterProjectEnvs({
idOrName: projectId,
});
const existingVar = existingVars.envs?.find(
(env) => env.key === key && env.target?.includes('production')
// Handle different response types
let envs: any[] = [];
if ('envs' in existingVars && Array.isArray(existingVars.envs)) {
envs = existingVars.envs;
} else if ('target' in existingVars && 'key' in existingVars) {
// Single environment variable response
envs = [existingVars];
}
const existingVar = envs.find(
(env: any) => env.key === key && env.target?.includes('production'),
);
if (existingVar) {
if (existingVar && existingVar.id) {
// Update existing variable
await vercelClient.projects.editEnvironmentVariable({
await vercelClient.projects.editProjectEnv({
idOrName: projectId,
id: existingVar.id,
requestBody: {
@@ -329,7 +379,7 @@ async function setVercelEnvVarSDK(vercelClient, projectId, key, value) {
console.log(`✅ Updated environment variable: ${key}`);
} else {
// Create new variable
await vercelClient.projects.createEnvironmentVariable({
await vercelClient.projects.createProjectEnv({
idOrName: projectId,
requestBody: {
key: key,
@@ -342,16 +392,23 @@ async function setVercelEnvVarSDK(vercelClient, projectId, key, value) {
}
return true;
} catch (error) {
console.warn(
`⚠️ Warning: Failed to set environment variable ${key}:`,
error.message
);
return false;
} catch (error: unknown) {
if (error instanceof Error) {
console.warn(
`⚠️ Warning: Failed to set environment variable ${key}:`,
error.message,
);
return false;
}
throw error;
}
}
async function setVercelEnvVarCLI(key, value, projectRoot) {
async function setVercelEnvVarCLI(
key: string,
value: string | object,
projectRoot: string,
): Promise<boolean> {
try {
// Remove existing env var
try {
@@ -360,11 +417,11 @@ async function setVercelEnvVarCLI(key, value, projectRoot) {
stdio: 'ignore',
env: process.env,
});
} catch (error) {
} catch (error: unknown) {
// Ignore errors from removal
}
let processedValue;
let processedValue: string;
if (typeof value === 'object') {
processedValue = JSON.stringify(value);
} else {
@@ -376,7 +433,7 @@ async function setVercelEnvVarCLI(key, value, projectRoot) {
fs.writeFileSync(tempFilePath, processedValue, 'utf8');
// Use appropriate command based on platform
let command;
let command: string;
if (process.platform === 'win32') {
command = `type "${tempFilePath}" | vercel env add ${key} production`;
} else {
@@ -386,35 +443,37 @@ async function setVercelEnvVarCLI(key, value, projectRoot) {
execSync(command, {
cwd: projectRoot,
stdio: 'pipe', // Changed from 'inherit' to avoid interactive prompts
shell: true,
env: process.env,
});
fs.unlinkSync(tempFilePath);
console.log(`✅ Set environment variable: ${key}`);
return true;
} catch (error) {
} catch (error: unknown) {
const tempFilePath = path.join(projectRoot, `${key}_temp.txt`);
if (fs.existsSync(tempFilePath)) {
fs.unlinkSync(tempFilePath);
}
console.warn(
`⚠️ Warning: Failed to set environment variable ${key}:`,
error.message
);
return false;
if (error instanceof Error) {
console.warn(
`⚠️ Warning: Failed to set environment variable ${key}:`,
error.message,
);
return false;
}
throw error;
}
}
async function setEnvironmentVariables(
vercelClient,
projectId,
envVars,
projectRoot
) {
vercelClient: Vercel | null,
projectId: string | null,
envVars: Record<string, string | object>,
projectRoot: string,
): Promise<Array<{ key: string; success: boolean }>> {
console.log('\n📝 Setting up environment variables...');
const results = [];
const results: Array<{ key: string; success: boolean }> = [];
for (const [key, value] of Object.entries(envVars)) {
if (!value) continue;
@@ -435,12 +494,12 @@ async function setEnvironmentVariables(
}
// Report results
const failed = results.filter((r) => !r.success);
const failed = results.filter(r => !r.success);
if (failed.length > 0) {
console.warn(`\n⚠ Failed to set ${failed.length} environment variables:`);
failed.forEach((r) => console.warn(` - ${r.key}`));
failed.forEach(r => console.warn(` - ${r.key}`));
console.warn(
'\nYou may need to set these manually in the Vercel dashboard.'
'\nYou may need to set these manually in the Vercel dashboard.',
);
}
@@ -448,22 +507,22 @@ async function setEnvironmentVariables(
}
async function waitForDeployment(
vercelClient,
projectId,
maxWaitTime = 300000
) {
vercelClient: Vercel | null,
projectId: string,
maxWaitTime = 300000,
): Promise<any> {
// 5 minutes
console.log('\n⏳ Waiting for deployment to complete...');
const startTime = Date.now();
while (Date.now() - startTime < maxWaitTime) {
try {
const deployments = await vercelClient.deployments.list({
const deployments = await vercelClient?.deployments.getDeployments({
projectId: projectId,
limit: 1,
});
if (deployments.deployments?.[0]) {
if (deployments?.deployments?.[0]) {
const deployment = deployments.deployments[0];
console.log(`📊 Deployment status: ${deployment.state}`);
@@ -477,21 +536,24 @@ async function waitForDeployment(
}
// Still building, wait and check again
await new Promise((resolve) => setTimeout(resolve, 5000)); // Wait 5 seconds
await new Promise(resolve => setTimeout(resolve, 5000)); // Wait 5 seconds
} else {
console.log('⏳ No deployment found yet, waiting...');
await new Promise((resolve) => setTimeout(resolve, 5000));
await new Promise(resolve => setTimeout(resolve, 5000));
}
} catch (error) {
console.warn('⚠️ Could not check deployment status:', error.message);
await new Promise((resolve) => setTimeout(resolve, 5000));
} catch (error: unknown) {
if (error instanceof Error) {
console.warn('⚠️ Could not check deployment status:', error.message);
await new Promise(resolve => setTimeout(resolve, 5000));
}
throw error;
}
}
throw new Error('Deployment timed out after 5 minutes');
}
async function deployToVercel(useGitHub = false) {
async function deployToVercel(useGitHub = false): Promise<void> {
try {
console.log('\n🚀 Deploying to Vercel...');
@@ -507,18 +569,18 @@ async function deployToVercel(useGitHub = false) {
framework: 'nextjs',
},
null,
2
)
2,
),
);
}
// Set up Vercel project
console.log('\n📦 Setting up Vercel project...');
console.log(
'An initial deployment is required to get an assigned domain that can be used in the mini app manifest\n'
'An initial deployment is required to get an assigned domain that can be used in the mini app manifest\n',
);
console.log(
'\n⚠ Note: choosing a longer, more unique project name will help avoid conflicts with other existing domains\n'
'\n⚠ Note: choosing a longer, more unique project name will help avoid conflicts with other existing domains\n',
);
// Use spawn instead of execSync for better error handling
@@ -526,11 +588,11 @@ async function deployToVercel(useGitHub = false) {
const vercelSetup = spawn('vercel', [], {
cwd: projectRoot,
stdio: 'inherit',
shell: process.platform === 'win32',
shell: process.platform === 'win32' ? true : undefined,
});
await new Promise((resolve, reject) => {
vercelSetup.on('close', (code) => {
await new Promise<void>((resolve, reject) => {
vercelSetup.on('close', code => {
if (code === 0 || code === null) {
console.log('✅ Vercel project setup completed');
resolve();
@@ -540,30 +602,33 @@ async function deployToVercel(useGitHub = false) {
}
});
vercelSetup.on('error', (error) => {
vercelSetup.on('error', error => {
console.log('⚠️ Vercel setup command completed (this is normal)');
resolve(); // Don't reject, as this is often expected
});
});
// Wait a moment for project files to be written
await new Promise((resolve) => setTimeout(resolve, 2000));
await new Promise(resolve => setTimeout(resolve, 2000));
// Load project info
let projectId;
let projectId: string;
try {
const projectJson = JSON.parse(
fs.readFileSync('.vercel/project.json', 'utf8')
fs.readFileSync('.vercel/project.json', 'utf8'),
);
projectId = projectJson.projectId;
} catch (error) {
throw new Error(
'Failed to load project info. Please ensure the Vercel project was created successfully.'
);
} catch (error: unknown) {
if (error instanceof Error) {
throw new Error(
'Failed to load project info. Please ensure the Vercel project was created successfully.',
);
}
throw error;
}
// Get Vercel token and initialize SDK client
let vercelClient = null;
let vercelClient: Vercel | null = null;
try {
const token = await getVercelToken();
if (token) {
@@ -572,29 +637,40 @@ async function deployToVercel(useGitHub = false) {
});
console.log('✅ Initialized Vercel SDK client');
}
} catch (error) {
console.warn(
'⚠️ Could not initialize Vercel SDK, falling back to CLI operations'
);
} catch (error: unknown) {
if (error instanceof Error) {
console.warn(
'⚠️ Could not initialize Vercel SDK, falling back to CLI operations',
);
}
throw error;
}
// Get project details
console.log('\n🔍 Getting project details...');
let domain;
let projectName;
let domain: string | undefined;
let projectName: string | undefined;
if (vercelClient) {
try {
const project = await vercelClient.projects.get({
idOrName: projectId,
});
projectName = project.name;
domain = `${projectName}.vercel.app`;
console.log('🌐 Using project name for domain:', domain);
} catch (error) {
console.warn(
'⚠️ Could not get project details via SDK, using CLI fallback'
const projects = await vercelClient.projects.getProjects({});
const project = projects.projects.find(
(p: any) => p.id === projectId || p.name === projectId,
);
if (project) {
projectName = project.name;
domain = `${projectName}.vercel.app`;
console.log('🌐 Using project name for domain:', domain);
} else {
throw new Error('Project not found');
}
} catch (error: unknown) {
if (error instanceof Error) {
console.warn(
'⚠️ Could not get project details via SDK, using CLI fallback',
);
}
throw error;
}
}
@@ -606,7 +682,7 @@ async function deployToVercel(useGitHub = false) {
{
cwd: projectRoot,
encoding: 'utf8',
}
},
);
const nameMatch = inspectOutput.match(/Name\s+([^\n]+)/);
@@ -622,39 +698,28 @@ async function deployToVercel(useGitHub = false) {
console.log('🌐 Using project name for domain:', domain);
} else {
console.warn(
'⚠️ Could not determine project name from inspection, using fallback'
'⚠️ Could not determine project name from inspection, using fallback',
);
// Use a fallback domain based on project ID
domain = `project-${projectId.slice(-8)}.vercel.app`;
console.log('🌐 Using fallback domain:', domain);
}
}
} catch (error) {
console.warn('⚠️ Could not inspect project, using fallback domain');
// Use a fallback domain based on project ID
domain = `project-${projectId.slice(-8)}.vercel.app`;
console.log('🌐 Using fallback domain:', domain);
} catch (error: unknown) {
if (error instanceof Error) {
console.warn('⚠️ Could not inspect project, using fallback domain');
// Use a fallback domain based on project ID
domain = `project-${projectId.slice(-8)}.vercel.app`;
console.log('🌐 Using fallback domain:', domain);
}
throw error;
}
}
// Generate mini app metadata
console.log('\n🔨 Generating mini app metadata...');
const webhookUrl =
process.env.NEYNAR_API_KEY && process.env.NEYNAR_CLIENT_ID
? `https://api.neynar.com/f/app/${process.env.NEYNAR_CLIENT_ID}/event`
: `https://${domain}/api/webhook`;
const miniAppMetadata = await generateFarcasterMetadata(domain, webhookUrl);
console.log('✅ Mini app metadata generated');
// Prepare environment variables
const nextAuthSecret =
process.env.NEXTAUTH_SECRET || crypto.randomBytes(32).toString('hex');
const vercelEnv = {
NEXTAUTH_SECRET: nextAuthSecret,
AUTH_SECRET: nextAuthSecret,
NEXTAUTH_URL: `https://${domain}`,
NEXT_PUBLIC_URL: `https://${domain}`,
...(process.env.NEYNAR_API_KEY && {
@@ -666,12 +731,18 @@ async function deployToVercel(useGitHub = false) {
...(process.env.SPONSOR_SIGNER && {
SPONSOR_SIGNER: process.env.SPONSOR_SIGNER,
}),
...(miniAppMetadata && { MINI_APP_METADATA: miniAppMetadata }),
// Include NextAuth environment variables if SEED_PHRASE is present or SPONSOR_SIGNER is true
...((process.env.SEED_PHRASE || process.env.SPONSOR_SIGNER === 'true') && {
NEXTAUTH_SECRET: nextAuthSecret,
AUTH_SECRET: nextAuthSecret,
NEXTAUTH_URL: `https://${domain}`,
}),
...Object.fromEntries(
Object.entries(process.env).filter(([key]) =>
key.startsWith('NEXT_PUBLIC_')
)
key.startsWith('NEXT_PUBLIC_'),
),
),
};
@@ -680,7 +751,7 @@ async function deployToVercel(useGitHub = false) {
vercelClient,
projectId,
vercelEnv,
projectRoot
projectRoot,
);
// Deploy the project
@@ -703,8 +774,8 @@ async function deployToVercel(useGitHub = false) {
env: process.env,
});
await new Promise((resolve, reject) => {
vercelDeploy.on('close', (code) => {
await new Promise<void>((resolve, reject) => {
vercelDeploy.on('close', code => {
if (code === 0) {
console.log('✅ Vercel deployment command completed');
resolve();
@@ -714,23 +785,26 @@ async function deployToVercel(useGitHub = false) {
}
});
vercelDeploy.on('error', (error) => {
vercelDeploy.on('error', error => {
console.error('❌ Vercel deployment error:', error.message);
reject(error);
});
});
// Wait for deployment to actually complete
let deployment;
let deployment: any;
if (vercelClient) {
try {
deployment = await waitForDeployment(vercelClient, projectId);
} catch (error) {
console.warn(
'⚠️ Could not verify deployment completion:',
error.message
);
console.log(' Proceeding with domain verification...');
} catch (error: unknown) {
if (error instanceof Error) {
console.warn(
'⚠️ Could not verify deployment completion:',
error.message,
);
console.log(' Proceeding with domain verification...');
}
throw error;
}
}
@@ -742,10 +816,13 @@ async function deployToVercel(useGitHub = false) {
try {
actualDomain = deployment.url || domain;
console.log('🌐 Verified actual domain:', actualDomain);
} catch (error) {
console.warn(
'⚠️ Could not verify domain via SDK, using assumed domain'
);
} catch (error: unknown) {
if (error instanceof Error) {
console.warn(
'⚠️ Could not verify domain via SDK, using assumed domain',
);
}
throw error;
}
}
@@ -753,32 +830,20 @@ async function deployToVercel(useGitHub = false) {
if (actualDomain !== domain) {
console.log('🔄 Updating environment variables with correct domain...');
const webhookUrl =
process.env.NEYNAR_API_KEY && process.env.NEYNAR_CLIENT_ID
? `https://api.neynar.com/f/app/${process.env.NEYNAR_CLIENT_ID}/event`
: `https://${actualDomain}/api/webhook`;
const updatedEnv = {
NEXTAUTH_URL: `https://${actualDomain}`,
const updatedEnv: Record<string, string | object> = {
NEXT_PUBLIC_URL: `https://${actualDomain}`,
};
if (miniAppMetadata) {
const updatedMetadata = await generateFarcasterMetadata(
actualDomain,
fid,
await validateSeedPhrase(process.env.SEED_PHRASE),
process.env.SEED_PHRASE,
webhookUrl
);
updatedEnv.MINI_APP_METADATA = updatedMetadata;
// Include NextAuth URL if SEED_PHRASE is present or SPONSOR_SIGNER is true
if (process.env.SEED_PHRASE || process.env.SPONSOR_SIGNER === 'true') {
updatedEnv.NEXTAUTH_URL = `https://${actualDomain}`;
}
await setEnvironmentVariables(
vercelClient,
projectId,
updatedEnv,
projectRoot
projectRoot,
);
console.log('\n📦 Redeploying with correct domain...');
@@ -788,8 +853,8 @@ async function deployToVercel(useGitHub = false) {
env: process.env,
});
await new Promise((resolve, reject) => {
vercelRedeploy.on('close', (code) => {
await new Promise<void>((resolve, reject) => {
vercelRedeploy.on('close', code => {
if (code === 0) {
console.log('✅ Redeployment completed');
resolve();
@@ -799,7 +864,7 @@ async function deployToVercel(useGitHub = false) {
}
});
vercelRedeploy.on('error', (error) => {
vercelRedeploy.on('error', error => {
console.error('❌ Redeployment error:', error.message);
reject(error);
});
@@ -811,19 +876,71 @@ async function deployToVercel(useGitHub = false) {
console.log('\n✨ Deployment complete! Your mini app is now live at:');
console.log(`🌐 https://${domain}`);
console.log(
'\n📝 You can manage your project at https://vercel.com/dashboard'
'\n📝 You can manage your project at https://vercel.com/dashboard',
);
} catch (error) {
console.error('\n❌ Deployment failed:', error.message);
process.exit(1);
// Prompt user to sign manifest in browser and paste accountAssociation
console.log(
`\n⚠ To complete your mini app manifest, you must sign it using the Farcaster developer portal.`,
);
console.log(
'1. Go to: https://farcaster.xyz/~/developers/mini-apps/manifest?domain=' +
domain,
);
console.log(
'2. Click "Transfer Ownership" and follow the instructions to sign the manifest.',
);
console.log(
'3. Copy the resulting accountAssociation JSON from the browser.',
);
console.log('4. Paste it below when prompted.');
const { userAccountAssociation } = await inquirer.prompt([
{
type: 'editor',
name: 'userAccountAssociation',
message: 'Paste the accountAssociation JSON here:',
validate: (input: string) => {
try {
const parsed = JSON.parse(input);
if (parsed.header && parsed.payload && parsed.signature) {
return true;
}
return 'Invalid accountAssociation: must have header, payload, and signature';
} catch (e) {
return 'Invalid JSON';
}
},
},
]);
const parsedAccountAssociation = JSON.parse(userAccountAssociation);
// Write APP_ACCOUNT_ASSOCIATION to src/lib/constants.ts
const constantsPath = path.join(projectRoot, 'src', 'lib', 'constants.ts');
let constantsContent = fs.readFileSync(constantsPath, 'utf8');
// Replace the APP_ACCOUNT_ASSOCIATION line using a robust, anchored, multiline regex
const newAccountAssociation = `export const APP_ACCOUNT_ASSOCIATION: AccountAssociation | undefined = ${JSON.stringify(parsedAccountAssociation, null, 2)};`;
constantsContent = constantsContent.replace(
/^export const APP_ACCOUNT_ASSOCIATION\s*:\s*AccountAssociation \| undefined\s*=\s*[^;]*;/m,
newAccountAssociation,
);
fs.writeFileSync(constantsPath, constantsContent);
console.log('\n✅ APP_ACCOUNT_ASSOCIATION updated in src/lib/constants.ts');
} catch (error: unknown) {
if (error instanceof Error) {
console.error('\n❌ Deployment failed:', error.message);
process.exit(1);
}
throw error;
}
}
async function main() {
async function main(): Promise<void> {
try {
console.log('🚀 Vercel Mini App Deployment (SDK Edition)');
console.log(
'This script will deploy your mini app to Vercel using the Vercel SDK.'
'This script will deploy your mini app to Vercel using the Vercel SDK.',
);
console.log('\nThe script will:');
console.log('1. Check for required environment variables');
@@ -834,13 +951,16 @@ async function main() {
// Check if @vercel/sdk is installed
try {
await import('@vercel/sdk');
} catch (error) {
console.log('📦 Installing @vercel/sdk...');
execSync('npm install @vercel/sdk', {
cwd: projectRoot,
stdio: 'inherit',
});
console.log('✅ @vercel/sdk installed successfully');
} catch (error: unknown) {
if (error instanceof Error) {
console.log('📦 Installing @vercel/sdk...');
execSync('npm install @vercel/sdk', {
cwd: projectRoot,
stdio: 'inherit',
});
console.log('✅ @vercel/sdk installed successfully');
}
throw error;
}
await checkRequiredEnvVars();
@@ -896,10 +1016,13 @@ async function main() {
}
await deployToVercel(useGitHub);
} catch (error) {
console.error('\n❌ Error:', error.message);
process.exit(1);
} catch (error: unknown) {
if (error instanceof Error) {
console.error('\n❌ Error:', error.message);
process.exit(1);
}
throw error;
}
}
main();
main();

View File

@@ -1,9 +1,9 @@
import { NextResponse } from 'next/server';
import { getFarcasterMetadata } from '../../../lib/utils';
import { getFarcasterDomainManifest } from '~/lib/utils';
export async function GET() {
try {
const config = await getFarcasterMetadata();
const config = await getFarcasterDomainManifest();
return NextResponse.json(config);
} catch (error) {
console.error('Error generating metadata:', error);

View File

@@ -1,46 +0,0 @@
import { NextResponse } from 'next/server';
import { getServerSession } from 'next-auth';
import { authOptions } from '~/auth';
export async function POST(request: Request) {
try {
const session = await getServerSession(authOptions);
if (!session?.user?.fid) {
return NextResponse.json(
{ error: 'No authenticated session found' },
{ status: 401 }
);
}
const body = await request.json();
const { signers, user } = body;
if (!signers || !user) {
return NextResponse.json(
{ error: 'Signers and user are required' },
{ status: 400 }
);
}
// For NextAuth to update the session, we need to trigger the JWT callback
// This is typically done by calling the session endpoint with updated data
// However, we can't directly modify the session token from here
// Instead, we'll store the data temporarily and let the client refresh the session
// The session will be updated when the JWT callback is triggered
return NextResponse.json({
success: true,
message: 'Session update prepared',
signers,
user,
});
} catch (error) {
console.error('Error preparing session update:', error);
return NextResponse.json(
{ error: 'Failed to prepare session update' },
{ status: 500 }
);
}
}

View File

@@ -0,0 +1,46 @@
import { NextResponse } from 'next/server';
import { createClient, Errors } from '@farcaster/quick-auth';
const client = createClient();
export async function POST(request: Request) {
try {
const { token } = await request.json();
if (!token) {
return NextResponse.json({ error: 'Token is required' }, { status: 400 });
}
// Get domain from environment or request
const domain = process.env.NEXT_PUBLIC_URL
? new URL(process.env.NEXT_PUBLIC_URL).hostname
: request.headers.get('host') || 'localhost';
try {
// Use the official QuickAuth library to verify the JWT
const payload = await client.verifyJwt({
token,
domain,
});
return NextResponse.json({
success: true,
user: {
fid: payload.sub,
},
});
} catch (e) {
if (e instanceof Errors.InvalidTokenError) {
console.info('Invalid token:', e.message);
return NextResponse.json({ error: 'Invalid token' }, { status: 401 });
}
throw e;
}
} catch (error) {
console.error('Token validation error:', error);
return NextResponse.json(
{ error: 'Internal server error' },
{ status: 500 },
);
}
}

View File

@@ -1,6 +1,5 @@
import type { Metadata } from "next";
import { getSession } from "~/auth"
import "~/app/globals.css";
import { Providers } from "~/app/providers";
import { APP_NAME, APP_DESCRIPTION } from "~/lib/constants";
@@ -15,7 +14,19 @@ export default async function RootLayout({
}: Readonly<{
children: React.ReactNode;
}>) {
const session = await getSession()
// Only get session if sponsored signer is enabled or seed phrase is provided
const sponsorSigner = process.env.SPONSOR_SIGNER === 'true';
const hasSeedPhrase = !!process.env.SEED_PHRASE;
let session = null;
if (sponsorSigner || hasSeedPhrase) {
try {
const { getSession } = await import("~/auth");
session = await getSession();
} catch (error) {
console.warn('Failed to get session:', error);
}
}
return (
<html lang="en">

View File

@@ -24,18 +24,36 @@ export function Providers({
}) {
const solanaEndpoint =
process.env.SOLANA_RPC_ENDPOINT || 'https://solana-rpc.publicnode.com';
// Only wrap with SessionProvider if session is provided
if (session) {
return (
<SessionProvider session={session}>
<WagmiProvider>
<MiniAppProvider
analyticsEnabled={ANALYTICS_ENABLED}
backButtonEnabled={true}
>
<SafeFarcasterSolanaProvider endpoint={solanaEndpoint}>
<AuthKitProvider config={{}}>{children}</AuthKitProvider>
</SafeFarcasterSolanaProvider>
</MiniAppProvider>
</WagmiProvider>
</SessionProvider>
);
}
// Return without SessionProvider if no session
return (
<SessionProvider session={session}>
<WagmiProvider>
<MiniAppProvider
analyticsEnabled={ANALYTICS_ENABLED}
backButtonEnabled={true}
>
<SafeFarcasterSolanaProvider endpoint={solanaEndpoint}>
<AuthKitProvider config={{}}>{children}</AuthKitProvider>
</SafeFarcasterSolanaProvider>
</MiniAppProvider>
</WagmiProvider>
</SessionProvider>
<WagmiProvider>
<MiniAppProvider
analyticsEnabled={ANALYTICS_ENABLED}
backButtonEnabled={true}
>
<SafeFarcasterSolanaProvider endpoint={solanaEndpoint}>
<AuthKitProvider config={{}}>{children}</AuthKitProvider>
</SafeFarcasterSolanaProvider>
</MiniAppProvider>
</WagmiProvider>
);
}

View File

@@ -118,7 +118,7 @@ export function AuthDialog({
const content = getStepContent();
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm p-4">
<div className="fixed inset-0 z-[100] flex items-center justify-center bg-black/50 backdrop-blur-sm p-4">
<div className="bg-white dark:bg-gray-800 rounded-xl w-full max-w-md shadow-2xl border border-gray-200 dark:border-gray-700 max-h-[80vh] sm:max-h-[90vh] flex flex-col">
<div className="flex justify-between items-center p-4 sm:p-6 pb-3 sm:pb-4 border-b border-gray-200 dark:border-gray-700 flex-shrink-0">
<h2 className="text-lg font-semibold text-gray-900 dark:text-gray-100">
@@ -191,20 +191,22 @@ export function AuthDialog({
{content.showOpenButton && content.qrUrl && (
<button
onClick={() =>
window.open(
content.qrUrl
.replace(
'https://farcaster.xyz/',
'https://client.farcaster.xyz/deeplinks/'
)
.replace(
'https://client.farcaster.xyz/deeplinks/',
'farcaster://'
),
'_blank'
)
}
onClick={() => {
if (content.qrUrl) {
window.open(
content.qrUrl
.replace(
'https://farcaster.xyz/',
'https://client.farcaster.xyz/deeplinks/'
)
.replace(
'https://client.farcaster.xyz/deeplinks/signed-key-request',
'https://farcaster.xyz/~/connect'
),
'_blank'
);
}
}}
className="btn btn-outline flex items-center justify-center gap-2 w-full"
>
I&apos;m using my phone

View File

@@ -1,11 +1,10 @@
'use client';
import '@farcaster/auth-kit/styles.css';
import { useSignIn } from '@farcaster/auth-kit';
import { useCallback, useEffect, useState } from 'react';
import { useSignIn, UseSignInData } from '@farcaster/auth-kit';
import { useCallback, useEffect, useState, useRef } from 'react';
import { cn } from '~/lib/utils';
import { Button } from '~/components/ui/Button';
import { isMobile } from '~/lib/devices';
import { ProfileButton } from '~/components/ui/NeynarAuthButton/ProfileButton';
import { AuthDialog } from '~/components/ui/NeynarAuthButton/AuthDialog';
import { getItem, removeItem, setItem } from '~/lib/localStorage';
@@ -113,6 +112,8 @@ export function NeynarAuthButton() {
);
const [message, setMessage] = useState<string | null>(null);
const [signature, setSignature] = useState<string | null>(null);
const [isSignerFlowRunning, setIsSignerFlowRunning] = useState(false);
const signerFlowStartedRef = useRef(false);
// Determine which flow to use based on context
const useBackendFlow = context !== undefined;
@@ -290,14 +291,46 @@ export function NeynarAuthButton() {
// Helper function to poll signer status
const startPolling = useCallback(
(signerUuid: string, message: string, signature: string) => {
// Clear any existing polling interval before starting a new one
if (pollingInterval) {
clearInterval(pollingInterval);
}
let retryCount = 0;
const maxRetries = 10; // Maximum 10 retries (20 seconds total)
const maxPollingTime = 60000; // Maximum 60 seconds of polling
const startTime = Date.now();
const interval = setInterval(async () => {
// Check if we've been polling too long
if (Date.now() - startTime > maxPollingTime) {
clearInterval(interval);
setPollingInterval(null);
return;
}
try {
const response = await fetch(
`/api/auth/signer?signerUuid=${signerUuid}`
);
if (!response.ok) {
throw new Error('Failed to poll signer status');
// Check if it's a rate limit error
if (response.status === 429) {
clearInterval(interval);
setPollingInterval(null);
return;
}
// Increment retry count for other errors
retryCount++;
if (retryCount >= maxRetries) {
clearInterval(interval);
setPollingInterval(null);
return;
}
throw new Error(`Failed to poll signer status: ${response.status}`);
}
const signerData = await response.json();
@@ -319,7 +352,7 @@ export function NeynarAuthButton() {
setPollingInterval(interval);
},
[fetchAllSigners]
[fetchAllSigners, pollingInterval]
);
// Cleanup polling on unmount
@@ -328,6 +361,7 @@ export function NeynarAuthButton() {
if (pollingInterval) {
clearInterval(pollingInterval);
}
signerFlowStartedRef.current = false;
};
}, [pollingInterval]);
@@ -362,11 +396,11 @@ export function NeynarAuthButton() {
// Success callback - this is critical!
const onSuccessCallback = useCallback(
async (res: unknown) => {
async (res: UseSignInData) => {
if (!useBackendFlow) {
// Only handle localStorage for frontend flow
const existingAuth = getItem<StoredAuthState>(STORAGE_KEY);
const user = await fetchUserData(res.fid);
const user = res.fid ? await fetchUserData(res.fid) : null;
const authState: StoredAuthState = {
...existingAuth,
isAuthenticated: true,
@@ -409,6 +443,11 @@ export function NeynarAuthButton() {
useEffect(() => {
setMessage(data?.message || null);
setSignature(data?.signature || null);
// Reset the signer flow flag when message/signature change
if (data?.message && data?.signature) {
signerFlowStartedRef.current = false;
}
}, [data?.message, data?.signature]);
// Connect for frontend flow when nonce is available
@@ -420,8 +459,16 @@ export function NeynarAuthButton() {
// Handle fetching signers after successful authentication
useEffect(() => {
if (message && signature) {
if (
message &&
signature &&
!isSignerFlowRunning &&
!signerFlowStartedRef.current
) {
signerFlowStartedRef.current = true;
const handleSignerFlow = async () => {
setIsSignerFlowRunning(true);
try {
const clientContext = context?.client as Record<string, unknown>;
const isMobileContext =
@@ -437,6 +484,7 @@ export function NeynarAuthButton() {
// First, fetch existing signers
const signers = await fetchAllSigners(message, signature);
if (useBackendFlow && isMobileContext) setSignersLoading(true);
// Check if no signers exist or if we have empty signers
@@ -457,8 +505,8 @@ export function NeynarAuthButton() {
setShowDialog(false);
await sdk.actions.openUrl(
signedKeyData.signer_approval_url.replace(
'https://client.farcaster.xyz/deeplinks/',
'farcaster://'
'https://client.farcaster.xyz/deeplinks/signed-key-request',
'https://farcaster.xyz/~/connect'
)
);
} else {
@@ -481,21 +529,14 @@ export function NeynarAuthButton() {
setSignersLoading(false);
setShowDialog(false);
setSignerApprovalUrl(null);
} finally {
setIsSignerFlowRunning(false);
}
};
handleSignerFlow();
}
}, [
message,
signature,
fetchAllSigners,
createSigner,
generateSignedKeyRequest,
startPolling,
context,
useBackendFlow,
]);
}, [message, signature]); // Simplified dependencies
// Backend flow using NextAuth
const handleBackendSignIn = useCallback(async () => {
@@ -568,6 +609,9 @@ export function NeynarAuthButton() {
clearInterval(pollingInterval);
setPollingInterval(null);
}
// Reset signer flow flag
signerFlowStartedRef.current = false;
} catch (error) {
console.error('❌ Error during sign out:', error);
// Optionally handle error state

View File

@@ -4,6 +4,7 @@ import { useCallback, useState, useEffect } from 'react';
import { Button } from './Button';
import { useMiniApp } from '@neynar/react';
import { type ComposeCast } from "@farcaster/miniapp-sdk";
import { APP_URL } from '~/lib/constants';
interface EmbedConfig {
path?: string;
@@ -72,7 +73,7 @@ export function ShareButton({ buttonText, cast, className = '', isLoading = fals
return embed;
}
if (embed.path) {
const baseUrl = process.env.NEXT_PUBLIC_URL || window.location.origin;
const baseUrl = APP_URL || window.location.origin;
const url = new URL(`${baseUrl}${embed.path}`);
// Add UTM parameters

View File

@@ -1,12 +1,23 @@
'use client';
import { useCallback, useState } from "react";
import { useMiniApp } from "@neynar/react";
import { ShareButton } from "../Share";
import { Button } from "../Button";
import { SignIn } from "../wallet/SignIn";
import { type Haptics } from "@farcaster/miniapp-sdk";
import { NeynarAuthButton } from '../NeynarAuthButton/index';
import { useCallback, useState, type ComponentType } from 'react';
import { useMiniApp } from '@neynar/react';
import { ShareButton } from '../Share';
import { Button } from '../Button';
import { SignIn } from '../wallet/SignIn';
import { type Haptics } from '@farcaster/miniapp-sdk';
import { APP_URL } from '~/lib/constants';
// Optional import for NeynarAuthButton - may not exist in all templates
let NeynarAuthButton: ComponentType | null = null;
try {
const module = require('../NeynarAuthButton/index');
NeynarAuthButton = module.NeynarAuthButton;
} catch (error) {
// Component doesn't exist, that's okay
console.log('NeynarAuthButton not available in this template');
}
/**
* ActionsTab component handles mini app actions like sharing, notifications, and haptic feedback.
@@ -96,7 +107,7 @@ export function ActionsTab() {
*/
const copyUserShareUrl = useCallback(async () => {
if (context?.user?.fid) {
const userShareUrl = `${process.env.NEXT_PUBLIC_URL}/share/${context.user.fid}`;
const userShareUrl = `${APP_URL}/share/${context.user.fid}`;
await navigator.clipboard.writeText(userShareUrl);
setNotificationState((prev) => ({ ...prev, shareUrlCopied: true }));
setTimeout(
@@ -123,50 +134,48 @@ export function ActionsTab() {
// --- Render ---
return (
<div className='space-y-3 px-6 w-full max-w-md mx-auto'>
<div className="space-y-3 px-6 w-full max-w-md mx-auto">
{/* Share functionality */}
<ShareButton
buttonText='Share Mini App'
buttonText="Share Mini App"
cast={{
text: 'Check out this awesome frame @1 @2 @3! 🚀🪐',
bestFriends: true,
embeds: [
`${process.env.NEXT_PUBLIC_URL}/share/${context?.user?.fid || ''}`,
],
embeds: [`${APP_URL}/share/${context?.user?.fid || ''}`],
}}
className='w-full'
className="w-full"
/>
{/* Authentication */}
<SignIn />
{/* Neynar Authentication */}
<NeynarAuthButton />
{NeynarAuthButton && <NeynarAuthButton />}
{/* Mini app actions */}
<Button
onClick={() =>
actions.openUrl('https://www.youtube.com/watch?v=dQw4w9WgXcQ')
}
className='w-full'
className="w-full"
>
Open Link
</Button>
<Button onClick={actions.addMiniApp} disabled={added} className='w-full'>
<Button onClick={actions.addMiniApp} disabled={added} className="w-full">
Add Mini App to Client
</Button>
{/* Notification functionality */}
{notificationState.sendStatus && (
<div className='text-sm w-full'>
<div className="text-sm w-full">
Send notification result: {notificationState.sendStatus}
</div>
)}
<Button
onClick={sendFarcasterNotification}
disabled={!notificationDetails}
className='w-full'
className="w-full"
>
Send notification
</Button>
@@ -175,14 +184,14 @@ export function ActionsTab() {
<Button
onClick={copyUserShareUrl}
disabled={!context?.user?.fid}
className='w-full'
className="w-full"
>
{notificationState.shareUrlCopied ? 'Copied!' : 'Copy share URL'}
</Button>
{/* Haptic feedback controls */}
<div className='space-y-2'>
<label className='block text-sm font-medium text-gray-700 dark:text-gray-300'>
<div className="space-y-2">
<label className="block text-sm font-medium text-gray-700 dark:text-gray-300">
Haptic Intensity
</label>
<select
@@ -192,7 +201,7 @@ export function ActionsTab() {
e.target.value as Haptics.ImpactOccurredType
)
}
className='w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring-2 focus:ring-primary'
className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring-2 focus:ring-primary"
>
<option value={'light'}>Light</option>
<option value={'medium'}>Medium</option>
@@ -200,7 +209,7 @@ export function ActionsTab() {
<option value={'soft'}>Soft</option>
<option value={'rigid'}>Rigid</option>
</select>
<Button onClick={triggerHapticFeedback} className='w-full'>
<Button onClick={triggerHapticFeedback} className="w-full">
Trigger Haptic Feedback
</Button>
</div>

View File

@@ -1,22 +1,20 @@
'use client';
import { useCallback, useState } from "react";
import { signIn, signOut, getCsrfToken } from "next-auth/react";
import sdk, { SignIn as SignInCore } from "@farcaster/miniapp-sdk";
import { useSession } from "next-auth/react";
import { Button } from "../Button";
import { useCallback, useState } from 'react';
import { SignIn as SignInCore } from '@farcaster/miniapp-sdk';
import { useQuickAuth } from '~/hooks/useQuickAuth';
import { Button } from '../Button';
/**
* SignIn component handles Farcaster authentication using Sign-In with Farcaster (SIWF).
* SignIn component handles Farcaster authentication using QuickAuth.
*
* This component provides a complete authentication flow for Farcaster users:
* - Generates nonces for secure authentication
* - Handles the SIWF flow using the Farcaster SDK
* - Manages NextAuth session state
* - Uses the built-in QuickAuth functionality from the Farcaster SDK
* - Manages authentication state in memory (no persistence)
* - Provides sign-out functionality
* - Displays authentication status and results
*
* The component integrates with both the Farcaster Frame SDK and NextAuth
* The component integrates with the Farcaster Frame SDK and QuickAuth
* to provide seamless authentication within mini apps.
*
* @example
@@ -36,52 +34,32 @@ export function SignIn() {
signingIn: false,
signingOut: false,
});
const [signInResult, setSignInResult] = useState<SignInCore.SignInResult>();
const [signInFailure, setSignInFailure] = useState<string>();
// --- Hooks ---
const { data: session, status } = useSession();
const { authenticatedUser, status, signIn, signOut } = useQuickAuth();
// --- Handlers ---
/**
* Generates a nonce for the sign-in process.
* Handles the sign-in process using QuickAuth.
*
* This function retrieves a CSRF token from NextAuth to use as a nonce
* for the SIWF authentication flow. The nonce ensures the authentication
* request is fresh and prevents replay attacks.
*
* @returns Promise<string> - The generated nonce token
* @throws Error if unable to generate nonce
*/
const getNonce = useCallback(async () => {
const nonce = await getCsrfToken();
if (!nonce) throw new Error('Unable to generate nonce');
return nonce;
}, []);
/**
* Handles the sign-in process using Farcaster SDK.
*
* This function orchestrates the complete SIWF flow:
* 1. Generates a nonce for security
* 2. Calls the Farcaster SDK to initiate sign-in
* 3. Submits the result to NextAuth for session management
* 4. Handles various error conditions including user rejection
* This function uses the built-in QuickAuth functionality:
* 1. Gets a token from QuickAuth (handles SIWF flow automatically)
* 2. Validates the token with our server
* 3. Updates the session state
*
* @returns Promise<void>
*/
const handleSignIn = useCallback(async () => {
try {
setAuthState((prev) => ({ ...prev, signingIn: true }));
setAuthState(prev => ({ ...prev, signingIn: true }));
setSignInFailure(undefined);
const nonce = await getNonce();
const result = await sdk.actions.signIn({ nonce });
setSignInResult(result);
await signIn('farcaster', {
message: result.message,
signature: result.signature,
redirect: false,
});
const success = await signIn();
if (!success) {
setSignInFailure('Authentication failed');
}
} catch (e) {
if (e instanceof SignInCore.RejectedByUser) {
setSignInFailure('Rejected by user');
@@ -89,52 +67,49 @@ export function SignIn() {
}
setSignInFailure('Unknown error');
} finally {
setAuthState((prev) => ({ ...prev, signingIn: false }));
setAuthState(prev => ({ ...prev, signingIn: false }));
}
}, [getNonce]);
}, [signIn]);
/**
* Handles the sign-out process.
*
* This function clears the NextAuth session only if the current session
* is using the Farcaster provider, and resets the local sign-in result state.
* This function clears the QuickAuth session and resets the local state.
*
* @returns Promise<void>
*/
const handleSignOut = useCallback(async () => {
try {
setAuthState((prev) => ({ ...prev, signingOut: true }));
// Only sign out if the current session is from Farcaster provider
if (session?.provider === 'farcaster') {
await signOut({ redirect: false });
}
setSignInResult(undefined);
setAuthState(prev => ({ ...prev, signingOut: true }));
await signOut();
} finally {
setAuthState((prev) => ({ ...prev, signingOut: false }));
setAuthState(prev => ({ ...prev, signingOut: false }));
}
}, [session]);
}, [signOut]);
// --- Render ---
return (
<>
{/* Authentication Buttons */}
{(status !== 'authenticated' || session?.provider !== 'farcaster') && (
{status !== 'authenticated' && (
<Button onClick={handleSignIn} disabled={authState.signingIn}>
Sign In with Farcaster
</Button>
)}
{status === 'authenticated' && session?.provider === 'farcaster' && (
{status === 'authenticated' && (
<Button onClick={handleSignOut} disabled={authState.signingOut}>
Sign out
</Button>
)}
{/* Session Information */}
{session && (
{authenticatedUser && (
<div className="my-2 p-2 text-xs overflow-x-scroll bg-gray-100 dark:bg-gray-900 rounded-lg font-mono">
<div className="font-semibold text-gray-500 dark:text-gray-300 mb-1">Session</div>
<div className="font-semibold text-gray-500 dark:text-gray-300 mb-1">
Authenticated User
</div>
<div className="whitespace-pre text-gray-700 dark:text-gray-200">
{JSON.stringify(session, null, 2)}
{JSON.stringify(authenticatedUser, null, 2)}
</div>
</div>
)}
@@ -142,20 +117,14 @@ export function SignIn() {
{/* Error Display */}
{signInFailure && !authState.signingIn && (
<div className="my-2 p-2 text-xs overflow-x-scroll bg-gray-100 dark:bg-gray-900 rounded-lg font-mono">
<div className="font-semibold text-gray-500 dark:text-gray-300 mb-1">SIWF Result</div>
<div className="whitespace-pre text-gray-700 dark:text-gray-200">{signInFailure}</div>
</div>
)}
{/* Success Result Display */}
{signInResult && !authState.signingIn && (
<div className="my-2 p-2 text-xs overflow-x-scroll bg-gray-100 dark:bg-gray-900 rounded-lg font-mono">
<div className="font-semibold text-gray-500 dark:text-gray-300 mb-1">SIWF Result</div>
<div className="font-semibold text-gray-500 dark:text-gray-300 mb-1">
Authentication Error
</div>
<div className="whitespace-pre text-gray-700 dark:text-gray-200">
{JSON.stringify(signInResult, null, 2)}
{signInFailure}
</div>
</div>
)}
</>
);
}
}

207
src/hooks/useQuickAuth.ts Normal file
View File

@@ -0,0 +1,207 @@
'use client';
import { useState, useEffect, useCallback } from 'react';
import { sdk } from '@farcaster/miniapp-sdk';
/**
* Represents the current authenticated user state
*/
interface AuthenticatedUser {
/** The user's Farcaster ID (FID) */
fid: number;
}
/**
* Possible authentication states for QuickAuth
*/
type QuickAuthStatus = 'loading' | 'authenticated' | 'unauthenticated';
/**
* Return type for the useQuickAuth hook
*/
interface UseQuickAuthReturn {
/** Current authenticated user data, or null if not authenticated */
authenticatedUser: AuthenticatedUser | null;
/** Current authentication status */
status: QuickAuthStatus;
/** Function to initiate the sign-in process using QuickAuth */
signIn: () => Promise<boolean>;
/** Function to sign out and clear the current authentication state */
signOut: () => Promise<void>;
/** Function to retrieve the current authentication token */
getToken: () => Promise<string | null>;
}
/**
* Custom hook for managing QuickAuth authentication state
*
* This hook provides a complete authentication flow using Farcaster's QuickAuth:
* - Automatically checks for existing authentication on mount
* - Validates tokens with the server-side API
* - Manages authentication state in memory (no persistence)
* - Provides sign-in/sign-out functionality
*
* QuickAuth tokens are managed in memory only, so signing out of the Farcaster
* client will automatically sign the user out of this mini app as well.
*
* @returns {UseQuickAuthReturn} Object containing user state and authentication methods
*
* @example
* ```tsx
* const { authenticatedUser, status, signIn, signOut } = useQuickAuth();
*
* if (status === 'loading') return <div>Loading...</div>;
* if (status === 'unauthenticated') return <button onClick={signIn}>Sign In</button>;
*
* return (
* <div>
* <p>Welcome, FID: {authenticatedUser?.fid}</p>
* <button onClick={signOut}>Sign Out</button>
* </div>
* );
* ```
*/
export function useQuickAuth(): UseQuickAuthReturn {
// Current authenticated user data
const [authenticatedUser, setAuthenticatedUser] =
useState<AuthenticatedUser | null>(null);
// Current authentication status
const [status, setStatus] = useState<QuickAuthStatus>('loading');
/**
* Validates a QuickAuth token with the server-side API
*
* @param {string} authToken - The JWT token to validate
* @returns {Promise<AuthenticatedUser | null>} User data if valid, null otherwise
*/
const validateTokenWithServer = async (
authToken: string,
): Promise<AuthenticatedUser | null> => {
try {
const validationResponse = await fetch('/api/auth/validate', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ token: authToken }),
});
if (validationResponse.ok) {
const responseData = await validationResponse.json();
return responseData.user;
}
return null;
} catch (error) {
console.error('Token validation failed:', error);
return null;
}
};
/**
* Checks for existing authentication token and validates it on component mount
* This runs automatically when the hook is first used
*/
useEffect(() => {
const checkExistingAuthentication = async () => {
try {
// Attempt to retrieve existing token from QuickAuth SDK
const { token } = await sdk.quickAuth.getToken();
if (token) {
// Validate the token with our server-side API
const validatedUserSession = await validateTokenWithServer(token);
if (validatedUserSession) {
// Token is valid, set authenticated state
setAuthenticatedUser(validatedUserSession);
setStatus('authenticated');
} else {
// Token is invalid or expired, clear authentication state
setStatus('unauthenticated');
}
} else {
// No existing token found, user is not authenticated
setStatus('unauthenticated');
}
} catch (error) {
console.error('Error checking existing authentication:', error);
setStatus('unauthenticated');
}
};
checkExistingAuthentication();
}, []);
/**
* Initiates the QuickAuth sign-in process
*
* Uses sdk.quickAuth.getToken() to get a QuickAuth session token.
* If there is already a session token in memory that hasn't expired,
* it will be immediately returned, otherwise a fresh one will be acquired.
*
* @returns {Promise<boolean>} True if sign-in was successful, false otherwise
*/
const signIn = useCallback(async (): Promise<boolean> => {
try {
setStatus('loading');
// Get QuickAuth session token
const { token } = await sdk.quickAuth.getToken();
if (token) {
// Validate the token with our server-side API
const validatedUserSession = await validateTokenWithServer(token);
if (validatedUserSession) {
// Authentication successful, update user state
setAuthenticatedUser(validatedUserSession);
setStatus('authenticated');
return true;
}
}
// Authentication failed, clear user state
setStatus('unauthenticated');
return false;
} catch (error) {
console.error('Sign-in process failed:', error);
setStatus('unauthenticated');
return false;
}
}, []);
/**
* Signs out the current user and clears the authentication state
*
* Since QuickAuth tokens are managed in memory only, this simply clears
* the local user state. The actual token will be cleared when the
* user signs out of their Farcaster client.
*/
const signOut = useCallback(async (): Promise<void> => {
// Clear local user state
setAuthenticatedUser(null);
setStatus('unauthenticated');
}, []);
/**
* Retrieves the current authentication token from QuickAuth
*
* @returns {Promise<string | null>} The current auth token, or null if not authenticated
*/
const getToken = useCallback(async (): Promise<string | null> => {
try {
const { token } = await sdk.quickAuth.getToken();
return token;
} catch (error) {
console.error('Failed to retrieve authentication token:', error);
return null;
}
}, []);
return {
authenticatedUser,
status,
signIn,
signOut,
getToken,
};
}

View File

@@ -1,3 +1,5 @@
import { type AccountAssociation } from '@farcaster/miniapp-node';
/**
* Application constants and configuration values.
*
@@ -14,63 +16,70 @@
* The base URL of the application.
* Used for generating absolute URLs for assets and API endpoints.
*/
export const APP_URL = process.env.NEXT_PUBLIC_URL!;
export const APP_URL: string = process.env.NEXT_PUBLIC_URL!;
/**
* The name of the mini app as displayed to users.
* Used in titles, headers, and app store listings.
*/
export const APP_NAME = 'shreyas-testing-mini-app';
export const APP_NAME: string = 'Starter Kit';
/**
* A brief description of the mini app's functionality.
* Used in app store listings and metadata.
*/
export const APP_DESCRIPTION = 'A Farcaster mini app created with Neynar';
export const APP_DESCRIPTION: string = 'A demo of the Neynar Starter Kit';
/**
* The primary category for the mini app.
* Used for app store categorization and discovery.
*/
export const APP_PRIMARY_CATEGORY = '';
export const APP_PRIMARY_CATEGORY: string = 'developer-tools';
/**
* Tags associated with the mini app.
* Used for search and discovery in app stores.
*/
export const APP_TAGS = ['neynar', 'starter-kit', 'demo'];
export const APP_TAGS: string[] = ['neynar', 'starter-kit', 'demo'];
// --- Asset URLs ---
/**
* URL for the app's icon image.
* Used in app store listings and UI elements.
*/
export const APP_ICON_URL = `${APP_URL}/icon.png`;
export const APP_ICON_URL: string = `${APP_URL}/icon.png`;
/**
* URL for the app's Open Graph image.
* Used for social media sharing and previews.
*/
export const APP_OG_IMAGE_URL = `${APP_URL}/api/opengraph-image`;
export const APP_OG_IMAGE_URL: string = `${APP_URL}/api/opengraph-image`;
/**
* URL for the app's splash screen image.
* Displayed during app loading.
*/
export const APP_SPLASH_URL = `${APP_URL}/splash.png`;
export const APP_SPLASH_URL: string = `${APP_URL}/splash.png`;
/**
* Background color for the splash screen.
* Used as fallback when splash image is loading.
*/
export const APP_SPLASH_BACKGROUND_COLOR = '#f7f7f7';
export const APP_SPLASH_BACKGROUND_COLOR: string = "#f7f7f7";
/**
* Account association for the mini app.
* Used to associate the mini app with a Farcaster account.
* If not provided, the mini app will be unsigned and have limited capabilities.
*/
export const APP_ACCOUNT_ASSOCIATION: AccountAssociation | undefined = undefined;
// --- UI Configuration ---
/**
* Text displayed on the main action button.
* Used for the primary call-to-action in the mini app.
*/
export const APP_BUTTON_TEXT = 'Launch Mini App';
export const APP_BUTTON_TEXT: string = 'Launch NSK';
// --- Integration Configuration ---
/**
@@ -80,8 +89,7 @@ export const APP_BUTTON_TEXT = 'Launch Mini App';
* Neynar webhook endpoint. Otherwise, falls back to a local webhook
* endpoint for development and testing.
*/
export const APP_WEBHOOK_URL =
process.env.NEYNAR_API_KEY && process.env.NEYNAR_CLIENT_ID
export const APP_WEBHOOK_URL: string = process.env.NEYNAR_API_KEY && process.env.NEYNAR_CLIENT_ID
? `https://api.neynar.com/f/app/${process.env.NEYNAR_CLIENT_ID}/event`
: `${APP_URL}/api/webhook`;
@@ -92,7 +100,7 @@ export const APP_WEBHOOK_URL =
* When false, wallet functionality is completely hidden from the UI.
* Useful for mini apps that don't require wallet integration.
*/
export const USE_WALLET = true;
export const USE_WALLET: boolean = true;
/**
* Flag to enable/disable analytics tracking.
@@ -101,7 +109,19 @@ export const USE_WALLET = true;
* When false, analytics collection is disabled.
* Useful for privacy-conscious users or development environments.
*/
export const ANALYTICS_ENABLED = true;
export const ANALYTICS_ENABLED: boolean = true;
/**
* Required chains for the mini app.
*
* Contains an array of CAIP-2 identifiers for blockchains that the mini app requires.
* If the host does not support all chains listed here, it will not render the mini app.
* If empty or undefined, the mini app will be rendered regardless of chain support.
*
* Supported chains: eip155:1, eip155:137, eip155:42161, eip155:10, eip155:8453,
* solana:mainnet, solana:devnet
*/
export const APP_REQUIRED_CHAINS: string[] = [];
// PLEASE DO NOT UPDATE THIS
export const SIGNED_KEY_REQUEST_VALIDATOR_EIP_712_DOMAIN = {

View File

@@ -1,6 +1,6 @@
import { type ClassValue, clsx } from "clsx";
import { twMerge } from "tailwind-merge";
import { mnemonicToAccount } from "viem/accounts";
import { type ClassValue, clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import { type Manifest } from '@farcaster/miniapp-node';
import {
APP_BUTTON_TEXT,
APP_DESCRIPTION,
@@ -9,35 +9,12 @@ import {
APP_OG_IMAGE_URL,
APP_PRIMARY_CATEGORY,
APP_SPLASH_BACKGROUND_COLOR,
APP_TAGS,
APP_URL,
APP_SPLASH_URL,
APP_TAGS, APP_URL,
APP_WEBHOOK_URL,
} from "./constants";
import { APP_SPLASH_URL } from "./constants";
interface MiniAppMetadata {
version: string;
name: string;
iconUrl: string;
homeUrl: string;
imageUrl?: string;
buttonTitle?: string;
splashImageUrl?: string;
splashBackgroundColor?: string;
webhookUrl?: string;
description?: string;
primaryCategory?: string;
tags?: string[];
}
interface MiniAppManifest {
accountAssociation?: {
header: string;
payload: string;
signature: string;
};
frame: MiniAppMetadata;
}
APP_ACCOUNT_ASSOCIATION,
APP_REQUIRED_CHAINS,
} from './constants';
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs));
@@ -47,6 +24,9 @@ export function getMiniAppEmbedMetadata(ogImageUrl?: string) {
return {
version: "next",
imageUrl: ogImageUrl ?? APP_OG_IMAGE_URL,
ogTitle: APP_NAME,
ogDescription: APP_DESCRIPTION,
ogImageUrl: ogImageUrl ?? APP_OG_IMAGE_URL,
button: {
title: APP_BUTTON_TEXT,
action: {
@@ -64,36 +44,10 @@ export function getMiniAppEmbedMetadata(ogImageUrl?: string) {
};
}
export async function getFarcasterMetadata(): Promise<MiniAppManifest> {
// First check for MINI_APP_METADATA in .env and use that if it exists
if (process.env.MINI_APP_METADATA) {
try {
const metadata = JSON.parse(process.env.MINI_APP_METADATA);
console.log("Using pre-signed mini app metadata from environment");
return metadata;
} catch (error) {
console.warn(
"Failed to parse MINI_APP_METADATA from environment:",
error
);
}
}
if (!APP_URL) {
throw new Error("NEXT_PUBLIC_URL not configured");
}
// Get the domain from the URL (without https:// prefix)
const domain = new URL(APP_URL).hostname;
console.log("Using domain for manifest:", domain);
export async function getFarcasterDomainManifest(): Promise<Manifest> {
return {
accountAssociation: {
header: "",
payload: "",
signature: "",
},
frame: {
accountAssociation: APP_ACCOUNT_ASSOCIATION,
miniapp: {
version: "1",
name: APP_NAME ?? "Neynar Starter Kit",
iconUrl: APP_ICON_URL,
@@ -106,6 +60,10 @@ export async function getFarcasterMetadata(): Promise<MiniAppManifest> {
description: APP_DESCRIPTION,
primaryCategory: APP_PRIMARY_CATEGORY,
tags: APP_TAGS,
requiredChains: APP_REQUIRED_CHAINS.length > 0 ? APP_REQUIRED_CHAINS : undefined,
ogTitle: APP_NAME,
ogDescription: APP_DESCRIPTION,
ogImageUrl: APP_OG_IMAGE_URL,
},
};
}