404 - Page Not Found 😢

9 |

10 | 11 | 12 | ); 13 | } 14 | 15 | export default MyApp; 16 | -------------------------------------------------------------------------------- /pages/api/auth/[...nextauth].ts: -------------------------------------------------------------------------------- 1 | import prisma from "@libs/server/prismaClient"; 2 | import { PrismaAdapter } from "@next-auth/prisma-adapter"; 3 | import NextAuth from "next-auth"; 4 | import GithubProvider from "next-auth/providers/github"; 5 | import GoogleProvider from "next-auth/providers/google"; 6 | 7 | // NextAuth Documentation is here : https://next-auth.js.org/configuration/options 8 | 9 | export default NextAuth({ 10 | adapter: PrismaAdapter(prisma), 11 | providers: [ 12 | GithubProvider({ 13 | clientId: process.env.GITHUB_ID ?? "", 14 | clientSecret: process.env.GITHUB_SECRET ?? "", 15 | }), 16 | GoogleProvider({ 17 | clientId: process.env.GOOGLE_ID ?? "", 18 | clientSecret: process.env.GOOGLE_SECRET ?? "", 19 | }), 20 | ], 21 | callbacks: { 22 | async jwt({ token, account, isNewUser, profile, user }) { 23 | // account(oauthInfo), profile, user(dbUserInfo), isNewUser are only passed one time after user signs in. 24 | if (user) { 25 | token.role = user.role; 26 | } 27 | return token; 28 | }, 29 | async session({ session, token }) { 30 | session.role = token.role; 31 | return session; 32 | }, 33 | }, 34 | session: { 35 | strategy: "jwt", 36 | maxAge: 24 * 60 * 60, // session duration. logout after 24h idle. 37 | }, 38 | }); 39 | -------------------------------------------------------------------------------- /pages/api/comment/index.ts: -------------------------------------------------------------------------------- 1 | import { hasRight } from "@libs/server/Authorization"; 2 | import { getUser } from "@libs/server/prismaClient"; 3 | import { NextApiRequest, NextApiResponse } from "next"; 4 | 5 | const allowedMethod = ["POST", "DELETE"]; 6 | 7 | export default async function handler( 8 | req: NextApiRequest, 9 | res: NextApiResponse 10 | ) { 11 | if (!allowedMethod.includes(req.method ?? "")) { 12 | res.status(405).end(); 13 | return; 14 | } 15 | const user = await getUser(req); 16 | const modelId = getAnyQueryValueOfKey(req, "modelId"); 17 | const commentId = getAnyQueryValueOfKey(req, "commentId"); 18 | if (req.method === "POST") { 19 | if (!modelId) { 20 | res 21 | .status(400) 22 | .json({ ok: false, error: "Can't find the model id in query." }); 23 | return; 24 | } 25 | if (!user) { 26 | res.json({ 27 | ok: false, 28 | message: "Please log in for commenting.", 29 | }); 30 | return; 31 | } 32 | const form = JSON.parse(req.body); 33 | await prismaClient.comment.create({ 34 | data: { 35 | text: form.text, 36 | userId: user.id, 37 | modelId: modelId, 38 | }, 39 | }); 40 | res.json({ ok: true, message: "success!" }); 41 | } else if (req.method === "DELETE") { 42 | if (!commentId) { 43 | res.json({ ok: false, message: "잘못된 삭제요청입니다." }); 44 | return; 45 | } 46 | const comment = await prismaClient.comment.findUnique({ 47 | where: { 48 | id: +commentId, 49 | }, 50 | }); 51 | if ( 52 | !hasRight({ method: "delete", theme: "comment" }, user, null, comment) 53 | ) { 54 | res.json({ 55 | ok: false, 56 | message: "삭제권한이 없습니다.", 57 | }); 58 | return; 59 | } 60 | await prismaClient.comment.delete({ 61 | where: { 62 | id: +commentId, 63 | }, 64 | }); 65 | res.json({ ok: true, message: "success!" }); 66 | } 67 | } 68 | 69 | export function getAnyQueryValueOfKey(req: NextApiRequest, key: string) { 70 | return Array.isArray(req.query[key]) 71 | ? req.query[key]?.[0] 72 | : (req.query[key] as string); 73 | } 74 | -------------------------------------------------------------------------------- /pages/api/config/index.ts: -------------------------------------------------------------------------------- 1 | import { SiteConfigProps, SiteTextProps } from "@customTypes/model"; 2 | import { Role } from "@prisma/client"; 3 | import { NextApiRequest, NextApiResponse } from "next"; 4 | import { getSession } from "next-auth/react"; 5 | 6 | const allowedMethod = ["GET", "PATCH"]; 7 | 8 | export type SiteConfig = { 9 | texts: SiteTextProps; 10 | }; 11 | 12 | const Query = ["texts", "config"] as const; 13 | 14 | export type RequestQuery = Partial<{ 15 | [key in typeof Query[number]]: string | string[]; 16 | }>; 17 | 18 | export type ResponseQuery = { 19 | texts?: Partial; 20 | config?: Partial; 21 | }; 22 | 23 | export default async function handler( 24 | req: NextApiRequest, 25 | res: NextApiResponse 26 | ) { 27 | if (!allowedMethod.includes(req.method!)) { 28 | return res.status(405).end(); 29 | } 30 | if (req.method === "GET") { 31 | return await handleGet(req, res); 32 | } else if (req.method === "PATCH") { 33 | return await handlePatch(req, res); 34 | } 35 | return res.end("error"); 36 | } 37 | 38 | const handleGet = async (req: NextApiRequest, res: NextApiResponse) => { 39 | const query: RequestQuery = req.query; 40 | const answer: ResponseQuery = {}; 41 | if (query.texts === "true") { 42 | const texts = await prismaClient.siteText.findMany(); 43 | answer.texts = parseDBGetResult(texts, "text"); 44 | } 45 | if (query.config === "true") { 46 | const config = await prismaClient.siteConfig.findMany(); 47 | answer.config = parseDBGetResult(config, "value"); 48 | } 49 | res.json(answer); 50 | return; 51 | }; 52 | 53 | const parseDBGetResult = ( 54 | result: { id: string; [key: string]: string }[], 55 | column: string 56 | ) => { 57 | return result.reduce((prev: { [key: string]: string }, cur) => { 58 | prev[cur.id] = cur[column]; 59 | return prev; 60 | }, {}); 61 | }; 62 | 63 | const handlePatch = async (req: NextApiRequest, res: NextApiResponse) => { 64 | const session = await getSession({ req }); 65 | if (!(await IsUserAdmin(session))) { 66 | return res.status(403).end(); 67 | } 68 | const result = await Promise.allSettled( 69 | Object.entries(req.body as Object).map(([key, val]) => { 70 | return prismaClient.siteText.update({ 71 | where: { id: key }, 72 | data: { text: val }, 73 | }); 74 | }) 75 | ); 76 | res.json(result); 77 | return; 78 | }; 79 | 80 | const IsUserAdmin = async (session: any) => { 81 | const email = session?.user?.email; 82 | const role = await prismaClient.user 83 | .findUnique({ 84 | where: { email: email ?? "" }, 85 | select: { 86 | role: true, 87 | }, 88 | }) 89 | .then((res) => res?.role); 90 | return role === Role.ADMIN; 91 | }; 92 | -------------------------------------------------------------------------------- /pages/api/db/initialize.ts: -------------------------------------------------------------------------------- 1 | // initialize nextjs api 2 | import { initDBRecordsOnlyNotSet } from "@customTypes/model"; 3 | import { getUser } from "@libs/server/prismaClient"; 4 | import { NextApiRequest, NextApiResponse } from "next"; 5 | 6 | export default async function handler( 7 | req: NextApiRequest, 8 | res: NextApiResponse 9 | ) { 10 | const { method } = req; 11 | 12 | switch (method) { 13 | case "GET": 14 | // if user is not ADMIN, return 403 15 | const user = await getUser(req); 16 | if (user?.role !== "ADMIN" && user?.role !== "DEVELOPER") { 17 | res.status(403).json({ message: "Not authorized" }); 18 | return; 19 | } 20 | try { 21 | await initDBRecordsOnlyNotSet(); 22 | res.status(200).json({ ok: true }); 23 | } catch (error) { 24 | res.status(400).json({ ok: false, message: "init DB failed" }); 25 | } 26 | break; 27 | default: 28 | res.setHeader("Allow", ["GET"]); 29 | res.status(405).end(`Method ${method} Not Allowed`); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /pages/api/models/[id].ts: -------------------------------------------------------------------------------- 1 | import { getAnyQueryValueOfKey } from "@api/comment"; 2 | import { UploadForm } from "@customTypes/model"; 3 | import { hasRight } from "@libs/server/Authorization"; 4 | import prismaClient, { getUser } from "@libs/server/prismaClient"; 5 | import { deleteS3Files, downloadS3Files } from "@libs/server/s3client"; 6 | import { NextApiRequest, NextApiResponse } from "next"; 7 | import internal from "stream"; 8 | 9 | const allowedMethod = ["GET", "DELETE", "PATCH", "POST"]; 10 | 11 | // If CDN is adapted, this api can improve performance by checking authority then passing download request to CDN server. 12 | // still, this api is handling download request. 13 | export const config = { 14 | api: { 15 | responseLimit: false, 16 | }, 17 | }; 18 | 19 | export default async function handler( 20 | req: NextApiRequest, 21 | res: NextApiResponse 22 | ) { 23 | if (!allowedMethod.includes(req.method ?? "")) { 24 | res.status(405).end(); 25 | return; 26 | } 27 | const modelId = Array.isArray(req.query.id) ? req.query.id[0] : req.query.id; 28 | 29 | if (!modelId) { 30 | res 31 | .status(400) 32 | .json({ ok: false, error: "Can't find the model id in query." }); 33 | return; 34 | } 35 | const user = await getUser(req); 36 | if (req.method === "GET") { 37 | const DAYILY_DOWNLOAD_LIMIT = 100; 38 | if (!user) { 39 | res.json({ 40 | ok: false, 41 | message: "Please log in for download", 42 | }); 43 | return; 44 | } 45 | if (user.role === "UNAUTHENTICATED") { 46 | res.json({ 47 | ok: false, 48 | message: "You don't have a permission to download a model.", 49 | }); 50 | return; 51 | } 52 | const { _count } = await prismaClient.log.aggregate({ 53 | // May be inefficient query. find another algorithm later. 54 | where: { 55 | createdAt: { 56 | gte: new Date(new Date().toDateString()), // truncated time(begining of today) depends on server location. 57 | }, 58 | action: "MODEL_DOWNLOAD", 59 | userId: user.id, 60 | }, 61 | _count: true, 62 | }); 63 | if (_count >= DAYILY_DOWNLOAD_LIMIT) { 64 | res.json({ 65 | ok: false, 66 | message: `Your download count exceed daily limit (max : ${DAYILY_DOWNLOAD_LIMIT})`, 67 | }); 68 | return; 69 | } 70 | 71 | const fileName = await prismaClient.model.findUnique({ 72 | where: { 73 | id: modelId, 74 | }, 75 | }); 76 | 77 | // download file from s3 78 | const objectbuffer = await downloadS3Files( 79 | modelId, 80 | fileName?.modelFile 81 | ).catch((error) => { 82 | throw Error("Can't find model."); 83 | }); 84 | if (objectbuffer instanceof Error) { 85 | res.json({ 86 | ok: false, 87 | message: `Can't find model with ID ${modelId}`, 88 | }); 89 | return; 90 | } 91 | if ( 92 | !objectbuffer.Body || 93 | !(objectbuffer.Body instanceof internal.Readable) 94 | ) { 95 | res.status(500).json({ 96 | ok: false, 97 | message: "failed to download while connecting storage server", 98 | }); 99 | return; 100 | } 101 | objectbuffer.Body.pipe(res); 102 | // then create new log 103 | await prismaClient.log.create({ 104 | data: { 105 | action: "MODEL_DOWNLOAD", 106 | userId: user.id, 107 | }, 108 | }); 109 | return; 110 | } 111 | if (req.method === "DELETE") { 112 | const model = await prismaClient.model.findUnique({ 113 | where: { 114 | id: modelId, 115 | }, 116 | }); 117 | if (model === null) { 118 | res.status(404).json({ ok: false, message: "Can't find the model." }); 119 | return; 120 | } 121 | if ( 122 | !hasRight( 123 | { 124 | method: "delete", 125 | theme: "model", 126 | }, 127 | user, 128 | model 129 | ) 130 | ) { 131 | res 132 | .status(403) 133 | .json({ ok: false, message: "You don't have a permission." }); 134 | return; 135 | } 136 | try { 137 | deleteS3Files(modelId); 138 | await prismaClient.model.delete({ 139 | where: { 140 | id: modelId, 141 | }, 142 | }); 143 | res.json({ ok: true, message: "delete success!" }); 144 | return; 145 | } catch (e) { 146 | res.status(500).json({ ok: false, message: "Failed while deleting." }); 147 | return; 148 | } 149 | } 150 | if (req.method === "PATCH") { 151 | const model = await prismaClient.model.findUnique({ 152 | where: { 153 | id: modelId, 154 | }, 155 | }); 156 | if (model === null) { 157 | res.status(404).json({ ok: false, message: "Can't find the model." }); 158 | return; 159 | } 160 | if ( 161 | !hasRight( 162 | { 163 | method: "update", 164 | theme: "model", 165 | }, 166 | user, 167 | model 168 | ) 169 | ) { 170 | res 171 | .status(403) 172 | .json({ ok: false, message: "You don't have a permission." }); 173 | return; 174 | } 175 | const form: UploadForm | undefined = JSON.parse(req.body); 176 | if (!form) { 177 | res.json({ ok: false, message: "Form data is not defined." }); 178 | return; 179 | } 180 | try { 181 | await prismaClient.model.update({ 182 | where: { 183 | id: modelId, 184 | }, 185 | data: { 186 | name: form.name, 187 | category: form.category, 188 | description: form.description, 189 | }, 190 | }); 191 | res.json({ ok: true, message: "update success!" }); 192 | return; 193 | } catch (e) { 194 | res.status(500).json({ ok: false, message: "Failed while updating db." }); 195 | return; 196 | } 197 | } 198 | if (req.method === "POST") { 199 | const key = getAnyQueryValueOfKey(req, "view"); 200 | if (key) { 201 | const model = await prismaClient.model.update({ 202 | where: { 203 | id: modelId, 204 | }, 205 | data: { 206 | viewed: { 207 | increment: 1, 208 | }, 209 | }, 210 | }); 211 | } 212 | res.json({ ok: true }); 213 | return; 214 | } 215 | res.status(500).json({ ok: false, message: "Failed handling request." }); 216 | } 217 | -------------------------------------------------------------------------------- /pages/api/models/index.ts: -------------------------------------------------------------------------------- 1 | import { getAnyQueryValueOfKey } from "@api/comment"; 2 | import { DeleteObjectCommand, PutObjectCommand } from "@aws-sdk/client-s3"; 3 | import { ModelInfo, OptionalModel, UploadForm } from "@customTypes/model"; 4 | import { Categories } from "@libs/client/Util"; 5 | import { hasRight } from "@libs/server/Authorization"; 6 | import prismaClient, { getUser } from "@libs/server/prismaClient"; 7 | import s3client, { deleteS3Files } from "@libs/server/s3client"; 8 | import { 9 | getModelFromForm, 10 | getOriginalNameAndPath, 11 | handlePOST, 12 | makeMaybeArrayToArray, 13 | updateModel, 14 | } from "@libs/server/ServerFileHandling"; 15 | import { Model, User } from "@prisma/client"; 16 | import formidable from "formidable"; 17 | import { createReadStream, ReadStream } from "fs"; 18 | import { NextApiRequest, NextApiResponse } from "next"; 19 | import { getSession } from "next-auth/react"; 20 | import path from "path/posix"; 21 | 22 | export const config = { 23 | api: { 24 | bodyParser: false, 25 | }, 26 | }; 27 | 28 | (BigInt.prototype as any).toJSON = function () { 29 | return this.toString(); 30 | }; 31 | 32 | type FormidableResult = { 33 | err: string; 34 | fields: formidable.Fields; 35 | files: formidable.Files; 36 | }; 37 | 38 | const allowedMethod = ["GET", "POST", "PATCH", "DELETE"]; 39 | 40 | export default async function handler( 41 | req: NextApiRequest, 42 | res: NextApiResponse 43 | ) { 44 | const session = await getSession({ req }); 45 | if (!allowedMethod.includes(req.method ?? "")) { 46 | res.status(405).end(); 47 | return; 48 | } 49 | if (req.method === "GET") { 50 | // respone specified model info 51 | if (req.query.id) { 52 | const model = await prismaClient.model.findUnique({ 53 | where: { id: req.query.id as string }, 54 | include: { 55 | Comment: { 56 | orderBy: { createdAt: "desc" }, 57 | include: { 58 | commenter: { 59 | select: { 60 | name: true, 61 | image: true, 62 | createdAt: true, 63 | }, 64 | }, 65 | }, 66 | }, 67 | }, 68 | }); 69 | if (!model) { 70 | res.status(404).end(); 71 | return; 72 | } 73 | if (model.blinded === true) { 74 | res.status(403).end(); 75 | return; 76 | } 77 | res.json([makeModelInfo(model)]); 78 | return; 79 | } else if (req.query.uploader) { 80 | // respone specific uploader's models info 81 | const uploaders = 82 | typeof req.query.uploader === "string" 83 | ? [req.query.uploader] 84 | : req.query.uploader; 85 | const querys = uploaders.map((uploaderId) => { 86 | return { 87 | uploader: { 88 | id: uploaderId, 89 | }, 90 | }; 91 | }); 92 | const model = await prismaClient.model.findMany({ 93 | where: { 94 | OR: querys, 95 | }, 96 | include: { 97 | _count: { 98 | select: { 99 | Comment: true, 100 | }, 101 | }, 102 | }, 103 | }); 104 | res.json(makeModelInfos(model)); 105 | return; 106 | } else if (req.query.sort) { 107 | let errorMessage = undefined; 108 | 109 | const { sort, category, filterByName, orderBy } = req.query; 110 | let options = { 111 | where: { 112 | name: { 113 | contains: filterByName?.toString(), 114 | }, 115 | }, 116 | orderBy: { 117 | [`${sort}`]: orderBy, 118 | }, 119 | include: { 120 | _count: { 121 | select: { 122 | Comment: true, 123 | }, 124 | }, 125 | }, 126 | }; 127 | if (category) { 128 | if (Categories.includes(category?.toString())) { 129 | const where = Object.assign(options.where, { 130 | category: category.toString().toUpperCase(), 131 | }); 132 | 133 | options.where = where; 134 | } 135 | } 136 | 137 | const modelList = await prismaClient.model.findMany(options); 138 | 139 | if (modelList?.length === 0) { 140 | if (filterByName) { 141 | errorMessage = `We couldn't find any matches for "${ 142 | req.query.filterByName 143 | }"${category ? ` in ${category}` : ""}`; 144 | } else if (category) { 145 | errorMessage = `We couldn't find any matches in "${category}"`; 146 | } 147 | 148 | res.status(404).json({ 149 | data: modelList, 150 | error: errorMessage, 151 | }); 152 | return; 153 | } 154 | const parsedList = makeModelInfos(modelList); 155 | res.status(200).json({ data: parsedList, error: undefined }); 156 | return; 157 | } 158 | const modelList = await prismaClient.model.findMany({ 159 | orderBy: { 160 | createdAt: "desc", 161 | }, 162 | include: { 163 | _count: { 164 | select: { 165 | Comment: true, 166 | }, 167 | }, 168 | uploader: { 169 | select: { 170 | name: true, 171 | }, 172 | }, 173 | }, 174 | }); 175 | const parsedList = makeModelInfos(modelList); 176 | res.status(200).json(parsedList); 177 | } else if (req.method === "POST") { 178 | // authorize client then upload model. db update return model id. 179 | const isLogined = !!session; 180 | if (!isLogined) { 181 | res.status(401).send("Login first"); 182 | return; 183 | } 184 | 185 | const user = await prismaClient.user.findUnique({ 186 | where: { 187 | email: session.user?.email ?? undefined, // if undefined, search nothing 188 | }, 189 | }); 190 | if (user === null) { 191 | res.status(401).end(); 192 | return; 193 | } 194 | 195 | if ( 196 | getAnyQueryValueOfKey(req, "modUsdz") === "true" && 197 | getAnyQueryValueOfKey(req, "modelId") 198 | ) { 199 | const modelId = getAnyQueryValueOfKey(req, "modelId"); 200 | const model = await prismaClient.model.findUnique({ 201 | where: { 202 | id: modelId, 203 | }, 204 | }); 205 | if (model === null) { 206 | res.status(404).json({ ok: false, message: "Can't find the model." }); 207 | return; 208 | } 209 | if ( 210 | !hasRight( 211 | { 212 | method: "update", 213 | theme: "model", 214 | }, 215 | user, 216 | model 217 | ) 218 | ) { 219 | res 220 | .status(403) 221 | .json({ ok: false, message: "You don't have a permission." }); 222 | return; 223 | } 224 | const formidable = await getFormidableFileFromReq(req, { 225 | multiples: true, 226 | maxFileSize: 150 << 20, // 100MB for zip file 227 | keepExtensions: true, 228 | }); 229 | const files = makeMaybeArrayToArray( 230 | formidable.files.file 231 | ); 232 | const deleteFile = (uuid: string, relPath: string) => { 233 | return s3client.send( 234 | new DeleteObjectCommand({ 235 | Bucket: process.env.S3_BUCKET, 236 | Key: path.join(`models/${uuid}`, relPath), 237 | }) 238 | ); 239 | }; 240 | if (model.modelUsdz) { 241 | await deleteFile(model.id, model.modelUsdz); 242 | } 243 | const fileInfo = await getOriginalNameAndPath(files[0]); 244 | const fileStream = createReadStream(fileInfo.loadedFile); 245 | const uploadFile = ( 246 | uuid: string, 247 | usdzName: string, 248 | stream: ReadStream 249 | ) => { 250 | const filesParams = { 251 | Bucket: process.env.S3_BUCKET, 252 | Key: path.join(`models/${uuid}`, usdzName), 253 | Body: stream, 254 | }; 255 | return s3client.send(new PutObjectCommand(filesParams)); 256 | }; 257 | await uploadFile(model.id, fileInfo.originalName, fileStream); 258 | await prismaClient.model.update({ 259 | where: { id: modelId }, 260 | data: { modelUsdz: fileInfo.originalName }, 261 | }); 262 | res.json({ ok: true }); 263 | return; 264 | } else { 265 | if ( 266 | // if don't have right, reply code 403. 267 | !hasRight( 268 | { 269 | theme: "model", 270 | method: "create", 271 | }, 272 | user 273 | ) 274 | ) { 275 | res.status(403).json({ ok: false, message: "로그인이 필요합니다." }); 276 | return; 277 | } 278 | // upload to s3 279 | const isAdminOrDev = user.role === "ADMIN" || user.role === "DEVELOPER"; 280 | const option: formidable.Options | undefined = isAdminOrDev 281 | ? { multiples: true, maxFileSize: Infinity, keepExtensions: true } 282 | : undefined; 283 | const formidable = await getFormidableFileFromReq(req, option).catch( 284 | (e) => "Failed" 285 | ); 286 | 287 | if (typeof formidable === "string") { 288 | res.json({ 289 | ok: false, 290 | message: "Failed to parse your request. Check your model size.", 291 | }); 292 | return; 293 | } 294 | const doesFormExist = !!formidable.fields.form; 295 | const model: OptionalModel = {}; 296 | model.userId = user.id; 297 | if (doesFormExist) { 298 | const form: UploadForm = JSON.parse(formidable.fields.form as string); 299 | updateModel(model, getModelFromForm(form)); 300 | } else { 301 | model.category = "MISC"; // add if form data is not exist. 302 | } 303 | const files = makeMaybeArrayToArray( 304 | formidable.files.file 305 | ); 306 | const results = await Promise.allSettled( 307 | files.map((file) => handlePOST(file, model)) 308 | ); 309 | res.json({ results }); 310 | } 311 | } else if (req.method === "PATCH") { 312 | const user = await getUser(req); 313 | if (getAnyQueryValueOfKey(req, "devMode") === "true") { 314 | if (getAnyQueryValueOfKey(req, "massive") === "true") { 315 | const { 316 | err, 317 | fields: { modelList }, 318 | } = await getFormidableFileFromReq(req); 319 | const blindVal = 320 | getAnyQueryValueOfKey(req, "blind") === "true" ? true : false; 321 | const mlist = modelList ?? []; 322 | await prismaClient.model.updateMany({ 323 | where: { 324 | id: { in: mlist as string[] }, 325 | }, 326 | data: { 327 | blinded: blindVal, 328 | }, 329 | }); 330 | res.json({ ok: true }); 331 | } else { 332 | const { 333 | err, 334 | fields: { model, blind }, 335 | } = await getFormidableFileFromReq(req); 336 | if (err) { 337 | res 338 | .status(500) 339 | .json({ ok: false, message: "Failed parsing request." }); 340 | return; 341 | } 342 | if ( 343 | !hasRight( 344 | { method: "update", theme: "model" }, 345 | user, 346 | await prismaClient.model.findUnique({ 347 | where: { id: model as string }, 348 | }) 349 | ) 350 | ) { 351 | res.status(403).json({ ok: false }); 352 | return; 353 | } 354 | 355 | await prismaClient.model.update({ 356 | where: { 357 | id: model as string, 358 | }, 359 | data: { 360 | blinded: blind === "true" ? true : false, 361 | }, 362 | }); 363 | res.end(); 364 | return; 365 | } 366 | } 367 | res.status(400).end(); 368 | return; 369 | } else if (req.method === "DELETE") { 370 | const user = await getUser(req); 371 | let models: (Model | null)[] = []; 372 | if (getAnyQueryValueOfKey(req, "massive") === "true") { 373 | const { 374 | err, 375 | fields: { modelList }, 376 | } = await getFormidableFileFromReq(req); 377 | if (err) { 378 | res.status(500).json({ ok: false, message: "Failed parsing request." }); 379 | return; 380 | } 381 | models = modelList 382 | ? await prismaClient.model.findMany({ 383 | where: { 384 | id: { in: modelList }, 385 | }, 386 | }) 387 | : []; 388 | } else { 389 | const modelId = getAnyQueryValueOfKey(req, "id"); 390 | if (!modelId) { 391 | res.status(400).json({ error: "model id query not found" }); 392 | return; 393 | } 394 | models = [ 395 | await prismaClient.model.findUnique({ 396 | where: { 397 | id: modelId, 398 | }, 399 | }), 400 | ]; 401 | } 402 | const results = await Promise.allSettled( 403 | models.map(async (model) => { 404 | if (!model) { 405 | throw "Couldn't find model by id."; 406 | } 407 | if (!user) { 408 | throw "Couldn't find user."; 409 | } 410 | await deleteModelFromDBAndS3(model, user); 411 | return "Success!"; 412 | }) 413 | ); 414 | res.json(results); 415 | } 416 | } 417 | 418 | // FOR RESPONE TO GET 419 | 420 | const makeModelInfo: (model: any) => ModelInfo = (model) => { 421 | const thumbnailSrc = model.thumbnail 422 | ? `/getResource/models/${model.id}/${model.thumbnail}` 423 | : ""; 424 | const usdzSrc = model.modelUsdz 425 | ? `/getResource/models/${model.id}/${model.modelUsdz}` 426 | : ""; 427 | return { 428 | ...model, 429 | modelSrc: `/getResource/models/${model.id}/${model.modelFile}`, 430 | thumbnailSrc, 431 | usdzSrc, 432 | }; 433 | }; 434 | 435 | const makeModelInfos: (models: Model[]) => ModelInfo[] = (models) => 436 | models.map((model) => makeModelInfo(model)); 437 | 438 | // FOR RESPONE TO POST 439 | 440 | export const getFormidableFileFromReq = async ( 441 | req: NextApiRequest, 442 | options?: formidable.Options 443 | ) => { 444 | return await new Promise((res, rej) => { 445 | const form = formidable( 446 | options ?? { 447 | multiples: true, 448 | maxFileSize: 150 << 20, // 100MB for zip file 449 | keepExtensions: true, 450 | } 451 | ); 452 | form.parse(req, (err: Error, fields, files) => { 453 | if (err) { 454 | return rej(err); 455 | } 456 | return res({ err, fields, files }); 457 | }); 458 | }); 459 | }; 460 | 461 | /** 462 | * FOR RESPONE TO DELETE 463 | * Check user authenication then handle delete request. 464 | */ 465 | const deleteModelFromDBAndS3 = async (model: Model, user: User) => { 466 | if ( 467 | !hasRight( 468 | { 469 | method: "delete", 470 | theme: "model", 471 | }, 472 | user, 473 | model 474 | ) 475 | ) { 476 | throw `User <${user.name}> doesn't have right to delete model <${model.name}>.`; 477 | } 478 | await deleteS3Files(model.id); 479 | await prismaClient.model.delete({ 480 | where: { 481 | id: model.id, 482 | }, 483 | }); 484 | }; 485 | -------------------------------------------------------------------------------- /pages/api/users/index.ts: -------------------------------------------------------------------------------- 1 | import { getUser } from "@libs/server/prismaClient"; 2 | import { NextApiRequest, NextApiResponse } from "next"; 3 | 4 | const allowedMethod = ["GET", "DELETE"]; 5 | 6 | export default async function handler( 7 | req: NextApiRequest, 8 | res: NextApiResponse 9 | ) { 10 | const user = await getUser(req); 11 | switch (req.method) { 12 | case "GET": { 13 | res.json(user); 14 | break; 15 | } 16 | case "DELETE": { 17 | res.status(405).json({ ok: false }); 18 | break; 19 | } 20 | default: { 21 | res.status(500).json({ ok: false }); 22 | break; 23 | } 24 | } 25 | return; 26 | } 27 | -------------------------------------------------------------------------------- /pages/dev/config.tsx: -------------------------------------------------------------------------------- 1 | import Wrapper from "@components/Wrapper"; 2 | import type { NextPage } from "next"; 3 | 4 | const PageConfing: NextPage = () => { 5 | return ( 6 | 7 | { 8 | // gray button with border 9 |

10 | 16 | 17 | 아직 설정된 text나 config 값이 없는 경우 초기 값을 지정합니다 18 | 19 |

20 | } 21 | 22 | ); 23 | }; 24 | 25 | export default PageConfing; 26 | -------------------------------------------------------------------------------- /pages/dev/index.tsx: -------------------------------------------------------------------------------- 1 | import Wrapper from "@components/Wrapper"; 2 | import type { NextPage } from "next"; 3 | import Link from "next/link"; 4 | 5 | const DevIndexPage: NextPage = () => { 6 | return ( 7 | 8 |

9 | 10 |

11 | 모델 여러개 업로드 12 |

13 | 14 | 15 |

16 | 모델 여러개 삭제 17 |

18 | 19 | 20 |

21 | 홈페이지 설정 22 |

23 | 24 | 25 |

26 | 저장소, DB 차이 확인 27 |

28 | 29 |

30 | 31 | ); 32 | }; 33 | 34 | export default DevIndexPage; 35 | -------------------------------------------------------------------------------- /pages/dev/models/delete.tsx: -------------------------------------------------------------------------------- 1 | import Wrapper from "@components/Wrapper"; 2 | import { useModelInfos } from "@libs/client/AccessDB"; 3 | import { AddUnit } from "@libs/client/Util"; 4 | import path from "path"; 5 | import { SyntheticEvent } from "react"; 6 | import { useForm } from "react-hook-form"; 7 | import { useSWRConfig } from "swr"; 8 | import { AllSettleResult, SuccessCounter } from "./upload"; 9 | 10 | const DeleteModelsPage = () => { 11 | const models = useModelInfos(); 12 | const { mutate: componentMutate } = useSWRConfig(); 13 | const { 14 | register, 15 | handleSubmit, 16 | formState: { isSubmitting }, 17 | setValue, 18 | watch, 19 | } = useForm(); 20 | 21 | return ( 22 | 23 |

25 | onValid(form, () => { 26 | componentMutate("/api/models"); 27 | }) 28 | )} 29 | > 30 |

31 | 32 | 33 | 34 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | {models.data?.map((model, i) => ( 60 | 61 | 69 | 72 | 75 | 78 | 81 | 84 | 87 | 90 | 91 | ))} 92 | 93 |

35 \| Check 36 \| ) => { 40 \| const boxes = watch(); 41 \| const bool = e.currentTarget.checked; 42 \| Object.entries(boxes).forEach(([key, val]) => { 43 \| setValue(key, bool); 44 \| }); 45 \| }} 46 \| className="flex m-auto h-5 w-5" 47 \| > 48 \|	Number	Name	usdz	gltf	UploadAt	Size	Uploader
62 \| 68 \|	70 \| {i} 71 \|	73 \| {model.name} 74 \|	76 \| {path.basename(model.usdzSrc)} 77 \|	79 \| {path.basename(model.modelSrc)} 80 \|	82 \| {new Date(model.createdAt).toUTCString()} 83 \|	85 \| {AddUnit(model.modelSize) + "B"} 86 \|	88 \| {model.uploader?.name ?? ""} 89 \|

94 |

95 |

96 | 선택된 모델 개수 :{" "} 97 | {Object.entries(watch()).filter(([key, val]) => val === true).length} 98 |

99 | 126 |

127 | 128 | ); 129 | }; 130 | 131 | export default DeleteModelsPage; 132 | 133 | async function onValid(form: object, refresh: () => void) { 134 | const formBody = new FormData(); 135 | const targetModels = Object.entries(form) 136 | .filter(([id, isChecked]) => isChecked) 137 | .forEach((list) => formBody.append("modelList", list[0])); 138 | 139 | const res: AllSettleResult[] = await fetch("/api/models?massive=true", { 140 | method: "DELETE", 141 | body: formBody, 142 | }).then((res) => res.json()); 143 | const count = SuccessCounter(res); 144 | alert( 145 | `삭제요청의 수 : ${count.total}\n 성공한 삭제 수 : ${count.successCnt}` 146 | ); 147 | count.successCnt === count.total 148 | ? null 149 | : alert( 150 | res 151 | .filter((report) => report.status === "rejected") 152 | .reduce((prev, cur) => prev + `${cur.reason}\n`, "실패한 이유 \n") 153 | ); 154 | refresh(); 155 | } 156 | 157 | function UncheckMainboxIfslaveUnchecked(e: SyntheticEvent) { 158 | const masterCheckbox = document.getElementById( 159 | "main-checkbox" 160 | ) as HTMLInputElement; 161 | if (e.currentTarget.checked === false) { 162 | masterCheckbox.checked = false; 163 | } 164 | } 165 | -------------------------------------------------------------------------------- /pages/dev/models/diff.tsx: -------------------------------------------------------------------------------- 1 | import { useModelInfos } from "@libs/client/AccessDB"; 2 | import { deleteS3Files, getSavedModelList } from "@libs/server/s3client"; 3 | import type { NextPage } from "next"; 4 | import { useEffect, useState } from "react"; 5 | 6 | const Diff: NextPage = () => { 7 | const dbModels = useModelInfos(); 8 | const [s3Set, setS3Set] = useState(new Set()); 9 | useEffect(() => { 10 | const func = async () => { 11 | const res: Set = (await getSavedModelList()) ?? new Set(); 12 | setS3Set(res); 13 | }; 14 | if (s3Set.size !== 0) { 15 | return; 16 | } 17 | func(); 18 | }); 19 | if (!dbModels.data) { 20 | return Loading; 21 | } 22 | const dbSet: Set = 23 | dbModels.data?.reduce((prev, cur) => { 24 | prev.add(cur.id); 25 | return prev; 26 | }, new Set()) ?? new Set(); 27 | const dbOnly = [...dbSet].filter((e) => !s3Set.has(e)); 28 | const s3Only = [...s3Set].filter((e) => !dbSet.has(e)); 29 | console.log("db Only", dbOnly); 30 | console.log("s3 Only", s3Only); 31 | return ( 32 |

33 | {/* 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 |

num	uuid
1	1

*/} 47 | 55 |

56 | ); 57 | }; 58 | 59 | export default Diff; 60 | 61 | async function deleteS3Models(uuids: string[]) { 62 | const faileds: string[] = []; 63 | const successes: string[] = []; 64 | uuids.forEach(async (uuid) => { 65 | await deleteS3Files(uuid) 66 | .catch((e) => faileds.push(uuid)) 67 | .then((res) => successes.push(uuid)); 68 | }); 69 | console.log("faileds", faileds); 70 | console.log("successes", successes); 71 | return; 72 | } 73 | -------------------------------------------------------------------------------- /pages/dev/models/upload.tsx: -------------------------------------------------------------------------------- 1 | import Wrapper from "@components/Wrapper"; 2 | import { useSession } from "next-auth/react"; 3 | import { useRouter } from "next/router"; 4 | import { useState } from "react"; 5 | import Dropzone from "react-dropzone"; 6 | import { FieldValues } from "react-hook-form"; 7 | 8 | const Upload = () => { 9 | const [files, setFiles] = useState([]); 10 | const router = useRouter(); 11 | const session = useSession(); 12 | const [isSubmitting, setIsSubmitting] = useState(false); 13 | 14 | if (session.status === "loading") { 15 | return null; 16 | } 17 | 18 | if (session.status === "unauthenticated") { 19 | router.push("/models"); 20 | } 21 | 22 | const onClick = async (form: FieldValues) => { 23 | if (files.length === 0) { 24 | return alert("파일 업로드해주시길 바랍니다."); 25 | } 26 | 27 | setIsSubmitting(true); 28 | const formData = new FormData(); 29 | files.forEach((file) => { 30 | formData.append("file", file); 31 | }); 32 | 33 | const res = await fetch("/api/models?massiveUpload=true", { 34 | method: "POST", 35 | body: formData, 36 | }) 37 | .then((res) => res.json()) 38 | .then((json) => SuccessCounter(json.results)); 39 | setIsSubmitting(false); 40 | alert( 41 | `업로드 파일 수 : ${res.total}\n 성공한 업로드 수 : ${res.successCnt}` 42 | ); 43 | setFiles([]); 44 | }; 45 | 46 | return ( 47 | 48 | { 51 | setFiles([...files, ...acceptedFiles]); 52 | }} 53 | > 54 | {({ getRootProps, getInputProps }) => ( 55 |

59 | {files.length > 0 ? ( 60 |

{ 63 | setFiles([]); 64 | e.stopPropagation(); 65 | }} 66 | > 67 | reset 68 |

69 | ) : null} 70 | 71 |

72 | {files.length === 0 ? ( 73 | <> 74 | 99 |

100 |

101 | 파일 업로드 102 |

103 |

104 | 업로드할 .zip 파일을 선택해주세요. 여러개도 선택 105 | 가능합니다. 106 |

107 |

108 | 109 | ) : ( 110 | 111 | 112 | 113 | 116 | 119 | 120 | 121 | 122 | {files?.map((files, i) => { 123 | const size = files.size; 124 | const kbSize = Math.floor(size / 1000); 125 | const mbSize = Math.floor(kbSize / 1000); 126 | 127 | return ( 128 | 129 | 132 | 139 | 140 | ); 141 | })} 142 | 143 |

114 \| File name 115 \|	117 \| Size 118 \|
130 \| {files.name} 131 \|	133 \| {size < 1000 134 \| ? size + "bite" 135 \| : kbSize > 1000 136 \| ? mbSize + "mb" 137 \| : kbSize + "kb"} 138 \|

144 | )} 145 |

146 |

147 | )} 148 | 149 | 177 | 178 | ); 179 | }; 180 | 181 | export default Upload; 182 | 183 | export function SuccessCounter(results: AllSettleResult[]) { 184 | const successCnt = results 185 | .map((res) => (res.status === "fulfilled" ? 1 : 0)) 186 | .reduce((prev: number, cur: number) => prev + cur, 0); 187 | return { total: results.length, successCnt }; 188 | } 189 | 190 | export type AllSettleResult = { 191 | status: "fulfilled" | "rejected"; 192 | reason?: string; 193 | [key: string]: any; 194 | }; 195 | -------------------------------------------------------------------------------- /pages/index.tsx: -------------------------------------------------------------------------------- 1 | import type { NextPage } from "next"; 2 | import { useRouter } from "next/router"; 3 | import { useEffect } from "react"; 4 | 5 | const Home: NextPage = () => { 6 | const router = useRouter(); 7 | useEffect(() => { 8 | router.replace("models"); 9 | }, []); 10 | 11 | return root page; 12 | }; 13 | 14 | export default Home; 15 | -------------------------------------------------------------------------------- /pages/models/[id]/index.tsx: -------------------------------------------------------------------------------- 1 | import ModelModal from "@components/ModelModal"; 2 | import { useModelInfo, useUser } from "@libs/client/AccessDB"; 3 | import type { NextPage } from "next"; 4 | import { useRouter } from "next/router"; 5 | 6 | interface ModelElemet extends Element { 7 | showPoster: () => void; 8 | dismissPoster: () => void; 9 | } 10 | 11 | const ModelPage: NextPage = () => { 12 | const router = useRouter(); 13 | const modelId = (router.query.id as string) ?? ""; 14 | const modelInfo = useModelInfo(modelId); 15 | const user = useUser(); 16 | 17 | if (modelInfo.error || user.error) { 18 | router.push("/"); 19 | return null; 20 | } 21 | if (!modelInfo.data) { 22 | return null; 23 | } 24 | 25 | return ( 26 | {}} 28 | modelId={modelId} 29 | pageMode={true} 30 | > 31 | ); 32 | }; 33 | 34 | export const increaseView = (modelId: string) => { 35 | fetch(`/api/models/${modelId}?view=true`, { 36 | method: "POST", 37 | }); 38 | }; 39 | 40 | export default ModelPage; 41 | -------------------------------------------------------------------------------- /pages/models/[id]/three.tsx: -------------------------------------------------------------------------------- 1 | import ModelInfo from "@components/ModelInfo"; 2 | import ThreeViewer from "@components/ThreeViewer"; 3 | import Wrapper from "@components/Wrapper"; 4 | import { useModelInfo, useUser } from "@libs/client/AccessDB"; 5 | import { hasRight } from "@libs/server/Authorization"; 6 | import type { NextPage } from "next"; 7 | import dynamic from "next/dynamic"; 8 | import { NextRouter, useRouter } from "next/router"; 9 | import { useEffect, useRef, useState } from "react"; 10 | 11 | const Model = dynamic(() => import("@components/Model"), { ssr: false }); 12 | 13 | interface ModelElemet extends Element { 14 | showPoster: () => void; 15 | dismissPoster: () => void; 16 | } 17 | 18 | const ModelPage: NextPage = () => { 19 | const router = useRouter(); 20 | const modelId = (router.query.id as string) ?? ""; 21 | const modelInfo = useModelInfo(modelId); 22 | const user = useUser(); 23 | const timer = useRef(Date.now()); 24 | const [modelViewer, setModelViewer] = useState(); 25 | const [isLogShown, setIsLogShown] = useState(false); 26 | const [logs, setLogs] = useState([]); 27 | useEffect(() => { 28 | // hook modelviewer elemet when loading is complete. 29 | const checker = setInterval(() => { 30 | const modelElem = document.querySelector("#modelViewer"); 31 | if (modelElem) { 32 | setModelViewer(modelElem as ModelElemet); 33 | clearInterval(checker); 34 | return; 35 | } 36 | }, 50); 37 | return () => { 38 | if (!modelViewer) { 39 | clearInterval(checker); 40 | } 41 | }; 42 | }, [modelViewer]); 43 | 44 | useEffect(() => { 45 | // when modelViewer founded 46 | const callback = (e: any) => { 47 | if (e.detail?.totalProgress === 1) { 48 | const spentTime = (Date.now() - timer.current) / 1000; 49 | 50 | setLogs((log) => 51 | log.concat(` : Loading spent ${spentTime} sec.`) 52 | ); 53 | } 54 | }; 55 | if (modelViewer) { 56 | modelViewer.addEventListener("progress", callback); 57 | } 58 | return () => { 59 | modelViewer?.removeEventListener("progress", callback); 60 | }; 61 | }, [modelViewer]); 62 | 63 | if (modelInfo.error || user.error) { 64 | router.push("/"); 65 | return null; 66 | } 67 | if (!modelInfo.data) { 68 | return null; 69 | } 70 | 71 | return ( 72 | 73 | 77 | 78 | {!modelInfo.loading ? modelInfo.data.name : ""} 79 | 80 |

81 |

82 | {isLogShown ? ( 83 |

84 | {logs.map((log, index) => ( 85 | 86 | {log} 87 | 88 | ))} 89 |

90 | ) : null} 91 | {!modelInfo.loading ? ( 92 | 93 | ) : ( 94 | "Loading..." 95 | )} 96 | 104 |

105 |

106 | {hasRight( 107 | { method: "read", theme: "model" }, 108 | user.data, 109 | modelInfo.data 110 | ) ? ( 111 | 119 | ) : null} 120 | {hasRight( 121 | { method: "update", theme: "model" }, 122 | user.data, 123 | modelInfo.data 124 | ) ? ( 125 | 131 | ) : null} 132 | {hasRight( 133 | { method: "delete", theme: "model" }, 134 | user.data, 135 | modelInfo.data 136 | ) ? ( 137 | 143 | ) : null} 144 |

145 | 146 |

147 | 148 | 149 | {!modelInfo.loading ? `Category > ${modelInfo.data.category}` : ""} 150 | 151 | 152 | {!modelInfo.loading ? modelInfo.data.description : ""} 153 | 154 | 155 | ); 156 | }; 157 | 158 | const callDeleteAPI = (id: string, router: NextRouter) => { 159 | fetch(`/api/models/${id}`, { 160 | method: "DELETE", 161 | }) 162 | .then((res) => { 163 | if (!res.ok) { 164 | throw res.json(); 165 | } 166 | router.push(`/models`); 167 | }) 168 | .catch((error) => { 169 | alert(`error : ${error.message}`); 170 | }); 171 | }; 172 | 173 | export default ModelPage; 174 | -------------------------------------------------------------------------------- /pages/models/[id]/update.tsx: -------------------------------------------------------------------------------- 1 | import ErrorDiv from "@components/ErrorDiv"; 2 | import Wrapper from "@components/Wrapper"; 3 | import { UploadForm } from "@customTypes/model"; 4 | import { useModelInfo, useUser } from "@libs/client/AccessDB"; 5 | import { hasRight } from "@libs/server/Authorization"; 6 | import type { NextPage } from "next"; 7 | import { useRouter } from "next/router"; 8 | import { FieldValues, useForm } from "react-hook-form"; 9 | 10 | const UpdatePage: NextPage = () => { 11 | const router = useRouter(); 12 | const modelId = router.query.id as string; 13 | const user = useUser(); 14 | const model = useModelInfo(modelId); 15 | const { register, handleSubmit, formState } = useForm({ 16 | defaultValues: { 17 | name: model.data?.name, 18 | category: model.data?.category, 19 | description: model.data?.description, 20 | }, 21 | }); 22 | const loading = user.loading || model.loading; 23 | if (loading) return null; 24 | if (!hasRight({ method: "update", theme: "model" }, user.data, model.data)) { 25 | router.push(`/models/${modelId}`); 26 | } 27 | const onValid = async (form: FieldValues) => { 28 | const res = await fetch(`/api/models/${modelId}`, { 29 | method: "PATCH", 30 | body: JSON.stringify(form), 31 | }).then((res) => res.json()); 32 | if (!res.ok) { 33 | alert(`업데이트에 실패하였습니다. ${res.message ?? ""}`); 34 | return "error"; 35 | } 36 | 37 | router.push(`/models/${modelId}`); 38 | }; 39 | return ( 40 | 41 |

42 |

43 | Thumbnail 44 |

45 |

46 |

47 |

48 | 49 | 모델명* 50 | 51 | 58 | 59 |

60 |

61 | 65 | 내용 66 | 67 | 72 |

73 |

74 | 75 | 카테고리* 76 | 77 | 102 | 103 |

104 |

105 | 106 | 태그 107 | 108 | 113 |

114 |

115 | 123 | 150 |

151 |

152 |

153 |

154 | 155 | ); 156 | }; 157 | 158 | export default UpdatePage; 159 | -------------------------------------------------------------------------------- /pages/models/index.tsx: -------------------------------------------------------------------------------- 1 | import MainPageShowcase from "@components/MainPageShowcase"; 2 | import SearchBar from "@components/Search"; 3 | import Thumbnails from "@components/Thumbnails"; 4 | import Wrapper from "@components/Wrapper"; 5 | import { ModelInfo } from "@customTypes/model"; 6 | import { useModelInfos, useSiteConfig } from "@libs/client/AccessDB"; 7 | import type { NextPage } from "next"; 8 | import { useSession } from "next-auth/react"; 9 | import { useState } from "react"; 10 | 11 | export interface ModelInfos { 12 | loading: boolean; 13 | data: ModelInfo[] | undefined; 14 | error: any; 15 | } 16 | 17 | const ModelsMainPage: NextPage = () => { 18 | const [models, setModels] = useState(); 19 | const modelsInfos = useModelInfos(); 20 | const session = useSession(); 21 | const devMode = 22 | session.data?.role === "ADMIN" || session.data?.role === "DEVELOPER"; 23 | 24 | const { data: { config } = {} } = useSiteConfig(); 25 | const { data: [mainModel] = [null] } = useModelInfos({ 26 | id: config?.showCaseModelId, 27 | }); 28 | return ( 29 | 30 | {config?.isShowcaseVisible === "true" ? ( 31 | 32 | ) : null} 33 | 34 | {models?.error ? ( 35 |

36 |

37 | {models.error} 38 |

39 |

40 | ) : ( 41 | 46 | )} 47 | 48 | ); 49 | }; 50 | 51 | export default ModelsMainPage; 52 | -------------------------------------------------------------------------------- /pages/models/upload.tsx: -------------------------------------------------------------------------------- 1 | import ErrorDiv from "@components/ErrorDiv"; 2 | import Wrapper from "@components/Wrapper"; 3 | import { UploadForm } from "@customTypes/model"; 4 | import { useUploadable } from "@libs/client/AccessDB"; 5 | import { useSession } from "next-auth/react"; 6 | import { useRouter } from "next/router"; 7 | import { useEffect, useState } from "react"; 8 | import Dropzone from "react-dropzone"; 9 | import { useForm } from "react-hook-form"; 10 | 11 | const Upload = () => { 12 | const [files, setFiles] = useState([]); 13 | const { 14 | register, 15 | setValue: setFormValue, 16 | watch: getFormValue, 17 | handleSubmit, 18 | reset: formReset, 19 | formState, 20 | } = useForm(); 21 | const router = useRouter(); 22 | const session = useSession(); 23 | const fields = getFormValue(); 24 | const isSubmitting = formState.isSubmitting; 25 | const formKeyName = "uploadForm"; 26 | const isUploadable = useUploadable(); 27 | 28 | useEffect(() => { 29 | // set uploadForm if upload form data remained 30 | const prev = JSON.parse(localStorage.getItem(formKeyName) ?? "{}"); 31 | for (const key in prev) { 32 | setFormValue(key as any, prev[key]); 33 | } 34 | }, [setFormValue]); 35 | 36 | useEffect(() => { 37 | // remember input to local storage 38 | localStorage.setItem(formKeyName, JSON.stringify(fields)); 39 | }, [fields]); 40 | 41 | if (session.status === "loading") { 42 | return null; 43 | } 44 | if (isUploadable === false) { 45 | router.replace("/models"); 46 | } 47 | 48 | const onValid = async (form: UploadForm) => { 49 | if (files.length === 0) { 50 | return alert("파일 업로드해주시길 바랍니다."); 51 | } 52 | 53 | const formData = new FormData(); 54 | files.forEach((file) => { 55 | formData.append("file", file); 56 | }); 57 | 58 | formData.append("form", JSON.stringify(form)); 59 | 60 | const res = await fetch("/api/models", { 61 | method: "POST", 62 | body: formData, 63 | }).then((res) => res.json()); 64 | const resStatus: "fulfilled" | "rejected" = res.results[0].status; 65 | if (resStatus === "rejected") { 66 | const ans = await res.message; 67 | alert(`업로드에 실패하였습니다.${ans ? "\n" + ans : ""}`); 68 | return "error"; 69 | } 70 | alert("파일이 업로드 되었습니다."); 71 | localStorage.removeItem(formKeyName); 72 | formReset(); 73 | router.push("/models"); 74 | }; 75 | 76 | return ( 77 | 78 |

79 | { 83 | setFiles(acceptedFiles); 84 | acceptedFiles.forEach((file) => { 85 | const zipName = file.name.split(".").slice(0, -1).join("."); 86 | setFormValue("name", zipName); 87 | }); 88 | }} 89 | > 90 | {({ getRootProps, getInputProps }) => ( 91 |

95 | 96 | {files.length === 0 ? ( 97 |

98 | 123 |

124 |

125 | 파일 업로드 126 |

127 |

128 | 업로드할 .zip 파일을 끌어다놓으세요. 129 |

130 |

131 |

132 |

133 | 압축파일은{" "} 134 | 135 | ./scene.gltf 와 ./thumbnail.png 파일 136 | {" "} 137 | 을 포함해야 합니다. 138 |

139 |

140 |

141 | ) : ( 142 |

143 |

148 |

name

149 |

size

150 |

151 | {files?.map((files, i) => { 152 | const size = files.size; 153 | const kbSize = Math.floor(size / 1000); 154 | const mbSize = Math.floor(kbSize / 1000); 155 | 156 | return ( 157 |

163 |

{files.name}

164 |

165 | {size < 1000 166 | ? size + "bite" 167 | : kbSize > 1000 168 | ? mbSize + "mb" 169 | : kbSize + "kb"} 170 |

171 |

172 | ); 173 | })} 174 |

175 | )} 176 |

177 | )} 178 | 179 |

180 |

181 | Thumbnail 182 |

183 |

184 |

185 | 186 | 모델명* 187 | 188 | 195 | 196 |

197 |

198 | 202 | 내용 203 | 204 | 209 |

210 |

211 | 212 | 카테고리* 213 | 214 | 239 | 240 |

241 |

242 | 243 | 태그 244 | 245 | 250 |

251 | 278 |

279 |

280 |

281 | 282 | ); 283 | }; 284 | 285 | export default Upload; 286 | -------------------------------------------------------------------------------- /pages/users/[id]/index.tsx: -------------------------------------------------------------------------------- 1 | import Thumbnails from "@components/Thumbnails"; 2 | import Wrapper from "@components/Wrapper"; 3 | import { useModelInfos, useUser } from "@libs/client/AccessDB"; 4 | import { useSession } from "next-auth/react"; 5 | import { useRouter } from "next/router"; 6 | 7 | function UserPage() { 8 | const user = useUser(); 9 | const router = useRouter(); 10 | const session = useSession(); 11 | const modelInfos = useModelInfos({ uploader: user.data?.id }); 12 | if (session.status === "unauthenticated") { 13 | router.replace("/models"); 14 | } 15 | if (user.loading || modelInfos.loading) return; 16 | return ( 17 | 18 |

내가 올린 모델들

19 |

20 | 21 | 22 | ); 23 | } 24 | 25 | export default UserPage; 26 | -------------------------------------------------------------------------------- /pages/users/index.tsx: -------------------------------------------------------------------------------- 1 | import { useUser } from "@libs/client/AccessDB"; 2 | import { useSession } from "next-auth/react"; 3 | import { useRouter } from "next/router"; 4 | 5 | function UsersPage() { 6 | const router = useRouter(); 7 | const session = useSession(); 8 | const user = useUser(); 9 | const onLoading = 10 | session.status === "loading" || user.loading || !router.isReady; 11 | if (onLoading) return; 12 | if (session.status === "unauthenticated" || !user.data) { 13 | router.replace("/models"); 14 | return; 15 | } 16 | router.replace(`/users/${user.data.id}`); 17 | return; 18 | } 19 | 20 | export default UsersPage; 21 | -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | } 7 | -------------------------------------------------------------------------------- /prisma/schema.prisma: -------------------------------------------------------------------------------- 1 | datasource db { 2 | provider = "mysql" 3 | url = env("DATABASE_URL") 4 | referentialIntegrity = "prisma" 5 | } 6 | 7 | generator client { 8 | provider = "prisma-client-js" 9 | previewFeatures = ["referentialIntegrity"] 10 | } 11 | 12 | model Account { 13 | id String @id @default(cuid()) 14 | userId String 15 | type String 16 | provider String 17 | providerAccountId String 18 | refresh_token String? @db.Text 19 | access_token String? @db.Text 20 | expires_at Int? 21 | token_type String? 22 | scope String? 23 | id_token String? @db.Text 24 | session_state String? 25 | createdAt DateTime @default(now()) 26 | updatedAt DateTime @default(now()) @updatedAt() 27 | 28 | user User @relation(fields: [userId], references: [id], onDelete: Cascade) 29 | 30 | @@unique([provider, providerAccountId]) 31 | } 32 | 33 | model Session { 34 | id String @id @default(cuid()) 35 | sessionToken String @unique 36 | userId String 37 | expires DateTime 38 | user User @relation(fields: [userId], references: [id], onDelete: Cascade) 39 | } 40 | 41 | model User { 42 | id String @id @default(cuid()) 43 | name String? 44 | email String @unique 45 | emailVerified DateTime? 46 | image String? 47 | accounts Account[] 48 | sessions Session[] 49 | role Role @default(USER) 50 | createdAt DateTime @default(now()) 51 | updatedAt DateTime @default(now()) @updatedAt() 52 | uploadModels Model[] 53 | Log Log[] 54 | Comment Comment[] 55 | } 56 | 57 | model VerificationToken { 58 | identifier String 59 | token String @unique 60 | expires DateTime 61 | 62 | @@unique([identifier, token]) 63 | } 64 | 65 | model Model { 66 | id String @id @default(uuid()) 67 | name String 68 | uploader User @relation(fields: [userId], references: [id]) 69 | createdAt DateTime @default(now()) 70 | updatedAt DateTime @default(now()) @updatedAt() 71 | userId String 72 | thumbnail String? @default("") 73 | modelFile String @default("scene.gltf") 74 | modelUsdz String? 75 | category ModelCategory @default(MISC) 76 | tags Json? 77 | description String? @db.Text() 78 | modelVertex BigInt? @default(0) 79 | modelTriangle BigInt? @default(0) 80 | modelSize BigInt? @default(0) 81 | usdzSize BigInt? @default(0) 82 | zipSize BigInt? @default(0) 83 | viewed Int @default(0) 84 | blinded Boolean @default(false) 85 | Comment Comment[] 86 | } 87 | 88 | model Comment { 89 | id Int @id @default(autoincrement()) 90 | commenter User @relation(fields: [userId], references: [id], onDelete: Cascade) 91 | createdAt DateTime @default(now()) 92 | updatedAt DateTime @default(now()) @updatedAt() 93 | text String 94 | modelCommented Model @relation(fields: [modelId], references: [id], onDelete: Cascade) 95 | userId String 96 | modelId String 97 | } 98 | 99 | model SiteText { 100 | id String @id 101 | text String @default("default") 102 | } 103 | 104 | model SiteConfig { 105 | id String @id 106 | value String 107 | } 108 | 109 | enum Role { 110 | UNAUTHENTICATED 111 | USER 112 | ADMIN 113 | DEVELOPER 114 | } 115 | 116 | enum ModelCategory { 117 | MISC 118 | FURNITURE 119 | ARCHITECTURE 120 | ANIMALS 121 | FOOD 122 | CHARACTERS 123 | NATURE 124 | VEHICLES 125 | SCENES 126 | ACCESSORIES 127 | HEALTH 128 | INSTRUMENTS 129 | PLANTS 130 | WEAPONS 131 | TECHNOLOGY 132 | } 133 | 134 | model Log { 135 | id BigInt @id @default(autoincrement()) 136 | userId String 137 | action Action 138 | createdAt DateTime @default(now()) 139 | User User @relation(fields: [userId], references: [id]) 140 | } 141 | 142 | enum Action { 143 | MODEL_DOWNLOAD 144 | MODEL_UPLOAD 145 | } 146 | -------------------------------------------------------------------------------- /public/MaruBuri-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/MaruBuri-Regular.woff -------------------------------------------------------------------------------- /public/closeBtn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/closeBtn.png -------------------------------------------------------------------------------- /public/comment.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/comment.png -------------------------------------------------------------------------------- /public/cube.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/cube.png -------------------------------------------------------------------------------- /public/list_gray.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/list_gray.png -------------------------------------------------------------------------------- /public/open_license.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/open_license.jpg -------------------------------------------------------------------------------- /public/searchIcon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/searchIcon.png -------------------------------------------------------------------------------- /public/showcaseBanner-blackToWhite.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/showcaseBanner-blackToWhite.png -------------------------------------------------------------------------------- /public/upload1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/upload1.png -------------------------------------------------------------------------------- /public/views.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ParallelSpaceInc/poly-web/ee1a4b83d4d5caac0a071303c997a7422acfd00a/public/views.png -------------------------------------------------------------------------------- /styles/globals.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | 5 | @font-face { 6 | font-family: 'MaruBuri-Regular'; 7 | src: url('/MaruBuri-Regular.woff') format('woff'); 8 | } -------------------------------------------------------------------------------- /supabase/client.ts: -------------------------------------------------------------------------------- 1 | import { createClient } from '@supabase/supabase-js'; 2 | 3 | const supabaseURL: string = process.env.NEXT_PUBLIC_SUPABASE_URL || ''; 4 | const supabaseServerKey: string = process.env.NEXT_PUBLIC_SUPABASE_KEY || ''; 5 | 6 | export const supabase = createClient(supabaseURL, supabaseServerKey); 7 | -------------------------------------------------------------------------------- /tailwind.config.js: -------------------------------------------------------------------------------- 1 | const defaultTheme = require("tailwindcss/defaultTheme"); 2 | module.exports = { 3 | content: [ 4 | "./pages/**/*.{js,ts,jsx,tsx}", 5 | "./components/**/*.{js,ts,jsx,tsx}", 6 | ], 7 | theme: { 8 | extend: { 9 | fontFamily: { 10 | 'MaruBuri': ['MaruBuri-Regular'] 11 | }, 12 | colors: { 13 | "google-blue": "#4285F4", 14 | "header-gray": "#444444", 15 | }, 16 | transitionProperty: { 17 | ...defaultTheme, 18 | width: "width", 19 | height: "height", 20 | }, 21 | }, 22 | }, 23 | plugins: [], 24 | }; 25 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es6", 4 | "lib": ["dom", "dom.iterable", "esnext"], 5 | "allowJs": true, 6 | "skipLibCheck": true, 7 | "strict": true, 8 | "forceConsistentCasingInFileNames": true, 9 | "noEmit": true, 10 | "esModuleInterop": true, 11 | "module": "esnext", 12 | "moduleResolution": "node", 13 | "resolveJsonModule": true, 14 | "isolatedModules": true, 15 | "jsx": "preserve", 16 | "incremental": true, 17 | "baseUrl": ".", 18 | "paths": { 19 | "@components/*": ["components/*"], 20 | "@api/*": ["pages/api/*"], 21 | "@styles/*": ["styles/*"], 22 | "@supabase/*": ["supabase/*"], 23 | "@libs/*": ["libs/*"], 24 | "@customTypes/*": ["customTypes/*"] 25 | } 26 | }, 27 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], 28 | "exclude": ["node_modules"] 29 | } 30 | --------------------------------------------------------------------------------