added support for database

CLAUDE.md

@@ -130,8 +130,7 @@ interface Block {
 ```
 
 Key files:
-- `components/editor/SnapDocsEditor.tsx` - Main editor with drag-and-drop
-- `components/editor/blocks/` - Individual block implementations
+- `components/editor/BlockNoteEditor.tsx` - Main editor using BlockNote
 - `lib/services/page-content.ts` - MongoDB content service
 
 ### Real-Time Collaboration
@@ -175,11 +174,12 @@ Required in `.env.local`:
 
 ## Development Tips
 
-### Adding New Block Types
-1. Add type to `BlockType` union in `types/index.ts`
-2. Create block component in `components/editor/blocks/`
-3. Update `BlockV2.tsx` to handle rendering
-4. Add to slash menu in `SlashMenu.tsx`
+### Editor
+The application uses BlockNote as the main editor, which provides:
+- Rich text editing with slash commands
+- Built-in block types (headings, lists, tables, etc.)
+- File uploads and media embedding
+- Real-time collaboration support
 
 ### Database Operations
 ```typescript

app/(protected)/ClientLayout.tsx

@@ -1,11 +1,9 @@
 'use client'
 
-import { SocketProvider } from '@/lib/socket/client'
-
 export function ClientLayout({ children }: { children: React.ReactNode }) {
  return (
- <SocketProvider>
+ <>
  {children}
- </SocketProvider>
+ </>
  )
 }

app/(protected)/workspace/[workspaceId]/database/create/CreateDatabasePage.tsx

@@ -0,0 +1,69 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { CreateDatabaseDialog } from '@/components/database'
+import { Button } from '@/components/ui/button'
+import { ArrowLeft, Database } from 'lucide-react'
+import Link from 'next/link'
+import toast from 'react-hot-toast'
+
+interface CreateDatabasePageProps {
+ workspaceId: string
+ workspace: {
+ id: string
+ name: string
+ slug: string
+ }
+ user: {
+ id: string
+ email: string
+ name?: string | null
+ }
+}
+
+export default function CreateDatabasePage({ workspaceId, workspace, user }: CreateDatabasePageProps) {
+ const router = useRouter()
+ const [showDialog, setShowDialog] = useState(true)
+
+ const handleCreateDatabase = async (database: any) => {
+ toast.success('Database created successfully!')
+ router.push(`/workspace/${workspaceId}/database/${database.id}`)
+ }
+
+ const handleCancel = () => {
+ router.push(`/workspace/${workspaceId}`)
+ }
+
+ return (
+ <div className="min-h-screen bg-gray-50">
+ <div className="max-w-7xl mx-auto px-4 py-8">
+ <div className="mb-6">
+ <Link href={`/workspace/${workspaceId}`}>
+ <Button variant="ghost" size="sm" className="mb-4">
+ <ArrowLeft className="w-4 h-4 mr-2" />
+ Back to workspace
+ </Button>
+ </Link>
+
+ <div className="flex items-center gap-3">
+ <Database className="w-8 h-8 text-gray-600" />
+ <h1 className="text-3xl font-bold">Create New Database</h1>
+ </div>
+ <p className="text-gray-600 mt-2">
+ Create a structured database to organize and manage your data
+ </p>
+ </div>
+
+ <CreateDatabaseDialog
+ open={showDialog}
+ onOpenChange={(open) => {
+ if (!open) handleCancel()
+ }}
+ workspaceId={workspaceId}
+ onCreateDatabase={handleCreateDatabase}
+ />
+ </div>
+ </div>
+ )
+}

app/(protected)/workspace/[workspaceId]/database/create/page.tsx

@@ -0,0 +1,52 @@
+import React from 'react'
+import { redirect } from 'next/navigation'
+import { getCurrentUser } from '@/lib/auth'
+import { prisma } from '@/lib/db/prisma'
+import { generateId } from '@/lib/utils/id'
+import CreateDatabasePage from './CreateDatabasePage'
+
+interface CreateDatabasePageProps {
+ params: Promise<{
+ workspaceId: string
+ }>
+}
+
+export default async function CreateDatabase({ params }: CreateDatabasePageProps) {
+ const user = await getCurrentUser()
+ if (!user) {
+ redirect('/login')
+ }
+
+ const resolvedParams = await params
+
+ // Check if user is a member of the workspace
+ const workspaceMember = await prisma.workspaceMember.findUnique({
+ where: {
+ userId_workspaceId: {
+ userId: user.id,
+ workspaceId: resolvedParams.workspaceId
+ }
+ }
+ })
+
+ if (!workspaceMember) {
+ redirect(`/workspace/${resolvedParams.workspaceId}`)
+ }
+
+ const workspace = await prisma.workspace.findUnique({
+ where: { id: resolvedParams.workspaceId },
+ select: { id: true, name: true, slug: true }
+ })
+
+ if (!workspace) {
+ redirect('/')
+ }
+
+ return (
+ <CreateDatabasePage
+ workspaceId={resolvedParams.workspaceId}
+ workspace={workspace}
+ user={user}
+ />
+ )
+}

app/(protected)/workspace/[workspaceId]/page/[pageId]/PageEditorV2.tsx

@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic'
 import { SnapDocsPageHeader } from '@/components/page/snapdocs-page-header'
 import { cn } from '@/lib/utils'
 import toast from 'react-hot-toast'
-import { useSocket } from '@/lib/socket/client'
+// import { useSocket } from '@/lib/socket/client' // Removed - using Yjs collaboration now
 
 // Dynamically import BlockNoteEditor to avoid SSR hydration issues
 const BlockNoteEditor = dynamic(
@@ -65,7 +65,7 @@ interface PageEditorProps {
 
 export default function PageEditorV2({ page, initialContent, user }: PageEditorProps) {
  const router = useRouter()
- const { isConnected, joinPage, leavePage } = useSocket()
+// const { isConnected, joinPage, leavePage } = useSocket() // Removed - using Yjs collaboration now
  const [title, setTitle] = useState(page.title || '')
  const [icon, setIcon] = useState(page.icon || '')
  const [coverImage, setCoverImage] = useState(page.coverImage || '')
@@ -78,22 +78,8 @@ export default function PageEditorV2({ page, initialContent, user }: PageEditorP
 
  const initialBlocks = initialContent?.blocks || []
 
- // Join the page room for real-time collaboration
- useEffect(() => {
- if (isConnected && user) {
- joinPage(page.id, page.workspaceId, {
- id: user.id,
- name: user.name || 'Anonymous',
- email: user.email || '',
- avatarUrl: null
- })
- }
-
- // Clean up when leaving the page
- return () => {
- leavePage()
- }
- }, [isConnected, page.id, page.workspaceId, user, joinPage, leavePage])
+ // Yjs collaboration is now handled directly in BlockNoteEditor component
+ // No need for Socket.io room joining
 
 
  // Auto-resize title textarea

app/api/databases/[databaseId]/route.ts

@@ -133,6 +133,71 @@ export async function PUT(
  }
 }
 
+// PATCH /api/databases/[databaseId] - Partial update database
+export async function PATCH(
+ request: NextRequest,
+ { params }: { params: Promise<{ databaseId: string }> }
+) {
+ try {
+ const session = await getServerSession(authOptions)
+ if (!session?.user?.id) {
+ return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+ }
+
+ const resolvedParams = await params
+ const body = await request.json()
+
+ // Check database exists and user has access
+ const database = await prisma.database.findUnique({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ include: {
+ workspace: {
+ include: {
+ members: {
+ where: {
+ userId: session.user.id
+ }
+ }
+ }
+ }
+ }
+ })
+
+ if (!database) {
+ return NextResponse.json({ error: 'Database not found' }, { status: 404 })
+ }
+
+ if (!database.workspace.members.length) {
+ return NextResponse.json({ error: 'Access denied' }, { status: 403 })
+ }
+
+ const updatedDatabase = await prisma.database.update({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ data: body,
+ include: {
+ views: true,
+ rows: {
+ orderBy: {
+ order: 'asc'
+ }
+ }
+ }
+ })
+
+ return NextResponse.json(updatedDatabase)
+ } catch (error) {
+ console.error('Error updating database:', error)
+ return NextResponse.json(
+ { error: 'Internal server error' },
+ { status: 500 }
+ )
+ }
+}
+
 // DELETE /api/databases/[databaseId] - Delete database
 export async function DELETE(
  request: NextRequest,

app/globals.css

@@ -126,48 +126,6 @@
  @apply relative min-h-full;
 }
 
-/* BlockV2 System - Clean hover area and handle positioning */
-.block-wrapper {
- @apply relative;
-}
-
-/* Extend hover area to include the handle space */
-.block-wrapper::before {
- content: '';
- position: absolute;
- left: -3rem; /* Mobile: 48px for handles */
- right: 0;
- top: 0;
- bottom: 0;
- pointer-events: none;
- z-index: 1;
-}
-
-@media (min-width: 768px) {
- .block-wrapper::before {
- left: -4rem; /* Desktop: 64px for handles */
- }
-}
-
-/* Block content area - properly centered */
-.block-content {
- @apply relative;
- /* Ensure content doesn't shift when handles appear */
- margin-left: 0;
-}
-
-/* Handle positioning with negative margins - doesn't affect content flow */
-.block-wrapper .absolute.-left-12 {
- /* Mobile handle position */
- left: -3rem;
-}
-
-@media (min-width: 768px) {
- .block-wrapper .absolute.-left-16 {
- /* Desktop handle position */
- left: -4rem;
- }
-}
 
 /* Responsive typography */
 @layer utilities {

CLAUDE.md

@@ -130,8 +130,7 @@ interface Block {
 ```
 
 Key files:
-- `components/editor/SnapDocsEditor.tsx` - Main editor with drag-and-drop
-- `components/editor/blocks/` - Individual block implementations
+- `components/editor/BlockNoteEditor.tsx` - Main editor using BlockNote
 - `lib/services/page-content.ts` - MongoDB content service
 
 ### Real-Time Collaboration
@@ -175,11 +174,12 @@ Required in `.env.local`:
 
 ## Development Tips
 
-### Adding New Block Types
-1. Add type to `BlockType` union in `types/index.ts`
-2. Create block component in `components/editor/blocks/`
-3. Update `BlockV2.tsx` to handle rendering
-4. Add to slash menu in `SlashMenu.tsx`
+### Editor
+The application uses BlockNote as the main editor, which provides:
+- Rich text editing with slash commands
+- Built-in block types (headings, lists, tables, etc.)
+- File uploads and media embedding
+- Real-time collaboration support
 
 ### Database Operations
 ```typescript

app/(protected)/ClientLayout.tsx

@@ -1,11 +1,9 @@
 'use client'
 
-import { SocketProvider } from '@/lib/socket/client'
-
 export function ClientLayout({ children }: { children: React.ReactNode }) {
  return (
- <SocketProvider>
+ <>
  {children}
- </SocketProvider>
+ </>
  )
 }

app/(protected)/workspace/[workspaceId]/database/create/CreateDatabasePage.tsx

@@ -0,0 +1,69 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { CreateDatabaseDialog } from '@/components/database'
+import { Button } from '@/components/ui/button'
+import { ArrowLeft, Database } from 'lucide-react'
+import Link from 'next/link'
+import toast from 'react-hot-toast'
+
+interface CreateDatabasePageProps {
+ workspaceId: string
+ workspace: {
+ id: string
+ name: string
+ slug: string
+ }
+ user: {
+ id: string
+ email: string
+ name?: string | null
+ }
+}
+
+export default function CreateDatabasePage({ workspaceId, workspace, user }: CreateDatabasePageProps) {
+ const router = useRouter()
+ const [showDialog, setShowDialog] = useState(true)
+
+ const handleCreateDatabase = async (database: any) => {
+ toast.success('Database created successfully!')
+ router.push(`/workspace/${workspaceId}/database/${database.id}`)
+ }
+
+ const handleCancel = () => {
+ router.push(`/workspace/${workspaceId}`)
+ }
+
+ return (
+ <div className="min-h-screen bg-gray-50">
+ <div className="max-w-7xl mx-auto px-4 py-8">
+ <div className="mb-6">
+ <Link href={`/workspace/${workspaceId}`}>
+ <Button variant="ghost" size="sm" className="mb-4">
+ <ArrowLeft className="w-4 h-4 mr-2" />
+ Back to workspace
+ </Button>
+ </Link>
+
+ <div className="flex items-center gap-3">
+ <Database className="w-8 h-8 text-gray-600" />
+ <h1 className="text-3xl font-bold">Create New Database</h1>
+ </div>
+ <p className="text-gray-600 mt-2">
+ Create a structured database to organize and manage your data
+ </p>
+ </div>
+
+ <CreateDatabaseDialog
+ open={showDialog}
+ onOpenChange={(open) => {
+ if (!open) handleCancel()
+ }}
+ workspaceId={workspaceId}
+ onCreateDatabase={handleCreateDatabase}
+ />
+ </div>
+ </div>
+ )
+}

app/(protected)/workspace/[workspaceId]/database/create/page.tsx

@@ -0,0 +1,52 @@
+import React from 'react'
+import { redirect } from 'next/navigation'
+import { getCurrentUser } from '@/lib/auth'
+import { prisma } from '@/lib/db/prisma'
+import { generateId } from '@/lib/utils/id'
+import CreateDatabasePage from './CreateDatabasePage'
+
+interface CreateDatabasePageProps {
+ params: Promise<{
+ workspaceId: string
+ }>
+}
+
+export default async function CreateDatabase({ params }: CreateDatabasePageProps) {
+ const user = await getCurrentUser()
+ if (!user) {
+ redirect('/login')
+ }
+
+ const resolvedParams = await params
+
+ // Check if user is a member of the workspace
+ const workspaceMember = await prisma.workspaceMember.findUnique({
+ where: {
+ userId_workspaceId: {
+ userId: user.id,
+ workspaceId: resolvedParams.workspaceId
+ }
+ }
+ })
+
+ if (!workspaceMember) {
+ redirect(`/workspace/${resolvedParams.workspaceId}`)
+ }
+
+ const workspace = await prisma.workspace.findUnique({
+ where: { id: resolvedParams.workspaceId },
+ select: { id: true, name: true, slug: true }
+ })
+
+ if (!workspace) {
+ redirect('/')
+ }
+
+ return (
+ <CreateDatabasePage
+ workspaceId={resolvedParams.workspaceId}
+ workspace={workspace}
+ user={user}
+ />
+ )
+}

app/(protected)/workspace/[workspaceId]/page/[pageId]/PageEditorV2.tsx

@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic'
 import { SnapDocsPageHeader } from '@/components/page/snapdocs-page-header'
 import { cn } from '@/lib/utils'
 import toast from 'react-hot-toast'
-import { useSocket } from '@/lib/socket/client'
+// import { useSocket } from '@/lib/socket/client' // Removed - using Yjs collaboration now
 
 // Dynamically import BlockNoteEditor to avoid SSR hydration issues
 const BlockNoteEditor = dynamic(
@@ -65,7 +65,7 @@ interface PageEditorProps {
 
 export default function PageEditorV2({ page, initialContent, user }: PageEditorProps) {
  const router = useRouter()
- const { isConnected, joinPage, leavePage } = useSocket()
+// const { isConnected, joinPage, leavePage } = useSocket() // Removed - using Yjs collaboration now
  const [title, setTitle] = useState(page.title || '')
  const [icon, setIcon] = useState(page.icon || '')
  const [coverImage, setCoverImage] = useState(page.coverImage || '')
@@ -78,22 +78,8 @@ export default function PageEditorV2({ page, initialContent, user }: PageEditorP
 
  const initialBlocks = initialContent?.blocks || []
 
- // Join the page room for real-time collaboration
- useEffect(() => {
- if (isConnected && user) {
- joinPage(page.id, page.workspaceId, {
- id: user.id,
- name: user.name || 'Anonymous',
- email: user.email || '',
- avatarUrl: null
- })
- }
-
- // Clean up when leaving the page
- return () => {
- leavePage()
- }
- }, [isConnected, page.id, page.workspaceId, user, joinPage, leavePage])
+ // Yjs collaboration is now handled directly in BlockNoteEditor component
+ // No need for Socket.io room joining
 
 
  // Auto-resize title textarea

app/api/databases/[databaseId]/route.ts

@@ -133,6 +133,71 @@ export async function PUT(
  }
 }
 
+// PATCH /api/databases/[databaseId] - Partial update database
+export async function PATCH(
+ request: NextRequest,
+ { params }: { params: Promise<{ databaseId: string }> }
+) {
+ try {
+ const session = await getServerSession(authOptions)
+ if (!session?.user?.id) {
+ return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+ }
+
+ const resolvedParams = await params
+ const body = await request.json()
+
+ // Check database exists and user has access
+ const database = await prisma.database.findUnique({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ include: {
+ workspace: {
+ include: {
+ members: {
+ where: {
+ userId: session.user.id
+ }
+ }
+ }
+ }
+ }
+ })
+
+ if (!database) {
+ return NextResponse.json({ error: 'Database not found' }, { status: 404 })
+ }
+
+ if (!database.workspace.members.length) {
+ return NextResponse.json({ error: 'Access denied' }, { status: 403 })
+ }
+
+ const updatedDatabase = await prisma.database.update({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ data: body,
+ include: {
+ views: true,
+ rows: {
+ orderBy: {
+ order: 'asc'
+ }
+ }
+ }
+ })
+
+ return NextResponse.json(updatedDatabase)
+ } catch (error) {
+ console.error('Error updating database:', error)
+ return NextResponse.json(
+ { error: 'Internal server error' },
+ { status: 500 }
+ )
+ }
+}
+
 // DELETE /api/databases/[databaseId] - Delete database
 export async function DELETE(
  request: NextRequest,

app/globals.css

@@ -126,48 +126,6 @@
  @apply relative min-h-full;
 }
 
-/* BlockV2 System - Clean hover area and handle positioning */
-.block-wrapper {
- @apply relative;
-}
-
-/* Extend hover area to include the handle space */
-.block-wrapper::before {
- content: '';
- position: absolute;
- left: -3rem; /* Mobile: 48px for handles */
- right: 0;
- top: 0;
- bottom: 0;
- pointer-events: none;
- z-index: 1;
-}
-
-@media (min-width: 768px) {
- .block-wrapper::before {
- left: -4rem; /* Desktop: 64px for handles */
- }
-}
-
-/* Block content area - properly centered */
-.block-content {
- @apply relative;
- /* Ensure content doesn't shift when handles appear */
- margin-left: 0;
-}
-
-/* Handle positioning with negative margins - doesn't affect content flow */
-.block-wrapper .absolute.-left-12 {
- /* Mobile handle position */
- left: -3rem;
-}
-
-@media (min-width: 768px) {
- .block-wrapper .absolute.-left-16 {
- /* Desktop handle position */
- left: -4rem;
- }
-}
 
 /* Responsive typography */
 @layer utilities {

CLAUDE.md

@@ -130,8 +130,7 @@ interface Block {
 ```
 
 Key files:
-- `components/editor/SnapDocsEditor.tsx` - Main editor with drag-and-drop
-- `components/editor/blocks/` - Individual block implementations
+- `components/editor/BlockNoteEditor.tsx` - Main editor using BlockNote
 - `lib/services/page-content.ts` - MongoDB content service
 
 ### Real-Time Collaboration
@@ -175,11 +174,12 @@ Required in `.env.local`:
 
 ## Development Tips
 
-### Adding New Block Types
-1. Add type to `BlockType` union in `types/index.ts`
-2. Create block component in `components/editor/blocks/`
-3. Update `BlockV2.tsx` to handle rendering
-4. Add to slash menu in `SlashMenu.tsx`
+### Editor
+The application uses BlockNote as the main editor, which provides:
+- Rich text editing with slash commands
+- Built-in block types (headings, lists, tables, etc.)
+- File uploads and media embedding
+- Real-time collaboration support
 
 ### Database Operations
 ```typescript

app/(protected)/ClientLayout.tsx

@@ -1,11 +1,9 @@
 'use client'
 
-import { SocketProvider } from '@/lib/socket/client'
-
 export function ClientLayout({ children }: { children: React.ReactNode }) {
  return (
- <SocketProvider>
+ <>
  {children}
- </SocketProvider>
+ </>
  )
 }

app/(protected)/workspace/[workspaceId]/database/create/CreateDatabasePage.tsx

@@ -0,0 +1,69 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { CreateDatabaseDialog } from '@/components/database'
+import { Button } from '@/components/ui/button'
+import { ArrowLeft, Database } from 'lucide-react'
+import Link from 'next/link'
+import toast from 'react-hot-toast'
+
+interface CreateDatabasePageProps {
+ workspaceId: string
+ workspace: {
+ id: string
+ name: string
+ slug: string
+ }
+ user: {
+ id: string
+ email: string
+ name?: string | null
+ }
+}
+
+export default function CreateDatabasePage({ workspaceId, workspace, user }: CreateDatabasePageProps) {
+ const router = useRouter()
+ const [showDialog, setShowDialog] = useState(true)
+
+ const handleCreateDatabase = async (database: any) => {
+ toast.success('Database created successfully!')
+ router.push(`/workspace/${workspaceId}/database/${database.id}`)
+ }
+
+ const handleCancel = () => {
+ router.push(`/workspace/${workspaceId}`)
+ }
+
+ return (
+ <div className="min-h-screen bg-gray-50">
+ <div className="max-w-7xl mx-auto px-4 py-8">
+ <div className="mb-6">
+ <Link href={`/workspace/${workspaceId}`}>
+ <Button variant="ghost" size="sm" className="mb-4">
+ <ArrowLeft className="w-4 h-4 mr-2" />
+ Back to workspace
+ </Button>
+ </Link>
+
+ <div className="flex items-center gap-3">
+ <Database className="w-8 h-8 text-gray-600" />
+ <h1 className="text-3xl font-bold">Create New Database</h1>
+ </div>
+ <p className="text-gray-600 mt-2">
+ Create a structured database to organize and manage your data
+ </p>
+ </div>
+
+ <CreateDatabaseDialog
+ open={showDialog}
+ onOpenChange={(open) => {
+ if (!open) handleCancel()
+ }}
+ workspaceId={workspaceId}
+ onCreateDatabase={handleCreateDatabase}
+ />
+ </div>
+ </div>
+ )
+}

app/(protected)/workspace/[workspaceId]/database/create/page.tsx

@@ -0,0 +1,52 @@
+import React from 'react'
+import { redirect } from 'next/navigation'
+import { getCurrentUser } from '@/lib/auth'
+import { prisma } from '@/lib/db/prisma'
+import { generateId } from '@/lib/utils/id'
+import CreateDatabasePage from './CreateDatabasePage'
+
+interface CreateDatabasePageProps {
+ params: Promise<{
+ workspaceId: string
+ }>
+}
+
+export default async function CreateDatabase({ params }: CreateDatabasePageProps) {
+ const user = await getCurrentUser()
+ if (!user) {
+ redirect('/login')
+ }
+
+ const resolvedParams = await params
+
+ // Check if user is a member of the workspace
+ const workspaceMember = await prisma.workspaceMember.findUnique({
+ where: {
+ userId_workspaceId: {
+ userId: user.id,
+ workspaceId: resolvedParams.workspaceId
+ }
+ }
+ })
+
+ if (!workspaceMember) {
+ redirect(`/workspace/${resolvedParams.workspaceId}`)
+ }
+
+ const workspace = await prisma.workspace.findUnique({
+ where: { id: resolvedParams.workspaceId },
+ select: { id: true, name: true, slug: true }
+ })
+
+ if (!workspace) {
+ redirect('/')
+ }
+
+ return (
+ <CreateDatabasePage
+ workspaceId={resolvedParams.workspaceId}
+ workspace={workspace}
+ user={user}
+ />
+ )
+}

app/(protected)/workspace/[workspaceId]/page/[pageId]/PageEditorV2.tsx

@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic'
 import { SnapDocsPageHeader } from '@/components/page/snapdocs-page-header'
 import { cn } from '@/lib/utils'
 import toast from 'react-hot-toast'
-import { useSocket } from '@/lib/socket/client'
+// import { useSocket } from '@/lib/socket/client' // Removed - using Yjs collaboration now
 
 // Dynamically import BlockNoteEditor to avoid SSR hydration issues
 const BlockNoteEditor = dynamic(
@@ -65,7 +65,7 @@ interface PageEditorProps {
 
 export default function PageEditorV2({ page, initialContent, user }: PageEditorProps) {
  const router = useRouter()
- const { isConnected, joinPage, leavePage } = useSocket()
+// const { isConnected, joinPage, leavePage } = useSocket() // Removed - using Yjs collaboration now
  const [title, setTitle] = useState(page.title || '')
  const [icon, setIcon] = useState(page.icon || '')
  const [coverImage, setCoverImage] = useState(page.coverImage || '')
@@ -78,22 +78,8 @@ export default function PageEditorV2({ page, initialContent, user }: PageEditorP
 
  const initialBlocks = initialContent?.blocks || []
 
- // Join the page room for real-time collaboration
- useEffect(() => {
- if (isConnected && user) {
- joinPage(page.id, page.workspaceId, {
- id: user.id,
- name: user.name || 'Anonymous',
- email: user.email || '',
- avatarUrl: null
- })
- }
-
- // Clean up when leaving the page
- return () => {
- leavePage()
- }
- }, [isConnected, page.id, page.workspaceId, user, joinPage, leavePage])
+ // Yjs collaboration is now handled directly in BlockNoteEditor component
+ // No need for Socket.io room joining
 
 
  // Auto-resize title textarea

app/api/databases/[databaseId]/route.ts

@@ -133,6 +133,71 @@ export async function PUT(
  }
 }
 
+// PATCH /api/databases/[databaseId] - Partial update database
+export async function PATCH(
+ request: NextRequest,
+ { params }: { params: Promise<{ databaseId: string }> }
+) {
+ try {
+ const session = await getServerSession(authOptions)
+ if (!session?.user?.id) {
+ return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+ }
+
+ const resolvedParams = await params
+ const body = await request.json()
+
+ // Check database exists and user has access
+ const database = await prisma.database.findUnique({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ include: {
+ workspace: {
+ include: {
+ members: {
+ where: {
+ userId: session.user.id
+ }
+ }
+ }
+ }
+ }
+ })
+
+ if (!database) {
+ return NextResponse.json({ error: 'Database not found' }, { status: 404 })
+ }
+
+ if (!database.workspace.members.length) {
+ return NextResponse.json({ error: 'Access denied' }, { status: 403 })
+ }
+
+ const updatedDatabase = await prisma.database.update({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ data: body,
+ include: {
+ views: true,
+ rows: {
+ orderBy: {
+ order: 'asc'
+ }
+ }
+ }
+ })
+
+ return NextResponse.json(updatedDatabase)
+ } catch (error) {
+ console.error('Error updating database:', error)
+ return NextResponse.json(
+ { error: 'Internal server error' },
+ { status: 500 }
+ )
+ }
+}
+
 // DELETE /api/databases/[databaseId] - Delete database
 export async function DELETE(
  request: NextRequest,

app/globals.css

@@ -126,48 +126,6 @@
  @apply relative min-h-full;
 }
 
-/* BlockV2 System - Clean hover area and handle positioning */
-.block-wrapper {
- @apply relative;
-}
-
-/* Extend hover area to include the handle space */
-.block-wrapper::before {
- content: '';
- position: absolute;
- left: -3rem; /* Mobile: 48px for handles */
- right: 0;
- top: 0;
- bottom: 0;
- pointer-events: none;
- z-index: 1;
-}
-
-@media (min-width: 768px) {
- .block-wrapper::before {
- left: -4rem; /* Desktop: 64px for handles */
- }
-}
-
-/* Block content area - properly centered */
-.block-content {
- @apply relative;
- /* Ensure content doesn't shift when handles appear */
- margin-left: 0;
-}
-
-/* Handle positioning with negative margins - doesn't affect content flow */
-.block-wrapper .absolute.-left-12 {
- /* Mobile handle position */
- left: -3rem;
-}
-
-@media (min-width: 768px) {
- .block-wrapper .absolute.-left-16 {
- /* Desktop handle position */
- left: -4rem;
- }
-}
 
 /* Responsive typography */
 @layer utilities {

CLAUDE.md

@@ -130,8 +130,7 @@ interface Block {
 ```
 
 Key files:
-- `components/editor/SnapDocsEditor.tsx` - Main editor with drag-and-drop
-- `components/editor/blocks/` - Individual block implementations
+- `components/editor/BlockNoteEditor.tsx` - Main editor using BlockNote
 - `lib/services/page-content.ts` - MongoDB content service
 
 ### Real-Time Collaboration
@@ -175,11 +174,12 @@ Required in `.env.local`:
 
 ## Development Tips
 
-### Adding New Block Types
-1. Add type to `BlockType` union in `types/index.ts`
-2. Create block component in `components/editor/blocks/`
-3. Update `BlockV2.tsx` to handle rendering
-4. Add to slash menu in `SlashMenu.tsx`
+### Editor
+The application uses BlockNote as the main editor, which provides:
+- Rich text editing with slash commands
+- Built-in block types (headings, lists, tables, etc.)
+- File uploads and media embedding
+- Real-time collaboration support
 
 ### Database Operations
 ```typescript

app/(protected)/ClientLayout.tsx

@@ -1,11 +1,9 @@
 'use client'
 
-import { SocketProvider } from '@/lib/socket/client'
-
 export function ClientLayout({ children }: { children: React.ReactNode }) {
  return (
- <SocketProvider>
+ <>
  {children}
- </SocketProvider>
+ </>
  )
 }

app/(protected)/workspace/[workspaceId]/database/create/CreateDatabasePage.tsx

@@ -0,0 +1,69 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { CreateDatabaseDialog } from '@/components/database'
+import { Button } from '@/components/ui/button'
+import { ArrowLeft, Database } from 'lucide-react'
+import Link from 'next/link'
+import toast from 'react-hot-toast'
+
+interface CreateDatabasePageProps {
+ workspaceId: string
+ workspace: {
+ id: string
+ name: string
+ slug: string
+ }
+ user: {
+ id: string
+ email: string
+ name?: string | null
+ }
+}
+
+export default function CreateDatabasePage({ workspaceId, workspace, user }: CreateDatabasePageProps) {
+ const router = useRouter()
+ const [showDialog, setShowDialog] = useState(true)
+
+ const handleCreateDatabase = async (database: any) => {
+ toast.success('Database created successfully!')
+ router.push(`/workspace/${workspaceId}/database/${database.id}`)
+ }
+
+ const handleCancel = () => {
+ router.push(`/workspace/${workspaceId}`)
+ }
+
+ return (
+ <div className="min-h-screen bg-gray-50">
+ <div className="max-w-7xl mx-auto px-4 py-8">
+ <div className="mb-6">
+ <Link href={`/workspace/${workspaceId}`}>
+ <Button variant="ghost" size="sm" className="mb-4">
+ <ArrowLeft className="w-4 h-4 mr-2" />
+ Back to workspace
+ </Button>
+ </Link>
+
+ <div className="flex items-center gap-3">
+ <Database className="w-8 h-8 text-gray-600" />
+ <h1 className="text-3xl font-bold">Create New Database</h1>
+ </div>
+ <p className="text-gray-600 mt-2">
+ Create a structured database to organize and manage your data
+ </p>
+ </div>
+
+ <CreateDatabaseDialog
+ open={showDialog}
+ onOpenChange={(open) => {
+ if (!open) handleCancel()
+ }}
+ workspaceId={workspaceId}
+ onCreateDatabase={handleCreateDatabase}
+ />
+ </div>
+ </div>
+ )
+}

app/(protected)/workspace/[workspaceId]/database/create/page.tsx

@@ -0,0 +1,52 @@
+import React from 'react'
+import { redirect } from 'next/navigation'
+import { getCurrentUser } from '@/lib/auth'
+import { prisma } from '@/lib/db/prisma'
+import { generateId } from '@/lib/utils/id'
+import CreateDatabasePage from './CreateDatabasePage'
+
+interface CreateDatabasePageProps {
+ params: Promise<{
+ workspaceId: string
+ }>
+}
+
+export default async function CreateDatabase({ params }: CreateDatabasePageProps) {
+ const user = await getCurrentUser()
+ if (!user) {
+ redirect('/login')
+ }
+
+ const resolvedParams = await params
+
+ // Check if user is a member of the workspace
+ const workspaceMember = await prisma.workspaceMember.findUnique({
+ where: {
+ userId_workspaceId: {
+ userId: user.id,
+ workspaceId: resolvedParams.workspaceId
+ }
+ }
+ })
+
+ if (!workspaceMember) {
+ redirect(`/workspace/${resolvedParams.workspaceId}`)
+ }
+
+ const workspace = await prisma.workspace.findUnique({
+ where: { id: resolvedParams.workspaceId },
+ select: { id: true, name: true, slug: true }
+ })
+
+ if (!workspace) {
+ redirect('/')
+ }
+
+ return (
+ <CreateDatabasePage
+ workspaceId={resolvedParams.workspaceId}
+ workspace={workspace}
+ user={user}
+ />
+ )
+}

app/(protected)/workspace/[workspaceId]/page/[pageId]/PageEditorV2.tsx

@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic'
 import { SnapDocsPageHeader } from '@/components/page/snapdocs-page-header'
 import { cn } from '@/lib/utils'
 import toast from 'react-hot-toast'
-import { useSocket } from '@/lib/socket/client'
+// import { useSocket } from '@/lib/socket/client' // Removed - using Yjs collaboration now
 
 // Dynamically import BlockNoteEditor to avoid SSR hydration issues
 const BlockNoteEditor = dynamic(
@@ -65,7 +65,7 @@ interface PageEditorProps {
 
 export default function PageEditorV2({ page, initialContent, user }: PageEditorProps) {
  const router = useRouter()
- const { isConnected, joinPage, leavePage } = useSocket()
+// const { isConnected, joinPage, leavePage } = useSocket() // Removed - using Yjs collaboration now
  const [title, setTitle] = useState(page.title || '')
  const [icon, setIcon] = useState(page.icon || '')
  const [coverImage, setCoverImage] = useState(page.coverImage || '')
@@ -78,22 +78,8 @@ export default function PageEditorV2({ page, initialContent, user }: PageEditorP
 
  const initialBlocks = initialContent?.blocks || []
 
- // Join the page room for real-time collaboration
- useEffect(() => {
- if (isConnected && user) {
- joinPage(page.id, page.workspaceId, {
- id: user.id,
- name: user.name || 'Anonymous',
- email: user.email || '',
- avatarUrl: null
- })
- }
-
- // Clean up when leaving the page
- return () => {
- leavePage()
- }
- }, [isConnected, page.id, page.workspaceId, user, joinPage, leavePage])
+ // Yjs collaboration is now handled directly in BlockNoteEditor component
+ // No need for Socket.io room joining
 
 
  // Auto-resize title textarea

app/api/databases/[databaseId]/route.ts

@@ -133,6 +133,71 @@ export async function PUT(
  }
 }
 
+// PATCH /api/databases/[databaseId] - Partial update database
+export async function PATCH(
+ request: NextRequest,
+ { params }: { params: Promise<{ databaseId: string }> }
+) {
+ try {
+ const session = await getServerSession(authOptions)
+ if (!session?.user?.id) {
+ return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+ }
+
+ const resolvedParams = await params
+ const body = await request.json()
+
+ // Check database exists and user has access
+ const database = await prisma.database.findUnique({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ include: {
+ workspace: {
+ include: {
+ members: {
+ where: {
+ userId: session.user.id
+ }
+ }
+ }
+ }
+ }
+ })
+
+ if (!database) {
+ return NextResponse.json({ error: 'Database not found' }, { status: 404 })
+ }
+
+ if (!database.workspace.members.length) {
+ return NextResponse.json({ error: 'Access denied' }, { status: 403 })
+ }
+
+ const updatedDatabase = await prisma.database.update({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ data: body,
+ include: {
+ views: true,
+ rows: {
+ orderBy: {
+ order: 'asc'
+ }
+ }
+ }
+ })
+
+ return NextResponse.json(updatedDatabase)
+ } catch (error) {
+ console.error('Error updating database:', error)
+ return NextResponse.json(
+ { error: 'Internal server error' },
+ { status: 500 }
+ )
+ }
+}
+
 // DELETE /api/databases/[databaseId] - Delete database
 export async function DELETE(
  request: NextRequest,

app/globals.css

@@ -126,48 +126,6 @@
  @apply relative min-h-full;
 }
 
-/* BlockV2 System - Clean hover area and handle positioning */
-.block-wrapper {
- @apply relative;
-}
-
-/* Extend hover area to include the handle space */
-.block-wrapper::before {
- content: '';
- position: absolute;
- left: -3rem; /* Mobile: 48px for handles */
- right: 0;
- top: 0;
- bottom: 0;
- pointer-events: none;
- z-index: 1;
-}
-
-@media (min-width: 768px) {
- .block-wrapper::before {
- left: -4rem; /* Desktop: 64px for handles */
- }
-}
-
-/* Block content area - properly centered */
-.block-content {
- @apply relative;
- /* Ensure content doesn't shift when handles appear */
- margin-left: 0;
-}
-
-/* Handle positioning with negative margins - doesn't affect content flow */
-.block-wrapper .absolute.-left-12 {
- /* Mobile handle position */
- left: -3rem;
-}
-
-@media (min-width: 768px) {
- .block-wrapper .absolute.-left-16 {
- /* Desktop handle position */
- left: -4rem;
- }
-}
 
 /* Responsive typography */
 @layer utilities {

CLAUDE.md

@@ -130,8 +130,7 @@ interface Block {
 ```
 
 Key files:
-- `components/editor/SnapDocsEditor.tsx` - Main editor with drag-and-drop
-- `components/editor/blocks/` - Individual block implementations
+- `components/editor/BlockNoteEditor.tsx` - Main editor using BlockNote
 - `lib/services/page-content.ts` - MongoDB content service
 
 ### Real-Time Collaboration
@@ -175,11 +174,12 @@ Required in `.env.local`:
 
 ## Development Tips
 
-### Adding New Block Types
-1. Add type to `BlockType` union in `types/index.ts`
-2. Create block component in `components/editor/blocks/`
-3. Update `BlockV2.tsx` to handle rendering
-4. Add to slash menu in `SlashMenu.tsx`
+### Editor
+The application uses BlockNote as the main editor, which provides:
+- Rich text editing with slash commands
+- Built-in block types (headings, lists, tables, etc.)
+- File uploads and media embedding
+- Real-time collaboration support
 
 ### Database Operations
 ```typescript

app/(protected)/ClientLayout.tsx

@@ -1,11 +1,9 @@
 'use client'
 
-import { SocketProvider } from '@/lib/socket/client'
-
 export function ClientLayout({ children }: { children: React.ReactNode }) {
  return (
- <SocketProvider>
+ <>
  {children}
- </SocketProvider>
+ </>
  )
 }

app/(protected)/workspace/[workspaceId]/database/create/CreateDatabasePage.tsx

@@ -0,0 +1,69 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { CreateDatabaseDialog } from '@/components/database'
+import { Button } from '@/components/ui/button'
+import { ArrowLeft, Database } from 'lucide-react'
+import Link from 'next/link'
+import toast from 'react-hot-toast'
+
+interface CreateDatabasePageProps {
+ workspaceId: string
+ workspace: {
+ id: string
+ name: string
+ slug: string
+ }
+ user: {
+ id: string
+ email: string
+ name?: string | null
+ }
+}
+
+export default function CreateDatabasePage({ workspaceId, workspace, user }: CreateDatabasePageProps) {
+ const router = useRouter()
+ const [showDialog, setShowDialog] = useState(true)
+
+ const handleCreateDatabase = async (database: any) => {
+ toast.success('Database created successfully!')
+ router.push(`/workspace/${workspaceId}/database/${database.id}`)
+ }
+
+ const handleCancel = () => {
+ router.push(`/workspace/${workspaceId}`)
+ }
+
+ return (
+ <div className="min-h-screen bg-gray-50">
+ <div className="max-w-7xl mx-auto px-4 py-8">
+ <div className="mb-6">
+ <Link href={`/workspace/${workspaceId}`}>
+ <Button variant="ghost" size="sm" className="mb-4">
+ <ArrowLeft className="w-4 h-4 mr-2" />
+ Back to workspace
+ </Button>
+ </Link>
+
+ <div className="flex items-center gap-3">
+ <Database className="w-8 h-8 text-gray-600" />
+ <h1 className="text-3xl font-bold">Create New Database</h1>
+ </div>
+ <p className="text-gray-600 mt-2">
+ Create a structured database to organize and manage your data
+ </p>
+ </div>
+
+ <CreateDatabaseDialog
+ open={showDialog}
+ onOpenChange={(open) => {
+ if (!open) handleCancel()
+ }}
+ workspaceId={workspaceId}
+ onCreateDatabase={handleCreateDatabase}
+ />
+ </div>
+ </div>
+ )
+}

app/(protected)/workspace/[workspaceId]/database/create/page.tsx

@@ -0,0 +1,52 @@
+import React from 'react'
+import { redirect } from 'next/navigation'
+import { getCurrentUser } from '@/lib/auth'
+import { prisma } from '@/lib/db/prisma'
+import { generateId } from '@/lib/utils/id'
+import CreateDatabasePage from './CreateDatabasePage'
+
+interface CreateDatabasePageProps {
+ params: Promise<{
+ workspaceId: string
+ }>
+}
+
+export default async function CreateDatabase({ params }: CreateDatabasePageProps) {
+ const user = await getCurrentUser()
+ if (!user) {
+ redirect('/login')
+ }
+
+ const resolvedParams = await params
+
+ // Check if user is a member of the workspace
+ const workspaceMember = await prisma.workspaceMember.findUnique({
+ where: {
+ userId_workspaceId: {
+ userId: user.id,
+ workspaceId: resolvedParams.workspaceId
+ }
+ }
+ })
+
+ if (!workspaceMember) {
+ redirect(`/workspace/${resolvedParams.workspaceId}`)
+ }
+
+ const workspace = await prisma.workspace.findUnique({
+ where: { id: resolvedParams.workspaceId },
+ select: { id: true, name: true, slug: true }
+ })
+
+ if (!workspace) {
+ redirect('/')
+ }
+
+ return (
+ <CreateDatabasePage
+ workspaceId={resolvedParams.workspaceId}
+ workspace={workspace}
+ user={user}
+ />
+ )
+}

app/(protected)/workspace/[workspaceId]/page/[pageId]/PageEditorV2.tsx

@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic'
 import { SnapDocsPageHeader } from '@/components/page/snapdocs-page-header'
 import { cn } from '@/lib/utils'
 import toast from 'react-hot-toast'
-import { useSocket } from '@/lib/socket/client'
+// import { useSocket } from '@/lib/socket/client' // Removed - using Yjs collaboration now
 
 // Dynamically import BlockNoteEditor to avoid SSR hydration issues
 const BlockNoteEditor = dynamic(
@@ -65,7 +65,7 @@ interface PageEditorProps {
 
 export default function PageEditorV2({ page, initialContent, user }: PageEditorProps) {
  const router = useRouter()
- const { isConnected, joinPage, leavePage } = useSocket()
+// const { isConnected, joinPage, leavePage } = useSocket() // Removed - using Yjs collaboration now
  const [title, setTitle] = useState(page.title || '')
  const [icon, setIcon] = useState(page.icon || '')
  const [coverImage, setCoverImage] = useState(page.coverImage || '')
@@ -78,22 +78,8 @@ export default function PageEditorV2({ page, initialContent, user }: PageEditorP
 
  const initialBlocks = initialContent?.blocks || []
 
- // Join the page room for real-time collaboration
- useEffect(() => {
- if (isConnected && user) {
- joinPage(page.id, page.workspaceId, {
- id: user.id,
- name: user.name || 'Anonymous',
- email: user.email || '',
- avatarUrl: null
- })
- }
-
- // Clean up when leaving the page
- return () => {
- leavePage()
- }
- }, [isConnected, page.id, page.workspaceId, user, joinPage, leavePage])
+ // Yjs collaboration is now handled directly in BlockNoteEditor component
+ // No need for Socket.io room joining
 
 
  // Auto-resize title textarea

app/api/databases/[databaseId]/route.ts

@@ -133,6 +133,71 @@ export async function PUT(
  }
 }
 
+// PATCH /api/databases/[databaseId] - Partial update database
+export async function PATCH(
+ request: NextRequest,
+ { params }: { params: Promise<{ databaseId: string }> }
+) {
+ try {
+ const session = await getServerSession(authOptions)
+ if (!session?.user?.id) {
+ return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+ }
+
+ const resolvedParams = await params
+ const body = await request.json()
+
+ // Check database exists and user has access
+ const database = await prisma.database.findUnique({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ include: {
+ workspace: {
+ include: {
+ members: {
+ where: {
+ userId: session.user.id
+ }
+ }
+ }
+ }
+ }
+ })
+
+ if (!database) {
+ return NextResponse.json({ error: 'Database not found' }, { status: 404 })
+ }
+
+ if (!database.workspace.members.length) {
+ return NextResponse.json({ error: 'Access denied' }, { status: 403 })
+ }
+
+ const updatedDatabase = await prisma.database.update({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ data: body,
+ include: {
+ views: true,
+ rows: {
+ orderBy: {
+ order: 'asc'
+ }
+ }
+ }
+ })
+
+ return NextResponse.json(updatedDatabase)
+ } catch (error) {
+ console.error('Error updating database:', error)
+ return NextResponse.json(
+ { error: 'Internal server error' },
+ { status: 500 }
+ )
+ }
+}
+
 // DELETE /api/databases/[databaseId] - Delete database
 export async function DELETE(
  request: NextRequest,

app/globals.css

@@ -126,48 +126,6 @@
  @apply relative min-h-full;
 }
 
-/* BlockV2 System - Clean hover area and handle positioning */
-.block-wrapper {
- @apply relative;
-}
-
-/* Extend hover area to include the handle space */
-.block-wrapper::before {
- content: '';
- position: absolute;
- left: -3rem; /* Mobile: 48px for handles */
- right: 0;
- top: 0;
- bottom: 0;
- pointer-events: none;
- z-index: 1;
-}
-
-@media (min-width: 768px) {
- .block-wrapper::before {
- left: -4rem; /* Desktop: 64px for handles */
- }
-}
-
-/* Block content area - properly centered */
-.block-content {
- @apply relative;
- /* Ensure content doesn't shift when handles appear */
- margin-left: 0;
-}
-
-/* Handle positioning with negative margins - doesn't affect content flow */
-.block-wrapper .absolute.-left-12 {
- /* Mobile handle position */
- left: -3rem;
-}
-
-@media (min-width: 768px) {
- .block-wrapper .absolute.-left-16 {
- /* Desktop handle position */
- left: -4rem;
- }
-}
 
 /* Responsive typography */
 @layer utilities {

CLAUDE.md

@@ -130,8 +130,7 @@ interface Block {
 ```
 
 Key files:
-- `components/editor/SnapDocsEditor.tsx` - Main editor with drag-and-drop
-- `components/editor/blocks/` - Individual block implementations
+- `components/editor/BlockNoteEditor.tsx` - Main editor using BlockNote
 - `lib/services/page-content.ts` - MongoDB content service
 
 ### Real-Time Collaboration
@@ -175,11 +174,12 @@ Required in `.env.local`:
 
 ## Development Tips
 
-### Adding New Block Types
-1. Add type to `BlockType` union in `types/index.ts`
-2. Create block component in `components/editor/blocks/`
-3. Update `BlockV2.tsx` to handle rendering
-4. Add to slash menu in `SlashMenu.tsx`
+### Editor
+The application uses BlockNote as the main editor, which provides:
+- Rich text editing with slash commands
+- Built-in block types (headings, lists, tables, etc.)
+- File uploads and media embedding
+- Real-time collaboration support
 
 ### Database Operations
 ```typescript

app/(protected)/ClientLayout.tsx

@@ -1,11 +1,9 @@
 'use client'
 
-import { SocketProvider } from '@/lib/socket/client'
-
 export function ClientLayout({ children }: { children: React.ReactNode }) {
  return (
- <SocketProvider>
+ <>
  {children}
- </SocketProvider>
+ </>
  )
 }

app/(protected)/workspace/[workspaceId]/database/create/CreateDatabasePage.tsx

@@ -0,0 +1,69 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { CreateDatabaseDialog } from '@/components/database'
+import { Button } from '@/components/ui/button'
+import { ArrowLeft, Database } from 'lucide-react'
+import Link from 'next/link'
+import toast from 'react-hot-toast'
+
+interface CreateDatabasePageProps {
+ workspaceId: string
+ workspace: {
+ id: string
+ name: string
+ slug: string
+ }
+ user: {
+ id: string
+ email: string
+ name?: string | null
+ }
+}
+
+export default function CreateDatabasePage({ workspaceId, workspace, user }: CreateDatabasePageProps) {
+ const router = useRouter()
+ const [showDialog, setShowDialog] = useState(true)
+
+ const handleCreateDatabase = async (database: any) => {
+ toast.success('Database created successfully!')
+ router.push(`/workspace/${workspaceId}/database/${database.id}`)
+ }
+
+ const handleCancel = () => {
+ router.push(`/workspace/${workspaceId}`)
+ }
+
+ return (
+ <div className="min-h-screen bg-gray-50">
+ <div className="max-w-7xl mx-auto px-4 py-8">
+ <div className="mb-6">
+ <Link href={`/workspace/${workspaceId}`}>
+ <Button variant="ghost" size="sm" className="mb-4">
+ <ArrowLeft className="w-4 h-4 mr-2" />
+ Back to workspace
+ </Button>
+ </Link>
+
+ <div className="flex items-center gap-3">
+ <Database className="w-8 h-8 text-gray-600" />
+ <h1 className="text-3xl font-bold">Create New Database</h1>
+ </div>
+ <p className="text-gray-600 mt-2">
+ Create a structured database to organize and manage your data
+ </p>
+ </div>
+
+ <CreateDatabaseDialog
+ open={showDialog}
+ onOpenChange={(open) => {
+ if (!open) handleCancel()
+ }}
+ workspaceId={workspaceId}
+ onCreateDatabase={handleCreateDatabase}
+ />
+ </div>
+ </div>
+ )
+}

app/(protected)/workspace/[workspaceId]/database/create/page.tsx

@@ -0,0 +1,52 @@
+import React from 'react'
+import { redirect } from 'next/navigation'
+import { getCurrentUser } from '@/lib/auth'
+import { prisma } from '@/lib/db/prisma'
+import { generateId } from '@/lib/utils/id'
+import CreateDatabasePage from './CreateDatabasePage'
+
+interface CreateDatabasePageProps {
+ params: Promise<{
+ workspaceId: string
+ }>
+}
+
+export default async function CreateDatabase({ params }: CreateDatabasePageProps) {
+ const user = await getCurrentUser()
+ if (!user) {
+ redirect('/login')
+ }
+
+ const resolvedParams = await params
+
+ // Check if user is a member of the workspace
+ const workspaceMember = await prisma.workspaceMember.findUnique({
+ where: {
+ userId_workspaceId: {
+ userId: user.id,
+ workspaceId: resolvedParams.workspaceId
+ }
+ }
+ })
+
+ if (!workspaceMember) {
+ redirect(`/workspace/${resolvedParams.workspaceId}`)
+ }
+
+ const workspace = await prisma.workspace.findUnique({
+ where: { id: resolvedParams.workspaceId },
+ select: { id: true, name: true, slug: true }
+ })
+
+ if (!workspace) {
+ redirect('/')
+ }
+
+ return (
+ <CreateDatabasePage
+ workspaceId={resolvedParams.workspaceId}
+ workspace={workspace}
+ user={user}
+ />
+ )
+}

app/(protected)/workspace/[workspaceId]/page/[pageId]/PageEditorV2.tsx

@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic'
 import { SnapDocsPageHeader } from '@/components/page/snapdocs-page-header'
 import { cn } from '@/lib/utils'
 import toast from 'react-hot-toast'
-import { useSocket } from '@/lib/socket/client'
+// import { useSocket } from '@/lib/socket/client' // Removed - using Yjs collaboration now
 
 // Dynamically import BlockNoteEditor to avoid SSR hydration issues
 const BlockNoteEditor = dynamic(
@@ -65,7 +65,7 @@ interface PageEditorProps {
 
 export default function PageEditorV2({ page, initialContent, user }: PageEditorProps) {
  const router = useRouter()
- const { isConnected, joinPage, leavePage } = useSocket()
+// const { isConnected, joinPage, leavePage } = useSocket() // Removed - using Yjs collaboration now
  const [title, setTitle] = useState(page.title || '')
  const [icon, setIcon] = useState(page.icon || '')
  const [coverImage, setCoverImage] = useState(page.coverImage || '')
@@ -78,22 +78,8 @@ export default function PageEditorV2({ page, initialContent, user }: PageEditorP
 
  const initialBlocks = initialContent?.blocks || []
 
- // Join the page room for real-time collaboration
- useEffect(() => {
- if (isConnected && user) {
- joinPage(page.id, page.workspaceId, {
- id: user.id,
- name: user.name || 'Anonymous',
- email: user.email || '',
- avatarUrl: null
- })
- }
-
- // Clean up when leaving the page
- return () => {
- leavePage()
- }
- }, [isConnected, page.id, page.workspaceId, user, joinPage, leavePage])
+ // Yjs collaboration is now handled directly in BlockNoteEditor component
+ // No need for Socket.io room joining
 
 
  // Auto-resize title textarea

app/api/databases/[databaseId]/route.ts

@@ -133,6 +133,71 @@ export async function PUT(
  }
 }
 
+// PATCH /api/databases/[databaseId] - Partial update database
+export async function PATCH(
+ request: NextRequest,
+ { params }: { params: Promise<{ databaseId: string }> }
+) {
+ try {
+ const session = await getServerSession(authOptions)
+ if (!session?.user?.id) {
+ return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+ }
+
+ const resolvedParams = await params
+ const body = await request.json()
+
+ // Check database exists and user has access
+ const database = await prisma.database.findUnique({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ include: {
+ workspace: {
+ include: {
+ members: {
+ where: {
+ userId: session.user.id
+ }
+ }
+ }
+ }
+ }
+ })
+
+ if (!database) {
+ return NextResponse.json({ error: 'Database not found' }, { status: 404 })
+ }
+
+ if (!database.workspace.members.length) {
+ return NextResponse.json({ error: 'Access denied' }, { status: 403 })
+ }
+
+ const updatedDatabase = await prisma.database.update({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ data: body,
+ include: {
+ views: true,
+ rows: {
+ orderBy: {
+ order: 'asc'
+ }
+ }
+ }
+ })
+
+ return NextResponse.json(updatedDatabase)
+ } catch (error) {
+ console.error('Error updating database:', error)
+ return NextResponse.json(
+ { error: 'Internal server error' },
+ { status: 500 }
+ )
+ }
+}
+
 // DELETE /api/databases/[databaseId] - Delete database
 export async function DELETE(
  request: NextRequest,

app/globals.css

@@ -126,48 +126,6 @@
  @apply relative min-h-full;
 }
 
-/* BlockV2 System - Clean hover area and handle positioning */
-.block-wrapper {
- @apply relative;
-}
-
-/* Extend hover area to include the handle space */
-.block-wrapper::before {
- content: '';
- position: absolute;
- left: -3rem; /* Mobile: 48px for handles */
- right: 0;
- top: 0;
- bottom: 0;
- pointer-events: none;
- z-index: 1;
-}
-
-@media (min-width: 768px) {
- .block-wrapper::before {
- left: -4rem; /* Desktop: 64px for handles */
- }
-}
-
-/* Block content area - properly centered */
-.block-content {
- @apply relative;
- /* Ensure content doesn't shift when handles appear */
- margin-left: 0;
-}
-
-/* Handle positioning with negative margins - doesn't affect content flow */
-.block-wrapper .absolute.-left-12 {
- /* Mobile handle position */
- left: -3rem;
-}
-
-@media (min-width: 768px) {
- .block-wrapper .absolute.-left-16 {
- /* Desktop handle position */
- left: -4rem;
- }
-}
 
 /* Responsive typography */
 @layer utilities {

CLAUDE.md

@@ -130,8 +130,7 @@ interface Block {
 ```
 
 Key files:
-- `components/editor/SnapDocsEditor.tsx` - Main editor with drag-and-drop
-- `components/editor/blocks/` - Individual block implementations
+- `components/editor/BlockNoteEditor.tsx` - Main editor using BlockNote
 - `lib/services/page-content.ts` - MongoDB content service
 
 ### Real-Time Collaboration
@@ -175,11 +174,12 @@ Required in `.env.local`:
 
 ## Development Tips
 
-### Adding New Block Types
-1. Add type to `BlockType` union in `types/index.ts`
-2. Create block component in `components/editor/blocks/`
-3. Update `BlockV2.tsx` to handle rendering
-4. Add to slash menu in `SlashMenu.tsx`
+### Editor
+The application uses BlockNote as the main editor, which provides:
+- Rich text editing with slash commands
+- Built-in block types (headings, lists, tables, etc.)
+- File uploads and media embedding
+- Real-time collaboration support
 
 ### Database Operations
 ```typescript

app/(protected)/ClientLayout.tsx

@@ -1,11 +1,9 @@
 'use client'
 
-import { SocketProvider } from '@/lib/socket/client'
-
 export function ClientLayout({ children }: { children: React.ReactNode }) {
  return (
- <SocketProvider>
+ <>
  {children}
- </SocketProvider>
+ </>
  )
 }

app/(protected)/workspace/[workspaceId]/database/create/CreateDatabasePage.tsx

@@ -0,0 +1,69 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { CreateDatabaseDialog } from '@/components/database'
+import { Button } from '@/components/ui/button'
+import { ArrowLeft, Database } from 'lucide-react'
+import Link from 'next/link'
+import toast from 'react-hot-toast'
+
+interface CreateDatabasePageProps {
+ workspaceId: string
+ workspace: {
+ id: string
+ name: string
+ slug: string
+ }
+ user: {
+ id: string
+ email: string
+ name?: string | null
+ }
+}
+
+export default function CreateDatabasePage({ workspaceId, workspace, user }: CreateDatabasePageProps) {
+ const router = useRouter()
+ const [showDialog, setShowDialog] = useState(true)
+
+ const handleCreateDatabase = async (database: any) => {
+ toast.success('Database created successfully!')
+ router.push(`/workspace/${workspaceId}/database/${database.id}`)
+ }
+
+ const handleCancel = () => {
+ router.push(`/workspace/${workspaceId}`)
+ }
+
+ return (
+ <div className="min-h-screen bg-gray-50">
+ <div className="max-w-7xl mx-auto px-4 py-8">
+ <div className="mb-6">
+ <Link href={`/workspace/${workspaceId}`}>
+ <Button variant="ghost" size="sm" className="mb-4">
+ <ArrowLeft className="w-4 h-4 mr-2" />
+ Back to workspace
+ </Button>
+ </Link>
+
+ <div className="flex items-center gap-3">
+ <Database className="w-8 h-8 text-gray-600" />
+ <h1 className="text-3xl font-bold">Create New Database</h1>
+ </div>
+ <p className="text-gray-600 mt-2">
+ Create a structured database to organize and manage your data
+ </p>
+ </div>
+
+ <CreateDatabaseDialog
+ open={showDialog}
+ onOpenChange={(open) => {
+ if (!open) handleCancel()
+ }}
+ workspaceId={workspaceId}
+ onCreateDatabase={handleCreateDatabase}
+ />
+ </div>
+ </div>
+ )
+}

app/(protected)/workspace/[workspaceId]/database/create/page.tsx

@@ -0,0 +1,52 @@
+import React from 'react'
+import { redirect } from 'next/navigation'
+import { getCurrentUser } from '@/lib/auth'
+import { prisma } from '@/lib/db/prisma'
+import { generateId } from '@/lib/utils/id'
+import CreateDatabasePage from './CreateDatabasePage'
+
+interface CreateDatabasePageProps {
+ params: Promise<{
+ workspaceId: string
+ }>
+}
+
+export default async function CreateDatabase({ params }: CreateDatabasePageProps) {
+ const user = await getCurrentUser()
+ if (!user) {
+ redirect('/login')
+ }
+
+ const resolvedParams = await params
+
+ // Check if user is a member of the workspace
+ const workspaceMember = await prisma.workspaceMember.findUnique({
+ where: {
+ userId_workspaceId: {
+ userId: user.id,
+ workspaceId: resolvedParams.workspaceId
+ }
+ }
+ })
+
+ if (!workspaceMember) {
+ redirect(`/workspace/${resolvedParams.workspaceId}`)
+ }
+
+ const workspace = await prisma.workspace.findUnique({
+ where: { id: resolvedParams.workspaceId },
+ select: { id: true, name: true, slug: true }
+ })
+
+ if (!workspace) {
+ redirect('/')
+ }
+
+ return (
+ <CreateDatabasePage
+ workspaceId={resolvedParams.workspaceId}
+ workspace={workspace}
+ user={user}
+ />
+ )
+}

app/(protected)/workspace/[workspaceId]/page/[pageId]/PageEditorV2.tsx

@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic'
 import { SnapDocsPageHeader } from '@/components/page/snapdocs-page-header'
 import { cn } from '@/lib/utils'
 import toast from 'react-hot-toast'
-import { useSocket } from '@/lib/socket/client'
+// import { useSocket } from '@/lib/socket/client' // Removed - using Yjs collaboration now
 
 // Dynamically import BlockNoteEditor to avoid SSR hydration issues
 const BlockNoteEditor = dynamic(
@@ -65,7 +65,7 @@ interface PageEditorProps {
 
 export default function PageEditorV2({ page, initialContent, user }: PageEditorProps) {
  const router = useRouter()
- const { isConnected, joinPage, leavePage } = useSocket()
+// const { isConnected, joinPage, leavePage } = useSocket() // Removed - using Yjs collaboration now
  const [title, setTitle] = useState(page.title || '')
  const [icon, setIcon] = useState(page.icon || '')
  const [coverImage, setCoverImage] = useState(page.coverImage || '')
@@ -78,22 +78,8 @@ export default function PageEditorV2({ page, initialContent, user }: PageEditorP
 
  const initialBlocks = initialContent?.blocks || []
 
- // Join the page room for real-time collaboration
- useEffect(() => {
- if (isConnected && user) {
- joinPage(page.id, page.workspaceId, {
- id: user.id,
- name: user.name || 'Anonymous',
- email: user.email || '',
- avatarUrl: null
- })
- }
-
- // Clean up when leaving the page
- return () => {
- leavePage()
- }
- }, [isConnected, page.id, page.workspaceId, user, joinPage, leavePage])
+ // Yjs collaboration is now handled directly in BlockNoteEditor component
+ // No need for Socket.io room joining
 
 
  // Auto-resize title textarea

app/api/databases/[databaseId]/route.ts

@@ -133,6 +133,71 @@ export async function PUT(
  }
 }
 
+// PATCH /api/databases/[databaseId] - Partial update database
+export async function PATCH(
+ request: NextRequest,
+ { params }: { params: Promise<{ databaseId: string }> }
+) {
+ try {
+ const session = await getServerSession(authOptions)
+ if (!session?.user?.id) {
+ return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+ }
+
+ const resolvedParams = await params
+ const body = await request.json()
+
+ // Check database exists and user has access
+ const database = await prisma.database.findUnique({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ include: {
+ workspace: {
+ include: {
+ members: {
+ where: {
+ userId: session.user.id
+ }
+ }
+ }
+ }
+ }
+ })
+
+ if (!database) {
+ return NextResponse.json({ error: 'Database not found' }, { status: 404 })
+ }
+
+ if (!database.workspace.members.length) {
+ return NextResponse.json({ error: 'Access denied' }, { status: 403 })
+ }
+
+ const updatedDatabase = await prisma.database.update({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ data: body,
+ include: {
+ views: true,
+ rows: {
+ orderBy: {
+ order: 'asc'
+ }
+ }
+ }
+ })
+
+ return NextResponse.json(updatedDatabase)
+ } catch (error) {
+ console.error('Error updating database:', error)
+ return NextResponse.json(
+ { error: 'Internal server error' },
+ { status: 500 }
+ )
+ }
+}
+
 // DELETE /api/databases/[databaseId] - Delete database
 export async function DELETE(
  request: NextRequest,

app/globals.css

@@ -126,48 +126,6 @@
  @apply relative min-h-full;
 }
 
-/* BlockV2 System - Clean hover area and handle positioning */
-.block-wrapper {
- @apply relative;
-}
-
-/* Extend hover area to include the handle space */
-.block-wrapper::before {
- content: '';
- position: absolute;
- left: -3rem; /* Mobile: 48px for handles */
- right: 0;
- top: 0;
- bottom: 0;
- pointer-events: none;
- z-index: 1;
-}
-
-@media (min-width: 768px) {
- .block-wrapper::before {
- left: -4rem; /* Desktop: 64px for handles */
- }
-}
-
-/* Block content area - properly centered */
-.block-content {
- @apply relative;
- /* Ensure content doesn't shift when handles appear */
- margin-left: 0;
-}
-
-/* Handle positioning with negative margins - doesn't affect content flow */
-.block-wrapper .absolute.-left-12 {
- /* Mobile handle position */
- left: -3rem;
-}
-
-@media (min-width: 768px) {
- .block-wrapper .absolute.-left-16 {
- /* Desktop handle position */
- left: -4rem;
- }
-}
 
 /* Responsive typography */
 @layer utilities {

CLAUDE.md

@@ -130,8 +130,7 @@ interface Block {
 ```
 
 Key files:
-- `components/editor/SnapDocsEditor.tsx` - Main editor with drag-and-drop
-- `components/editor/blocks/` - Individual block implementations
+- `components/editor/BlockNoteEditor.tsx` - Main editor using BlockNote
 - `lib/services/page-content.ts` - MongoDB content service
 
 ### Real-Time Collaboration
@@ -175,11 +174,12 @@ Required in `.env.local`:
 
 ## Development Tips
 
-### Adding New Block Types
-1. Add type to `BlockType` union in `types/index.ts`
-2. Create block component in `components/editor/blocks/`
-3. Update `BlockV2.tsx` to handle rendering
-4. Add to slash menu in `SlashMenu.tsx`
+### Editor
+The application uses BlockNote as the main editor, which provides:
+- Rich text editing with slash commands
+- Built-in block types (headings, lists, tables, etc.)
+- File uploads and media embedding
+- Real-time collaboration support
 
 ### Database Operations
 ```typescript

app/(protected)/ClientLayout.tsx

@@ -1,11 +1,9 @@
 'use client'
 
-import { SocketProvider } from '@/lib/socket/client'
-
 export function ClientLayout({ children }: { children: React.ReactNode }) {
  return (
- <SocketProvider>
+ <>
  {children}
- </SocketProvider>
+ </>
  )
 }

app/(protected)/workspace/[workspaceId]/database/create/CreateDatabasePage.tsx

@@ -0,0 +1,69 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import { CreateDatabaseDialog } from '@/components/database'
+import { Button } from '@/components/ui/button'
+import { ArrowLeft, Database } from 'lucide-react'
+import Link from 'next/link'
+import toast from 'react-hot-toast'
+
+interface CreateDatabasePageProps {
+ workspaceId: string
+ workspace: {
+ id: string
+ name: string
+ slug: string
+ }
+ user: {
+ id: string
+ email: string
+ name?: string | null
+ }
+}
+
+export default function CreateDatabasePage({ workspaceId, workspace, user }: CreateDatabasePageProps) {
+ const router = useRouter()
+ const [showDialog, setShowDialog] = useState(true)
+
+ const handleCreateDatabase = async (database: any) => {
+ toast.success('Database created successfully!')
+ router.push(`/workspace/${workspaceId}/database/${database.id}`)
+ }
+
+ const handleCancel = () => {
+ router.push(`/workspace/${workspaceId}`)
+ }
+
+ return (
+ <div className="min-h-screen bg-gray-50">
+ <div className="max-w-7xl mx-auto px-4 py-8">
+ <div className="mb-6">
+ <Link href={`/workspace/${workspaceId}`}>
+ <Button variant="ghost" size="sm" className="mb-4">
+ <ArrowLeft className="w-4 h-4 mr-2" />
+ Back to workspace
+ </Button>
+ </Link>
+
+ <div className="flex items-center gap-3">
+ <Database className="w-8 h-8 text-gray-600" />
+ <h1 className="text-3xl font-bold">Create New Database</h1>
+ </div>
+ <p className="text-gray-600 mt-2">
+ Create a structured database to organize and manage your data
+ </p>
+ </div>
+
+ <CreateDatabaseDialog
+ open={showDialog}
+ onOpenChange={(open) => {
+ if (!open) handleCancel()
+ }}
+ workspaceId={workspaceId}
+ onCreateDatabase={handleCreateDatabase}
+ />
+ </div>
+ </div>
+ )
+}

app/(protected)/workspace/[workspaceId]/database/create/page.tsx

@@ -0,0 +1,52 @@
+import React from 'react'
+import { redirect } from 'next/navigation'
+import { getCurrentUser } from '@/lib/auth'
+import { prisma } from '@/lib/db/prisma'
+import { generateId } from '@/lib/utils/id'
+import CreateDatabasePage from './CreateDatabasePage'
+
+interface CreateDatabasePageProps {
+ params: Promise<{
+ workspaceId: string
+ }>
+}
+
+export default async function CreateDatabase({ params }: CreateDatabasePageProps) {
+ const user = await getCurrentUser()
+ if (!user) {
+ redirect('/login')
+ }
+
+ const resolvedParams = await params
+
+ // Check if user is a member of the workspace
+ const workspaceMember = await prisma.workspaceMember.findUnique({
+ where: {
+ userId_workspaceId: {
+ userId: user.id,
+ workspaceId: resolvedParams.workspaceId
+ }
+ }
+ })
+
+ if (!workspaceMember) {
+ redirect(`/workspace/${resolvedParams.workspaceId}`)
+ }
+
+ const workspace = await prisma.workspace.findUnique({
+ where: { id: resolvedParams.workspaceId },
+ select: { id: true, name: true, slug: true }
+ })
+
+ if (!workspace) {
+ redirect('/')
+ }
+
+ return (
+ <CreateDatabasePage
+ workspaceId={resolvedParams.workspaceId}
+ workspace={workspace}
+ user={user}
+ />
+ )
+}

app/(protected)/workspace/[workspaceId]/page/[pageId]/PageEditorV2.tsx

@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic'
 import { SnapDocsPageHeader } from '@/components/page/snapdocs-page-header'
 import { cn } from '@/lib/utils'
 import toast from 'react-hot-toast'
-import { useSocket } from '@/lib/socket/client'
+// import { useSocket } from '@/lib/socket/client' // Removed - using Yjs collaboration now
 
 // Dynamically import BlockNoteEditor to avoid SSR hydration issues
 const BlockNoteEditor = dynamic(
@@ -65,7 +65,7 @@ interface PageEditorProps {
 
 export default function PageEditorV2({ page, initialContent, user }: PageEditorProps) {
  const router = useRouter()
- const { isConnected, joinPage, leavePage } = useSocket()
+// const { isConnected, joinPage, leavePage } = useSocket() // Removed - using Yjs collaboration now
  const [title, setTitle] = useState(page.title || '')
  const [icon, setIcon] = useState(page.icon || '')
  const [coverImage, setCoverImage] = useState(page.coverImage || '')
@@ -78,22 +78,8 @@ export default function PageEditorV2({ page, initialContent, user }: PageEditorP
 
  const initialBlocks = initialContent?.blocks || []
 
- // Join the page room for real-time collaboration
- useEffect(() => {
- if (isConnected && user) {
- joinPage(page.id, page.workspaceId, {
- id: user.id,
- name: user.name || 'Anonymous',
- email: user.email || '',
- avatarUrl: null
- })
- }
-
- // Clean up when leaving the page
- return () => {
- leavePage()
- }
- }, [isConnected, page.id, page.workspaceId, user, joinPage, leavePage])
+ // Yjs collaboration is now handled directly in BlockNoteEditor component
+ // No need for Socket.io room joining
 
 
  // Auto-resize title textarea

app/api/databases/[databaseId]/route.ts

@@ -133,6 +133,71 @@ export async function PUT(
  }
 }
 
+// PATCH /api/databases/[databaseId] - Partial update database
+export async function PATCH(
+ request: NextRequest,
+ { params }: { params: Promise<{ databaseId: string }> }
+) {
+ try {
+ const session = await getServerSession(authOptions)
+ if (!session?.user?.id) {
+ return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
+ }
+
+ const resolvedParams = await params
+ const body = await request.json()
+
+ // Check database exists and user has access
+ const database = await prisma.database.findUnique({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ include: {
+ workspace: {
+ include: {
+ members: {
+ where: {
+ userId: session.user.id
+ }
+ }
+ }
+ }
+ }
+ })
+
+ if (!database) {
+ return NextResponse.json({ error: 'Database not found' }, { status: 404 })
+ }
+
+ if (!database.workspace.members.length) {
+ return NextResponse.json({ error: 'Access denied' }, { status: 403 })
+ }
+
+ const updatedDatabase = await prisma.database.update({
+ where: {
+ id: resolvedParams.databaseId
+ },
+ data: body,
+ include: {
+ views: true,
+ rows: {
+ orderBy: {
+ order: 'asc'
+ }
+ }
+ }
+ })
+
+ return NextResponse.json(updatedDatabase)
+ } catch (error) {
+ console.error('Error updating database:', error)
+ return NextResponse.json(
+ { error: 'Internal server error' },
+ { status: 500 }
+ )
+ }
+}
+
 // DELETE /api/databases/[databaseId] - Delete database
 export async function DELETE(
  request: NextRequest,

app/globals.css

@@ -126,48 +126,6 @@
  @apply relative min-h-full;
 }
 
-/* BlockV2 System - Clean hover area and handle positioning */
-.block-wrapper {
- @apply relative;
-}
-
-/* Extend hover area to include the handle space */
-.block-wrapper::before {
- content: '';
- position: absolute;
- left: -3rem; /* Mobile: 48px for handles */
- right: 0;
- top: 0;
- bottom: 0;
- pointer-events: none;
- z-index: 1;
-}
-
-@media (min-width: 768px) {
- .block-wrapper::before {
- left: -4rem; /* Desktop: 64px for handles */
- }
-}
-
-/* Block content area - properly centered */
-.block-content {
- @apply relative;
- /* Ensure content doesn't shift when handles appear */
- margin-left: 0;
-}
-
-/* Handle positioning with negative margins - doesn't affect content flow */
-.block-wrapper .absolute.-left-12 {
- /* Mobile handle position */
- left: -3rem;
-}
-
-@media (min-width: 768px) {
- .block-wrapper .absolute.-left-16 {
- /* Desktop handle position */
- left: -4rem;
- }
-}
 
 /* Responsive typography */
 @layer utilities {