| null
}
@@ -33,7 +34,14 @@ interface LogRowProps {
* Uses shallow comparison for the log object.
*/
const LogRow = memo(
- function LogRow({ log, isSelected, onClick, onContextMenu, selectedRowRef }: LogRowProps) {
+ function LogRow({
+ log,
+ isSelected,
+ onClick,
+ onHover,
+ onContextMenu,
+ selectedRowRef,
+ }: LogRowProps) {
const formattedDate = useMemo(() => formatDate(log.createdAt), [log.createdAt])
const isDeletedWorkflow = !log.workflow?.id && !log.workflowId
const workflowName = isDeletedWorkflow
@@ -43,6 +51,8 @@ const LogRow = memo(
const handleClick = useCallback(() => onClick(log), [onClick, log])
+ const handleMouseEnter = useCallback(() => onHover?.(log), [onHover, log])
+
const handleContextMenu = useCallback(
(e: React.MouseEvent) => {
if (onContextMenu) {
@@ -61,6 +71,7 @@ const LogRow = memo(
isSelected && 'bg-[var(--surface-3)] dark:bg-[var(--surface-4)]'
)}
onClick={handleClick}
+ onMouseEnter={handleMouseEnter}
onContextMenu={handleContextMenu}
>
@@ -142,7 +153,8 @@ const LogRow = memo(
prevProps.log.id === nextProps.log.id &&
prevProps.log.duration === nextProps.log.duration &&
prevProps.log.status === nextProps.log.status &&
- prevProps.isSelected === nextProps.isSelected
+ prevProps.isSelected === nextProps.isSelected &&
+ prevProps.onHover === nextProps.onHover
)
}
)
@@ -151,6 +163,7 @@ interface RowProps {
logs: WorkflowLog[]
selectedLogId: string | null
onLogClick: (log: WorkflowLog) => void
+ onLogHover?: (log: WorkflowLog) => void
onLogContextMenu?: (e: React.MouseEvent, log: WorkflowLog) => void
selectedRowRef: React.RefObject
isFetchingNextPage: boolean
@@ -167,6 +180,7 @@ function Row({
logs,
selectedLogId,
onLogClick,
+ onLogHover,
onLogContextMenu,
selectedRowRef,
isFetchingNextPage,
@@ -198,6 +212,7 @@ function Row({
log={log}
isSelected={isSelected}
onClick={onLogClick}
+ onHover={onLogHover}
onContextMenu={onLogContextMenu}
selectedRowRef={isSelected ? selectedRowRef : null}
/>
@@ -209,6 +224,7 @@ export interface LogsListProps {
logs: WorkflowLog[]
selectedLogId: string | null
onLogClick: (log: WorkflowLog) => void
+ onLogHover?: (log: WorkflowLog) => void
onLogContextMenu?: (e: React.MouseEvent, log: WorkflowLog) => void
selectedRowRef: React.RefObject
hasNextPage: boolean
@@ -227,6 +243,7 @@ export function LogsList({
logs,
selectedLogId,
onLogClick,
+ onLogHover,
onLogContextMenu,
selectedRowRef,
hasNextPage,
@@ -272,6 +289,7 @@ export function LogsList({
logs,
selectedLogId,
onLogClick,
+ onLogHover,
onLogContextMenu,
selectedRowRef,
isFetchingNextPage,
@@ -281,6 +299,7 @@ export function LogsList({
logs,
selectedLogId,
onLogClick,
+ onLogHover,
onLogContextMenu,
selectedRowRef,
isFetchingNextPage,
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/components/notifications/notifications.tsx b/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/components/notifications/notifications.tsx
index 81bbfa3a2..e1dcc4193 100644
--- a/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/components/notifications/notifications.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/components/notifications/notifications.tsx
@@ -1,6 +1,6 @@
'use client'
-import { useCallback, useEffect, useMemo, useState } from 'react'
+import { memo, useCallback, useEffect, useMemo, useState } from 'react'
import { createLogger } from '@sim/logger'
import { Plus, X } from 'lucide-react'
import {
@@ -113,7 +113,7 @@ function formatAlertConfigLabel(config: {
}
}
-export function NotificationSettings({
+export const NotificationSettings = memo(function NotificationSettings({
workspaceId,
open,
onOpenChange,
@@ -144,7 +144,7 @@ export function NotificationSettings({
slackChannelId: '',
slackChannelName: '',
slackAccountId: '',
- useAlertRule: false,
+
alertRule: 'none' as AlertRule,
consecutiveFailures: 3,
failureRatePercent: 50,
@@ -212,7 +212,7 @@ export function NotificationSettings({
slackChannelId: '',
slackChannelName: '',
slackAccountId: '',
- useAlertRule: false,
+
alertRule: 'none',
consecutiveFailures: 3,
failureRatePercent: 50,
@@ -484,7 +484,6 @@ export function NotificationSettings({
slackChannelId: subscription.slackConfig?.channelId || '',
slackChannelName: subscription.slackConfig?.channelName || '',
slackAccountId: subscription.slackConfig?.accountId || '',
- useAlertRule: !!subscription.alertConfig,
alertRule: subscription.alertConfig?.rule || 'none',
consecutiveFailures: subscription.alertConfig?.consecutiveFailures || 3,
failureRatePercent: subscription.alertConfig?.failureRatePercent || 50,
@@ -1289,4 +1288,4 @@ export function NotificationSettings({
>
)
-}
+})
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/logs-toolbar.tsx b/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/logs-toolbar.tsx
index 11280214f..9a6897990 100644
--- a/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/logs-toolbar.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/logs-toolbar.tsx
@@ -1,6 +1,6 @@
'use client'
-import { useCallback, useMemo, useState } from 'react'
+import { memo, useCallback, useMemo, useState } from 'react'
import { ArrowUp, Bell, Library, MoreHorizontal, RefreshCw } from 'lucide-react'
import { useParams } from 'next/navigation'
import {
@@ -149,7 +149,7 @@ function getTriggerIcon(
* @param props - The component props
* @returns The complete logs toolbar
*/
-export function LogsToolbar({
+export const LogsToolbar = memo(function LogsToolbar({
viewMode,
onViewModeChange,
isRefreshing,
@@ -749,4 +749,4 @@ export function LogsToolbar({