Skip to content

Commit 75123f5

Browse files
AlgoFoeAlgoFoe
committed
clerk vue with data sync in ts
1 parent 9ac8018 commit 75123f5

5 files changed

Lines changed: 106 additions & 59 deletions

File tree

‎.gitignore‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,8 @@ delete
55
activate-hackpack.bat
66
deactivate-hackpack.bat
77
test1/
8-
test2/
8+
test2/
9+
test3/
10+
test4/
11+
test5/
12+
backend/

‎lib/authentication/index.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -293,7 +293,7 @@ export async function setupClerk(state) {
293293
export async function setupAuth0(state) {
294294
const { framework, projectName, language } = state;
295295

296-
console.log(chalk.blue(`Setting up Auth0 for ${framework} project: ${projectName} \n📝 Language: ${language}`));
296+
console.log(chalk.blue(`Setting up Auth0 for ${framework} project: ${projectName} \nLanguage: ${language}`));
297297

298298
// Validate framework support
299299
if (!isFrameworkSupported(framework)) {
@@ -305,6 +305,6 @@ export async function setupAuth0(state) {
305305
await setupAuth0Angular(state);
306306
return;
307307
} else {
308-
console.log(chalk.yellow(`⚠️ Auth0 setup for framework '${framework}' is not yet automated. Please refer to https://auth0.com/docs/quickstart/spa/angular for manual setup instructions.`));
308+
console.log(chalk.yellow(`Auth0 setup for framework '${framework}' is not yet automated. Please refer to https://auth0.com/docs/quickstart/spa/angular for manual setup instructions.`));
309309
}
310310
}

‎lib/authentication/utils/clerkvue.js‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -373,14 +373,20 @@ export default defineConfig({
373373
const indexPath = path.join(backendSrc, `index.${language === 'ts' ? 'ts' : 'js'}`);
374374
if (fs.existsSync(indexPath)) {
375375
let indexContent = fs.readFileSync(indexPath, "utf8");
376-
const importRegex = /(import connectDB[^\n]*\n)/;
376+
const importRegex = /(import[^\n]*\n)(?![\s\S]*import)/;
377377

378-
if (!/import\s+webhooksRoute/.test(indexContent)) {
378+
const routePath =
379+
language === "ts"
380+
? "./routes/webhooks.route"
381+
: "./routes/webhooks.route.js";
382+
383+
if (!/import\s+webhooksRouter/.test(indexContent)) {
379384
indexContent = indexContent.replace(
380385
importRegex,
381-
`$1import webhooksRoute from "./routes/webhooks.route.${language === "ts" ? 'ts' : 'js'}";\n`
386+
`$1import webhooksRouter from "${routePath}";\n`
382387
);
383388
}
389+
384390
// for js
385391
let expressRegex;
386392
if (language === 'ts') {

‎lib/authentication/utils/utility.js‎

Lines changed: 68 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1248,21 +1248,33 @@ export const ProtectedRoute = ({ children }${language === 'ts' ? ': { children:
12481248

12491249
// for frameworks needing express server
12501250
export const actions = (language) => {
1251-
return `import UserModel from "../models/user.model.js";
1252-
import connectDB from "../lib/dbconnect.js";
1251+
const isTS = language === "ts";
1252+
1253+
return `
1254+
import ${isTS ? "{ connectDB }" : "connectDB"} from "../lib/dbconnect${isTS ? "" : ".js"}";
1255+
import UserModel from "../models/user.model${isTS ? "" : ".js"}";
1256+
${isTS ? `import type { UserJSON, DeletedObjectJSON } from "@clerk/backend";` : ""}
12531257
12541258
// Create user
1255-
export async function createUser(payload) {
1259+
export async function createUser(payload${isTS ? ": UserJSON" : ""}) {
12561260
try {
12571261
await connectDB();
12581262
12591263
const userData = {
12601264
clerkId: payload.id,
1261-
email: (payload.email_addresses && payload.email_addresses[0]?.email_address) || "",
1262-
username: payload.username || "",
1263-
photo: payload.profile_image_url || "",
1264-
firstName: payload.first_name || "",
1265-
lastName: payload.last_name || "",
1265+
email: ${
1266+
isTS
1267+
? "payload.email_addresses?.[0]?.email_address ?? \"\""
1268+
: "(payload.email_addresses && payload.email_addresses[0]?.email_address) || \"\""
1269+
},
1270+
username: ${isTS ? "payload.username ?? \"\"" : "payload.username || \"\""},
1271+
photo: ${
1272+
isTS
1273+
? "payload.image_url ?? \"\""
1274+
: "payload.profile_image_url || \"\""
1275+
},
1276+
firstName: ${isTS ? "payload.first_name ?? \"\"" : "payload.first_name || \"\""},
1277+
lastName: ${isTS ? "payload.last_name ?? \"\"" : "payload.last_name || \"\""},
12661278
};
12671279
12681280
const newUser = await UserModel.create(userData);
@@ -1274,18 +1286,26 @@ export async function createUser(payload) {
12741286
}
12751287
12761288
// Update user
1277-
export async function updateUser(payload) {
1289+
export async function updateUser(payload${isTS ? ": UserJSON" : ""}) {
12781290
try {
12791291
await connectDB();
12801292
12811293
const updatedUser = await UserModel.findOneAndUpdate(
12821294
{ clerkId: payload.id },
12831295
{
1284-
email: (payload.email_addresses && payload.email_addresses[0]?.email_address) || "",
1285-
username: payload.username || "",
1286-
photo: payload.profile_image_url || "",
1287-
firstName: payload.first_name || "",
1288-
lastName: payload.last_name || "",
1296+
email: ${
1297+
isTS
1298+
? "payload.email_addresses?.[0]?.email_address ?? \"\""
1299+
: "(payload.email_addresses && payload.email_addresses[0]?.email_address) || \"\""
1300+
},
1301+
username: ${isTS ? "payload.username ?? \"\"" : "payload.username || \"\""},
1302+
photo: ${
1303+
isTS
1304+
? "payload.image_url ?? \"\""
1305+
: "payload.profile_image_url || \"\""
1306+
},
1307+
firstName: ${isTS ? "payload.first_name ?? \"\"" : "payload.first_name || \"\""},
1308+
lastName: ${isTS ? "payload.last_name ?? \"\"" : "payload.last_name || \"\""},
12891309
},
12901310
{ new: true }
12911311
);
@@ -1298,7 +1318,7 @@ export async function updateUser(payload) {
12981318
}
12991319
13001320
// Delete user
1301-
export async function deleteUser(payload) {
1321+
export async function deleteUser(payload${isTS ? ": DeletedObjectJSON" : ""}) {
13021322
try {
13031323
await connectDB();
13041324
await UserModel.findOneAndDelete({ clerkId: payload.id });
@@ -1307,42 +1327,55 @@ export async function deleteUser(payload) {
13071327
throw error;
13081328
}
13091329
}
1310-
`
1311-
}
1330+
`;
1331+
};
13121332

13131333
// for frameworks needing express server
13141334
export const webhooksRoute = (language) => {
1315-
return `import express from "express";
1335+
const isTS = language === "ts";
1336+
1337+
return `
1338+
import express${isTS ? ", { Request, Response }" : ""} from "express";
13161339
import { verifyWebhook } from "@clerk/express/webhooks";
1317-
import { createUser, updateUser, deleteUser } from "../actions/user.actions.js";
1340+
import { createUser, updateUser, deleteUser } from "../actions/user.actions${isTS ? "" : ".js"}";
1341+
${isTS ? `import type {
1342+
UserJSON,
1343+
DeletedObjectJSON,
1344+
WebhookEvent,
1345+
} from "@clerk/backend";` : ""}
13181346
13191347
const router = express.Router();
13201348
13211349
router.post(
13221350
"/clerk",
13231351
express.raw({ type: "application/json" }),
1324-
async (req, res) => {
1352+
async (req${isTS ? ": Request" : ""}, res${isTS ? ": Response" : ""}) => {
13251353
try {
1326-
const evt = await verifyWebhook(req);
1354+
${isTS ? "const evt: WebhookEvent = await verifyWebhook(req);" : "const evt = await verifyWebhook(req);"}
13271355
1328-
const eventType = evt.type;
1329-
const data = evt.data;
1356+
const { type: eventType, data } = evt;
13301357
13311358
switch (eventType) {
1332-
case "user.created":
1333-
await createUser(data);
1334-
console.log("User created (webhook):", data.id);
1359+
case "user.created": {
1360+
${isTS ? "const user = data as UserJSON;" : "const user = data;"}
1361+
await createUser(user);
1362+
console.log("User created (webhook):", user.id);
13351363
break;
1364+
}
13361365
1337-
case "user.updated":
1338-
await updateUser(data);
1339-
console.log("User updated (webhook):", data.id);
1366+
case "user.updated": {
1367+
${isTS ? "const user = data as UserJSON;" : "const user = data;"}
1368+
await updateUser(user);
1369+
console.log("User updated (webhook):", user.id);
13401370
break;
1371+
}
13411372
1342-
case "user.deleted":
1343-
await deleteUser(data);
1344-
console.log("User deleted (webhook):", data.id);
1373+
case "user.deleted": {
1374+
${isTS ? "const deleted = data as DeletedObjectJSON;" : "const deleted = data;"}
1375+
await deleteUser(deleted);
1376+
console.log("User deleted (webhook):", deleted.id);
13451377
break;
1378+
}
13461379
13471380
default:
13481381
console.log(\`Unhandled Clerk event type: \${eventType}\`);
@@ -1357,8 +1390,8 @@ router.post(
13571390
);
13581391
13591392
export default router;
1360-
`
1361-
}
1393+
`;
1394+
};
13621395

13631396
export const SignInReactPage = (useTailwind) => {
13641397
if (useTailwind) {
@@ -1444,7 +1477,7 @@ export default SignUpPage;
14441477

14451478

14461479
export const clerkUserModel = (language) => {
1447-
return `import mongoose, { Schema }${language === 'ts' ? ', { Document, Model }' : ''} from "mongoose";
1480+
return `import mongoose${language === 'ts' ? ', { Document, Schema, Model }' : ', { Schema }'} from "mongoose";
14481481
14491482
${language === 'ts' ? `export interface IUser extends Document {
14501483
clerkId: string;

‎lib/backend/utils/utility.js‎

Lines changed: 22 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export const packageJsonContent = (language) => {
88
main: `src/index.${isTS ? "ts" : "js"}`,
99
...(isTS ? {} : { type: "module" }),
1010
scripts: {
11-
start: `node src/index.js`,
11+
start:isTS?`node dist/index.js`: `node src/index.js`,
1212
dev: `nodemon src/index.${isTS ? "ts" : "js"}`,
1313
build: isTS ? "tsc" : "echo 'Build completed'",
1414
test: "echo 'No tests specified'",
@@ -135,8 +135,7 @@ export const indexContent = (language) => {
135135
// Connect to MongoDB
136136
connectDB();
137137
138-
console.log(\`🚀 Server running on port \${PORT}\`);
139-
console.log(\`📚 API Documentation available at http://localhost:\${PORT}\`);
138+
console.log(\`Server running on port \${PORT}\`);
140139
})`.trim();
141140
} else {
142141
return `
@@ -266,9 +265,9 @@ async function testDatabaseConnection() {
266265
const prisma = new PrismaClient();
267266
try {
268267
await prisma.$connect();
269-
console.log("🚀 Successfully connected to the PostgreSQL database!");
268+
console.log(" Successfully connected to the PostgreSQL database!");
270269
} catch (err) {
271-
console.error("❌ Failed to connect to the PostgreSQL database:");
270+
console.error(" Failed to connect to the PostgreSQL database:");
272271
console.error(err.message);
273272
process.exit(1);
274273
} finally {
@@ -296,7 +295,7 @@ app.use(express.urlencoded({ extended: true }));
296295
const prisma = new PrismaClient();
297296
298297
app.get("/", (req, res) => {
299-
res.send("🚀 Prisma + PostgreSQL + Express running!");
298+
res.send("Prisma + PostgreSQL + Express running!");
300299
});
301300
302301
// Handle 404
@@ -318,7 +317,7 @@ app.use((err, req, res, next) => {
318317
319318
320319
app.listen(process.env.PORT || 5000, () => {
321-
console.log("\n🚀 Server running on port " + (process.env.PORT || 5000));
320+
console.log("\n Server running on port " + (process.env.PORT || 5000));
322321
testDatabaseConnection();
323322
});
324323
`.trim();
@@ -401,10 +400,10 @@ import { prisma } from '../../../lib/prisma/client'
401400
export async function testDbConnection(): Promise<boolean> {
402401
try {
403402
await prisma.$connect()
404-
console.log("✅ Connected to PostgreSQL database successfully.")
403+
console.log(" Connected to PostgreSQL database successfully.")
405404
return true
406405
} catch (error) {
407-
console.error("❌ Failed to connect to PostgreSQL database:", error)
406+
console.error(" Failed to connect to PostgreSQL database:", error)
408407
return false
409408
} finally {
410409
await prisma.$disconnect()
@@ -415,9 +414,9 @@ export async function GET() {
415414
const isConnected = await testDbConnection()
416415
417416
if (isConnected) {
418-
return NextResponse.json({ status: 'success', message: 'Database connected ✅' })
417+
return NextResponse.json({ status: 'success', message: 'Database connected' })
419418
} else {
420-
return NextResponse.json({ status: 'error', message: 'Database connection failed ❌' }, { status: 500 })
419+
return NextResponse.json({ status: 'error', message: 'Database connection failed' }, { status: 500 })
421420
}
422421
}
423422
`
@@ -721,9 +720,9 @@ export const connectToDB = async ()${isTypescript === "ts" ? `: Promise<void>` :
721720
try {
722721
const db = await mongoose.connect(MONGODB_URI)
723722
isConnected = db.connections[0].readyState === 1
724-
console.log('✅ MongoDB Connected')
723+
console.log('MongoDB Connected')
725724
} catch (error) {
726-
console.error('❌ MongoDB Connection Failed:', error)
725+
console.error('MongoDB Connection Failed:', error)
727726
}
728727
}
729728
`
@@ -811,11 +810,16 @@ export default defineEventHandler(async (event) => {
811810

812811
export const tsConfigContent={
813812
"compilerOptions": {
814-
"target": "es6",
813+
"types": ["node", "express"],
814+
"typeRoots": ["./src/types", "./node_modules/@types"],
815+
"rootDir": "src",
816+
"outDir": "dist",
817+
818+
"target": "es2016",
815819
"module": "commonjs",
816-
"rootDir": "./",
817-
"outDir": "./build",
818820
"esModuleInterop": true,
819-
"strict": true
821+
"forceConsistentCasingInFileNames": true,
822+
"strict": true,
823+
"skipLibCheck": true
820824
}
821-
}
825+
}

0 commit comments

Comments
 (0)