V2

.npmrc

@@ -1,5 +1,2 @@
-# Expo doesn't play nice with pnpm by default. 
-# The symbolic links of pnpm break the rules of Expo monorepos.
-# @link https://docs.expo.dev/guides/monorepos/#common-issues
 node-linker=hoisted
-strict-peer-dependencies=false
+link-workspace-packages=true

.nvmrc

@@ -1 +1 @@
-20.18.0
+22.14

apps/admin/Dockerfile

@@ -6,7 +6,7 @@ ENV NEXT_TELEMETRY_DISABLED=1
 RUN <<EOF 
   apt-get update -y
   apt-get install libc6 libc++1 bash -y
-  npm install -g pnpm@9.10.0
+  npm install -g pnpm@10.14.0
 EOF
 
 FROM base AS with-turbo

apps/admin/components.json

@@ -1,16 +1,21 @@
 {
   "$schema": "https://ui.shadcn.com/schema.json",
-  "style": "default",
+  "style": "new-york",
   "rsc": true,
   "tsx": true,
   "tailwind": {
-    "config": "tailwind.config.ts",
+    "config": "",
     "css": "src/styles/globals.css",
     "baseColor": "stone",
-    "cssVariables": true
+    "cssVariables": true,
+    "prefix": ""
   },
   "aliases": {
-    "components": "@/components",
-    "utils": "@/lib/utils"
-  }
+    "components": "~/components",
+    "utils": "~/lib/utils",
+    "ui": "~/components/ui",
+    "lib": "~/lib",
+    "hooks": "~/hooks"
+  },
+  "iconLibrary": "lucide"
 }

apps/admin/next.config.js

@@ -1,13 +1,12 @@
-import { fileURLToPath } from "url";
-import createJiti from "jiti";
+import { createJiti } from "jiti";
+
+const jiti = createJiti(import.meta.url);
 
 // Import env files to validate at build time. Use jiti so we can load .ts files in here.
-createJiti(fileURLToPath(import.meta.url))("./src/env");
+await jiti.import("./src/env");
 
 /** @type {import("next").NextConfig} */
 const config = {
-  reactStrictMode: true,
-
   /** Enables hot reloading for local packages without a build step */
   transpilePackages: [
     "@enpitsu/api",

apps/admin/package.json

@@ -4,68 +4,140 @@
   "private": true,
   "type": "module",
   "scripts": {
-    "build": "pnpm with-env next build",
+    "build": "pnpm with-env next build --turbo",
     "clean": "git clean -xdf .next .turbo node_modules",
-    "dev": "pnpm with-env next dev",
+    "dev": "pnpm with-env next dev --turbo",
     "lint": "eslint",
     "format": "prettier --check . --ignore-path ../../.gitignore",
     "start": "pnpm with-env next start",
     "typecheck": "tsc --noEmit",
     "with-env": "dotenv -e ../../.env --"
   },
   "dependencies": {
+    "@ariakit/react": "^0.4.18",
+    "@emoji-mart/data": "1.2.1",
     "@enpitsu/api": "workspace:^0.1.0",
     "@enpitsu/auth": "workspace:^0.1.0",
     "@enpitsu/db": "workspace:^0.1.0",
     "@enpitsu/redis": "workspace:^0.1.0",
     "@enpitsu/token-generator": "workspace:^0.1.0",
-    "@enpitsu/ui": "workspace:^0.1.0",
+    "@hocuspocus/provider": "^3.2.3",
+    "@hookform/resolvers": "^5.2.1",
+    "@platejs/ai": "^49.2.15",
+    "@platejs/autoformat": "^49.0.0",
+    "@platejs/basic-nodes": "^49.0.0",
+    "@platejs/basic-styles": "^49.0.0",
+    "@platejs/callout": "^49.0.0",
+    "@platejs/caption": "^49.0.0",
+    "@platejs/code-block": "^49.0.0",
+    "@platejs/combobox": "^49.0.0",
+    "@platejs/comment": "^49.0.0",
+    "@platejs/date": "^49.0.2",
+    "@platejs/dnd": "^49.2.18",
+    "@platejs/emoji": "^49.0.0",
+    "@platejs/indent": "^49.0.0",
+    "@platejs/layout": "^49.2.1",
+    "@platejs/link": "^49.1.1",
+    "@platejs/list": "^49.2.17",
+    "@platejs/list-classic": "^49.1.0",
+    "@platejs/markdown": "^49.2.15",
+    "@platejs/math": "^49.0.0",
+    "@platejs/media": "^49.0.0",
+    "@platejs/mention": "^49.0.0",
+    "@platejs/resizable": "^49.0.0",
+    "@platejs/selection": "^49.2.4",
+    "@platejs/suggestion": "^49.0.0",
+    "@platejs/table": "^49.1.13",
+    "@platejs/toc": "^49.0.0",
+    "@platejs/toggle": "^49.0.0",
+    "@platejs/yjs": "^49.0.0",
+    "@radix-ui/react-alert-dialog": "^1.1.15",
+    "@radix-ui/react-avatar": "^1.1.10",
+    "@radix-ui/react-checkbox": "^1.3.3",
+    "@radix-ui/react-dialog": "^1.1.15",
+    "@radix-ui/react-dropdown-menu": "^2.1.16",
+    "@radix-ui/react-label": "^2.1.7",
+    "@radix-ui/react-popover": "^1.1.15",
+    "@radix-ui/react-radio-group": "^1.3.8",
+    "@radix-ui/react-select": "^2.2.6",
+    "@radix-ui/react-separator": "^1.1.7",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-switch": "^1.2.6",
+    "@radix-ui/react-tabs": "^1.1.13",
+    "@radix-ui/react-toolbar": "^1.1.11",
+    "@radix-ui/react-tooltip": "^1.2.8",
+    "@slate-yjs/core": "^1.0.2",
+    "@slate-yjs/react": "^1.1.0",
+    "@tailwindcss/postcss": "^4.1.12",
     "@tanstack/react-query": "catalog:",
-    "@tanstack/react-table": "^8.20.6",
+    "@tanstack/react-table": "^8.21.3",
     "@trpc/client": "catalog:",
-    "@trpc/react-query": "catalog:",
     "@trpc/server": "catalog:",
+    "@trpc/tanstack-react-query": "catalog:",
+    "@udecode/cn": "^49.0.15",
+    "@uploadthing/react": "7.3.1",
+    "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "csv-parse": "^5.6.0",
+    "cmdk": "^1.1.1",
+    "csv-parse": "^6.1.0",
     "date-fns": "^4.1.0",
     "exceljs": "^4.4.0",
+    "html2canvas-pro": "^1.5.11",
     "jszip": "^3.10.1",
-    "katex": "^0.16.21",
-    "lucide-react": "^0.474.0",
-    "next": "14.2.23",
-    "next-themes": "^0.4.4",
+    "katex": "^0.16.22",
+    "lodash": "^4.17.21",
+    "lowlight": "^3.3.0",
+    "lucide-react": "^0.532.0",
+    "nanoid": "5.1.5",
+    "next": "^15.4.4",
+    "next-themes": "^0.4.6",
+    "pdf-lib": "^1.17.1",
+    "platejs": "^49.2.9",
+    "postcss": "^8.5.6",
     "qrcode": "^1.5.4",
-    "quill-delta": "^5.1.0",
-    "react": "catalog:react18",
-    "react-day-picker": "8.10.1",
-    "react-dom": "catalog:react18",
-    "react-error-boundary": "^5.0.0",
-    "react-hook-form": "^7.54.2",
-    "react-icons": "^5.4.0",
-    "react-quill": "^2.0.0",
-    "sharp": "^0.33.5",
+    "react": "catalog:react19",
+    "react-day-picker": "9.9.0",
+    "react-dom": "catalog:react19",
+    "react-error-boundary": "^6.0.0",
+    "react-hook-form": "^7.61.1",
+    "react-icons": "^5.5.0",
+    "react-lite-youtube-embed": "^2.5.6",
+    "react-player": "3.3.1",
+    "react-textarea-autosize": "^8.5.9",
+    "react-tweet": "^3.2.2",
+    "remark-gfm": "^4.0.1",
+    "remark-math": "^6.0.0",
+    "sharp": "^0.34.3",
     "slugify": "^1.6.6",
+    "sonner": "^2.0.7",
     "string-similarity": "^4.0.4",
     "superjson": "2.2.2",
+    "tailwind-merge": "^3.3.1",
+    "tailwind-scrollbar-hide": "^4.0.0",
     "tailwindcss-animate": "^1.0.7",
+    "uploadthing": "7.7.2",
+    "use-file-picker": "2.1.2",
+    "vaul": "^1.1.2",
+    "y-indexeddb": "^9.0.12",
+    "yjs": "^13.6.27",
     "zod": "catalog:"
   },
   "devDependencies": {
     "@enpitsu/eslint-config": "workspace:^0.2.0",
     "@enpitsu/prettier-config": "workspace:^0.1.0",
-    "@enpitsu/tailwind-config": "workspace:^0.1.0",
     "@enpitsu/tsconfig": "workspace:^0.1.0",
     "@types/katex": "^0.16.7",
-    "@types/node": "^20.10.2",
+    "@types/node": "^24.1.0",
     "@types/qrcode": "^1.5.5",
-    "@types/react": "catalog:react18",
-    "@types/react-dom": "catalog:react18",
+    "@types/react": "catalog:react19",
+    "@types/react-dom": "catalog:react19",
     "@types/string-similarity": "^4.0.2",
-    "dotenv-cli": "^7.4.4",
+    "dotenv-cli": "^9.0.0",
     "eslint": "catalog:",
-    "jiti": "^2.4.2",
+    "jiti": "^2.5.1",
     "prettier": "catalog:",
     "tailwindcss": "catalog:",
+    "tw-animate-css": "^1.3.7",
     "typescript": "catalog:"
   },
   "prettier": "@enpitsu/prettier-config"

apps/admin/postcss.config.mjs

@@ -0,0 +1,7 @@
+const config = {
+  plugins: {
+    "@tailwindcss/postcss": {},
+  },
+};
+
+export default config;

apps/admin/src/_components/Admin/AllRegisteredUser/UpdateRole.tsx

@@ -1,6 +1,13 @@
 "use client";
 
-import { Button } from "@enpitsu/ui/button";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { Loader2 } from "lucide-react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
+
+import { Button } from "~/components/ui/button";
 import {
   Dialog,
   DialogClose,
@@ -9,29 +16,23 @@ import {
   DialogFooter,
   DialogHeader,
   DialogTitle,
-} from "@enpitsu/ui/dialog";
+} from "~/components/ui/dialog";
 import {
   Form,
   FormControl,
   FormField,
   FormItem,
   FormLabel,
   FormMessage,
-} from "@enpitsu/ui/form";
+} from "~/components/ui/form";
 import {
   Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
   SelectValue,
-} from "@enpitsu/ui/select";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { Loader2 } from "lucide-react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
-
-import { api } from "~/trpc/react";
+} from "~/components/ui/select";
+import { useTRPC } from "~/trpc/react";
 
 const FormSchema = z.object({
   role: z.enum(["user", "admin"], {
@@ -50,23 +51,29 @@ export const UpdateRole = ({
   userId: string;
   toggleOpen: () => void;
 }) => {
-  const utils = api.useUtils();
-  const updateRoleMutation = api.admin.updateUserRole.useMutation({
-    onSuccess() {
-      toast.success("Berhasil memperbarui pengguna!", {
-        description: "Status pengguna berhasil diperbarui.",
-      });
-      toggleOpen();
-    },
-    onError(error) {
-      toast.error("Operasi Gagal", {
-        description: `Terjadi kesalahan, Error: ${error.message}`,
-      });
-    },
-    async onSettled() {
-      await utils.admin.getAllRegisteredUser.invalidate();
-    },
-  });
+  const trpc = useTRPC();
+  const queryClient = useQueryClient();
+
+  const updateRoleMutation = useMutation(
+    trpc.admin.updateUserRole.mutationOptions({
+      onSuccess() {
+        toast.success("Berhasil memperbarui pengguna!", {
+          description: "Status pengguna berhasil diperbarui.",
+        });
+        toggleOpen();
+      },
+      onError(error) {
+        toast.error("Operasi Gagal", {
+          description: `Terjadi kesalahan, Error: ${error.message}`,
+        });
+      },
+      async onSettled() {
+        await queryClient.invalidateQueries(
+          trpc.admin.getAllRegisteredUser.pathFilter(),
+        );
+      },
+    }),
+  );
 
   const form = useForm<z.infer<typeof FormSchema>>({
     resolver: zodResolver(FormSchema),

apps/admin/src/_components/Admin/AllRegisteredUser/index.tsx

@@ -1,24 +1,26 @@
 "use client";
 
-import type { RouterOutputs } from "@enpitsu/api";
 import type { ColumnDef } from "@tanstack/react-table";
 import { useCallback, useState } from "react";
 import { Space_Mono } from "next/font/google";
-import { Avatar, AvatarFallback, AvatarImage } from "@enpitsu/ui/avatar";
-import { Button } from "@enpitsu/ui/button";
+import { useQuery } from "@tanstack/react-query";
+import { format } from "date-fns";
+import { id } from "date-fns/locale";
+import { MoreHorizontal, PencilLine } from "lucide-react";
+
+import type { RouterOutputs } from "@enpitsu/api";
+
+import { ReusableDataTable } from "~/_components/data-table";
+import { Avatar, AvatarFallback, AvatarImage } from "~/components/ui/avatar";
+import { Button } from "~/components/ui/button";
 import {
   DropdownMenu,
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuLabel,
   DropdownMenuTrigger,
-} from "@enpitsu/ui/dropdown-menu";
-import { format } from "date-fns";
-import { id } from "date-fns/locale";
-import { MoreHorizontal, PencilLine } from "lucide-react";
-
-import { ReusableDataTable } from "~/_components/data-table";
-import { api } from "~/trpc/react";
+} from "~/components/ui/dropdown-menu";
+import { useTRPC } from "~/trpc/react";
 import { UpdateRole } from "./UpdateRole";
 
 type PendingUserList = RouterOutputs["admin"]["getAllRegisteredUser"][number];
@@ -115,8 +117,10 @@ export const columns: ColumnDef<PendingUserList>[] = [
 ];
 
 export function AllRegisteredUser() {
-  const allRegisteredUserQuery =
-    api.admin.getAllRegisteredUser.useQuery(undefined);
+  const trpc = useTRPC();
+  const allRegisteredUserQuery = useQuery(
+    trpc.admin.getAllRegisteredUser.queryOptions(),
+  );
 
   return (
     <div className="w-full">