diff --git a/apps/rowboat/app/lib/agent-tools.ts b/apps/rowboat/app/lib/agent-tools.ts
index b4b82ac0..05f8d31e 100644
--- a/apps/rowboat/app/lib/agent-tools.ts
+++ b/apps/rowboat/app/lib/agent-tools.ts
@@ -541,9 +541,12 @@ export function createTools(
         } else if (config.isComposio) {
             tools[toolName] = createComposioTool(logger, usageTracker, config, projectId);
             toolLogger.log(`✓ created composio tool: ${toolName}`);
-        } else {
+        } else if (config.isWebhook) {
             tools[toolName] = createWebhookTool(logger, usageTracker, config, projectId);
             toolLogger.log(`✓ created webhook tool: ${toolName} (fallback)`);
+        } else { // this is for placeholder tools
+            tools[toolName] = createMockTool(logger, usageTracker, config);
+            toolLogger.log(`✓ created mock tool: ${toolName}`);
         }
     }
     
diff --git a/apps/rowboat/app/lib/feature_flags.ts b/apps/rowboat/app/lib/feature_flags.ts
index 5ca8d502..bd3fa6a0 100644
--- a/apps/rowboat/app/lib/feature_flags.ts
+++ b/apps/rowboat/app/lib/feature_flags.ts
@@ -5,7 +5,7 @@ export const USE_CHAT_WIDGET = process.env.USE_CHAT_WIDGET === 'true';
 export const USE_AUTH = process.env.USE_AUTH === 'true';
 export const USE_RAG_S3_UPLOADS = process.env.USE_RAG_S3_UPLOADS === 'true';
 export const USE_GEMINI_FILE_PARSING = process.env.USE_GEMINI_FILE_PARSING === 'true';
-export const USE_BILLING = process.env.USE_BILLING === 'true';
+export const USE_BILLING = process.env.NEXT_PUBLIC_USE_BILLING === 'true' || process.env.USE_BILLING === 'true';
 export const USE_COMPOSIO_TOOLS = process.env.USE_COMPOSIO_TOOLS === 'true';
 export const USE_KLAVIS_TOOLS = process.env.USE_KLAVIS_TOOLS === 'true';
 
diff --git a/apps/rowboat/app/lib/types/workflow_types.ts b/apps/rowboat/app/lib/types/workflow_types.ts
index 4432b426..9c75e4c1 100644
--- a/apps/rowboat/app/lib/types/workflow_types.ts
+++ b/apps/rowboat/app/lib/types/workflow_types.ts
@@ -76,6 +76,7 @@ export const WorkflowTool = z.object({
     mcpServerName: z.string().optional(),
     isComposio: z.boolean().optional(), // whether this is a Composio tool
     isLibrary: z.boolean().default(false).optional(), // whether this is a library tool
+    isWebhook: z.boolean().optional(), // whether this is a webhook tool
     composioData: z.object({
         slug: z.string(), // the slug for the Composio tool e.g. "GITHUB_CREATE_AN_ISSUE"
         noAuth: z.boolean(), // whether the tool requires no authentication
diff --git a/apps/rowboat/app/projects/[projectId]/entities/tool_config.tsx b/apps/rowboat/app/projects/[projectId]/entities/tool_config.tsx
index a3822d93..dbc7685d 100644
--- a/apps/rowboat/app/projects/[projectId]/entities/tool_config.tsx
+++ b/apps/rowboat/app/projects/[projectId]/entities/tool_config.tsx
@@ -175,7 +175,6 @@ export function ToolConfig({
     const projectId = params.projectId as string;
     const [selectedParams, setSelectedParams] = useState(new Set([]));
     const isReadOnly = tool.isMcp || tool.isComposio;
-    const isWebhookTool = !tool.isMcp && !tool.isComposio;
     const [nameError, setNameError] = useState<string | null>(null);
     const [showSavedBanner, setShowSavedBanner] = useState(false);
     const [localToolName, setLocalToolName] = useState(tool.name);
@@ -366,7 +365,7 @@ export function ToolConfig({
                     </div>
                 )}
                 {/* Tool Type Section */}
-                <div className="bg-gradient-to-r from-blue-50 to-indigo-50 dark:from-blue-950/30 dark:to-indigo-950/30 border border-blue-200 dark:border-blue-800 rounded-lg p-4">
+                {!tool.isLibrary && <div className="bg-gradient-to-r from-blue-50 to-indigo-50 dark:from-blue-950/30 dark:to-indigo-950/30 border border-blue-200 dark:border-blue-800 rounded-lg p-4">
                     <div className="flex items-start gap-3">
                         <div className="flex-shrink-0 mt-1">
                             {tool.isMcp ? (
@@ -381,40 +380,39 @@ export function ToolConfig({
                             <h3 className="text-sm font-semibold text-gray-800 dark:text-gray-200 mb-2">
                                 How this tool runs
                             </h3>
-                            {tool.isMcp ? (
-                                <div className="text-sm text-gray-700 dark:text-gray-300">
-                                    <p>This tool is powered by the <span className="font-medium text-blue-700 dark:text-blue-300">{tool.mcpServerName}</span> MCP server.</p>
-                                    <p className="text-xs text-gray-600 dark:text-gray-400 mt-1">
-                                        MCP (Model Context Protocol) tools are external services that provide additional capabilities to your agent.
-                                    </p>
+                            {tool.isMcp && <div className="text-sm text-gray-700 dark:text-gray-300">
+                                <p>This tool is powered by the <span className="font-medium text-blue-700 dark:text-blue-300">{tool.mcpServerName}</span> MCP server.</p>
+                                <p className="text-xs text-gray-600 dark:text-gray-400 mt-1">
+                                    MCP (Model Context Protocol) tools are external services that provide additional capabilities to your agent.
+                                </p>
+                            </div>}
+                            { tool.isComposio && <div className="text-sm text-gray-700 dark:text-gray-300">
+                                <div className="flex items-center gap-2 mb-1">
+                                    <p>This tool is powered by <span className="font-medium text-purple-700 dark:text-purple-300">Composio</span></p>
+                                    {tool.composioData?.toolkitName && (
+                                        <span className="text-xs bg-purple-100 dark:bg-purple-900/50 text-purple-700 dark:text-purple-300 px-2 py-1 rounded-full">
+                                            {tool.composioData.toolkitName}
+                                        </span>
+                                    )}
                                 </div>
-                            ) : tool.isComposio ? (
-                                <div className="text-sm text-gray-700 dark:text-gray-300">
-                                    <div className="flex items-center gap-2 mb-1">
-                                        <p>This tool is powered by <span className="font-medium text-purple-700 dark:text-purple-300">Composio</span></p>
-                                        {tool.composioData?.toolkitName && (
-                                            <span className="text-xs bg-purple-100 dark:bg-purple-900/50 text-purple-700 dark:text-purple-300 px-2 py-1 rounded-full">
-                                                {tool.composioData.toolkitName}
-                                            </span>
-                                        )}
-                                    </div>
-                                    <p className="text-xs text-gray-600 dark:text-gray-400 mt-1">
-                                        Composio provides pre-built integrations with popular services and APIs.
-                                    </p>
+                                <p className="text-xs text-gray-600 dark:text-gray-400 mt-1">
+                                    Composio provides pre-built integrations with popular services and APIs.
+                                </p>
+                            </div>}
+                            { tool.isWebhook && <div className="text-sm text-gray-700 dark:text-gray-300">
+                                <div className="flex items-center gap-1 mb-1">
+                                    <p>This tool is invoked using the webhook configured in <Link href={`/projects/${projectId}/config`} className="text-green-600 dark:text-green-400 hover:text-green-700 dark:hover:text-green-300 font-medium underline decoration-green-300 hover:decoration-green-500 transition-colors">project settings</Link></p>
                                 </div>
-                            ) : (
-                                <div className="text-sm text-gray-700 dark:text-gray-300">
-                                    <div className="flex items-center gap-1 mb-1">
-                                        <p>This tool is invoked using the webhook configured in <Link href={`/projects/${projectId}/config`} className="text-green-600 dark:text-green-400 hover:text-green-700 dark:hover:text-green-300 font-medium underline decoration-green-300 hover:decoration-green-500 transition-colors">project settings</Link></p>
-                                    </div>
-                                    <p className="text-xs text-gray-600 dark:text-gray-400 mt-1">
-                                        Webhook tools make HTTP requests to your configured endpoint when called by the agent.
-                                    </p>
-                                </div>
-                            )}
+                                <p className="text-xs text-gray-600 dark:text-gray-400 mt-1">
+                                    Webhook tools make HTTP requests to your configured endpoint when called by the agent.
+                                </p>
+                            </div>}
+                            { !tool.isMcp && !tool.isComposio && !tool.isWebhook && <div className="text-sm text-gray-700 dark:text-gray-300">
+                                <p>This is a placeholder tool that should be mocked.</p>
+                            </div>}
                         </div>
                     </div>
-                </div>
+                </div>}
 
                 {/* Identity Section */}
                 <SectionCard
diff --git a/apps/rowboat/app/projects/[projectId]/tools/components/AddWebhookTool.tsx b/apps/rowboat/app/projects/[projectId]/tools/components/AddWebhookTool.tsx
index 6935c4ed..90964c24 100644
--- a/apps/rowboat/app/projects/[projectId]/tools/components/AddWebhookTool.tsx
+++ b/apps/rowboat/app/projects/[projectId]/tools/components/AddWebhookTool.tsx
@@ -15,7 +15,8 @@ export function AddWebhookTool({ projectId, onAddTool }: AddWebhookToolProps) {
   function handleAddTool() {
     onAddTool({
       description: 'Webhook tool',
-      mockTool: false,
+      mockTool: true,
+      isWebhook: true,
     });
   }
 
diff --git a/apps/rowboat/app/projects/[projectId]/tools/components/ToolsConfig.tsx b/apps/rowboat/app/projects/[projectId]/tools/components/ToolsConfig.tsx
index 38e3895e..908dcb4f 100644
--- a/apps/rowboat/app/projects/[projectId]/tools/components/ToolsConfig.tsx
+++ b/apps/rowboat/app/projects/[projectId]/tools/components/ToolsConfig.tsx
@@ -35,6 +35,7 @@ export function ToolsConfig({
   const [activeTab, setActiveTab] = useState(defaultActiveTab);
   const [selectedToolkit, setSelectedToolkit] = useState<ToolkitType | null>(null);
   const [isToolsPanelOpen, setIsToolsPanelOpen] = useState(false);
+  const useBilling = process.env.NEXT_PUBLIC_USE_BILLING === "true";
 
   const handleTabChange = (key: Key) => {
     setActiveTab(key.toString());
@@ -84,14 +85,14 @@ export function ToolsConfig({
             />
           </div>
         </Tab>
-        <Tab key="webhook" title="Webhook">
+        {!useBilling && <Tab key="webhook" title="Webhook">
           <div className="mt-4 p-6">
             <AddWebhookTool
               projectId={projectId}
               onAddTool={onAddTool}
             />
           </div>
-        </Tab>
+        </Tab>}
       </Tabs>
       
       {/* Tools Panel */}