Switch to pnpm (#11)

Author: jonathanschad

Diff for: .dockerignore

@@ -3,13 +3,13 @@
 **/dist
 
 # Environment files
-client/.env
-server/.env
+**/.env
+.env
 
 # Build artifacts
-client/build
-client/dist
-server/dist
+apps/client/build
+apps/client/dist
+apps/server/dist
 
 # Logs
 **/*.log
@@ -26,5 +26,5 @@ docker-compose.yml
 Thumbs.db
 
 # Prisma directory - make sure to exclude specific files if necessary, not the directory itself
-!server/prisma/
-!server/prisma/schema.prisma
+!packages/prisma/prisma/
+!packages/prisma/prisma/schema.prisma

Diff for: .gitignore

@@ -1,3 +1,36 @@
 .DS_Store
 .vscode
-.env
+.env
+node_modules
+dist
+build
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+.vite
+
+tsconfig.tsbuildinfo
+
+packages/prisma/src/generated

Diff for: .npmrc

@@ -0,0 +1,2 @@
+sync-injected-deps-after-scripts[]=build
+inject-workspace-packages=true

Diff for: .prettierrc

@@ -0,0 +1,7 @@
+{
+  "singleQuote": true,
+  "trailingComma": "all",
+  "tabWidth": 4,
+  "printWidth": 120,
+  "semi": true
+}

Diff for: Dockerfile

@@ -1,46 +1,63 @@
-# Stage 1: Build the React app
-FROM node:20-alpine3.20 AS client-builder
-WORKDIR /app
-COPY client/package.json client/yarn.lock ./
-COPY client ./
-RUN yarn install
-RUN yarn build
-
-# Copy sourcemaps to a separate directory
-RUN mkdir -p /sourcemaps 
-RUN cp -R dist/assets/ /sourcemaps
-RUN rm dist/assets/*.map
-
-# Stage 2: Build the NestJS server
-FROM node:20-alpine3.20 AS server-builder
-WORKDIR /app
-COPY server/package.json server/yarn.lock ./
-COPY server ./
-RUN yarn install
-RUN npx prisma generate
-RUN yarn build
-RUN mkdir -p /sourcemaps 
-RUN cp -R dist/ /sourcemaps
-
-# Stage 3: Production container
-FROM node:20-alpine3.20
-WORKDIR /app
+# Base image with pnpm installed
+FROM node:20-alpine3.20 AS base
+#RUN apt-get update -y && apt-get install -y openssl
+RUN npm install -g pnpm@latest
+
+# Set environment variables for pnpm
+ENV PNPM_HOME="/pnpm"
+ENV PATH="$PNPM_HOME:$PATH"
+
+# Build stage
+FROM base AS build
+WORKDIR /usr/src/app
+
+# Copy all files to the container
+COPY . .
+
+# Install dependencies and build all apps/packages
+RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --frozen-lockfile
+RUN pnpm build
+
+# Deploy production builds for client and server
+RUN pnpm deploy --filter=client --prod /prod/client
+RUN pnpm deploy --filter=server --prod /prod/server
+RUN pnpm deploy --filter=@boilerplate/prisma --prod /prod/database
+
+# Extract sourcemaps for client
+RUN mkdir -p /sourcemaps-client
+RUN cp -R /prod/client/dist/assets/*.map /sourcemaps-client
+RUN rm /prod/client/dist/assets/*.map
+
+# Extract sourcemaps for server
+RUN mkdir -p /sourcemaps-server
+RUN cp -R /prod/server/dist/*.map /sourcemaps-server
+RUN rm /prod/server/dist/*.map
+
+# Production stage
+FROM node:20-alpine3.20 AS production
+#RUN apt-get update -y && apt-get install -y openssl
+WORKDIR /apps
 
 # Copy server build
-COPY --from=server-builder /app/dist ./server
-COPY --from=server-builder /app/node_modules ./node_modules
-COPY --from=server-builder /app/prisma ./prisma 
+COPY --from=build /prod/server ./server
 
 # Copy client build for static file serving
-COPY --from=client-builder /app/dist ./server/public
+COPY --from=build /prod/client/dist ./server/dist/public
+
+# Copy the @boilerplate/database package (for Prisma CLI and schema)
+COPY --from=build /prod/database ./database
 
 # Expose sourcemaps as a build artifact
-COPY --from=client-builder /sourcemaps /sourcemaps-client
-COPY --from=server-builder /sourcemaps/dist /sourcemaps-server
+COPY --from=build /sourcemaps-client /sourcemaps-client
+COPY --from=build /sourcemaps-server /sourcemaps-server
 
 # Set environment variables
 ENV PORT=3000
 EXPOSE 3000
 
+# Set the Prisma schema path explicitly
+ENV PRISMA_SCHEMA_PATH=/apps/database/prisma/schema.prisma
+
 # Start the NestJS server
-CMD ["sh", "-c", "npx prisma migrate deploy && node server/src/main.js"]
+CMD ["sh", "-c", "cd /apps/database && npx prisma migrate deploy --schema $PRISMA_SCHEMA_PATH && cd ../server && node dist/main.js"]
+#CMD ["sh", "-c", "tail -f /dev/null"]

Diff for: apps/client/.eslintrc.cjs

@@ -0,0 +1,43 @@
+module.exports = {
+    root: true,
+    env: { browser: true, es2020: true },
+    extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'plugin:react-hooks/recommended'],
+    ignorePatterns: ['dist', '.eslintrc.cjs'],
+    parser: '@typescript-eslint/parser',
+    plugins: ['react-refresh', 'simple-import-sort'],
+    rules: {
+        'react-refresh/only-export-components': ['warn', { allowConstantExport: true }],
+        'no-restricted-imports': [
+            'error',
+            {
+                patterns: ['.*'],
+            },
+        ],
+        'simple-import-sort/imports': [
+            'error',
+            {
+                groups: [
+                    // 1. Node.js builtins and external packages from node_modules
+                    ['^(node:)?\\w', '^@(?!server|client|boilerplate)\\w'],
+
+                    // 2. Local imports (from the current app/package)
+                    // This depends on which package you're in
+                    // For @client package:
+                    ['^@server'],
+
+                    // 3. Imports from other apps/packages in your monorepo
+                    ['^@client', '^@boilerplate'],
+
+                    // 4. Side effect imports
+                    ['^\\u0000'],
+
+                    // 5. Parent imports. Put `..` last.
+                    ['^\\.\\.(?!/?$)', '^\\.\\./?$'],
+
+                    // 6. Other relative imports. Put same-folder imports and `.` last.
+                    ['^\\./(?=.*/)(?!/?$)', '^\\.(?!/?$)', '^\\./?$'],
+                ],
+            },
+        ],
+    },
+};

Diff for: client/.prettierrc renamed to apps/client/.prettierrc

@@ -0,0 +1,17 @@
+{
+    "$schema": "https://ui.shadcn.com/schema.json",
+    "style": "default",
+    "rsc": false,
+    "tsx": true,
+    "tailwind": {
+        "config": "tailwind.config.js",
+        "css": "src/assets/global.css",
+        "baseColor": "slate",
+        "cssVariables": true,
+        "prefix": ""
+    },
+    "aliases": {
+        "components": "@/components",
+        "utils": "@/lib/utils"
+    }
+}

Diff for: client/README.md renamed to apps/client/README.md

@@ -1,13 +1,14 @@
 {
-    "name": "website",
-    "version": "0.2.1",
+    "name": "client",
+    "version": "0.3",
     "type": "module",
     "license": "MIT",
     "author": "Jonathan Schad",
     "scripts": {
         "dev": "vite",
         "build": "yarn generate-license-attribution && tsc && vite build",
         "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+        "lint:fix": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0 --fix",
         "preview": "vite preview",
         "generate-license-attribution": "license-checker-rseidelsohn --relativeLicensePath --relativeModulePath --json  --out src/assets/licenses.json"
     },

Diff for: apps/client/components.json

@@ -1,13 +1,13 @@
-import * as Sentry from '@sentry/react';
 import Plausible from 'plausible-tracker';
 import { useEffect, useRef } from 'react';
 import { createRoutesFromChildren, matchRoutes, useLocation, useNavigationType } from 'react-router-dom';
-
-import { config } from '@/config';
+import * as Sentry from '@sentry/react';
 
 // eslint-disable-next-line no-restricted-imports
 import packageJson from '../package.json';
 
+import { config } from '@/config';
+
 export const Analytics = () => {
     const plausible = useRef<ReturnType<typeof Plausible> | null>(null);
     const sentryClient = useRef<ReturnType<typeof Sentry.init> | null>(null);

Diff for: client/index.html renamed to apps/client/index.html

@@ -1,8 +1,8 @@
+import { QueryClient, QueryClientProvider } from 'react-query';
+
 import '@/i18n/i18n';
 import '/node_modules/flag-icons/css/flag-icons.min.css';
 
-import { QueryClient, QueryClientProvider } from 'react-query';
-
 import { Analytics } from '@/Analytics';
 import LoadingApplication from '@/pages/LoadingApplication';
 import { Routes } from '@/Routes';

Diff for: client/package.json renamed to apps/client/package.json

@@ -1,13 +1,13 @@
 /* eslint-disable no-restricted-imports */
-import './google-oauth-button.css';
-
 import { useTranslation } from 'react-i18next';
 import { useMutation, useQueryClient } from 'react-query';
 
-import { startGoogleOAuthFlow } from '@/repository/login';
+import './google-oauth-button.css';
 
 import GoogleSVG from './google.svg?react';
 
+import { startGoogleOAuthFlow } from '@/repository/login';
+
 export const GoogleOAuthButton = () => {
     const { t } = useTranslation('common');
     const queryClient = useQueryClient();

Diff for: client/postcss.config.js renamed to apps/client/postcss.config.js

@@ -1,5 +1,5 @@
-import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import * as React from 'react';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
 
 import { cn } from '@/lib/utils';
 

Diff for: client/public/vite.svg renamed to apps/client/public/vite.svg

@@ -1,6 +1,6 @@
-import { Slot } from '@radix-ui/react-slot';
 import { cva, type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
 
 import { cn } from '@/lib/utils';
 
@@ -44,4 +44,5 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
 );
 Button.displayName = 'Button';
 
+// eslint-disable-next-line react-refresh/only-export-components
 export { Button, buttonVariants };

Diff for: client/src/Analytics.tsx renamed to apps/client/src/Analytics.tsx

@@ -0,0 +1,43 @@
+import * as React from 'react';
+
+import { cn } from '@/lib/utils';
+
+const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('rounded-lg border bg-card text-card-foreground shadow-sm', className)} {...props} />
+));
+Card.displayName = 'Card';
+
+const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+    ({ className, ...props }, ref) => (
+        <div ref={ref} className={cn('flex flex-col space-y-1.5 p-6', className)} {...props} />
+    ),
+);
+CardHeader.displayName = 'CardHeader';
+
+const CardTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+    ({ className, ...props }, ref) => (
+        <h3 ref={ref} className={cn('text-2xl font-semibold leading-none tracking-tight', className)} {...props} />
+    ),
+);
+CardTitle.displayName = 'CardTitle';
+
+const CardDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(
+    ({ className, ...props }, ref) => (
+        <p ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />
+    ),
+);
+CardDescription.displayName = 'CardDescription';
+
+const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+    ({ className, ...props }, ref) => <div ref={ref} className={cn('p-6 pt-0', className)} {...props} />,
+);
+CardContent.displayName = 'CardContent';
+
+const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+    ({ className, ...props }, ref) => (
+        <div ref={ref} className={cn('flex items-center p-6 pt-0', className)} {...props} />
+    ),
+);
+CardFooter.displayName = 'CardFooter';
+
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };

Diff for: client/src/App.tsx renamed to apps/client/src/App.tsx

@@ -1,5 +1,5 @@
-import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as React from 'react';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 
 import { Checkbox, CheckboxProps } from '@/components/ui/checkbox';
 

Diff for: client/src/Routes.tsx renamed to apps/client/src/Routes.tsx

@@ -1,6 +1,6 @@
-import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { Check } from 'lucide-react';
 import * as React from 'react';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 
 import { cn } from '@/lib/utils';
 export interface CheckboxProps

Diff for: client/src/assets/global.css renamed to apps/client/src/assets/global.css

@@ -1,3 +1,4 @@
+import { useState } from 'react';
 import {
     ColumnDef,
     flexRender,
@@ -9,7 +10,6 @@ import {
     SortingState,
     useReactTable,
 } from '@tanstack/react-table';
-import { useState } from 'react';
 
 import { Button } from '@/components/ui/button';
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';