fix(dups): onConntext being called twice for a signle edge, once in onConnectEnd and onConnectExtended

* feat(logs-context-menu): consolidated logs utils and types, added logs record context menu (#2659)

* feat(email): welcome email; improvement(emails): ui/ux (#2658)

* feat(email): welcome email; improvement(emails): ui/ux

* improvement(emails): links, accounts, preview

* refactor(emails): file structure and wrapper components

* added envvar for personal emails sent, added isHosted gate

* fixed failing tests, added env mock

* fix: removed comment

---------

Co-authored-by: waleed <walif6@gmail.com>

* fix(logging): hitl + trigger dev crash protection (#2664)

* hitl gaps

* deal with trigger worker crashes

* cleanup import strcuture

* feat(imap): added support for imap trigger (#2663)

* feat(tools): added support for imap trigger

* feat(imap): added parity, tested

* ack PR comments

* final cleanup

* feat(i18n): update translations (#2665)

Co-authored-by: waleedlatif1 <waleedlatif1@users.noreply.github.com>

* fix(grain): updated grain trigger to auto-establish trigger (#2666)

Co-authored-by: aadamgough <adam@sim.ai>

* feat(admin): routes to manage deployments (#2667)

* feat(admin): routes to manage deployments

* fix naming fo deployed by

* feat(time-picker): added timepicker emcn component, added to playground, added searchable prop for dropdown, added more timezones for schedule, updated license and notice date (#2668)

* feat(time-picker): added timepicker emcn component, added to playground, added searchable prop for dropdown, added more timezones for schedule, updated license and notice date

* removed unused params, cleaned up redundant utils

* improvement(invite): aligned styling (#2669)

* improvement(invite): aligned with rest of app

* fix(invite): error handling

* fix: addressed comments

---------

Co-authored-by: Emir Karabeg <78010029+emir-karabeg@users.noreply.github.com>
Co-authored-by: Vikhyath Mondreti <vikhyathvikku@gmail.com>
Co-authored-by: waleedlatif1 <waleedlatif1@users.noreply.github.com>
Co-authored-by: Adam Gough <77861281+aadamgough@users.noreply.github.com>
Co-authored-by: aadamgough <adam@sim.ai>

.github/workflows/test-build.yml

@@ -38,41 +38,6 @@ jobs:
       - name: Install dependencies
         run: bun install --frozen-lockfile
 
-      - name: Validate feature flags
-        run: |
-          FILE="apps/sim/lib/core/config/feature-flags.ts"
-          ERRORS=""
-
-          echo "Checking for hardcoded boolean feature flags..."
-
-          # Use perl for multiline matching to catch both:
-          #   export const isHosted = true
-          #   export const isHosted =
-          #     true
-          HARDCODED=$(perl -0777 -ne 'while (/export const (is[A-Za-z]+)\s*=\s*\n?\s*(true|false)\b/g) { print "  $1 = $2\n" }' "$FILE")
-
-          if [ -n "$HARDCODED" ]; then
-            ERRORS="${ERRORS}\n❌ Feature flags must not be hardcoded to boolean literals!\n\nFound hardcoded flags:\n${HARDCODED}\n\nFeature flags should derive their values from environment variables.\n"
-          fi
-
-          echo "Checking feature flag naming conventions..."
-
-          # Check that all export const (except functions) start with 'is'
-          # This finds exports like "export const someFlag" that don't start with "is" or "get"
-          BAD_NAMES=$(grep -E "^export const [a-z]" "$FILE" | grep -vE "^export const (is|get)" | sed 's/export const \([a-zA-Z]*\).*/  \1/')
-
-          if [ -n "$BAD_NAMES" ]; then
-            ERRORS="${ERRORS}\n❌ Feature flags must use 'is' prefix for boolean flags!\n\nFound incorrectly named flags:\n${BAD_NAMES}\n\nExample: 'hostedMode' should be 'isHostedMode'\n"
-          fi
-
-          if [ -n "$ERRORS" ]; then
-            echo ""
-            echo -e "$ERRORS"
-            exit 1
-          fi
-
-          echo "✅ All feature flags are properly configured"
-
       - name: Lint code
         run: bun run lint:check
 

README.md

@@ -13,10 +13,6 @@
   <a href="https://docs.sim.ai" target="_blank" rel="noopener noreferrer"><img src="https://img.shields.io/badge/Docs-6F3DFA.svg" alt="Documentation"></a>
 </p>
 
-<p align="center">
-  <a href="https://cursor.com/link/prompt?text=Help%20me%20set%20up%20Sim%20Studio%20locally.%20Follow%20these%20steps%3A%0A%0A1.%20First%2C%20verify%20Docker%20is%20installed%20and%20running%3A%0A%20%20%20docker%20--version%0A%20%20%20docker%20info%0A%0A2.%20Clone%20the%20repository%3A%0A%20%20%20git%20clone%20https%3A%2F%2Fgithub.com%2Fsimstudioai%2Fsim.git%0A%20%20%20cd%20sim%0A%0A3.%20Start%20the%20services%20with%20Docker%20Compose%3A%0A%20%20%20docker%20compose%20-f%20docker-compose.prod.yml%20up%20-d%0A%0A4.%20Wait%20for%20all%20containers%20to%20be%20healthy%20(this%20may%20take%201-2%20minutes)%3A%0A%20%20%20docker%20compose%20-f%20docker-compose.prod.yml%20ps%0A%0A5.%20Verify%20the%20app%20is%20accessible%20at%20http%3A%2F%2Flocalhost%3A3000%0A%0AIf%20there%20are%20any%20errors%2C%20help%20me%20troubleshoot%20them.%20Common%20issues%3A%0A-%20Port%203000%2C%203002%2C%20or%205432%20already%20in%20use%0A-%20Docker%20not%20running%0A-%20Insufficient%20memory%20(needs%2012GB%2B%20RAM)%0A%0AFor%20local%20AI%20models%20with%20Ollama%2C%20use%20this%20instead%20of%20step%203%3A%0A%20%20%20docker%20compose%20-f%20docker-compose.ollama.yml%20--profile%20setup%20up%20-d"><img src="https://img.shields.io/badge/Set%20Up%20with-Cursor-000000?logo=cursor&logoColor=white" alt="Set Up with Cursor"></a>
-</p>
-
 ### Build Workflows with Ease
 Design agent workflows visually on a canvas—connect agents, tools, and blocks, then run them instantly.
 
@@ -64,11 +60,17 @@ Docker must be installed and running on your machine.
 ### Self-hosted: Docker Compose
 
 ```bash
-git clone https://github.com/simstudioai/sim.git && cd sim
+# Clone the repository
+git clone https://github.com/simstudioai/sim.git
+
+# Navigate to the project directory
+cd sim
+
+# Start Sim
 docker compose -f docker-compose.prod.yml up -d
 ```
 
-Open [http://localhost:3000](http://localhost:3000)
+Access the application at [http://localhost:3000/](http://localhost:3000/)
 
 #### Using Local Models with Ollama
 
@@ -89,17 +91,33 @@ docker compose -f docker-compose.ollama.yml exec ollama ollama pull llama3.1:8b
 
 #### Using an External Ollama Instance
 
-If Ollama is running on your host machine, use `host.docker.internal` instead of `localhost`:
+If you already have Ollama running on your host machine (outside Docker), you need to configure the `OLLAMA_URL` to use `host.docker.internal` instead of `localhost`:
 
 ```bash
+# Docker Desktop (macOS/Windows)
 OLLAMA_URL=http://host.docker.internal:11434 docker compose -f docker-compose.prod.yml up -d
+
+# Linux (add extra_hosts or use host IP)
+docker compose -f docker-compose.prod.yml up -d  # Then set OLLAMA_URL to your host's IP
 ```
 
-On Linux, use your host's IP address or add `extra_hosts: ["host.docker.internal:host-gateway"]` to the compose file.
+**Why?** When running inside Docker, `localhost` refers to the container itself, not your host machine. `host.docker.internal` is a special DNS name that resolves to the host.
+
+For Linux users, you can either:
+- Use your host machine's actual IP address (e.g., `http://192.168.1.100:11434`)
+- Add `extra_hosts: ["host.docker.internal:host-gateway"]` to the simstudio service in your compose file
 
 #### Using vLLM
 
-Sim supports [vLLM](https://docs.vllm.ai/) for self-hosted models. Set `VLLM_BASE_URL` and optionally `VLLM_API_KEY` in your environment.
+Sim also supports [vLLM](https://docs.vllm.ai/) for self-hosted models with OpenAI-compatible API:
+
+```bash
+# Set these environment variables
+VLLM_BASE_URL=http://your-vllm-server:8000
+VLLM_API_KEY=your_optional_api_key  # Only if your vLLM instance requires auth
+```
+
+When running with Docker, use `host.docker.internal` if vLLM is on your host machine (same as Ollama above).
 
 ### Self-hosted: Dev Containers
 
@@ -110,9 +128,14 @@ Sim supports [vLLM](https://docs.vllm.ai/) for self-hosted models. Set `VLLM_BAS
 
 ### Self-hosted: Manual Setup
 
-**Requirements:** [Bun](https://bun.sh/), [Node.js](https://nodejs.org/) v20+, PostgreSQL 12+ with [pgvector](https://github.com/pgvector/pgvector)
+**Requirements:**
+- [Bun](https://bun.sh/) runtime
+- [Node.js](https://nodejs.org/) v20+ (required for sandboxed code execution)
+- PostgreSQL 12+ with [pgvector extension](https://github.com/pgvector/pgvector) (required for AI embeddings)
 
-1. Clone and install:
+**Note:** Sim uses vector embeddings for AI features like knowledge bases and semantic search, which requires the `pgvector` PostgreSQL extension.
+
+1. Clone and install dependencies:
 
 ```bash
 git clone https://github.com/simstudioai/sim.git
@@ -122,33 +145,75 @@ bun install
 
 2. Set up PostgreSQL with pgvector:
 
+You need PostgreSQL with the `vector` extension for embedding support. Choose one option:
+
+**Option A: Using Docker (Recommended)**
 ```bash
-docker run --name simstudio-db -e POSTGRES_PASSWORD=your_password -e POSTGRES_DB=simstudio -p 5432:5432 -d pgvector/pgvector:pg17
+# Start PostgreSQL with pgvector extension
+docker run --name simstudio-db \
+  -e POSTGRES_PASSWORD=your_password \
+  -e POSTGRES_DB=simstudio \
+  -p 5432:5432 -d \
+  pgvector/pgvector:pg17
 ```
 
-Or install manually via the [pgvector guide](https://github.com/pgvector/pgvector#installation).
+**Option B: Manual Installation**
+- Install PostgreSQL 12+ and the pgvector extension
+- See [pgvector installation guide](https://github.com/pgvector/pgvector#installation)
 
-3. Configure environment:
+3. Set up environment:
 
 ```bash
-cp apps/sim/.env.example apps/sim/.env
-cp packages/db/.env.example packages/db/.env
-# Edit both .env files to set DATABASE_URL="postgresql://postgres:your_password@localhost:5432/simstudio"
+cd apps/sim
+cp .env.example .env  # Configure with required variables (DATABASE_URL, BETTER_AUTH_SECRET, BETTER_AUTH_URL)
 ```
 
-4. Run migrations:
+Update your `.env` file with the database URL:
+```bash
+DATABASE_URL="postgresql://postgres:your_password@localhost:5432/simstudio"
+```
+
+4. Set up the database:
+
+First, configure the database package environment:
+```bash
+cd packages/db
+cp .env.example .env 
+```
+
+Update your `packages/db/.env` file with the database URL:
+```bash
+DATABASE_URL="postgresql://postgres:your_password@localhost:5432/simstudio"
+```
+
+Then run the migrations:
+```bash
+cd packages/db # Required so drizzle picks correct .env file
+bunx drizzle-kit migrate --config=./drizzle.config.ts
+```
+
+5. Start the development servers:
+
+**Recommended approach - run both servers together (from project root):**
 
 ```bash
-cd packages/db && bunx drizzle-kit migrate --config=./drizzle.config.ts
+bun run dev:full
 ```
 
-5. Start development servers:
+This starts both the main Next.js application and the realtime socket server required for full functionality.
 
+**Alternative - run servers separately:**
+
+Next.js app (from project root):
 ```bash
-bun run dev:full  # Starts both Next.js app and realtime socket server
+bun run dev
 ```
 
-Or run separately: `bun run dev` (Next.js) and `cd apps/sim && bun run dev:sockets` (realtime).
+Realtime socket server (from `apps/sim` directory in a separate terminal):
+```bash
+cd apps/sim
+bun run dev:sockets
+```
 
 ## Copilot API Keys
 
@@ -159,7 +224,7 @@ Copilot is a Sim-managed service. To use Copilot on a self-hosted instance:
 
 ## Environment Variables
 
-Key environment variables for self-hosted deployments. See [`.env.example`](apps/sim/.env.example) for defaults or [`env.ts`](apps/sim/lib/core/config/env.ts) for the full list.
+Key environment variables for self-hosted deployments (see `apps/sim/.env.example` for full list):
 
 | Variable | Required | Description |
 |----------|----------|-------------|
@@ -167,9 +232,9 @@ Key environment variables for self-hosted deployments. See [`.env.example`](apps
 | `BETTER_AUTH_SECRET` | Yes | Auth secret (`openssl rand -hex 32`) |
 | `BETTER_AUTH_URL` | Yes | Your app URL (e.g., `http://localhost:3000`) |
 | `NEXT_PUBLIC_APP_URL` | Yes | Public app URL (same as above) |
-| `ENCRYPTION_KEY` | Yes | Encrypts environment variables (`openssl rand -hex 32`) |
-| `INTERNAL_API_SECRET` | Yes | Encrypts internal API routes (`openssl rand -hex 32`) |
-| `API_ENCRYPTION_KEY` | Yes | Encrypts API keys (`openssl rand -hex 32`) |
+| `ENCRYPTION_KEY` | Yes | Encryption key (`openssl rand -hex 32`) |
+| `OLLAMA_URL` | No | Ollama server URL (default: `http://localhost:11434`) |
+| `VLLM_BASE_URL` | No | vLLM server URL for self-hosted models |
 | `COPILOT_API_KEY` | No | API key from sim.ai for Copilot features |
 
 ## Troubleshooting

apps/docs/content/docs/en/self-hosting/index.mdx

@@ -8,12 +8,6 @@ import { Callout } from 'fumadocs-ui/components/callout'
 
 Deploy Sim Studio on your own infrastructure with Docker or Kubernetes.
 
-<div className="flex gap-2 my-4">
-  <a href="https://cursor.com/link/prompt?text=Help%20me%20set%20up%20Sim%20Studio%20locally.%20Follow%20these%20steps%3A%0A%0A1.%20First%2C%20verify%20Docker%20is%20installed%20and%20running%3A%0A%20%20%20docker%20--version%0A%20%20%20docker%20info%0A%0A2.%20Clone%20the%20repository%3A%0A%20%20%20git%20clone%20https%3A%2F%2Fgithub.com%2Fsimstudioai%2Fsim.git%0A%20%20%20cd%20sim%0A%0A3.%20Start%20the%20services%20with%20Docker%20Compose%3A%0A%20%20%20docker%20compose%20-f%20docker-compose.prod.yml%20up%20-d%0A%0A4.%20Wait%20for%20all%20containers%20to%20be%20healthy%20(this%20may%20take%201-2%20minutes)%3A%0A%20%20%20docker%20compose%20-f%20docker-compose.prod.yml%20ps%0A%0A5.%20Verify%20the%20app%20is%20accessible%20at%20http%3A%2F%2Flocalhost%3A3000%0A%0AIf%20there%20are%20any%20errors%2C%20help%20me%20troubleshoot%20them.%20Common%20issues%3A%0A-%20Port%203000%2C%203002%2C%20or%205432%20already%20in%20use%0A-%20Docker%20not%20running%0A-%20Insufficient%20memory%20(needs%2012GB%2B%20RAM)%0A%0AFor%20local%20AI%20models%20with%20Ollama%2C%20use%20this%20instead%20of%20step%203%3A%0A%20%20%20docker%20compose%20-f%20docker-compose.ollama.yml%20--profile%20setup%20up%20-d">
-    <img src="https://img.shields.io/badge/Set%20Up%20with-Cursor-000000?logo=cursor&logoColor=white" alt="Set Up with Cursor" />
-  </a>
-</div>
-
 ## Requirements
 
 | Resource | Minimum | Recommended |
@@ -54,4 +48,3 @@ Open [http://localhost:3000](http://localhost:3000)
 | realtime | 3002 | WebSocket server |
 | db | 5432 | PostgreSQL with pgvector |
 | migrations | - | Database migrations (runs once) |
-

apps/sim/app/api/folders/[id]/route.ts

@@ -14,7 +14,6 @@ const updateFolderSchema = z.object({
   color: z.string().optional(),
   isExpanded: z.boolean().optional(),
   parentId: z.string().nullable().optional(),
-  sortOrder: z.number().int().min(0).optional(),
 })
 
 // PUT - Update a folder
@@ -39,7 +38,7 @@ export async function PUT(request: NextRequest, { params }: { params: Promise<{
       return NextResponse.json({ error: `Validation failed: ${errorMessages}` }, { status: 400 })
     }
 
-    const { name, color, isExpanded, parentId, sortOrder } = validationResult.data
+    const { name, color, isExpanded, parentId } = validationResult.data
 
     // Verify the folder exists
     const existingFolder = await db
@@ -82,12 +81,12 @@ export async function PUT(request: NextRequest, { params }: { params: Promise<{
       }
     }
 
-    const updates: Record<string, unknown> = { updatedAt: new Date() }
+    // Update the folder
+    const updates: any = { updatedAt: new Date() }
     if (name !== undefined) updates.name = name.trim()
     if (color !== undefined) updates.color = color
     if (isExpanded !== undefined) updates.isExpanded = isExpanded
     if (parentId !== undefined) updates.parentId = parentId || null
-    if (sortOrder !== undefined) updates.sortOrder = sortOrder
 
     const [updatedFolder] = await db
       .update(workflowFolder)

apps/sim/app/api/folders/reorder/route.ts

@@ -1,91 +0,0 @@
-import { db } from '@sim/db'
-import { workflowFolder } from '@sim/db/schema'
-import { createLogger } from '@sim/logger'
-import { eq, inArray } from 'drizzle-orm'
-import { type NextRequest, NextResponse } from 'next/server'
-import { z } from 'zod'
-import { getSession } from '@/lib/auth'
-import { generateRequestId } from '@/lib/core/utils/request'
-import { getUserEntityPermissions } from '@/lib/workspaces/permissions/utils'
-
-const logger = createLogger('FolderReorderAPI')
-
-const ReorderSchema = z.object({
-  workspaceId: z.string(),
-  updates: z.array(
-    z.object({
-      id: z.string(),
-      sortOrder: z.number().int().min(0),
-      parentId: z.string().nullable().optional(),
-    })
-  ),
-})
-
-export async function PUT(req: NextRequest) {
-  const requestId = generateRequestId()
-  const session = await getSession()
-
-  if (!session?.user?.id) {
-    logger.warn(`[${requestId}] Unauthorized folder reorder attempt`)
-    return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
-  }
-
-  try {
-    const body = await req.json()
-    const { workspaceId, updates } = ReorderSchema.parse(body)
-
-    const permission = await getUserEntityPermissions(session.user.id, 'workspace', workspaceId)
-    if (!permission || permission === 'read') {
-      logger.warn(
-        `[${requestId}] User ${session.user.id} lacks write permission for workspace ${workspaceId}`
-      )
-      return NextResponse.json({ error: 'Write access required' }, { status: 403 })
-    }
-
-    const folderIds = updates.map((u) => u.id)
-    const existingFolders = await db
-      .select({ id: workflowFolder.id, workspaceId: workflowFolder.workspaceId })
-      .from(workflowFolder)
-      .where(inArray(workflowFolder.id, folderIds))
-
-    const validIds = new Set(
-      existingFolders.filter((f) => f.workspaceId === workspaceId).map((f) => f.id)
-    )
-
-    const validUpdates = updates.filter((u) => validIds.has(u.id))
-
-    if (validUpdates.length === 0) {
-      return NextResponse.json({ error: 'No valid folders to update' }, { status: 400 })
-    }
-
-    await db.transaction(async (tx) => {
-      for (const update of validUpdates) {
-        const updateData: Record<string, unknown> = {
-          sortOrder: update.sortOrder,
-          updatedAt: new Date(),
-        }
-        if (update.parentId !== undefined) {
-          updateData.parentId = update.parentId
-        }
-        await tx.update(workflowFolder).set(updateData).where(eq(workflowFolder.id, update.id))
-      }
-    })
-
-    logger.info(
-      `[${requestId}] Reordered ${validUpdates.length} folders in workspace ${workspaceId}`
-    )
-
-    return NextResponse.json({ success: true, updated: validUpdates.length })
-  } catch (error) {
-    if (error instanceof z.ZodError) {
-      logger.warn(`[${requestId}] Invalid folder reorder data`, { errors: error.errors })
-      return NextResponse.json(
-        { error: 'Invalid request data', details: error.errors },
-        { status: 400 }
-      )
-    }
-
-    logger.error(`[${requestId}] Error reordering folders`, error)
-    return NextResponse.json({ error: 'Failed to reorder folders' }, { status: 500 })
-  }
-}

apps/sim/app/api/workflows/[id]/route.ts

@@ -20,7 +20,6 @@ const UpdateWorkflowSchema = z.object({
   description: z.string().optional(),
   color: z.string().optional(),
   folderId: z.string().nullable().optional(),
-  sortOrder: z.number().int().min(0).optional(),
 })
 
 /**
@@ -439,12 +438,12 @@ export async function PUT(request: NextRequest, { params }: { params: Promise<{
       return NextResponse.json({ error: 'Access denied' }, { status: 403 })
     }
 
-    const updateData: Record<string, unknown> = { updatedAt: new Date() }
+    // Build update object
+    const updateData: any = { updatedAt: new Date() }
     if (updates.name !== undefined) updateData.name = updates.name
     if (updates.description !== undefined) updateData.description = updates.description
     if (updates.color !== undefined) updateData.color = updates.color
     if (updates.folderId !== undefined) updateData.folderId = updates.folderId
-    if (updates.sortOrder !== undefined) updateData.sortOrder = updates.sortOrder
 
     // Update the workflow
     const [updatedWorkflow] = await db

apps/sim/app/api/workflows/reorder/route.ts

@@ -1,91 +0,0 @@
-import { db } from '@sim/db'
-import { workflow } from '@sim/db/schema'
-import { createLogger } from '@sim/logger'
-import { eq, inArray } from 'drizzle-orm'
-import { type NextRequest, NextResponse } from 'next/server'
-import { z } from 'zod'
-import { getSession } from '@/lib/auth'
-import { generateRequestId } from '@/lib/core/utils/request'
-import { getUserEntityPermissions } from '@/lib/workspaces/permissions/utils'
-
-const logger = createLogger('WorkflowReorderAPI')
-
-const ReorderSchema = z.object({
-  workspaceId: z.string(),
-  updates: z.array(
-    z.object({
-      id: z.string(),
-      sortOrder: z.number().int().min(0),
-      folderId: z.string().nullable().optional(),
-    })
-  ),
-})
-
-export async function PUT(req: NextRequest) {
-  const requestId = generateRequestId()
-  const session = await getSession()
-
-  if (!session?.user?.id) {
-    logger.warn(`[${requestId}] Unauthorized reorder attempt`)
-    return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
-  }
-
-  try {
-    const body = await req.json()
-    const { workspaceId, updates } = ReorderSchema.parse(body)
-
-    const permission = await getUserEntityPermissions(session.user.id, 'workspace', workspaceId)
-    if (!permission || permission === 'read') {
-      logger.warn(
-        `[${requestId}] User ${session.user.id} lacks write permission for workspace ${workspaceId}`
-      )
-      return NextResponse.json({ error: 'Write access required' }, { status: 403 })
-    }
-
-    const workflowIds = updates.map((u) => u.id)
-    const existingWorkflows = await db
-      .select({ id: workflow.id, workspaceId: workflow.workspaceId })
-      .from(workflow)
-      .where(inArray(workflow.id, workflowIds))
-
-    const validIds = new Set(
-      existingWorkflows.filter((w) => w.workspaceId === workspaceId).map((w) => w.id)
-    )
-
-    const validUpdates = updates.filter((u) => validIds.has(u.id))
-
-    if (validUpdates.length === 0) {
-      return NextResponse.json({ error: 'No valid workflows to update' }, { status: 400 })
-    }
-
-    await db.transaction(async (tx) => {
-      for (const update of validUpdates) {
-        const updateData: Record<string, unknown> = {
-          sortOrder: update.sortOrder,
-          updatedAt: new Date(),
-        }
-        if (update.folderId !== undefined) {
-          updateData.folderId = update.folderId
-        }
-        await tx.update(workflow).set(updateData).where(eq(workflow.id, update.id))
-      }
-    })
-
-    logger.info(
-      `[${requestId}] Reordered ${validUpdates.length} workflows in workspace ${workspaceId}`
-    )
-
-    return NextResponse.json({ success: true, updated: validUpdates.length })
-  } catch (error) {
-    if (error instanceof z.ZodError) {
-      logger.warn(`[${requestId}] Invalid reorder data`, { errors: error.errors })
-      return NextResponse.json(
-        { error: 'Invalid request data', details: error.errors },
-        { status: 400 }
-      )
-    }
-
-    logger.error(`[${requestId}] Error reordering workflows`, error)
-    return NextResponse.json({ error: 'Failed to reorder workflows' }, { status: 500 })
-  }
-}

apps/sim/app/api/workflows/route.ts

@@ -1,7 +1,7 @@
 import { db } from '@sim/db'
 import { workflow, workspace } from '@sim/db/schema'
 import { createLogger } from '@sim/logger'
-import { and, eq, isNull, max } from 'drizzle-orm'
+import { eq } from 'drizzle-orm'
 import { type NextRequest, NextResponse } from 'next/server'
 import { z } from 'zod'
 import { getSession } from '@/lib/auth'
@@ -131,23 +131,11 @@ export async function POST(req: NextRequest) {
         // Silently fail
       })
 
-    const folderCondition = folderId ? eq(workflow.folderId, folderId) : isNull(workflow.folderId)
-    const [maxResult] = await db
-      .select({ maxOrder: max(workflow.sortOrder) })
-      .from(workflow)
-      .where(
-        workspaceId
-          ? and(eq(workflow.workspaceId, workspaceId), folderCondition)
-          : and(eq(workflow.userId, session.user.id), folderCondition)
-      )
-    const sortOrder = (maxResult?.maxOrder ?? -1) + 1
-
     await db.insert(workflow).values({
       id: workflowId,
       userId: session.user.id,
       workspaceId: workspaceId || null,
       folderId: folderId || null,
-      sortOrder,
       name,
       description,
       color,
@@ -168,7 +156,6 @@ export async function POST(req: NextRequest) {
       color,
       workspaceId,
       folderId,
-      sortOrder,
       createdAt: now,
       updatedAt: now,
     })

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/deploy/components/deploy-modal/components/chat/chat.tsx

@@ -23,7 +23,7 @@ import { Alert, AlertDescription, Skeleton } from '@/components/ui'
 import { getEnv, isTruthy } from '@/lib/core/config/env'
 import { generatePassword } from '@/lib/core/security/encryption'
 import { cn } from '@/lib/core/utils/cn'
-import { getBaseUrl, getEmailDomain } from '@/lib/core/utils/urls'
+import { getEmailDomain } from '@/lib/core/utils/urls'
 import { quickValidateEmail } from '@/lib/messaging/email/validation'
 import { OutputSelect } from '@/app/workspace/[workspaceId]/w/[workflowId]/components/chat/components/output-select/output-select'
 import {
@@ -493,7 +493,7 @@ function IdentifierInput({
     onChange(lowercaseValue)
   }
 
-  const fullUrl = `${getBaseUrl()}/chat/${value}`
+  const fullUrl = `${getEnv('NEXT_PUBLIC_APP_URL')}/chat/${value}`
   const displayUrl = fullUrl.replace(/^https?:\/\//, '')
 
   return (

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/deploy/components/deploy-modal/components/form/form.tsx

@@ -14,6 +14,7 @@ import {
   Tooltip,
 } from '@/components/emcn'
 import { Skeleton } from '@/components/ui'
+import { getEnv } from '@/lib/core/config/env'
 import { isDev } from '@/lib/core/config/feature-flags'
 import { cn } from '@/lib/core/utils/cn'
 import { getBaseUrl, getEmailDomain } from '@/lib/core/utils/urls'
@@ -391,7 +392,7 @@ export function FormDeploy({
     )
   }
 
-  const fullUrl = `${getBaseUrl()}/form/${identifier}`
+  const fullUrl = `${getEnv('NEXT_PUBLIC_APP_URL')}/form/${identifier}`
   const displayUrl = fullUrl.replace(/^https?:\/\//, '')
 
   return (

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/deploy/components/deploy-modal/deploy-modal.tsx

@@ -15,7 +15,7 @@ import {
   ModalTabsList,
   ModalTabsTrigger,
 } from '@/components/emcn'
-import { getBaseUrl } from '@/lib/core/utils/urls'
+import { getEnv } from '@/lib/core/config/env'
 import { getInputFormatExample as getInputFormatExampleUtil } from '@/lib/workflows/operations/deployment-utils'
 import type { WorkflowDeploymentVersionResponse } from '@/lib/workflows/persistence/utils'
 import { useUserPermissionsContext } from '@/app/workspace/[workspaceId]/providers/workspace-permissions-provider'
@@ -209,7 +209,7 @@ export function DeployModal({
         }
 
         const data = await response.json()
-        const endpoint = `${getBaseUrl()}/api/workflows/${workflowId}/execute`
+        const endpoint = `${getEnv('NEXT_PUBLIC_APP_URL')}/api/workflows/${workflowId}/execute`
         const inputFormatExample = getInputFormatExample(selectedStreamingOutputs.length > 0)
         const placeholderKey = workflowWorkspaceId ? 'YOUR_WORKSPACE_API_KEY' : 'YOUR_API_KEY'
 
@@ -270,7 +270,7 @@ export function DeployModal({
       const deploymentInfoResponse = await fetch(`/api/workflows/${workflowId}/deploy`)
       if (deploymentInfoResponse.ok) {
         const deploymentData = await deploymentInfoResponse.json()
-        const apiEndpoint = `${getBaseUrl()}/api/workflows/${workflowId}/execute`
+        const apiEndpoint = `${getEnv('NEXT_PUBLIC_APP_URL')}/api/workflows/${workflowId}/execute`
         const inputFormatExample = getInputFormatExample(selectedStreamingOutputs.length > 0)
         const placeholderKey = getApiHeaderPlaceholder()
 
@@ -409,7 +409,7 @@ export function DeployModal({
         const deploymentInfoResponse = await fetch(`/api/workflows/${workflowId}/deploy`)
         if (deploymentInfoResponse.ok) {
           const deploymentData = await deploymentInfoResponse.json()
-          const apiEndpoint = `${getBaseUrl()}/api/workflows/${workflowId}/execute`
+          const apiEndpoint = `${getEnv('NEXT_PUBLIC_APP_URL')}/api/workflows/${workflowId}/execute`
           const inputFormatExample = getInputFormatExample(selectedStreamingOutputs.length > 0)
           const placeholderKey = getApiHeaderPlaceholder()
 
@@ -526,7 +526,7 @@ export function DeployModal({
     const deploymentInfoResponse = await fetch(`/api/workflows/${workflowId}/deploy`)
     if (deploymentInfoResponse.ok) {
       const deploymentData = await deploymentInfoResponse.json()
-      const apiEndpoint = `${getBaseUrl()}/api/workflows/${workflowId}/execute`
+      const apiEndpoint = `${getEnv('NEXT_PUBLIC_APP_URL')}/api/workflows/${workflowId}/execute`
       const inputFormatExample = getInputFormatExample(selectedStreamingOutputs.length > 0)
 
       const placeholderKey = getApiHeaderPlaceholder()

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx

@@ -36,8 +36,6 @@ interface FolderItemProps {
     onDragEnter?: (e: React.DragEvent<HTMLElement>) => void
     onDragLeave?: (e: React.DragEvent<HTMLElement>) => void
   }
-  onDragStart?: () => void
-  onDragEnd?: () => void
 }
 
 /**
@@ -48,13 +46,7 @@ interface FolderItemProps {
  * @param props - Component props
  * @returns Folder item with drag and expand support
  */
-export function FolderItem({
-  folder,
-  level,
-  hoverHandlers,
-  onDragStart: onDragStartProp,
-  onDragEnd: onDragEndProp,
-}: FolderItemProps) {
+export function FolderItem({ folder, level, hoverHandlers }: FolderItemProps) {
   const params = useParams()
   const router = useRouter()
   const workspaceId = params.workspaceId as string
@@ -144,6 +136,11 @@ export function FolderItem({
     }
   }, [createFolderMutation, workspaceId, folder.id, expandFolder])
 
+  /**
+   * Drag start handler - sets folder data for drag operation
+   *
+   * @param e - React drag event
+   */
   const onDragStart = useCallback(
     (e: React.DragEvent) => {
       if (isEditing) {
@@ -153,25 +150,14 @@ export function FolderItem({
 
       e.dataTransfer.setData('folder-id', folder.id)
       e.dataTransfer.effectAllowed = 'move'
-      onDragStartProp?.()
     },
-    [folder.id, onDragStartProp]
+    [folder.id]
   )
 
-  const {
-    isDragging,
-    shouldPreventClickRef,
-    handleDragStart,
-    handleDragEnd: handleDragEndBase,
-  } = useItemDrag({
+  const { isDragging, shouldPreventClickRef, handleDragStart, handleDragEnd } = useItemDrag({
     onDragStart,
   })
 
-  const handleDragEnd = useCallback(() => {
-    handleDragEndBase()
-    onDragEndProp?.()
-  }, [handleDragEndBase, onDragEndProp])
-
   const {
     isOpen: isContextMenuOpen,
     position,

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx

@@ -29,8 +29,6 @@ interface WorkflowItemProps {
   active: boolean
   level: number
   onWorkflowClick: (workflowId: string, shiftKey: boolean, metaKey: boolean) => void
-  onDragStart?: () => void
-  onDragEnd?: () => void
 }
 
 /**
@@ -40,14 +38,7 @@ interface WorkflowItemProps {
  * @param props - Component props
  * @returns Workflow item with drag and selection support
  */
-export function WorkflowItem({
-  workflow,
-  active,
-  level,
-  onWorkflowClick,
-  onDragStart: onDragStartProp,
-  onDragEnd: onDragEndProp,
-}: WorkflowItemProps) {
+export function WorkflowItem({ workflow, active, level, onWorkflowClick }: WorkflowItemProps) {
   const params = useParams()
   const workspaceId = params.workspaceId as string
   const { selectedWorkflows } = useFolderStore()
@@ -113,6 +104,11 @@ export function WorkflowItem({
     [workflow.id, updateWorkflow]
   )
 
+  /**
+   * Drag start handler - handles workflow dragging with multi-selection support
+   *
+   * @param e - React drag event
+   */
   const onDragStart = useCallback(
     (e: React.DragEvent) => {
       if (isEditing) {
@@ -125,25 +121,14 @@ export function WorkflowItem({
 
       e.dataTransfer.setData('workflow-ids', JSON.stringify(workflowIds))
       e.dataTransfer.effectAllowed = 'move'
-      onDragStartProp?.()
     },
-    [isSelected, selectedWorkflows, workflow.id, onDragStartProp]
+    [isSelected, selectedWorkflows, workflow.id]
   )
 
-  const {
-    isDragging,
-    shouldPreventClickRef,
-    handleDragStart,
-    handleDragEnd: handleDragEndBase,
-  } = useItemDrag({
+  const { isDragging, shouldPreventClickRef, handleDragStart, handleDragEnd } = useItemDrag({
     onDragStart,
   })
 
-  const handleDragEnd = useCallback(() => {
-    handleDragEndBase()
-    onDragEndProp?.()
-  }, [handleDragEndBase, onDragEndProp])
-
   const {
     isOpen: isContextMenuOpen,
     position,

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/workflow-list.tsx

@@ -14,6 +14,9 @@ import { useFolderStore } from '@/stores/folders/store'
 import type { FolderTreeNode } from '@/stores/folders/types'
 import type { WorkflowMetadata } from '@/stores/workflows/registry/types'
 
+/**
+ * Constants for tree layout and styling
+ */
 const TREE_SPACING = {
   INDENT_PER_LEVEL: 20,
 } as const
@@ -26,18 +29,12 @@ interface WorkflowListProps {
   scrollContainerRef: React.RefObject<HTMLDivElement | null>
 }
 
-function DropIndicatorLine({ show, level = 0 }: { show: boolean; level?: number }) {
-  if (!show) return null
-  return (
-    <div
-      className='pointer-events-none absolute left-0 right-0 z-20 flex items-center'
-      style={{ paddingLeft: `${level * TREE_SPACING.INDENT_PER_LEVEL}px` }}
-    >
-      <div className='h-[2px] flex-1 rounded-full bg-[#0096FF]' />
-    </div>
-  )
-}
-
+/**
+ * WorkflowList component displays workflows organized by folders with drag-and-drop support.
+ *
+ * @param props - Component props
+ * @returns Workflow list with folders and drag-drop support
+ */
 export function WorkflowList({
   regularWorkflows,
   isLoading = false,
@@ -51,20 +48,20 @@ export function WorkflowList({
   const workflowId = params.workflowId as string
 
   const { isLoading: foldersLoading } = useFolders(workspaceId)
+
   const { getFolderTree, expandedFolders, getFolderPath, setExpanded } = useFolderStore()
 
   const {
-    dropIndicator,
+    dropTargetId,
     isDragging,
     setScrollContainer,
-    createWorkflowDragHandlers,
     createFolderDragHandlers,
-    createEmptyFolderDropZone,
-    createRootDropZone,
-    handleDragStart,
-    handleDragEnd,
+    createItemDragHandlers,
+    createRootDragHandlers,
+    createFolderHeaderHoverHandlers,
   } = useDragDrop()
 
+  // Set scroll container when ref changes
   useEffect(() => {
     if (scrollContainerRef.current) {
       setScrollContainer(scrollContainerRef.current)
@@ -79,22 +76,23 @@ export function WorkflowList({
     return activeWorkflow?.folderId || null
   }, [workflowId, regularWorkflows, isLoading, foldersLoading])
 
-  const workflowsByFolder = useMemo(() => {
-    const grouped = regularWorkflows.reduce(
-      (acc, workflow) => {
-        const folderId = workflow.folderId || 'root'
-        if (!acc[folderId]) acc[folderId] = []
-        acc[folderId].push(workflow)
-        return acc
-      },
-      {} as Record<string, WorkflowMetadata[]>
-    )
-    for (const folderId of Object.keys(grouped)) {
-      grouped[folderId].sort((a, b) => a.sortOrder - b.sortOrder)
-    }
-    return grouped
-  }, [regularWorkflows])
+  const workflowsByFolder = useMemo(
+    () =>
+      regularWorkflows.reduce(
+        (acc, workflow) => {
+          const folderId = workflow.folderId || 'root'
+          if (!acc[folderId]) acc[folderId] = []
+          acc[folderId].push(workflow)
+          return acc
+        },
+        {} as Record<string, WorkflowMetadata[]>
+      ),
+    [regularWorkflows]
+  )
 
+  /**
+   * Build a flat list of all workflow IDs in display order for range selection
+   */
   const orderedWorkflowIds = useMemo(() => {
     const ids: string[] = []
 
@@ -108,10 +106,12 @@ export function WorkflowList({
       }
     }
 
+    // Collect from folders first
     for (const folder of folderTree) {
       collectWorkflowIds(folder)
     }
 
+    // Then collect root workflows
     const rootWorkflows = workflowsByFolder.root || []
     for (const workflow of rootWorkflows) {
       ids.push(workflow.id)
@@ -120,24 +120,30 @@ export function WorkflowList({
     return ids
   }, [folderTree, workflowsByFolder])
 
+  // Workflow selection hook - uses active workflow ID as anchor for range selection
   const { handleWorkflowClick } = useWorkflowSelection({
     workflowIds: orderedWorkflowIds,
     activeWorkflowId: workflowId,
   })
 
   const isWorkflowActive = useCallback(
-    (wfId: string) => pathname === `/workspace/${workspaceId}/w/${wfId}`,
+    (workflowId: string) => pathname === `/workspace/${workspaceId}/w/${workflowId}`,
     [pathname, workspaceId]
   )
 
+  /**
+   * Auto-expand folders and select active workflow.
+   */
   useEffect(() => {
     if (!workflowId || isLoading || foldersLoading) return
 
+    // Expand folder path to reveal workflow
     if (activeWorkflowFolderId) {
       const folderPath = getFolderPath(activeWorkflowFolderId)
       folderPath.forEach((folder) => setExpanded(folder.id, true))
     }
 
+    // Select workflow if not already selected
     const { selectedWorkflows, selectOnly } = useFolderStore.getState()
     if (!selectedWorkflows.has(workflowId)) {
       selectOnly(workflowId)
@@ -145,40 +151,23 @@ export function WorkflowList({
   }, [workflowId, activeWorkflowFolderId, isLoading, foldersLoading, getFolderPath, setExpanded])
 
   const renderWorkflowItem = useCallback(
-    (workflow: WorkflowMetadata, level: number, folderId: string | null = null) => {
-      const showBefore =
-        dropIndicator?.targetId === workflow.id && dropIndicator?.position === 'before'
-      const showAfter =
-        dropIndicator?.targetId === workflow.id && dropIndicator?.position === 'after'
-
-      return (
-        <div key={workflow.id} className='relative'>
-          <DropIndicatorLine show={showBefore} level={level} />
-          <div
-            style={{ paddingLeft: `${level * TREE_SPACING.INDENT_PER_LEVEL}px` }}
-            {...createWorkflowDragHandlers(workflow.id, folderId)}
-          >
-            <WorkflowItem
-              workflow={workflow}
-              active={isWorkflowActive(workflow.id)}
-              level={level}
-              onWorkflowClick={handleWorkflowClick}
-              onDragStart={() => handleDragStart('workflow')}
-              onDragEnd={handleDragEnd}
-            />
-          </div>
-          <DropIndicatorLine show={showAfter} level={level} />
+    (workflow: WorkflowMetadata, level: number, parentFolderId: string | null = null) => (
+      <div key={workflow.id} className='relative' {...createItemDragHandlers(parentFolderId)}>
+        <div
+          style={{
+            paddingLeft: `${level * TREE_SPACING.INDENT_PER_LEVEL}px`,
+          }}
+        >
+          <WorkflowItem
+            workflow={workflow}
+            active={isWorkflowActive(workflow.id)}
+            level={level}
+            onWorkflowClick={handleWorkflowClick}
+          />
         </div>
-      )
-    },
-    [
-      dropIndicator,
-      isWorkflowActive,
-      createWorkflowDragHandlers,
-      handleWorkflowClick,
-      handleDragStart,
-      handleDragEnd,
-    ]
+      </div>
+    ),
+    [isWorkflowActive, createItemDragHandlers, handleWorkflowClick]
   )
 
   const renderFolderSection = useCallback(
@@ -190,72 +179,45 @@ export function WorkflowList({
       const workflowsInFolder = workflowsByFolder[folder.id] || []
       const isExpanded = expandedFolders.has(folder.id)
       const hasChildren = workflowsInFolder.length > 0 || folder.children.length > 0
-
-      const showBefore =
-        dropIndicator?.targetId === folder.id && dropIndicator?.position === 'before'
-      const showAfter = dropIndicator?.targetId === folder.id && dropIndicator?.position === 'after'
-      const showInside =
-        dropIndicator?.targetId === folder.id && dropIndicator?.position === 'inside'
-
-      const childItems: Array<{
-        type: 'folder' | 'workflow'
-        id: string
-        sortOrder: number
-        data: FolderTreeNode | WorkflowMetadata
-      }> = []
-      for (const childFolder of folder.children) {
-        childItems.push({
-          type: 'folder',
-          id: childFolder.id,
-          sortOrder: childFolder.sortOrder,
-          data: childFolder,
-        })
-      }
-      for (const workflow of workflowsInFolder) {
-        childItems.push({
-          type: 'workflow',
-          id: workflow.id,
-          sortOrder: workflow.sortOrder,
-          data: workflow,
-        })
-      }
-      childItems.sort((a, b) => a.sortOrder - b.sortOrder)
+      const isDropTarget = dropTargetId === folder.id
 
       return (
-        <div key={folder.id} className='relative'>
-          <DropIndicatorLine show={showBefore} level={level} />
+        <div key={folder.id} className='relative' {...createFolderDragHandlers(folder.id)}>
+          {/* Drop target highlight overlay - always rendered for stable DOM */}
           <div
             className={clsx(
-              'rounded-[4px] transition-colors duration-75',
-              showInside && isDragging && 'bg-[#0096FF]/10'
+              'pointer-events-none absolute inset-0 z-10 rounded-[4px] transition-opacity duration-75',
+              isDropTarget && isDragging ? 'bg-gray-400/20 opacity-100' : 'opacity-0'
             )}
+          />
+
+          <div
             style={{ paddingLeft: `${level * TREE_SPACING.INDENT_PER_LEVEL}px` }}
-            {...createFolderDragHandlers(folder.id, parentFolderId)}
+            {...createItemDragHandlers(folder.id)}
           >
             <FolderItem
               folder={folder}
               level={level}
-              onDragStart={() => handleDragStart('folder')}
-              onDragEnd={handleDragEnd}
+              hoverHandlers={createFolderHeaderHoverHandlers(folder.id)}
             />
           </div>
-          <DropIndicatorLine show={showAfter} level={level} />
 
-          {isExpanded && (
-            <div className='relative'>
+          {isExpanded && hasChildren && (
+            <div className='relative' {...createItemDragHandlers(folder.id)}>
+              {/* Vertical line - positioned to align under folder chevron */}
               <div
                 className='pointer-events-none absolute top-0 bottom-0 w-px bg-[var(--border)]'
                 style={{ left: `${level * TREE_SPACING.INDENT_PER_LEVEL + 12}px` }}
               />
               <div className='mt-[2px] space-y-[2px] pl-[2px]'>
-                {childItems.map((item) =>
-                  item.type === 'folder'
-                    ? renderFolderSection(item.data as FolderTreeNode, level + 1, folder.id)
-                    : renderWorkflowItem(item.data as WorkflowMetadata, level + 1, folder.id)
-                )}
-                {!hasChildren && (
-                  <div className='h-[24px]' {...createEmptyFolderDropZone(folder.id)} />
+                {workflowsInFolder.map((workflow: WorkflowMetadata) =>
+                  renderWorkflowItem(workflow, level + 1, folder.id)
                 )}
+                {folder.children.map((childFolder) => (
+                  <div key={childFolder.id} className='relative'>
+                    {renderFolderSection(childFolder, level + 1, folder.id)}
+                  </div>
+                ))}
               </div>
             </div>
           )}
@@ -265,46 +227,29 @@ export function WorkflowList({
     [
       workflowsByFolder,
       expandedFolders,
-      dropIndicator,
+      dropTargetId,
       isDragging,
       createFolderDragHandlers,
-      createEmptyFolderDropZone,
-      handleDragStart,
-      handleDragEnd,
+      createItemDragHandlers,
+      createFolderHeaderHoverHandlers,
       renderWorkflowItem,
     ]
   )
 
-  const rootDropZoneHandlers = createRootDropZone()
+  const handleRootDragEvents = createRootDragHandlers()
   const rootWorkflows = workflowsByFolder.root || []
+  const isRootDropTarget = dropTargetId === 'root'
+  const hasRootWorkflows = rootWorkflows.length > 0
+  const hasFolders = folderTree.length > 0
 
-  const rootItems = useMemo(() => {
-    const items: Array<{
-      type: 'folder' | 'workflow'
-      id: string
-      sortOrder: number
-      data: FolderTreeNode | WorkflowMetadata
-    }> = []
-    for (const folder of folderTree) {
-      items.push({ type: 'folder', id: folder.id, sortOrder: folder.sortOrder, data: folder })
-    }
-    for (const workflow of rootWorkflows) {
-      items.push({
-        type: 'workflow',
-        id: workflow.id,
-        sortOrder: workflow.sortOrder,
-        data: workflow,
-      })
-    }
-    return items.sort((a, b) => a.sortOrder - b.sortOrder)
-  }, [folderTree, rootWorkflows])
-
-  const hasRootItems = rootItems.length > 0
-  const showRootInside = dropIndicator?.targetId === 'root' && dropIndicator?.position === 'inside'
-
+  /**
+   * Handle click on empty space to revert to active workflow selection
+   */
   const handleContainerClick = useCallback(
     (e: React.MouseEvent<HTMLDivElement>) => {
+      // Only handle clicks directly on the container (empty space)
       if (e.target !== e.currentTarget) return
+
       const { selectOnly, clearSelection } = useFolderStore.getState()
       workflowId ? selectOnly(workflowId) : clearSelection()
     },
@@ -313,20 +258,36 @@ export function WorkflowList({
 
   return (
     <div className='flex min-h-full flex-col pb-[8px]' onClick={handleContainerClick}>
+      {/* Folders Section */}
+      {hasFolders && (
+        <div className='mb-[2px] space-y-[2px]'>
+          {folderTree.map((folder) => renderFolderSection(folder, 0))}
+        </div>
+      )}
+
+      {/* Root Workflows Section - Expands to fill remaining space */}
       <div
-        className={clsx(
-          'relative flex-1 rounded-[4px] transition-colors duration-75',
-          !hasRootItems && 'min-h-[26px]',
-          showRootInside && isDragging && 'bg-[#0096FF]/10'
-        )}
-        {...rootDropZoneHandlers}
+        className={clsx('relative flex-1', !hasRootWorkflows && 'min-h-[26px]')}
+        {...handleRootDragEvents}
       >
-        <div className='space-y-[2px]'>
-          {rootItems.map((item) =>
-            item.type === 'folder'
-              ? renderFolderSection(item.data as FolderTreeNode, 0, null)
-              : renderWorkflowItem(item.data as WorkflowMetadata, 0, null)
+        {/* Root drop target highlight overlay - always rendered for stable DOM */}
+        <div
+          className={clsx(
+            'pointer-events-none absolute inset-0 z-10 rounded-[4px] transition-opacity duration-75',
+            isRootDropTarget && isDragging ? 'bg-gray-400/20 opacity-100' : 'opacity-0'
           )}
+        />
+
+        <div className='space-y-[2px]'>
+          {rootWorkflows.map((workflow: WorkflowMetadata) => (
+            <WorkflowItem
+              key={workflow.id}
+              workflow={workflow}
+              active={isWorkflowActive(workflow.id)}
+              level={0}
+              onWorkflowClick={handleWorkflowClick}
+            />
+          ))}
         </div>
       </div>
 

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/hooks/index.ts

@@ -1,6 +1,6 @@
 export { useAutoScroll } from './use-auto-scroll'
 export { useContextMenu } from './use-context-menu'
-export { type DropIndicator, useDragDrop } from './use-drag-drop'
+export { useDragDrop } from './use-drag-drop'
 export { useFolderExpand } from './use-folder-expand'
 export { useFolderOperations } from './use-folder-operations'
 export { useItemDrag } from './use-item-drag'

apps/sim/app/workspace/[workspaceId]/w/components/sidebar/hooks/use-drag-drop.ts

@@ -1,39 +1,47 @@
 import { useCallback, useEffect, useRef, useState } from 'react'
 import { createLogger } from '@sim/logger'
 import { useParams } from 'next/navigation'
-import { useReorderFolders } from '@/hooks/queries/folders'
-import { useReorderWorkflows } from '@/hooks/queries/workflows'
+import { useUpdateFolder } from '@/hooks/queries/folders'
 import { useFolderStore } from '@/stores/folders/store'
 import { useWorkflowRegistry } from '@/stores/workflows/registry/store'
 
 const logger = createLogger('WorkflowList:DragDrop')
 
-const SCROLL_THRESHOLD = 60
-const SCROLL_SPEED = 8
-const HOVER_EXPAND_DELAY = 400
+/**
+ * Constants for auto-scroll behavior
+ */
+const SCROLL_THRESHOLD = 60 // Distance from edge to trigger scroll
+const SCROLL_SPEED = 8 // Pixels per frame
 
-export interface DropIndicator {
-  targetId: string
-  position: 'before' | 'after' | 'inside'
-  folderId: string | null
-}
+/**
+ * Constants for folder auto-expand on hover during drag
+ */
+const HOVER_EXPAND_DELAY = 400 // Milliseconds to wait before expanding folder
 
+/**
+ * Custom hook for handling drag and drop operations for workflows and folders.
+ * Includes auto-scrolling, drop target highlighting, and hover-to-expand.
+ *
+ * @returns Drag and drop state and event handlers
+ */
 export function useDragDrop() {
-  const [dropIndicator, setDropIndicator] = useState<DropIndicator | null>(null)
+  const [dropTargetId, setDropTargetId] = useState<string | null>(null)
   const [isDragging, setIsDragging] = useState(false)
   const [hoverFolderId, setHoverFolderId] = useState<string | null>(null)
   const scrollContainerRef = useRef<HTMLDivElement | null>(null)
   const scrollIntervalRef = useRef<number | null>(null)
   const hoverExpandTimerRef = useRef<number | null>(null)
   const lastDragYRef = useRef<number>(0)
-  const draggedTypeRef = useRef<'workflow' | 'folder' | null>(null)
 
   const params = useParams()
   const workspaceId = params.workspaceId as string | undefined
-  const reorderWorkflowsMutation = useReorderWorkflows()
-  const reorderFoldersMutation = useReorderFolders()
+  const updateFolderMutation = useUpdateFolder()
   const { setExpanded, expandedFolders } = useFolderStore()
+  const { updateWorkflow } = useWorkflowRegistry()
 
+  /**
+   * Auto-scroll handler - scrolls container when dragging near edges
+   */
   const handleAutoScroll = useCallback(() => {
     if (!scrollContainerRef.current || !isDragging) return
 
@@ -41,17 +49,22 @@ export function useDragDrop() {
     const rect = container.getBoundingClientRect()
     const mouseY = lastDragYRef.current
 
+    // Only scroll if mouse is within container bounds
     if (mouseY < rect.top || mouseY > rect.bottom) return
 
+    // Calculate distance from top and bottom edges
     const distanceFromTop = mouseY - rect.top
     const distanceFromBottom = rect.bottom - mouseY
 
     let scrollDelta = 0
 
+    // Scroll up if near top and not at scroll top
     if (distanceFromTop < SCROLL_THRESHOLD && container.scrollTop > 0) {
       const intensity = Math.max(0, Math.min(1, 1 - distanceFromTop / SCROLL_THRESHOLD))
       scrollDelta = -SCROLL_SPEED * intensity
-    } else if (distanceFromBottom < SCROLL_THRESHOLD) {
+    }
+    // Scroll down if near bottom and not at scroll bottom
+    else if (distanceFromBottom < SCROLL_THRESHOLD) {
       const maxScroll = container.scrollHeight - container.clientHeight
       if (container.scrollTop < maxScroll) {
         const intensity = Math.max(0, Math.min(1, 1 - distanceFromBottom / SCROLL_THRESHOLD))
@@ -64,9 +77,12 @@ export function useDragDrop() {
     }
   }, [isDragging])
 
+  /**
+   * Start auto-scroll animation loop
+   */
   useEffect(() => {
     if (isDragging) {
-      scrollIntervalRef.current = window.setInterval(handleAutoScroll, 10)
+      scrollIntervalRef.current = window.setInterval(handleAutoScroll, 10) // ~100fps for smoother response
     } else {
       if (scrollIntervalRef.current) {
         clearInterval(scrollIntervalRef.current)
@@ -81,17 +97,30 @@ export function useDragDrop() {
     }
   }, [isDragging, handleAutoScroll])
 
+  /**
+   * Handle hover folder changes - start/clear expand timer
+   */
   useEffect(() => {
+    // Clear existing timer when hover folder changes
     if (hoverExpandTimerRef.current) {
       clearTimeout(hoverExpandTimerRef.current)
       hoverExpandTimerRef.current = null
     }
 
-    if (!isDragging || !hoverFolderId) return
-    if (expandedFolders.has(hoverFolderId)) return
+    // Don't start timer if not dragging or no folder is hovered
+    if (!isDragging || !hoverFolderId) {
+      return
+    }
 
+    // Don't expand if folder is already expanded
+    if (expandedFolders.has(hoverFolderId)) {
+      return
+    }
+
+    // Start timer to expand folder after delay
     hoverExpandTimerRef.current = window.setTimeout(() => {
       setExpanded(hoverFolderId, true)
+      logger.info(`Auto-expanded folder ${hoverFolderId} during drag`)
     }, HOVER_EXPAND_DELAY)
 
     return () => {
@@ -102,333 +131,249 @@ export function useDragDrop() {
     }
   }, [hoverFolderId, isDragging, expandedFolders, setExpanded])
 
+  /**
+   * Cleanup hover state when dragging stops
+   */
   useEffect(() => {
     if (!isDragging) {
       setHoverFolderId(null)
-      setDropIndicator(null)
-      draggedTypeRef.current = null
     }
   }, [isDragging])
 
-  const calculateDropPosition = useCallback(
-    (e: React.DragEvent, element: HTMLElement): 'before' | 'after' => {
-      const rect = element.getBoundingClientRect()
-      const midY = rect.top + rect.height / 2
-      return e.clientY < midY ? 'before' : 'after'
-    },
-    []
-  )
-
+  /**
+   * Moves one or more workflows to a target folder
+   *
+   * @param workflowIds - Array of workflow IDs to move
+   * @param targetFolderId - Target folder ID or null for root
+   */
   const handleWorkflowDrop = useCallback(
-    async (workflowIds: string[], indicator: DropIndicator) => {
-      if (!workflowIds.length || !workspaceId) return
+    async (workflowIds: string[], targetFolderId: string | null) => {
+      if (!workflowIds.length) {
+        logger.warn('No workflows to move')
+        return
+      }
 
       try {
-        const destinationFolderId =
-          indicator.position === 'inside'
-            ? indicator.targetId === 'root'
-              ? null
-              : indicator.targetId
-            : indicator.folderId
-
-        type SiblingItem = { type: 'folder' | 'workflow'; id: string; sortOrder: number }
-        const currentFolders = useFolderStore.getState().folders
-        const currentWorkflows = useWorkflowRegistry.getState().workflows
-        const siblingFolders = Object.values(currentFolders).filter(
-          (f) => f.parentId === destinationFolderId
+        await Promise.all(
+          workflowIds.map((workflowId) => updateWorkflow(workflowId, { folderId: targetFolderId }))
         )
-        const siblingWorkflows = Object.values(currentWorkflows).filter(
-          (w) => w.folderId === destinationFolderId
-        )
-
-        const siblingItems: SiblingItem[] = [
-          ...siblingFolders.map((f) => ({
-            type: 'folder' as const,
-            id: f.id,
-            sortOrder: f.sortOrder,
-          })),
-          ...siblingWorkflows.map((w) => ({
-            type: 'workflow' as const,
-            id: w.id,
-            sortOrder: w.sortOrder,
-          })),
-        ].sort((a, b) => a.sortOrder - b.sortOrder)
-
-        const movingSet = new Set(workflowIds)
-        const remaining = siblingItems.filter(
-          (item) => !(item.type === 'workflow' && movingSet.has(item.id))
-        )
-        const moving = workflowIds.map((id) => ({ type: 'workflow' as const, id, sortOrder: 0 }))
-
-        let insertAt: number
-        if (indicator.position === 'inside') {
-          insertAt = remaining.length
-        } else {
-          const targetIdx = remaining.findIndex((item) => item.id === indicator.targetId)
-          insertAt = indicator.position === 'before' ? targetIdx : targetIdx + 1
-        }
-
-        const newOrder: SiblingItem[] = [
-          ...remaining.slice(0, insertAt),
-          ...moving,
-          ...remaining.slice(insertAt),
-        ]
-
-        const folderUpdates = newOrder
-          .map((item, i) => ({ ...item, sortOrder: i }))
-          .filter((item) => item.type === 'folder')
-          .map((item) => ({
-            id: item.id,
-            sortOrder: item.sortOrder,
-            parentId: destinationFolderId,
-          }))
-
-        const workflowUpdates = newOrder
-          .map((item, i) => ({ ...item, sortOrder: i }))
-          .filter((item) => item.type === 'workflow')
-          .map((item) => ({
-            id: item.id,
-            sortOrder: item.sortOrder,
-            folderId: destinationFolderId,
-          }))
-
-        await Promise.all([
-          folderUpdates.length > 0 &&
-            reorderFoldersMutation.mutateAsync({ workspaceId, updates: folderUpdates }),
-          workflowUpdates.length > 0 &&
-            reorderWorkflowsMutation.mutateAsync({ workspaceId, updates: workflowUpdates }),
-        ])
+        logger.info(`Moved ${workflowIds.length} workflow(s)`)
       } catch (error) {
-        logger.error('Failed to reorder workflows:', error)
+        logger.error('Failed to move workflows:', error)
       }
     },
-    [workspaceId, reorderFoldersMutation, reorderWorkflowsMutation]
+    [updateWorkflow]
   )
 
-  const handleFolderDrop = useCallback(
-    async (draggedFolderId: string, indicator: DropIndicator) => {
-      if (!draggedFolderId || !workspaceId) return
+  /**
+   * Moves a folder to a new parent folder, with validation
+   *
+   * @param draggedFolderId - ID of the folder being moved
+   * @param targetFolderId - Target folder ID or null for root
+   */
+  const handleFolderMove = useCallback(
+    async (draggedFolderId: string, targetFolderId: string | null) => {
+      if (!draggedFolderId) {
+        logger.warn('No folder to move')
+        return
+      }
 
       try {
         const folderStore = useFolderStore.getState()
-        const currentFolders = folderStore.folders
+        const draggedFolderPath = folderStore.getFolderPath(draggedFolderId)
 
-        const targetParentId =
-          indicator.position === 'inside'
-            ? indicator.targetId === 'root'
-              ? null
-              : indicator.targetId
-            : indicator.folderId
+        // Prevent moving folder into its own descendant
+        if (
+          targetFolderId &&
+          draggedFolderPath.some((ancestor) => ancestor.id === targetFolderId)
+        ) {
+          logger.info('Cannot move folder into its own descendant')
+          return
+        }
 
-        if (draggedFolderId === targetParentId) {
+        // Prevent moving folder into itself
+        if (draggedFolderId === targetFolderId) {
           logger.info('Cannot move folder into itself')
           return
         }
 
-        if (targetParentId) {
-          const targetPath = folderStore.getFolderPath(targetParentId)
-          if (targetPath.some((f) => f.id === draggedFolderId)) {
-            logger.info('Cannot move folder into its own descendant')
-            return
-          }
+        if (!workspaceId) {
+          logger.warn('No workspaceId available for folder move')
+          return
         }
-
-        type SiblingItem = { type: 'folder' | 'workflow'; id: string; sortOrder: number }
-        const currentWorkflows = useWorkflowRegistry.getState().workflows
-        const siblingFolders = Object.values(currentFolders).filter(
-          (f) => f.parentId === targetParentId
-        )
-        const siblingWorkflows = Object.values(currentWorkflows).filter(
-          (w) => w.folderId === targetParentId
-        )
-
-        const siblingItems: SiblingItem[] = [
-          ...siblingFolders.map((f) => ({
-            type: 'folder' as const,
-            id: f.id,
-            sortOrder: f.sortOrder,
-          })),
-          ...siblingWorkflows.map((w) => ({
-            type: 'workflow' as const,
-            id: w.id,
-            sortOrder: w.sortOrder,
-          })),
-        ].sort((a, b) => a.sortOrder - b.sortOrder)
-
-        const remaining = siblingItems.filter(
-          (item) => !(item.type === 'folder' && item.id === draggedFolderId)
-        )
-
-        let insertAt: number
-        if (indicator.position === 'inside') {
-          insertAt = remaining.length
-        } else {
-          const targetIdx = remaining.findIndex((item) => item.id === indicator.targetId)
-          insertAt = indicator.position === 'before' ? targetIdx : targetIdx + 1
-        }
-
-        const newOrder: SiblingItem[] = [
-          ...remaining.slice(0, insertAt),
-          { type: 'folder', id: draggedFolderId, sortOrder: 0 },
-          ...remaining.slice(insertAt),
-        ]
-
-        const folderUpdates = newOrder
-          .map((item, i) => ({ ...item, sortOrder: i }))
-          .filter((item) => item.type === 'folder')
-          .map((item) => ({ id: item.id, sortOrder: item.sortOrder, parentId: targetParentId }))
-
-        const workflowUpdates = newOrder
-          .map((item, i) => ({ ...item, sortOrder: i }))
-          .filter((item) => item.type === 'workflow')
-          .map((item) => ({ id: item.id, sortOrder: item.sortOrder, folderId: targetParentId }))
-
-        await Promise.all([
-          folderUpdates.length > 0 &&
-            reorderFoldersMutation.mutateAsync({ workspaceId, updates: folderUpdates }),
-          workflowUpdates.length > 0 &&
-            reorderWorkflowsMutation.mutateAsync({ workspaceId, updates: workflowUpdates }),
-        ])
+        await updateFolderMutation.mutateAsync({
+          workspaceId,
+          id: draggedFolderId,
+          updates: { parentId: targetFolderId },
+        })
+        logger.info(`Moved folder to ${targetFolderId ? `folder ${targetFolderId}` : 'root'}`)
       } catch (error) {
-        logger.error('Failed to reorder folder:', error)
+        logger.error('Failed to move folder:', error)
       }
     },
-    [workspaceId, reorderFoldersMutation, reorderWorkflowsMutation]
+    [updateFolderMutation, workspaceId]
   )
 
-  const handleDrop = useCallback(
-    async (e: React.DragEvent) => {
+  /**
+   * Handles drop events for both workflows and folders
+   *
+   * @param e - React drag event
+   * @param targetFolderId - Target folder ID or null for root
+   */
+  const handleFolderDrop = useCallback(
+    async (e: React.DragEvent, targetFolderId: string | null) => {
       e.preventDefault()
       e.stopPropagation()
-
-      const indicator = dropIndicator
-      setDropIndicator(null)
+      setDropTargetId(null)
       setIsDragging(false)
 
-      if (!indicator) return
-
       try {
+        // Check if dropping workflows
         const workflowIdsData = e.dataTransfer.getData('workflow-ids')
         if (workflowIdsData) {
           const workflowIds = JSON.parse(workflowIdsData) as string[]
-          await handleWorkflowDrop(workflowIds, indicator)
+          await handleWorkflowDrop(workflowIds, targetFolderId)
           return
         }
 
+        // Check if dropping a folder
         const folderIdData = e.dataTransfer.getData('folder-id')
-        if (folderIdData) {
-          await handleFolderDrop(folderIdData, indicator)
+        if (folderIdData && targetFolderId !== folderIdData) {
+          await handleFolderMove(folderIdData, targetFolderId)
         }
       } catch (error) {
         logger.error('Failed to handle drop:', error)
       }
     },
-    [dropIndicator, handleWorkflowDrop, handleFolderDrop]
-  )
-
-  const createWorkflowDragHandlers = useCallback(
-    (workflowId: string, folderId: string | null) => ({
-      onDragOver: (e: React.DragEvent<HTMLElement>) => {
-        e.preventDefault()
-        e.stopPropagation()
-        lastDragYRef.current = e.clientY
-        setIsDragging(true)
-
-        const position = calculateDropPosition(e, e.currentTarget)
-        setDropIndicator({ targetId: workflowId, position, folderId })
-      },
-      onDrop: handleDrop,
-    }),
-    [calculateDropPosition, handleDrop]
+    [handleWorkflowDrop, handleFolderMove]
   )
 
+  /**
+   * Creates drag event handlers for a specific folder section
+   * These handlers are attached to the entire folder section container
+   *
+   * @param folderId - Folder ID to create handlers for
+   * @returns Object containing drag event handlers
+   */
   const createFolderDragHandlers = useCallback(
-    (folderId: string, parentFolderId: string | null) => ({
+    (folderId: string) => ({
+      onDragEnter: (e: React.DragEvent<HTMLElement>) => {
+        e.preventDefault()
+        setIsDragging(true)
+      },
+      onDragOver: (e: React.DragEvent<HTMLElement>) => {
+        e.preventDefault()
+        lastDragYRef.current = e.clientY
+        setDropTargetId(folderId)
+        setIsDragging(true)
+      },
+      onDragLeave: (e: React.DragEvent<HTMLElement>) => {
+        e.preventDefault()
+        const relatedTarget = e.relatedTarget as HTMLElement | null
+        const currentTarget = e.currentTarget as HTMLElement
+        // Only clear if we're leaving the folder section completely
+        if (!relatedTarget || !currentTarget.contains(relatedTarget)) {
+          setDropTargetId(null)
+        }
+      },
+      onDrop: (e: React.DragEvent<HTMLElement>) => handleFolderDrop(e, folderId),
+    }),
+    [handleFolderDrop]
+  )
+
+  /**
+   * Creates drag event handlers for items (workflows/folders) that belong to a parent folder
+   * When dragging over an item, highlights the parent folder section
+   *
+   * @param parentFolderId - Parent folder ID or null for root
+   * @returns Object containing drag event handlers
+   */
+  const createItemDragHandlers = useCallback(
+    (parentFolderId: string | null) => ({
       onDragOver: (e: React.DragEvent<HTMLElement>) => {
         e.preventDefault()
         e.stopPropagation()
         lastDragYRef.current = e.clientY
+        setDropTargetId(parentFolderId || 'root')
         setIsDragging(true)
+      },
+    }),
+    []
+  )
 
-        if (draggedTypeRef.current === 'folder') {
-          const position = calculateDropPosition(e, e.currentTarget)
-          setDropIndicator({ targetId: folderId, position, folderId: parentFolderId })
-        } else {
-          setDropIndicator({ targetId: folderId, position: 'inside', folderId: parentFolderId })
+  /**
+   * Creates drag event handlers for the root drop zone
+   *
+   * @returns Object containing drag event handlers for root
+   */
+  const createRootDragHandlers = useCallback(
+    () => ({
+      onDragEnter: (e: React.DragEvent<HTMLElement>) => {
+        e.preventDefault()
+        setIsDragging(true)
+      },
+      onDragOver: (e: React.DragEvent<HTMLElement>) => {
+        e.preventDefault()
+        lastDragYRef.current = e.clientY
+        setDropTargetId('root')
+        setIsDragging(true)
+      },
+      onDragLeave: (e: React.DragEvent<HTMLElement>) => {
+        e.preventDefault()
+        const relatedTarget = e.relatedTarget as HTMLElement | null
+        const currentTarget = e.currentTarget as HTMLElement
+        // Only clear if we're leaving the root completely
+        if (!relatedTarget || !currentTarget.contains(relatedTarget)) {
+          setDropTargetId(null)
+        }
+      },
+      onDrop: (e: React.DragEvent<HTMLElement>) => handleFolderDrop(e, null),
+    }),
+    [handleFolderDrop]
+  )
+
+  /**
+   * Creates drag event handlers for folder header (the clickable part)
+   * These handlers trigger folder expansion on hover during drag
+   *
+   * @param folderId - Folder ID to handle hover for
+   * @returns Object containing drag event handlers for folder header
+   */
+  const createFolderHeaderHoverHandlers = useCallback(
+    (folderId: string) => ({
+      onDragEnter: (e: React.DragEvent<HTMLElement>) => {
+        if (isDragging) {
           setHoverFolderId(folderId)
         }
       },
       onDragLeave: (e: React.DragEvent<HTMLElement>) => {
         const relatedTarget = e.relatedTarget as HTMLElement | null
         const currentTarget = e.currentTarget as HTMLElement
+        // Only clear if we're leaving the folder header completely
         if (!relatedTarget || !currentTarget.contains(relatedTarget)) {
           setHoverFolderId(null)
         }
       },
-      onDrop: handleDrop,
     }),
-    [calculateDropPosition, handleDrop]
+    [isDragging]
   )
 
-  const createEmptyFolderDropZone = useCallback(
-    (folderId: string) => ({
-      onDragOver: (e: React.DragEvent<HTMLElement>) => {
-        e.preventDefault()
-        e.stopPropagation()
-        lastDragYRef.current = e.clientY
-        setIsDragging(true)
-        setDropIndicator({ targetId: folderId, position: 'inside', folderId })
-      },
-      onDrop: handleDrop,
-    }),
-    [handleDrop]
-  )
-
-  const createRootDropZone = useCallback(
-    () => ({
-      onDragOver: (e: React.DragEvent<HTMLElement>) => {
-        e.preventDefault()
-        lastDragYRef.current = e.clientY
-        setIsDragging(true)
-        setDropIndicator({ targetId: 'root', position: 'inside', folderId: null })
-      },
-      onDragLeave: (e: React.DragEvent<HTMLElement>) => {
-        const relatedTarget = e.relatedTarget as HTMLElement | null
-        const currentTarget = e.currentTarget as HTMLElement
-        if (!relatedTarget || !currentTarget.contains(relatedTarget)) {
-          setDropIndicator(null)
-        }
-      },
-      onDrop: handleDrop,
-    }),
-    [handleDrop]
-  )
-
-  const handleDragStart = useCallback((type: 'workflow' | 'folder') => {
-    draggedTypeRef.current = type
-    setIsDragging(true)
-  }, [])
-
-  const handleDragEnd = useCallback(() => {
-    setIsDragging(false)
-    setDropIndicator(null)
-    draggedTypeRef.current = null
-    setHoverFolderId(null)
-  }, [])
-
+  /**
+   * Set the scroll container ref for auto-scrolling
+   *
+   * @param element - Scrollable container element
+   */
   const setScrollContainer = useCallback((element: HTMLDivElement | null) => {
     scrollContainerRef.current = element
   }, [])
 
   return {
-    dropIndicator,
+    dropTargetId,
     isDragging,
     setScrollContainer,
-    createWorkflowDragHandlers,
     createFolderDragHandlers,
-    createEmptyFolderDropZone,
-    createRootDropZone,
-    handleDragStart,
-    handleDragEnd,
+    createItemDragHandlers,
+    createRootDragHandlers,
+    createFolderHeaderHoverHandlers,
   }
 }

apps/sim/hooks/queries/folders.ts

@@ -285,66 +285,9 @@ export function useDuplicateFolderMutation() {
     },
     ...handlers,
     onSettled: (_data, _error, variables) => {
+      // Invalidate both folders and workflows (duplicated folder may contain workflows)
       queryClient.invalidateQueries({ queryKey: folderKeys.list(variables.workspaceId) })
       queryClient.invalidateQueries({ queryKey: workflowKeys.list(variables.workspaceId) })
     },
   })
 }
-
-interface ReorderFoldersVariables {
-  workspaceId: string
-  updates: Array<{
-    id: string
-    sortOrder: number
-    parentId?: string | null
-  }>
-}
-
-export function useReorderFolders() {
-  const queryClient = useQueryClient()
-
-  return useMutation({
-    mutationFn: async (variables: ReorderFoldersVariables): Promise<void> => {
-      const response = await fetch('/api/folders/reorder', {
-        method: 'PUT',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(variables),
-      })
-
-      if (!response.ok) {
-        const error = await response.json().catch(() => ({}))
-        throw new Error(error.error || 'Failed to reorder folders')
-      }
-    },
-    onMutate: async (variables) => {
-      await queryClient.cancelQueries({ queryKey: folderKeys.list(variables.workspaceId) })
-
-      const snapshot = { ...useFolderStore.getState().folders }
-
-      useFolderStore.setState((state) => {
-        const updated = { ...state.folders }
-        for (const update of variables.updates) {
-          if (updated[update.id]) {
-            updated[update.id] = {
-              ...updated[update.id],
-              sortOrder: update.sortOrder,
-              parentId:
-                update.parentId !== undefined ? update.parentId : updated[update.id].parentId,
-            }
-          }
-        }
-        return { folders: updated }
-      })
-
-      return { snapshot }
-    },
-    onError: (_error, _variables, context) => {
-      if (context?.snapshot) {
-        useFolderStore.setState({ folders: context.snapshot })
-      }
-    },
-    onSettled: (_data, _error, variables) => {
-      queryClient.invalidateQueries({ queryKey: folderKeys.list(variables.workspaceId) })
-    },
-  })
-}

apps/sim/hooks/queries/workflows.ts

@@ -32,7 +32,6 @@ function mapWorkflow(workflow: any): WorkflowMetadata {
     color: workflow.color,
     workspaceId: workflow.workspaceId,
     folderId: workflow.folderId,
-    sortOrder: workflow.sortOrder ?? 0,
     createdAt: new Date(workflow.createdAt),
     lastModified: new Date(workflow.updatedAt || workflow.createdAt),
   }
@@ -101,7 +100,6 @@ interface CreateWorkflowResult {
   color: string
   workspaceId: string
   folderId?: string | null
-  sortOrder: number
 }
 
 interface DuplicateWorkflowVariables {
@@ -120,7 +118,6 @@ interface DuplicateWorkflowResult {
   color: string
   workspaceId: string
   folderId?: string | null
-  sortOrder: number
   blocksCount: number
   edgesCount: number
   subflowsCount: number
@@ -164,7 +161,6 @@ function createWorkflowMutationHandlers<TVariables extends { workspaceId: string
               color: data.color,
               workspaceId: data.workspaceId,
               folderId: data.folderId,
-              sortOrder: 'sortOrder' in data ? data.sortOrder : 0,
             },
           },
           error: null,
@@ -183,26 +179,16 @@ export function useCreateWorkflow() {
   const handlers = createWorkflowMutationHandlers<CreateWorkflowVariables>(
     queryClient,
     'CreateWorkflow',
-    (variables, tempId) => {
-      const currentWorkflows = useWorkflowRegistry.getState().workflows
-      const targetFolderId = variables.folderId || null
-      const workflowsInFolder = Object.values(currentWorkflows).filter(
-        (w) => w.folderId === targetFolderId
-      )
-      const maxSortOrder = workflowsInFolder.reduce((max, w) => Math.max(max, w.sortOrder ?? 0), -1)
-
-      return {
-        id: tempId,
-        name: variables.name || generateCreativeWorkflowName(),
-        lastModified: new Date(),
-        createdAt: new Date(),
-        description: variables.description || 'New workflow',
-        color: variables.color || getNextWorkflowColor(),
-        workspaceId: variables.workspaceId,
-        folderId: targetFolderId,
-        sortOrder: maxSortOrder + 1,
-      }
-    }
+    (variables, tempId) => ({
+      id: tempId,
+      name: variables.name || generateCreativeWorkflowName(),
+      lastModified: new Date(),
+      createdAt: new Date(),
+      description: variables.description || 'New workflow',
+      color: variables.color || getNextWorkflowColor(),
+      workspaceId: variables.workspaceId,
+      folderId: variables.folderId || null,
+    })
   )
 
   return useMutation({
@@ -257,13 +243,13 @@ export function useCreateWorkflow() {
         color: createdWorkflow.color,
         workspaceId,
         folderId: createdWorkflow.folderId,
-        sortOrder: createdWorkflow.sortOrder ?? 0,
       }
     },
     ...handlers,
     onSuccess: (data, variables, context) => {
       handlers.onSuccess(data, variables, context)
 
+      // Initialize subblock values for new workflow
       const { subBlockValues } = buildDefaultWorkflowArtifacts()
       useSubBlockStore.setState((state) => ({
         workflowValues: {
@@ -281,26 +267,16 @@ export function useDuplicateWorkflowMutation() {
   const handlers = createWorkflowMutationHandlers<DuplicateWorkflowVariables>(
     queryClient,
     'DuplicateWorkflow',
-    (variables, tempId) => {
-      const currentWorkflows = useWorkflowRegistry.getState().workflows
-      const targetFolderId = variables.folderId || null
-      const workflowsInFolder = Object.values(currentWorkflows).filter(
-        (w) => w.folderId === targetFolderId
-      )
-      const maxSortOrder = workflowsInFolder.reduce((max, w) => Math.max(max, w.sortOrder ?? 0), -1)
-
-      return {
-        id: tempId,
-        name: variables.name,
-        lastModified: new Date(),
-        createdAt: new Date(),
-        description: variables.description,
-        color: variables.color,
-        workspaceId: variables.workspaceId,
-        folderId: targetFolderId,
-        sortOrder: maxSortOrder + 1,
-      }
-    }
+    (variables, tempId) => ({
+      id: tempId,
+      name: variables.name,
+      lastModified: new Date(),
+      createdAt: new Date(),
+      description: variables.description,
+      color: variables.color,
+      workspaceId: variables.workspaceId,
+      folderId: variables.folderId || null,
+    })
   )
 
   return useMutation({
@@ -341,7 +317,6 @@ export function useDuplicateWorkflowMutation() {
         color: duplicatedWorkflow.color || color,
         workspaceId,
         folderId: duplicatedWorkflow.folderId ?? folderId,
-        sortOrder: duplicatedWorkflow.sortOrder ?? 0,
         blocksCount: duplicatedWorkflow.blocksCount || 0,
         edgesCount: duplicatedWorkflow.edgesCount || 0,
         subflowsCount: duplicatedWorkflow.subflowsCount || 0,
@@ -423,61 +398,3 @@ export function useRevertToVersion() {
     },
   })
 }
-
-interface ReorderWorkflowsVariables {
-  workspaceId: string
-  updates: Array<{
-    id: string
-    sortOrder: number
-    folderId?: string | null
-  }>
-}
-
-export function useReorderWorkflows() {
-  const queryClient = useQueryClient()
-
-  return useMutation({
-    mutationFn: async (variables: ReorderWorkflowsVariables): Promise<void> => {
-      const response = await fetch('/api/workflows/reorder', {
-        method: 'PUT',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(variables),
-      })
-
-      if (!response.ok) {
-        const error = await response.json().catch(() => ({}))
-        throw new Error(error.error || 'Failed to reorder workflows')
-      }
-    },
-    onMutate: async (variables) => {
-      await queryClient.cancelQueries({ queryKey: workflowKeys.list(variables.workspaceId) })
-
-      const snapshot = { ...useWorkflowRegistry.getState().workflows }
-
-      useWorkflowRegistry.setState((state) => {
-        const updated = { ...state.workflows }
-        for (const update of variables.updates) {
-          if (updated[update.id]) {
-            updated[update.id] = {
-              ...updated[update.id],
-              sortOrder: update.sortOrder,
-              folderId:
-                update.folderId !== undefined ? update.folderId : updated[update.id].folderId,
-            }
-          }
-        }
-        return { workflows: updated }
-      })
-
-      return { snapshot }
-    },
-    onError: (_error, _variables, context) => {
-      if (context?.snapshot) {
-        useWorkflowRegistry.setState({ workflows: context.snapshot })
-      }
-    },
-    onSettled: (_data, _error, variables) => {
-      queryClient.invalidateQueries({ queryKey: workflowKeys.list(variables.workspaceId) })
-    },
-  })
-}

apps/sim/lib/core/config/feature-flags.ts

@@ -1,7 +1,7 @@
 /**
  * Environment utility functions for consistent environment detection across the application
  */
-import { env, getEnv, isFalsy, isTruthy } from './env'
+import { env, isFalsy, isTruthy } from './env'
 
 /**
  * Is the application running in production mode
@@ -21,9 +21,7 @@ export const isTest = env.NODE_ENV === 'test'
 /**
  * Is this the hosted version of the application
  */
-export const isHosted =
-  getEnv('NEXT_PUBLIC_APP_URL') === 'https://www.sim.ai' ||
-  getEnv('NEXT_PUBLIC_APP_URL') === 'https://www.staging.sim.ai'
+export const isHosted = true
 
 /**
  * Is billing enforcement enabled

apps/sim/lib/workflows/comparison/compare.ts

@@ -24,7 +24,9 @@ export function hasWorkflowChanged(
   deployedState: WorkflowState | null
 ): boolean {
   // If no deployed state exists, then the workflow has changed
-  if (!deployedState) return true
+  if (!deployedState) {
+    return true
+  }
 
   // 1. Compare edges (connections between blocks)
   const currentEdges = currentState.edges || []

apps/sim/stores/operation-queue/store.ts

@@ -95,19 +95,41 @@ export const useOperationQueueStore = create<OperationQueueState>((set, get) =>
       return
     }
 
-    // Enhanced duplicate content check - especially important for block operations
-    const duplicateContent = state.operations.find(
-      (op) =>
-        op.operation.operation === operation.operation.operation &&
-        op.operation.target === operation.operation.target &&
-        op.workflowId === operation.workflowId &&
-        // For block operations, check the block ID specifically
-        ((operation.operation.target === 'block' &&
-          op.operation.payload?.id === operation.operation.payload?.id) ||
-          // For other operations, fall back to full payload comparison
-          (operation.operation.target !== 'block' &&
-            JSON.stringify(op.operation.payload) === JSON.stringify(operation.operation.payload)))
-    )
+    // Enhanced duplicate content check - especially important for block and edge operations
+    const duplicateContent = state.operations.find((op) => {
+      if (
+        op.operation.operation !== operation.operation.operation ||
+        op.operation.target !== operation.operation.target ||
+        op.workflowId !== operation.workflowId
+      ) {
+        return false
+      }
+
+      // For block operations, check the block ID specifically
+      if (operation.operation.target === 'block') {
+        return op.operation.payload?.id === operation.operation.payload?.id
+      }
+
+      // For edge operations (batch-add-edges), check by source→target connection
+      // This prevents duplicate edges with different IDs but same connection
+      if (
+        operation.operation.target === 'edges' &&
+        operation.operation.operation === 'batch-add-edges'
+      ) {
+        const newEdges = operation.operation.payload?.edges || []
+        const existingEdges = op.operation.payload?.edges || []
+        // Check if any new edge has the same source→target as an existing operation's edges
+        return newEdges.some((newEdge: any) =>
+          existingEdges.some(
+            (existingEdge: any) =>
+              existingEdge.source === newEdge.source && existingEdge.target === newEdge.target
+          )
+        )
+      }
+
+      // For other operations, fall back to full payload comparison
+      return JSON.stringify(op.operation.payload) === JSON.stringify(operation.operation.payload)
+    })
 
     const isReplaceStateWorkflowOp =
       operation.operation.target === 'workflow' && operation.operation.operation === 'replace-state'

apps/sim/stores/workflows/registry/store.ts

@@ -476,6 +476,7 @@ export const useWorkflowRegistry = create<WorkflowRegistry>()(
         // Use the server-generated ID
         const id = duplicatedWorkflow.id
 
+        // Generate new workflow metadata using the server-generated ID
         const newWorkflow: WorkflowMetadata = {
           id,
           name: `${sourceWorkflow.name} (Copy)`,
@@ -483,9 +484,8 @@ export const useWorkflowRegistry = create<WorkflowRegistry>()(
           createdAt: new Date(),
           description: sourceWorkflow.description,
           color: getNextWorkflowColor(),
-          workspaceId,
-          folderId: sourceWorkflow.folderId,
-          sortOrder: duplicatedWorkflow.sortOrder ?? 0,
+          workspaceId, // Include the workspaceId in the new workflow
+          folderId: sourceWorkflow.folderId, // Include the folderId from source workflow
         }
 
         // Get the current workflow state to copy from

apps/sim/stores/workflows/registry/types.ts

@@ -26,7 +26,6 @@ export interface WorkflowMetadata {
   color: string
   workspaceId?: string
   folderId?: string | null
-  sortOrder: number
 }
 
 export type HydrationPhase =

packages/db/schema.ts

@@ -150,7 +150,6 @@ export const workflow = pgTable(
       .references(() => user.id, { onDelete: 'cascade' }),
     workspaceId: text('workspace_id').references(() => workspace.id, { onDelete: 'cascade' }),
     folderId: text('folder_id').references(() => workflowFolder.id, { onDelete: 'set null' }),
-    sortOrder: integer('sort_order').notNull().default(0),
     name: text('name').notNull(),
     description: text('description'),
     color: text('color').notNull().default('#3972F6'),
@@ -167,7 +166,6 @@ export const workflow = pgTable(
     userIdIdx: index('workflow_user_id_idx').on(table.userId),
     workspaceIdIdx: index('workflow_workspace_id_idx').on(table.workspaceId),
     userWorkspaceIdx: index('workflow_user_workspace_idx').on(table.userId, table.workspaceId),
-    folderSortIdx: index('workflow_folder_sort_idx').on(table.folderId, table.sortOrder),
   })
 )