From bbab2ff73270a686d0910524a43547a46f132196 Mon Sep 17 00:00:00 2001 From: Emir Karabeg <78010029+emir-karabeg@users.noreply.github.com> Date: Wed, 10 Dec 2025 17:20:59 -0800 Subject: [PATCH 1/2] improvement(ui/ux): small styling improvements (#2293) * improvement: action-bar duplicate, copilot header name truncating, dashboard table scrolling * improvement: workflow block handle positioning * improvement: copilot notification fix message * improvement: dashboard layout, popover hovering * fix: filtering table into row, workflow name truncating --- .../logs/components/dashboard/dashboard.tsx | 4 ++-- .../logs/components/log-details/log-details.tsx | 10 +++++----- apps/sim/app/workspace/[workspaceId]/logs/logs.tsx | 4 ++-- .../components/panel/components/copilot/copilot.tsx | 4 ++-- .../components/action-bar/action-bar.tsx | 4 ++-- .../components/workflow-block/workflow-block.tsx | 8 ++++---- .../sim/components/emcn/components/popover/popover.tsx | 3 ++- apps/sim/stores/notifications/utils.ts | 4 +--- apps/sim/stores/terminal/console/store.ts | 6 +++++- 9 files changed, 25 insertions(+), 22 deletions(-) diff --git a/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/dashboard.tsx b/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/dashboard.tsx index 50774d8303..a5da603a7c 100644 --- a/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/dashboard.tsx +++ b/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/dashboard.tsx @@ -131,7 +131,7 @@ function WorkflowsListSkeleton({ rowCount = 5 }: { rowCount?: number }) { */ function DashboardSkeleton() { return ( -
+
{/* Graphs Section */}
@@ -774,7 +774,7 @@ export default function Dashboard({ } return ( -
+
{/* Graphs Section */}
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/components/log-details/log-details.tsx b/apps/sim/app/workspace/[workspaceId]/logs/components/log-details/log-details.tsx index a89fa9091e..6b0106f4cf 100644 --- a/apps/sim/app/workspace/[workspaceId]/logs/components/log-details/log-details.tsx +++ b/apps/sim/app/workspace/[workspaceId]/logs/components/log-details/log-details.tsx @@ -161,9 +161,9 @@ export function LogDetails({
{/* Timestamp & Workflow Row */} -
+
{/* Timestamp Card */} -
+
Timestamp
@@ -179,16 +179,16 @@ export function LogDetails({ {/* Workflow Card */} {log.workflow && ( -
+
Workflow
-
+
- + {log.workflow.name}
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/logs.tsx b/apps/sim/app/workspace/[workspaceId]/logs/logs.tsx index 71e7b257a6..a45336609d 100644 --- a/apps/sim/app/workspace/[workspaceId]/logs/logs.tsx +++ b/apps/sim/app/workspace/[workspaceId]/logs/logs.tsx @@ -410,14 +410,14 @@ export default function Logs() { {/* Dashboard view */} {isDashboardView && ( -
+
)} {/* Main content area with table - only show in logs view */} {!isDashboardView && ( -
+
{/* Table container */}
{/* Table header */} diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/copilot.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/copilot.tsx index 2387f68881..b6050a2276 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/copilot.tsx +++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/copilot/copilot.tsx @@ -398,8 +398,8 @@ export const Copilot = forwardRef(({ panelWidth }, ref className='flex h-full flex-col overflow-hidden' > {/* Header */} -
-

+
+

{currentChat?.title || 'New Chat'}

diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/action-bar/action-bar.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/action-bar/action-bar.tsx index 500cf98809..f5a5c0659d 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/action-bar/action-bar.tsx +++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/components/action-bar/action-bar.tsx @@ -1,6 +1,6 @@ import { memo, useCallback } from 'react' import { ArrowLeftRight, ArrowUpDown, Circle, CircleOff, LogOut } from 'lucide-react' -import { Button, Duplicate, Tooltip, Trash2 } from '@/components/emcn' +import { Button, Copy, Tooltip, Trash2 } from '@/components/emcn' import { cn } from '@/lib/core/utils/cn' import { useUserPermissionsContext } from '@/app/workspace/[workspaceId]/providers/workspace-permissions-provider' import { useCollaborativeWorkflow } from '@/hooks/use-collaborative-workflow' @@ -119,7 +119,7 @@ export const ActionBar = memo( className='hover:!text-[var(--text-inverse)] h-[23px] w-[23px] rounded-[8px] bg-[var(--surface-9)] p-0 text-[#868686] hover:bg-[var(--brand-secondary)]' disabled={disabled} > - + {getTooltipMessage('Duplicate Block')} diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx index 0f7b484783..786d577c91 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx +++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/workflow-block/workflow-block.tsx @@ -703,12 +703,12 @@ export const WorkflowBlock = memo(function WorkflowBlock({ const colorClasses = isError ? '!bg-red-400 dark:!bg-red-500' : '!bg-[var(--surface-12)]' const positionClasses = { - left: '!left-[-7px] !h-5 !w-[7px] !rounded-l-[2px] !rounded-r-none hover:!left-[-10px] hover:!w-[10px] hover:!rounded-l-full', + left: '!left-[-8px] !h-5 !w-[7px] !rounded-l-[2px] !rounded-r-none hover:!left-[-11px] hover:!w-[10px] hover:!rounded-l-full', right: - '!right-[-7px] !h-5 !w-[7px] !rounded-r-[2px] !rounded-l-none hover:!right-[-10px] hover:!w-[10px] hover:!rounded-r-full', - top: '!top-[-7px] !h-[7px] !w-5 !rounded-t-[2px] !rounded-b-none hover:!top-[-10px] hover:!h-[10px] hover:!rounded-t-full', + '!right-[-8px] !h-5 !w-[7px] !rounded-r-[2px] !rounded-l-none hover:!right-[-11px] hover:!w-[10px] hover:!rounded-r-full', + top: '!top-[-8px] !h-[7px] !w-5 !rounded-t-[2px] !rounded-b-none hover:!top-[-11px] hover:!h-[10px] hover:!rounded-t-full', bottom: - '!bottom-[-7px] !h-[7px] !w-5 !rounded-b-[2px] !rounded-t-none hover:!bottom-[-10px] hover:!h-[10px] hover:!rounded-b-full', + '!bottom-[-8px] !h-[7px] !w-5 !rounded-b-[2px] !rounded-t-none hover:!bottom-[-11px] hover:!h-[10px] hover:!rounded-b-full', } return cn(baseClasses, colorClasses, positionClasses[position]) diff --git a/apps/sim/components/emcn/components/popover/popover.tsx b/apps/sim/components/emcn/components/popover/popover.tsx index 041b9d9f2f..fce043c394 100644 --- a/apps/sim/components/emcn/components/popover/popover.tsx +++ b/apps/sim/components/emcn/components/popover/popover.tsx @@ -57,9 +57,10 @@ import { cn } from '@/lib/core/utils/cn' /** * Shared base styles for all popover interactive items. * Ensures consistent height and styling across items, folders, and back button. + * Uses fast transitions (duration-75) to prevent hover state "jumping" during rapid mouse movement. */ const POPOVER_ITEM_BASE_CLASSES = - 'flex h-[25px] min-w-0 cursor-pointer items-center gap-[8px] rounded-[6px] px-[6px] font-base text-[var(--text-primary)] text-[12px] transition-colors dark:text-[var(--text-primary)] [&_svg]:transition-colors disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed' + 'flex h-[25px] min-w-0 cursor-pointer items-center gap-[8px] rounded-[6px] px-[6px] font-base text-[var(--text-primary)] text-[12px] transition-colors duration-75 dark:text-[var(--text-primary)] [&_svg]:transition-colors [&_svg]:duration-75 disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed' /** * Variant-specific active state styles for popover items. diff --git a/apps/sim/stores/notifications/utils.ts b/apps/sim/stores/notifications/utils.ts index 671f0563d5..64fd910253 100644 --- a/apps/sim/stores/notifications/utils.ts +++ b/apps/sim/stores/notifications/utils.ts @@ -42,9 +42,7 @@ export function openCopilotWithMessage(message: string): void { return } - const messageWithInstructions = `${trimmedMessage}\n\nPlease fix this.` - - void copilotStore.sendMessage(messageWithInstructions, { stream: true }).catch((error) => { + void copilotStore.sendMessage(trimmedMessage, { stream: true }).catch((error) => { logger.error('Failed to send message to copilot', { error }) }) diff --git a/apps/sim/stores/terminal/console/store.ts b/apps/sim/stores/terminal/console/store.ts index a02d5bb19e..355741c423 100644 --- a/apps/sim/stores/terminal/console/store.ts +++ b/apps/sim/stores/terminal/console/store.ts @@ -110,6 +110,10 @@ export const useTerminalConsoleStore = create()( if (isErrorNotificationsEnabled) { try { const errorMessage = String(newEntry.error) + const blockName = newEntry.blockName || 'Unknown Block' + + // Copilot message includes block name for better debugging context + const copilotMessage = `${errorMessage}\n\nError in ${blockName}.\n\nPlease fix this.` useNotificationStore.getState().addNotification({ level: 'error', @@ -117,7 +121,7 @@ export const useTerminalConsoleStore = create()( workflowId: entry.workflowId, action: { type: 'copilot', - message: errorMessage, + message: copilotMessage, }, }) } catch (notificationError) { From 1d62ece915c4806b4dc3614f988aa82dc26c6ad4 Mon Sep 17 00:00:00 2001 From: Vikhyath Mondreti Date: Wed, 10 Dec 2025 18:25:36 -0800 Subject: [PATCH 2/2] fix(billing): copilot should directly deduct credit balance (#2294) --- apps/sim/app/api/billing/update-cost/route.ts | 15 ++++----------- 1 file changed, 4 insertions(+), 11 deletions(-) diff --git a/apps/sim/app/api/billing/update-cost/route.ts b/apps/sim/app/api/billing/update-cost/route.ts index 3beed143f4..16838876df 100644 --- a/apps/sim/app/api/billing/update-cost/route.ts +++ b/apps/sim/app/api/billing/update-cost/route.ts @@ -3,7 +3,6 @@ import { userStats } from '@sim/db/schema' import { eq, sql } from 'drizzle-orm' import { type NextRequest, NextResponse } from 'next/server' import { z } from 'zod' -import { deductFromCredits } from '@/lib/billing/credits/balance' import { checkAndBillOverageThreshold } from '@/lib/billing/threshold-billing' import { checkInternalApiKey } from '@/lib/copilot/utils' import { isBillingEnabled } from '@/lib/core/config/environment' @@ -92,17 +91,11 @@ export async function POST(req: NextRequest) { return NextResponse.json({ error: 'User stats record not found' }, { status: 500 }) } - const { creditsUsed, overflow } = await deductFromCredits(userId, cost) - if (creditsUsed > 0) { - logger.info(`[${requestId}] Deducted cost from credits`, { userId, creditsUsed, overflow }) - } - const costToStore = overflow - const updateFields = { - totalCost: sql`total_cost + ${costToStore}`, - currentPeriodCost: sql`current_period_cost + ${costToStore}`, - totalCopilotCost: sql`total_copilot_cost + ${costToStore}`, - currentPeriodCopilotCost: sql`current_period_copilot_cost + ${costToStore}`, + totalCost: sql`total_cost + ${cost}`, + currentPeriodCost: sql`current_period_cost + ${cost}`, + totalCopilotCost: sql`total_copilot_cost + ${cost}`, + currentPeriodCopilotCost: sql`current_period_copilot_cost + ${cost}`, totalCopilotCalls: sql`total_copilot_calls + 1`, lastActive: new Date(), }