Admin dashboard improvements and central config

.github/workflows/ci.yml

@@ -1,9 +1,6 @@
 name: CI
 
 on:
-  push:
-    branches:
-      - development
   pull_request:
     branches:
       - main

apps/web/package.json

@@ -16,6 +16,7 @@
     "fullclean": "rm -rf dist .next .turbo node_modules"
   },
   "dependencies": {
+    "@repo/types": "workspace:*",
     "@auth/drizzle-adapter": "^1.8.0",
     "@codemirror/collab": "^6.1.1",
     "@codemirror/lang-markdown": "^6.3.2",
@@ -34,6 +35,7 @@
     "@tailwindcss/typography": "^0.5.16",
     "@tanstack/react-query": "^5.74.4",
     "@tanstack/react-query-devtools": "^5.74.4",
+    "@tanstack/react-table": "^8.21.3",
     "@trpc/client": "^11.1.0",
     "@trpc/next": "^11.1.0",
     "@trpc/react-query": "^11.1.0",
@@ -58,6 +60,7 @@
     "pg": "^8.14.1",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
+    "react-intersection-observer": "^9.16.0",
     "react-markdown": "^10.1.0",
     "react-syntax-highlighter": "^15.6.1",
     "rehype-highlight": "^7.0.2",

apps/web/src/app/(auth)/login/login-page.tsx

@@ -0,0 +1,54 @@
+"use client";
+
+import { LoginForm } from "~/components/auth/LoginForm";
+import { Suspense, useEffect } from "react";
+import { useRouter } from "next/navigation";
+import { usePermissions } from "~/components/auth/permission/client";
+import { Button } from "@repo/ui";
+import { ArrowLeftIcon } from "lucide-react";
+
+export default function LoginPage() {
+  const router = useRouter();
+  const { isAuthenticated, hasPermission } = usePermissions();
+
+  useEffect(() => {
+    if (isAuthenticated) {
+      router.push("/");
+    }
+  }, [isAuthenticated, router]);
+
+  const hasWikiReadPermission = hasPermission("wiki:page:read");
+
+  return (
+    <div className="bg-background-paper flex min-h-screen flex-col items-center justify-center px-4 py-12 sm:px-6 lg:px-8">
+      <div className="w-full max-w-md space-y-8">
+        <div>
+          <h2 className="mt-6 text-center text-3xl font-bold tracking-tight">
+            Sign in to NextWiki
+          </h2>
+          {!hasWikiReadPermission && (
+            <p className="text-text-secondary mt-2 text-center text-sm">
+              This is a private wiki. You need to be logged in to access it.
+            </p>
+          )}
+        </div>
+
+        <Suspense fallback={<div>Loading login form...</div>}>
+          <LoginForm />
+        </Suspense>
+      </div>
+
+      {/* Show the back to home button if the user has the wiki:page:read permission, otherwise they will be redirected back here so no need to show it */}
+      {hasWikiReadPermission && (
+        <Button
+          className="fixed bottom-16 left-16 rounded-full"
+          variant="outlined"
+          onClick={() => router.push("/")}
+        >
+          <ArrowLeftIcon className="h-4 w-4" />
+          Back to home
+        </Button>
+      )}
+    </div>
+  );
+}

apps/web/src/app/(auth)/register/page.tsx

@@ -1,25 +1,26 @@
-"use client";
+import RegisterClientPage from "./register-page";
+import { getSettingValue } from "~/lib/utils/settings";
 
-import { ArrowLeftIcon } from "lucide-react";
-import { useRouter } from "next/navigation";
-import { useEffect } from "react";
-import { RegisterForm } from "~/components/auth/RegisterForm";
-import { usePermissions } from "~/components/auth/permission/client";
-import { Button } from "@repo/ui";
-
-export default function RegisterPage({
+export default async function RegisterPage({
   isFirstUser = false,
 }: {
   isFirstUser?: boolean;
 }) {
-  const router = useRouter();
-  const { isAuthenticated } = usePermissions();
+  const allowRegistration = await getSettingValue("auth.allowRegistration");
 
-  useEffect(() => {
-    if (isAuthenticated) {
-      router.push("/");
-    }
-  }, [isAuthenticated, router]);
+  if (!allowRegistration) {
+    return (
+      <div className="bg-background-paper flex h-screen flex-col items-center justify-center px-4 py-12 sm:px-6 lg:px-8">
+        <div className="w-full max-w-md space-y-8">
+          <div>
+            <h2 className="mt-6 text-center text-3xl font-bold tracking-tight">
+              Registration is not allowed
+            </h2>
+          </div>
+        </div>
+      </div>
+    );
+  }
 
   return (
     <div className="bg-background-paper flex h-screen flex-col items-center justify-center px-4 py-12 sm:px-6 lg:px-8">
@@ -34,18 +35,8 @@ export default function RegisterPage({
             </p>
           )}
         </div>
-
-        <RegisterForm isFirstUser={isFirstUser} />
-
-        <Button
-          className="fixed bottom-16 left-16 rounded-full"
-          variant="outlined"
-          onClick={() => router.push("/")}
-        >
-          <ArrowLeftIcon className="h-4 w-4" />
-          Back to home
-        </Button>
       </div>
+      <RegisterClientPage isFirstUser={isFirstUser} />
     </div>
   );
 }

apps/web/src/app/(auth)/register/register-page.tsx

@@ -0,0 +1,38 @@
+"use client";
+
+import { ArrowLeftIcon } from "lucide-react";
+import { useRouter } from "next/navigation";
+import { useEffect } from "react";
+import { RegisterForm } from "~/components/auth/RegisterForm";
+import { usePermissions } from "~/components/auth/permission/client";
+import { Button } from "@repo/ui";
+
+export default function RegisterClientPage({
+  isFirstUser = false,
+}: {
+  isFirstUser?: boolean;
+}) {
+  const router = useRouter();
+  const { isAuthenticated } = usePermissions();
+
+  useEffect(() => {
+    if (isAuthenticated) {
+      router.push("/");
+    }
+  }, [isAuthenticated, router]);
+
+  return (
+    <>
+      <RegisterForm isFirstUser={isFirstUser} />
+
+      <Button
+        className="fixed bottom-16 left-16 rounded-full"
+        variant="outlined"
+        onClick={() => router.push("/")}
+      >
+        <ArrowLeftIcon className="h-4 w-4" />
+        Back to home
+      </Button>
+    </>
+  );
+}

apps/web/src/app/admin/assets/page.tsx

@@ -14,6 +14,17 @@ import {
   SelectValue,
 } from "@repo/ui";
 
+/* TODO: A lot to be done here and for assets in general
+ * - Add pagination URGENT
+ * - Add search
+ * - Add filter by file type
+ * - Add filter by uploaded by
+ * - Add filter by page
+ * - Add filter by date
+ * - Implement preview for images
+ * - Implement download
+ */
+
 export default function AssetsAdminPage() {
   const notification = useNotification();
   const [searchTerm, setSearchTerm] = useState("");
@@ -69,7 +80,7 @@ export default function AssetsAdminPage() {
     : [];
 
   return (
-    <div className="container mx-auto px-6">
+    <div className="container mx-auto px-6 py-3">
       <h1 className="mb-6 text-3xl font-bold">Asset Management</h1>
 
       {/* Search and filter controls */}