update docker and turbo for build

.github/workflows/build.yml

@@ -30,11 +30,27 @@ jobs:
           password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Build and Push Docker Image
-        uses: docker/build-push-action@v2
+        uses: docker/build-push-action@v3
+        with:
+          context: .
+          push: false
+          file: Dockerfile.node
+          tags: custom-node:latest
+
+      - name: Build Admin
+        uses: docker/build-push-action@v3
         with:
           context: .
           push: true
-          tags: ghcr.io/${{ github.repository }}:${{ github.event.inputs.tag }}, ghcr.io/${{ github.repository }}:${{ steps.vars.outputs.sha_short }}
-          image: ${{ github.repository }}
-          buildArgs: COMMIT=${{ steps.vars.outputs.sha_short }}
-          registry: ghcr.io
+          tags: ghcr.io/${{ github.repository }}/admin:${{ github.event.inputs.tag }}
+          build-args: COMMIT=${{ steps.vars.outputs.sha_short }}, APP=admin, START_COMMAND=start
+
+      # - name: Build and Push Docker Image
+      #   uses: docker/build-push-action@v2
+      #   with:
+      #     context: .
+      #     push: true
+      #     tags: ghcr.io/${{ github.repository }}:${{ github.event.inputs.tag }}, ghcr.io/${{ github.repository }}:${{ steps.vars.outputs.sha_short }}
+      #     image: ${{ github.repository }}
+      #     buildArgs: COMMIT=${{ steps.vars.outputs.sha_short }}
+      #     registry: ghcr.io

Dockerfile

@@ -1,26 +1,43 @@
-FROM node:18-alpine
+FROM custom-node:latest AS pruned
+WORKDIR /app
+ARG APP
 
-LABEL org.opencontainers.image.source=http://github.com/celluloid-edu/celluloid
-LABEL org.opencontainers.image.description="Celluloid is a collaborative video annotation application designed for educational purposes."
-LABEL org.opencontainers.image.licenses=MIT
+COPY . .
 
-# Install system dependencies
-RUN apk update && apk add --no-cache git python3 make g++ curl
+RUN turbo prune --scope=$APP --docker
 
-# Set working directory
+FROM custom-node:latest AS installer
 WORKDIR /app
+ARG APP
 
-COPY . .
+COPY --from=pruned /app/out/json/ .
+COPY --from=pruned /app/out/yarn.lock /app/yarn.lock
+
+RUN \
+      --mount=type=cache,target=/usr/local/share/.cache/yarn/v6,sharing=private \
+      yarn --prefer-offline --frozen-lockfile
 
-RUN yarn set version berry
+FROM custom-node:latest as builder
+WORKDIR /app
+ARG APP
+
+COPY --from=installer --link /app .
 
-# Install project dependencies
-RUN yarn install && yarn build
-# --inline-builds
+COPY --from=pruned /app/out/full/ .
+COPY turbo.json turbo.json
 
+RUN turbo run build --no-cache --filter=${APP}^...
 
-ENV PORT=3000
-EXPOSE $PORT
+RUN \
+      --mount=type=cache,target=/usr/local/share/.cache/yarn/v6,sharing=private \
+      yarn --prefer-offline --frozen-lockfile
+
+#############################################
+FROM node:20.2-alpine3.17 AS runner
+WORKDIR /app
+ARG APP
+ARG START_COMMAND=dev
 
-CMD [ "yarn", "server", "start"]
+COPY --from=builder /app .
 
+CMD yarn workspace ${APP} ${START_COMMAND}

Dockerfile.node

@@ -0,0 +1,5 @@
+FROM node:20.2-alpine3.17
+
+RUN apk add -f --update --no-cache --virtual .gyp nano bash libc6-compat python3 make g++ \
+      && yarn global add turbo \
+      && apk del .gyp

README.md

@@ -190,3 +190,5 @@ yourself with some of the following technologies:
 
 You can still find the old Celluloid version 1 that supports YouTube videos
 [here](https://github.com/celluloid-camp/celluloid/releases/tag/v1).
+
+docker build --build-arg APP=admin -t celluloid-admin .

package.json

@@ -62,6 +62,7 @@
     "ts-node": "^10.0.0",
     "tsup": "^5.11.13",
     "tsx": "^3.12.10",
+    "turbo": "^1.10.14",
     "typescript": "^5.0.4",
     "wait-port": "^1.0.4"
   },
@@ -86,5 +87,8 @@
       "react-app/jest"
     ]
   },
-  "packageManager": "yarn@3.4.1"
+  "packageManager": "yarn@3.4.1",
+  "engines": {
+    "node": ">=20"
+  }
 }

packages/admin/package.json

@@ -13,7 +13,7 @@
   "scripts": {
     "dev": "tsx watch --clear-screen=false src ",
     "build": "rm -rf dist && tsc",
-    "start": "DATABASE_URL=$DATABASE_URL node --use-strict dist/index.js"
+    "start": "node --use-strict dist/index.js"
   },
   "dependencies": {
     "@adminjs/express": "6.0.0",

packages/admin/src/server.ts

@@ -2,7 +2,7 @@ import AdminJSExpress from "@adminjs/express";
 import importExportFeature from "@adminjs/import-export";
 import { Database, getModelByName, Resource } from '@adminjs/prisma';
 import { dark, light, noSidebar } from '@adminjs/themes'
-import PrismaModule from '@celluloid/database/client-prisma/index.js';
+import PrismaModule from '@celluloid/database';
 import AdminJS, { AdminJSOptions, DEFAULT_PATHS, ThemeConfig } from "adminjs";
 
 import { componentLoader, Components } from './components.js'

packages/api/package.json

@@ -25,7 +25,7 @@
     "swagger-ui-express": "^5.0.0",
     "trpc-openapi": "^1.2.0",
     "uuid": "^9.0.1",
-    "zod": "^3.0.0"
+    "zod": "^3.22.2"
   },
   "devDependencies": {
     "@types/express": "^4.17.17",

packages/api/src/prisma.ts

@@ -1,4 +1,4 @@
 
 
-import { PrismaClient } from '@celluloid/database/client-prisma'
+import { PrismaClient } from '@celluloid/database'
 export const prisma = new PrismaClient()

packages/api/src/routers/playlist.ts

@@ -1,9 +1,10 @@
-import { UserRole } from '@celluloid/database/client-prisma';
+import { UserRole } from '@celluloid/database';
 import { TRPCError } from '@trpc/server';
 import { z } from 'zod';
 
 import { prisma } from '../prisma';
 import { protectedProcedure, publicProcedure, router } from '../trpc';
+import { generateUniqueShareName } from '../utils';
 
 // const defaultPostSelect = Prisma.validator<Prisma.ProjectSelect>()({
 //   id: true,
@@ -92,6 +93,8 @@ export const playlistRouter = router({
         title: z.string().min(1),
         description: z.string(),
         projects: z.array(z.object({
+          title: z.string(),
+          description: z.string(),
           videoId: z.string(),
           host: z.string(),
         })),
@@ -105,7 +108,9 @@ export const playlistRouter = router({
       }),
     )
     .mutation(async ({ input, ctx }) => {
-      if (ctx.requirePermission(UserRole.Teacher)) {
+      if (ctx.user && ctx.requirePermission(UserRole.Teacher)) {
+        const userId = ctx.user.id;
+
         const project = await prisma.playlist.create({
           select: {
             projects: true,
@@ -119,15 +124,16 @@ export const playlistRouter = router({
                 data: input.projects.map(p => ({
                   videoId: p.videoId,
                   host: p.host,
-                  title: input.title,
-                  description: input.description,
+                  title: p.title,
+                  description: p.description,
                   objective: input.objective,
                   levelStart: input.levelStart,
                   levelEnd: input.levelEnd,
                   public: input.public,
                   collaborative: input.collaborative,
                   shared: input.shared,
-                  userId: ctx.user?.id,
+                  userId: userId,
+                  shareName: generateUniqueShareName(p.title)
                 }))
               }
             }

packages/api/src/routers/project.ts

@@ -1,8 +1,9 @@
+import { UserRole } from '@celluloid/database';
 import { TRPCError } from '@trpc/server';
 import { z } from 'zod';
 
 import { prisma } from '../prisma';
-import { publicProcedure, router } from '../trpc';
+import { protectedProcedure, publicProcedure, router } from '../trpc';
 
 // const defaultPostSelect = Prisma.validator<Prisma.ProjectSelect>()({
 //   id: true,
@@ -93,10 +94,9 @@ export const projectRouter = router({
       }
       return project;
     }),
-  add: publicProcedure
+  add: protectedProcedure
     .input(
       z.object({
-        videoId: z.string(),
         title: z.string().min(1),
         description: z.string(),
         objective: z.string(),
@@ -106,13 +106,29 @@ export const projectRouter = router({
         collaborative: z.boolean(),
         shared: z.boolean(),
         userId: z.string(),
+        videoId: z.string(),
+        host: z.string(),
       }),
     )
-    .mutation(async ({ input }) => {
-      const project = await prisma.project.create({
-        data: input,
-        // select: defaultPostSelect,
-      });
-      return project;
+    .mutation(async ({ input, ctx }) => {
+      if (ctx.user && ctx.user.id && ctx.requirePermission(UserRole.Teacher)) {
+        const project = await prisma.project.create({
+          data: {
+            userId: ctx.user?.id,
+            title: input.title,
+            description: input.description,
+            videoId: input.videoId,
+            host: input.host,
+            objective: input.objective,
+            levelStart: input.levelStart,
+            levelEnd: input.levelEnd,
+            public: input.public,
+            collaborative: input.collaborative,
+            shared: input.shared,
+          }
+          // select: defaultPostSelect,
+        });
+        return project;
+      }
     }),
 });

packages/api/src/utils.ts

@@ -1,5 +1,5 @@
 import { paramCase } from 'change-case';
-import { uniqueId } from 'lodash';
+import _ from 'lodash';
 
 export function generateUniqueShareName(title: string) {
   const compare = (a: string, b: string) =>
@@ -21,5 +21,5 @@ export function generateUniqueShareName(title: string) {
     .reduce(construct, [])
     .join('-');
 
-  return uniqueId(prefix);
+  return _.uniqueId(prefix);
 }

packages/client/package.json

@@ -12,12 +12,13 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@celluloid/database": "*",
     "@celluloid/react-player": "2.11.5",
     "@celluloid/types": "^0.1.0",
     "@celluloid/validators": "^0.1.0",
     "@emotion/react": "^11.10.6",
     "@emotion/styled": "^11.10.6",
-    "@mui/icons-material": "^5.11.16",
+    "@mui/icons-material": "^5.14.11",
     "@mui/lab": "^5.0.0-alpha.126",
     "@mui/material": "^5.12.0",
     "@mui/styles": "^5.12.0",
@@ -40,7 +41,7 @@
     "linkify-urls": "^4.0.0",
     "lodash": "^4.17.21",
     "material-ui-confirm": "^3.0.9",
-    "material-ui-pickers": "^1.0.0-rc.17",
+    "material-ui-pickers": "^2.2.4",
     "moment-duration-format": "^2.2.2",
     "mui-image": "^1.0.7",
     "passport": "^0.6.0",
@@ -66,7 +67,7 @@
     "rooks": "^7.4.1",
     "shiitake": "^3.0.2",
     "typescript": "^5.0.4",
-    "yup": "^1.1.1"
+    "yup": "^1.3.1"
   },
   "browserslist": {
     "production": [