chore: import upstream snapshot with attribution

apps/sim/stores/logs/filters/store.ts

@@ -0,0 +1,17 @@
+import { create } from 'zustand'
+import { devtools } from 'zustand/middleware'
+import type { LogViewState } from '@/stores/logs/filters/types'
+
+/**
+ * Logs view store. Holds only non-URL view state (the logs/dashboard toggle).
+ * All filter state is URL-backed via `useLogFilters` (nuqs).
+ */
+export const useFilterStore = create<LogViewState>()(
+  devtools(
+    (set) => ({
+      viewMode: 'logs',
+      setViewMode: (viewMode) => set({ viewMode }),
+    }),
+    { name: 'logs-view-store' }
+  )
+)

apps/sim/stores/logs/filters/types.ts

@@ -0,0 +1,50 @@
+export type TimeRange =
+  | 'Past 30 minutes'
+  | 'Past hour'
+  | 'Past 6 hours'
+  | 'Past 12 hours'
+  | 'Past 24 hours'
+  | 'Past 3 days'
+  | 'Past 7 days'
+  | 'Past 14 days'
+  | 'Past 30 days'
+  | 'All time'
+  | 'Custom range'
+
+export type LogLevel =
+  | 'error'
+  | 'info'
+  | 'running'
+  | 'pending'
+  | 'cancelled'
+  | 'all'
+  | (string & {})
+
+/** Core trigger types for workflow execution */
+export const CORE_TRIGGER_TYPES = [
+  'manual',
+  'api',
+  'schedule',
+  'chat',
+  'webhook',
+  'mcp',
+  'copilot',
+  'mothership',
+  'workflow',
+] as const
+
+export type CoreTriggerType = (typeof CORE_TRIGGER_TYPES)[number]
+
+export type TriggerType = CoreTriggerType | 'all' | (string & {})
+
+export type LogViewMode = 'logs' | 'dashboard'
+
+/**
+ * Non-URL logs view state. The filter state itself (time range, level,
+ * workflows, folders, triggers, search) lives in the URL via nuqs
+ * (`useLogFilters`); only the view-mode toggle is kept in this store.
+ */
+export interface LogViewState {
+  viewMode: LogViewMode
+  setViewMode: (viewMode: LogViewMode) => void
+}

apps/sim/stores/logs/store.ts

@@ -0,0 +1,36 @@
+import { create } from 'zustand'
+import { persist } from 'zustand/middleware'
+import type { LogDetailsUIState } from './types'
+import { clampPanelWidth, DEFAULT_LOG_DETAILS_WIDTH } from './utils'
+
+export const useLogDetailsUIStore = create<LogDetailsUIState>()(
+  persist(
+    (set) => ({
+      panelWidth: DEFAULT_LOG_DETAILS_WIDTH,
+      /**
+       * Updates the log details panel width, enforcing min/max constraints.
+       * @param width - Desired width in pixels for the panel.
+       */
+      setPanelWidth: (width) => {
+        set({ panelWidth: clampPanelWidth(width) })
+      },
+      isResizing: false,
+      /**
+       * Updates the resize state flag.
+       * @param isResizing - True while the panel is being resized via mouse drag.
+       */
+      setIsResizing: (isResizing) => {
+        set({ isResizing })
+      },
+    }),
+    {
+      name: 'log-details-ui-state',
+      partialize: (state) => ({ panelWidth: state.panelWidth }),
+      onRehydrateStorage: () => (state) => {
+        if (state) {
+          state.panelWidth = clampPanelWidth(state.panelWidth)
+        }
+      },
+    }
+  )
+)

apps/sim/stores/logs/types.ts

@@ -0,0 +1,9 @@
+/**
+ * Log details UI state persisted across sessions.
+ */
+export interface LogDetailsUIState {
+  panelWidth: number
+  setPanelWidth: (width: number) => void
+  isResizing: boolean
+  setIsResizing: (isResizing: boolean) => void
+}

apps/sim/stores/logs/utils.ts

@@ -0,0 +1,30 @@
+/**
+ * Width constraints for the log details panel.
+ *
+ * The min is the floor below which the panel becomes unusable. On narrow
+ * viewports (e.g. tablets, side-by-side windows, Mothership task pages with
+ * a constrained content area) the viewport-ratio cap is what actually wins
+ * — `getMaxLogDetailsWidth` enforces this. We never let the floor exceed
+ * the cap, so the panel always leaves room for the surface behind it.
+ */
+export const MIN_LOG_DETAILS_WIDTH = 320
+export const DEFAULT_LOG_DETAILS_WIDTH = 520
+export const MAX_LOG_DETAILS_WIDTH_RATIO = 0.6
+
+/**
+ * Returns the maximum log details panel width (60% of viewport width).
+ * Falls back to a reasonable default for SSR.
+ */
+export const getMaxLogDetailsWidth = () =>
+  typeof window !== 'undefined' ? window.innerWidth * MAX_LOG_DETAILS_WIDTH_RATIO : 1040
+
+/**
+ * Clamps a width value to the valid panel range for the current viewport.
+ * The floor (`MIN_LOG_DETAILS_WIDTH`) is itself capped by the viewport ratio
+ * so a small viewport never produces a panel that covers more than 60vw.
+ */
+export const clampPanelWidth = (width: number) => {
+  const max = getMaxLogDetailsWidth()
+  const min = Math.min(MIN_LOG_DETAILS_WIDTH, max)
+  return Math.max(min, Math.min(width, max))
+}