windmill-components 1.537.1 → 1.542.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (275) hide show
  1. package/package/components/AIProviderPicker.svelte +181 -0
  2. package/package/components/AIProviderPicker.svelte.d.ts +15 -0
  3. package/package/components/ArgInfo.svelte +2 -2
  4. package/package/components/ArgInput.svelte +35 -9
  5. package/package/components/ArgInput.svelte.d.ts +3 -3
  6. package/package/components/AssignableTagsInner.svelte +89 -3
  7. package/package/components/ConcurrentJobsChart.svelte +36 -48
  8. package/package/components/ConcurrentJobsChart.svelte.d.ts +8 -20
  9. package/package/components/CustomPopover.svelte.d.ts +1 -1
  10. package/package/components/DropdownSelect.svelte +26 -0
  11. package/package/components/DropdownSelect.svelte.d.ts +11 -0
  12. package/package/components/DropdownV2Inner.svelte +1 -1
  13. package/package/components/{DynSelect.svelte → DynamicInput.svelte} +47 -15
  14. package/package/components/DynamicInput.svelte.d.ts +11 -0
  15. package/package/components/EditableSchemaForm.svelte +119 -95
  16. package/package/components/EditableSchemaForm.svelte.d.ts +4 -4
  17. package/package/components/Editor.svelte +86 -93
  18. package/package/components/Editor.svelte.d.ts +4 -3
  19. package/package/components/EditorBar.svelte +2 -5
  20. package/package/components/EditorSettings.svelte +11 -9
  21. package/package/components/FlowBuilder.svelte +3 -3
  22. package/package/components/FlowLogRow.svelte +64 -0
  23. package/package/components/FlowLogRow.svelte.d.ts +15 -0
  24. package/package/components/FlowLogViewer.svelte +406 -373
  25. package/package/components/FlowLogViewer.svelte.d.ts +5 -1
  26. package/package/components/FlowLogViewerWrapper.svelte +44 -1
  27. package/package/components/FlowLoopIterationPreview.svelte.d.ts +1 -1
  28. package/package/components/FlowPreviewContent.svelte.d.ts +1 -1
  29. package/package/components/FlowStatusViewerInner.svelte +34 -3
  30. package/package/components/FolderPicker.svelte +1 -1
  31. package/package/components/InputTransformForm.svelte +20 -10
  32. package/package/components/JobArgs.svelte +1 -1
  33. package/package/components/JobLoader.svelte.d.ts +1 -1
  34. package/package/components/JobStatus.svelte +2 -0
  35. package/package/components/LogSnippetViewer.svelte +3 -3
  36. package/package/components/LogSnippetViewer.svelte.d.ts +1 -1
  37. package/package/components/LogViewer.svelte +87 -71
  38. package/package/components/LogViewer.svelte.d.ts +1 -0
  39. package/package/components/Path.svelte +7 -1
  40. package/package/components/Path.svelte.d.ts +1 -1
  41. package/package/components/PrefixedInput.svelte +120 -0
  42. package/package/components/PrefixedInput.svelte.d.ts +8 -0
  43. package/package/components/QueuePosition.svelte +81 -0
  44. package/package/components/QueuePosition.svelte.d.ts +8 -0
  45. package/package/components/ResourceNarrowing.svelte +13 -0
  46. package/package/components/ResourceNarrowing.svelte.d.ts +6 -0
  47. package/package/components/ResourceTypePicker.svelte +49 -74
  48. package/package/components/RunChart.svelte +74 -89
  49. package/package/components/RunChart.svelte.d.ts +10 -22
  50. package/package/components/S3FilePicker.svelte +1 -1
  51. package/package/components/SchemaForm.svelte.d.ts +2 -2
  52. package/package/components/ScriptBuilder.svelte +2 -1
  53. package/package/components/ScriptEditor.svelte +4 -3
  54. package/package/components/ScriptEditor.svelte.d.ts +2 -1
  55. package/package/components/ServiceLogsInner.svelte +1 -1
  56. package/package/components/ShareModal.svelte.d.ts +1 -1
  57. package/package/components/SimpleEditor.svelte +4 -67
  58. package/package/components/StringTypeNarrowing.svelte +5 -10
  59. package/package/components/TemplateEditor.svelte +2 -16
  60. package/package/components/TimeAgo.svelte +1 -1
  61. package/package/components/TimeAgo.svelte.d.ts +1 -0
  62. package/package/components/Toggle.svelte +2 -1
  63. package/package/components/Toggle.svelte.d.ts +2 -1
  64. package/package/components/WorkerRepl.svelte +1 -1
  65. package/package/components/apps/components/display/AppNavbarItem.svelte +2 -1
  66. package/package/components/apps/components/display/table/AppAggridTable.svelte +44 -48
  67. package/package/components/apps/components/display/table/SyncColumnDefs.svelte +101 -19
  68. package/package/components/apps/components/display/table/SyncColumnDefs.svelte.d.ts +5 -2
  69. package/package/components/apps/components/display/table/utils.js +36 -5
  70. package/package/components/apps/components/inputs/currency/CurrencyInput.svelte +10 -5
  71. package/package/components/apps/editor/AppEditor.svelte +4 -3
  72. package/package/components/apps/editor/AppEditorHeader.svelte +0 -1
  73. package/package/components/apps/editor/GridViewer.svelte.d.ts +11 -4
  74. package/package/components/apps/editor/SettingsPanel.svelte +2 -2
  75. package/package/components/apps/editor/componentsPanel/ListItem.svelte +2 -2
  76. package/package/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte.d.ts +1 -1
  77. package/package/components/apps/editor/inlineScriptsPanel/InlineScriptEditorDrawer.svelte.d.ts +1 -1
  78. package/package/components/apps/editor/inlineScriptsPanel/InlineScriptRunnableByPath.svelte.d.ts +1 -1
  79. package/package/components/apps/editor/settingsPanel/ArrayStaticInputEditor.svelte +26 -3
  80. package/package/components/apps/editor/settingsPanel/InputsSpecEditor.svelte +1 -1
  81. package/package/components/apps/editor/settingsPanel/inputEditor/StaticInputEditor.svelte +13 -5
  82. package/package/components/apps/svelte-grid/Grid.svelte.d.ts +30 -11
  83. package/package/components/assets/JobAssetsViewer.svelte +28 -24
  84. package/package/components/auditLogs/AuditLogsTable.svelte +2 -6
  85. package/package/components/chartjs-wrappers/Chart.svelte.d.ts +14 -7
  86. package/package/components/common/OnChange.svelte.d.ts +11 -4
  87. package/package/components/common/badge/Badge.svelte +9 -2
  88. package/package/components/common/badge/Badge.svelte.d.ts +2 -1
  89. package/package/components/common/calendarPicker/CalendarPicker.svelte +5 -1
  90. package/package/components/common/calendarPicker/CalendarPicker.svelte.d.ts +5 -4
  91. package/package/components/common/drawer/Disposable.svelte +9 -11
  92. package/package/components/common/drawer/Drawer.svelte +3 -4
  93. package/package/components/common/drawer/Drawer.svelte.d.ts +1 -0
  94. package/package/components/common/menu/MenuItem.svelte.d.ts +2 -2
  95. package/package/components/common/modal/Modal.svelte.d.ts +1 -1
  96. package/package/components/common/tabs/TabContent.svelte +2 -7
  97. package/package/components/common/tabs/TabContent.svelte.d.ts +5 -27
  98. package/package/components/common/toggleButton-v2/ToggleButtonGroup.svelte +9 -3
  99. package/package/components/common/toggleButton-v2/ToggleButtonGroup.svelte.d.ts +1 -0
  100. package/package/components/common/toggleButton-v2/ToggleButtonMore.svelte +8 -4
  101. package/package/components/common/toggleButton-v2/ToggleButtonMore.svelte.d.ts +1 -0
  102. package/package/components/copilot/MetadataGen.svelte +1 -1
  103. package/package/components/copilot/chat/AIChatManager.svelte.js +24 -102
  104. package/package/components/copilot/chat/AssistantMessage.svelte +0 -4
  105. package/package/components/copilot/chat/anthropic.d.ts +15 -0
  106. package/package/components/copilot/chat/anthropic.js +208 -0
  107. package/package/components/copilot/chat/api/apiTools.d.ts +2 -2
  108. package/package/components/copilot/chat/api/apiTools.js +10 -7
  109. package/package/components/copilot/chat/api/core.d.ts +1 -1
  110. package/package/components/copilot/chat/api/core.js +7 -2
  111. package/package/components/copilot/chat/ask/core.d.ts +1 -1
  112. package/package/components/copilot/chat/ask/core.js +7 -2
  113. package/package/components/copilot/chat/flow/core.d.ts +1 -1
  114. package/package/components/copilot/chat/flow/core.js +14 -4
  115. package/package/components/copilot/chat/monaco-adapter.d.ts +6 -5
  116. package/package/components/copilot/chat/navigator/core.d.ts +1 -1
  117. package/package/components/copilot/chat/navigator/core.js +7 -2
  118. package/package/components/copilot/chat/script/CodeDisplay.svelte +10 -111
  119. package/package/components/copilot/chat/script/core.d.ts +5 -4
  120. package/package/components/copilot/chat/script/core.js +131 -19
  121. package/package/components/copilot/chat/shared.d.ts +7 -7
  122. package/package/components/copilot/lib.d.ts +29 -8
  123. package/package/components/copilot/lib.js +199 -24
  124. package/package/components/custom_ui.d.ts +1 -0
  125. package/package/components/flows/content/FlowInput.svelte +5 -5
  126. package/package/components/flows/content/FlowModuleComponent.svelte +5 -2
  127. package/package/components/flows/content/FlowModuleEarlyStop.svelte +47 -17
  128. package/package/components/flows/content/FlowModuleSleep.svelte +4 -1
  129. package/package/components/flows/content/FlowModuleSuspend.svelte +0 -1
  130. package/package/components/flows/content/FlowModuleTimeout.svelte +50 -10
  131. package/package/components/flows/content/FlowModuleTimeout.svelte.d.ts +1 -0
  132. package/package/components/flows/content/FlowRetries.svelte +108 -3
  133. package/package/components/flows/content/FlowRetries.svelte.d.ts +3 -2
  134. package/package/components/flows/flowInfers.js +8 -35
  135. package/package/components/flows/flowStore.d.ts +45 -1
  136. package/package/components/flows/flowStore.js +1 -1
  137. package/package/components/flows/map/FlowJobsMenu.svelte +3 -3
  138. package/package/components/flows/map/FlowModuleSchemaItem.svelte +61 -54
  139. package/package/components/flows/map/FlowModuleSchemaItem.svelte.d.ts +1 -1
  140. package/package/components/flows/map/FlowModuleSchemaItemViewer.svelte +1 -1
  141. package/package/components/flows/map/InsertModuleButton.svelte +1 -0
  142. package/package/components/flows/map/InsertModuleInner.svelte +12 -15
  143. package/package/components/flows/map/InsertModuleInner.svelte.d.ts +10 -9
  144. package/package/components/flows/propPicker/OutputPickerInner.svelte.d.ts +1 -1
  145. package/package/components/git_sync/DetectionFlow.svelte +15 -17
  146. package/package/components/git_sync/GitSyncContext.svelte.js +1 -1
  147. package/package/components/git_sync/GitSyncRepositoryCard.svelte +0 -1
  148. package/package/components/graph/graphBuilder.svelte.d.ts +5 -1
  149. package/package/components/graph/renderers/edges/BaseEdge.svelte +9 -1
  150. package/package/components/graph/renderers/edges/BaseEdge.svelte.d.ts +4 -1
  151. package/package/components/graph/renderers/nodes/BranchAllStart.svelte +2 -3
  152. package/package/components/graph/renderers/nodes/BranchOneStart.svelte +2 -3
  153. package/package/components/graph/renderers/triggers/TriggerButton.svelte.d.ts +1 -1
  154. package/package/components/graph/renderers/triggers/TriggersBadge.svelte +3 -1
  155. package/package/components/graph/renderers/triggers/TriggersWrapper.svelte +34 -24
  156. package/package/components/graph/renderers/triggers/TriggersWrapper.svelte.d.ts +1 -2
  157. package/package/components/home/ItemsList.svelte +17 -13
  158. package/package/components/home/TreeView.svelte +21 -27
  159. package/package/components/home/TreeView.svelte.d.ts +2 -29
  160. package/package/components/home/TreeViewRoot.svelte +11 -23
  161. package/package/components/home/TreeViewRoot.svelte.d.ts +15 -13
  162. package/package/components/icons/GitIcon.svelte +10 -2
  163. package/package/components/icons/GitIcon.svelte.d.ts +1 -0
  164. package/package/components/meltComponents/MeltButton.svelte.d.ts +1 -1
  165. package/package/components/meltComponents/Popover.svelte +23 -3
  166. package/package/components/meltComponents/Popover.svelte.d.ts +2 -1
  167. package/package/components/monacoLanguagesOptions.d.ts +3 -0
  168. package/package/components/monacoLanguagesOptions.js +109 -0
  169. package/package/components/propertyPicker/ObjectViewer.svelte +7 -2
  170. package/package/components/propertyPicker/PropPicker.svelte +1 -1
  171. package/package/components/propertyPicker/utils.js +14 -7
  172. package/package/components/runs/JobRunsPreview.svelte +212 -177
  173. package/package/components/runs/JobsLoader.svelte +2 -2
  174. package/package/components/runs/JobsLoader.svelte.d.ts +1 -1
  175. package/package/components/runs/NoWorkerWithTagWarning.svelte +18 -5
  176. package/package/components/runs/RunBadges.svelte +100 -0
  177. package/package/components/runs/RunBadges.svelte.d.ts +12 -0
  178. package/package/components/runs/RunLabels.svelte +86 -0
  179. package/package/components/runs/RunLabels.svelte.d.ts +10 -0
  180. package/package/components/runs/RunOption.svelte +20 -0
  181. package/package/components/runs/RunOption.svelte.d.ts +10 -0
  182. package/package/components/runs/RunRow.svelte +239 -151
  183. package/package/components/runs/RunRow.svelte.d.ts +12 -9
  184. package/package/components/runs/RunsBatchActionsDropdown.svelte +13 -17
  185. package/package/components/runs/RunsBatchActionsDropdown.svelte.d.ts +5 -18
  186. package/package/components/runs/RunsFilter.svelte +369 -243
  187. package/package/components/runs/RunsFilter.svelte.d.ts +2 -0
  188. package/package/components/runs/RunsQueue.svelte +96 -25
  189. package/package/components/runs/RunsQueue.svelte.d.ts +7 -21
  190. package/package/components/runs/RunsTable.svelte +62 -71
  191. package/package/components/runs/RunsTable.svelte.d.ts +2 -1
  192. package/package/components/runs/runs-grid.css +95 -0
  193. package/package/components/schema/EditableSchemaDrawer.svelte +12 -12
  194. package/package/components/schema/FlowPropertyEditor.svelte +197 -206
  195. package/package/components/schema/PropertyEditor.svelte +33 -35
  196. package/package/components/schema/SchemaFormDND.svelte.d.ts +2 -2
  197. package/package/components/search/GlobalSearchModal.svelte +8 -1
  198. package/package/components/select/DraggableTags.svelte.d.ts +17 -7
  199. package/package/components/select/MultiSelect.svelte.d.ts +21 -11
  200. package/package/components/select/Select.svelte +2 -1
  201. package/package/components/select/Select.svelte.d.ts +25 -13
  202. package/package/components/select/SelectDropdown.svelte.d.ts +14 -7
  203. package/package/components/settings/TokenDisplay.svelte +1 -1
  204. package/package/components/sidebar/OperatorMenu.svelte +5 -0
  205. package/package/components/sidebar/SidebarContent.svelte +48 -2
  206. package/package/components/sidebar/WorkspaceMenu.svelte +116 -17
  207. package/package/components/toast.js +6 -3
  208. package/package/components/triggers/AddTriggersButton.svelte +7 -6
  209. package/package/components/triggers/CaptureWrapper.svelte +19 -3
  210. package/package/components/triggers/TriggerLabel.svelte +8 -0
  211. package/package/components/triggers/TriggerTokens.svelte +1 -1
  212. package/package/components/triggers/TriggersEditor.svelte +9 -5
  213. package/package/components/triggers/TriggersTable.svelte +2 -2
  214. package/package/components/triggers/TriggersWrapper.svelte +16 -5
  215. package/package/components/triggers/TriggersWrapper.svelte.d.ts +3 -19
  216. package/package/components/{details/EmailTriggerCaptures.svelte → triggers/email/DefaultEmailCapture.svelte} +5 -5
  217. package/package/components/{details/EmailTriggerCaptures.svelte.d.ts → triggers/email/DefaultEmailCapture.svelte.d.ts} +4 -4
  218. package/package/components/{details/EmailTriggerConfigSection.svelte → triggers/email/DefaultEmailConfigSection.svelte} +24 -14
  219. package/package/components/triggers/email/DefaultEmailConfigSection.svelte.d.ts +13 -0
  220. package/package/components/triggers/email/DefaultEmailPanel.svelte +71 -0
  221. package/package/components/triggers/email/DefaultEmailPanel.svelte.d.ts +11 -0
  222. package/package/components/triggers/email/EmailCapture.svelte +39 -0
  223. package/package/components/triggers/email/EmailCapture.svelte.d.ts +43 -0
  224. package/package/components/triggers/email/EmailTriggerEditor.svelte +20 -0
  225. package/package/components/triggers/email/EmailTriggerEditor.svelte.d.ts +11 -0
  226. package/package/components/triggers/email/EmailTriggerEditorConfigSection.svelte +133 -0
  227. package/package/components/triggers/email/EmailTriggerEditorConfigSection.svelte.d.ts +14 -0
  228. package/package/components/triggers/email/EmailTriggerEditorInner.svelte +335 -0
  229. package/package/components/triggers/email/EmailTriggerEditorInner.svelte.d.ts +22 -0
  230. package/package/components/triggers/email/EmailTriggerPanel.svelte +61 -0
  231. package/package/components/triggers/email/EmailTriggerPanel.svelte.d.ts +14 -0
  232. package/package/components/triggers/email/utils.d.ts +4 -0
  233. package/package/components/triggers/email/utils.js +52 -0
  234. package/package/components/triggers/http/RouteEditorConfigSection.svelte +1 -1
  235. package/package/components/triggers/http/utils.js +1 -1
  236. package/package/components/triggers/triggers.svelte.d.ts +1 -0
  237. package/package/components/triggers/triggers.svelte.js +24 -2
  238. package/package/components/triggers/utils.js +19 -5
  239. package/package/components/triggers.d.ts +1 -1
  240. package/package/components/triggers.js +2 -0
  241. package/package/components/wizards/AgGridWizard.svelte +85 -80
  242. package/package/components/workspaceSettings/AISettings.svelte +74 -22
  243. package/package/components/workspaceSettings/AISettings.svelte.d.ts +2 -1
  244. package/package/components/workspaceSettings/CreateWorkspace.svelte +395 -0
  245. package/package/components/workspaceSettings/CreateWorkspace.svelte.d.ts +6 -0
  246. package/package/components/workspaceSettings/DucklakeSettings.svelte +3 -1
  247. package/package/components/workspaceSettings/GitSyncFilterSettings.svelte +1 -1
  248. package/package/components/workspaceSettings/StorageSettings.svelte +69 -48
  249. package/package/gen/core/OpenAPI.js +1 -1
  250. package/package/gen/schemas.gen.d.ts +142 -3
  251. package/package/gen/schemas.gen.js +144 -3
  252. package/package/gen/services.gen.d.ts +129 -1
  253. package/package/gen/services.gen.js +267 -1
  254. package/package/gen/types.gen.d.ts +434 -8
  255. package/package/hubPaths.json +4 -2
  256. package/package/infer.js +1 -1
  257. package/package/keyboardChain.d.ts +5 -0
  258. package/package/keyboardChain.js +40 -0
  259. package/package/services/JobManager.js +2 -2
  260. package/package/stores.d.ts +3 -1
  261. package/package/stores.js +8 -5
  262. package/package/utils/workspaceHierarchy.d.ts +27 -0
  263. package/package/utils/workspaceHierarchy.js +101 -0
  264. package/package/utils.d.ts +6 -3
  265. package/package/utils.js +30 -15
  266. package/package/workspace_settings.js +2 -3
  267. package/package.json +9 -11
  268. package/package/components/DynSelect.svelte.d.ts +0 -11
  269. package/package/components/ObjectTypeNarrowing.svelte +0 -18
  270. package/package/components/ObjectTypeNarrowing.svelte.d.ts +0 -22
  271. package/package/components/details/DetailPageTriggerPanel.svelte +0 -121
  272. package/package/components/details/DetailPageTriggerPanel.svelte.d.ts +0 -20
  273. package/package/components/details/EmailTriggerConfigSection.svelte.d.ts +0 -12
  274. package/package/components/details/EmailTriggerPanel.svelte +0 -76
  275. package/package/components/details/EmailTriggerPanel.svelte.d.ts +0 -26
@@ -0,0 +1,86 @@
1
+ <script lang="ts">import { twMerge } from 'tailwind-merge';
2
+ import { ListFilterPlus } from 'lucide-svelte';
3
+ import Tooltip from '../meltComponents/Tooltip.svelte';
4
+ import DropdownV2 from '../DropdownV2.svelte';
5
+ let { job, activeLabel, onFilterByLabel, labelWidth } = $props();
6
+ const GAP = 4;
7
+ const LABEL_MAX_WIDTH = 84;
8
+ const MORE_LABEL_WIDTH = 30;
9
+ // Min width for labels columns is 120px
10
+ const labels = $derived(job && Array.isArray(job?.['labels']) ? job['labels'] : []);
11
+ const labelSplit = $derived.by(() => {
12
+ if (!labels || labels.length === 0 || labelWidth <= 0) {
13
+ return { visibleLabels: [], hiddenLabels: [] };
14
+ }
15
+ if (labels.length === 1) {
16
+ return { visibleLabels: labels, hiddenLabels: [] };
17
+ }
18
+ let currentWidth = 0;
19
+ const visible = [];
20
+ const hidden = [];
21
+ const margin = 20;
22
+ for (let i = 0; i < labels.length; i++) {
23
+ const label = labels[i];
24
+ // Check if we need to reserve space for overflow badge
25
+ const needsOverflowBadge = i < labels.length - 1;
26
+ const remainingWidth = labelWidth - currentWidth;
27
+ const requiredWidth = LABEL_MAX_WIDTH + (needsOverflowBadge ? MORE_LABEL_WIDTH + GAP : 0) + margin;
28
+ if (remainingWidth >= requiredWidth || visible.length === 0) {
29
+ visible.push(label);
30
+ currentWidth += LABEL_MAX_WIDTH + GAP;
31
+ }
32
+ else {
33
+ hidden.push(...labels.slice(i));
34
+ break;
35
+ }
36
+ }
37
+ return { visibleLabels: visible, hiddenLabels: hidden };
38
+ });
39
+ const visibleLabels = $derived(labelSplit.visibleLabels || []);
40
+ const hiddenLabels = $derived(labelSplit.hiddenLabels || []);
41
+ const dropdownItems = $derived(hiddenLabels.map((label) => ({
42
+ displayName: label,
43
+ action: () => onFilterByLabel(label),
44
+ icon: ListFilterPlus
45
+ })));
46
+ </script>
47
+
48
+ {#if labels && labels.length > 0}
49
+ <div class="flex flex-row items-center" style="gap: {GAP}px">
50
+ {#each visibleLabels as label}
51
+ <Tooltip openDelay={500} placement="bottom">
52
+ <button
53
+ class={twMerge(
54
+ activeLabel == label ? 'bg-blue-50 dark:bg-blue-900/50' : '',
55
+ 'flex flex-row items-center px-2 group py-1 rounded-md bg-surface-secondary hover:bg-surface'
56
+ )}
57
+ style="gap: {GAP}px; width: {LABEL_MAX_WIDTH}px"
58
+ onclick={() => {
59
+ onFilterByLabel(label)
60
+ }}
61
+ >
62
+ <span class="truncate text-2xs font-normal">{label}</span>
63
+ <ListFilterPlus size={12} class="shrink-0 text-gray-300 group-hover:text-primary" />
64
+ </button>
65
+ {#snippet text()}
66
+ {`Filter by label: ${label}`}
67
+ {/snippet}
68
+ </Tooltip>
69
+ {/each}
70
+
71
+ {#if hiddenLabels.length > 0}
72
+ <DropdownV2 placement="bottom-start" items={dropdownItems} customWidth={224}>
73
+ {#snippet buttonReplacement()}
74
+ <button
75
+ class="flex flex-row items-center justify-center px-2 py-1 text-2xs font-semibold hover:bg-surface bg-surface-secondary text-secondary rounded-md"
76
+ style="gap: {GAP}px; width: {MORE_LABEL_WIDTH}px"
77
+ >
78
+ +{hiddenLabels.length}
79
+ </button>
80
+ {/snippet}
81
+ </DropdownV2>
82
+ {/if}
83
+ </div>
84
+ {:else}
85
+ <span class="text-2xs text-secondary">-</span>
86
+ {/if}
@@ -0,0 +1,10 @@
1
+ import type { Job } from '../../gen';
2
+ interface Props {
3
+ job: Job;
4
+ activeLabel: string | null;
5
+ onFilterByLabel: (label: string) => void;
6
+ labelWidth: number;
7
+ }
8
+ declare const RunLabels: import("svelte").Component<Props, {}, "">;
9
+ type RunLabels = ReturnType<typeof RunLabels>;
10
+ export default RunLabels;
@@ -0,0 +1,20 @@
1
+ <script lang="ts">import Tooltip from '../Tooltip.svelte';
2
+ let { label, children, tooltip, for: forAttr = '', noLabel = false } = $props();
3
+ </script>
4
+
5
+ <div class="flex flex-col items-start w-fit">
6
+ <div class="text-xs truncate">
7
+ {#if forAttr}
8
+ <label for={forAttr} class:text-transparent={noLabel}>{label}</label>
9
+ {:else}
10
+ <span class:text-transparent={noLabel}>{label}</span>
11
+ {/if}
12
+ {#if tooltip}
13
+ <Tooltip small>{@render tooltip()}</Tooltip>
14
+ {/if}
15
+ </div>
16
+
17
+ <div class="flex flex-row gap-1 items-center justify-start w-full relative h-[34px]">
18
+ {@render children()}
19
+ </div>
20
+ </div>
@@ -0,0 +1,10 @@
1
+ interface Props {
2
+ label: string;
3
+ children: import('svelte').Snippet;
4
+ tooltip?: import('svelte').Snippet;
5
+ for?: string;
6
+ noLabel?: boolean;
7
+ }
8
+ declare const RunOption: import("svelte").Component<Props, {}, "">;
9
+ type RunOption = ReturnType<typeof RunOption>;
10
+ export default RunOption;
@@ -1,51 +1,89 @@
1
1
  <script lang="ts">import { base } from '../../base';
2
2
  import { goto } from '../../navigation';
3
- import { displayDate, msToReadableTime, truncateHash, truncateRev, isFlowPreview, isScriptPreview, isJobSelectable } from '../../utils';
3
+ import { displayDate, truncateHash, truncateRev, isScriptPreview, isJobSelectable, msToReadableTime, isFlowPreview } from '../../utils';
4
4
  import { Badge, Button } from '../common';
5
5
  import ScheduleEditor from '../triggers/schedules/ScheduleEditor.svelte';
6
6
  import BarsStaggered from '../icons/BarsStaggered.svelte';
7
- import { Calendar, Check, FastForward, Folder, Hourglass, ListFilter, Play, ShieldQuestion, X } from 'lucide-svelte';
7
+ import { Bot, Calendar, Check, Clock, Code, ExternalLink, FastForward, Hourglass, ListFilterPlus, Package, Play, ShieldQuestion, X } from 'lucide-svelte';
8
8
  import { createEventDispatcher } from 'svelte';
9
9
  import TimeAgo from '../TimeAgo.svelte';
10
10
  import { forLater } from '../../forLater';
11
11
  import { twMerge } from 'tailwind-merge';
12
12
  import Portal from '../Portal.svelte';
13
13
  import WaitTimeWarning from '../common/waitTimeWarning/WaitTimeWarning.svelte';
14
+ import DropdownV2 from '../DropdownV2.svelte';
15
+ import { Tooltip } from '../meltComponents';
16
+ import { GitIcon } from '../icons';
17
+ import RunLabels from './RunLabels.svelte';
18
+ import './runs-grid.css';
14
19
  const dispatch = createEventDispatcher();
15
- export let job;
16
- export let selected = false;
17
- export let containerWidth = 0;
18
- export let containsLabel = false;
19
- export let activeLabel;
20
- export let selectionMode = false;
21
- let scheduleEditor;
22
- $: isExternal = job && job.id === '-';
20
+ let { job, selected = false, containerWidth = 0, containsLabel = false, showTag = true, activeLabel, selectionMode = false } = $props();
21
+ let scheduleEditor = $state(undefined);
22
+ let isExternal = $derived(job && job.id === '-');
23
+ function getJobKindIcon(jobKind) {
24
+ if (jobKind === 'flow' || isFlowPreview(jobKind)) {
25
+ return BarsStaggered;
26
+ }
27
+ else if (jobKind === 'deploymentcallback') {
28
+ return GitIcon;
29
+ }
30
+ else if (jobKind === 'dependencies' ||
31
+ jobKind === 'appdependencies' ||
32
+ jobKind === 'flowdependencies') {
33
+ return Package;
34
+ }
35
+ else if (jobKind === 'script' ||
36
+ isScriptPreview(jobKind) ||
37
+ jobKind === 'script_hub' ||
38
+ jobKind === 'singlescriptflow') {
39
+ return Code;
40
+ }
41
+ else if (jobKind === 'aiagent') {
42
+ return Bot;
43
+ }
44
+ return Code;
45
+ }
46
+ let labelWidth = $state(0);
47
+ let isJobRecent = $state(true);
23
48
  </script>
24
49
 
25
50
  <Portal name="run-row">
26
51
  <ScheduleEditor onUpdate={() => goto('/schedules')} bind:this={scheduleEditor} />
27
52
  </Portal>
28
- <!-- svelte-ignore a11y-click-events-have-key-events -->
29
- <!-- svelte-ignore a11y-no-static-element-interactions -->
53
+ <!-- svelte-ignore a11y_click_events_have_key_events -->
54
+ <!-- svelte-ignore a11y_no_static_element_interactions -->
30
55
  <div
31
56
  class={twMerge(
32
57
  'hover:bg-surface-hover cursor-pointer',
33
58
  selected ? 'bg-blue-50 dark:bg-blue-900/50' : '',
34
- 'flex flex-row items-center h-full'
59
+ 'grid items-center h-full'
35
60
  )}
61
+ class:grid-runs-table={!containsLabel && !selectionMode && showTag}
62
+ class:grid-runs-table-with-labels={containsLabel && !selectionMode && showTag}
63
+ class:grid-runs-table-selection={!containsLabel && selectionMode && showTag}
64
+ class:grid-runs-table-with-labels-selection={containsLabel && selectionMode && showTag}
65
+ class:grid-runs-table-no-tag={!containsLabel && !selectionMode && !showTag}
66
+ class:grid-runs-table-with-labels-no-tag={containsLabel && !selectionMode && !showTag}
67
+ class:grid-runs-table-selection-no-tag={!containsLabel && selectionMode && !showTag}
68
+ class:grid-runs-table-with-labels-selection-no-tag={containsLabel && selectionMode && !showTag}
36
69
  style="width: {containerWidth}px"
37
- on:click={() => {
70
+ onclick={() => {
38
71
  if (!selectionMode || isJobSelectable(selectionMode)(job)) {
39
72
  dispatch('select')
40
73
  }
41
74
  }}
42
75
  >
43
- <div class="w-1/12 flex justify-center">
44
- {#if selectionMode && isJobSelectable(selectionMode)(job)}
45
- <div class="px-2">
46
- <input type="checkbox" checked={selected} />
76
+ <!-- Selection column (only when in selection mode) -->
77
+ {#if selectionMode}
78
+ <div class="flex items-center justify-center">
79
+ <div class="w-4 h-4">
80
+ <input type="checkbox" checked={selected} disabled={!isJobSelectable(selectionMode)(job)} />
47
81
  </div>
48
- {/if}
82
+ </div>
83
+ {/if}
84
+
85
+ <!-- Status -->
86
+ <div class="flex items-center justify-start pl-2">
49
87
  {#if isExternal}
50
88
  <Badge color="gray" baseClass="!px-1.5">
51
89
  <ShieldQuestion size={14} />
@@ -87,16 +125,13 @@ $: isExternal = job && job.id === '-';
87
125
  {/if}
88
126
  </div>
89
127
 
90
- <div class="w-4/12 flex justify-start">
91
- <div class="flex flex-row items-center gap-1 text-gray-500 dark:text-gray-300 text-2xs">
128
+ <!-- Job time -->
129
+ <div class="overflow-hidden min-w-0">
130
+ <div class="flex flex-row items-center gap-1 text-secondary text-2xs">
92
131
  {#if job}
93
132
  {#if 'started_at' in job && job.started_at}
94
- Started <TimeAgo agoOnlyIfRecent date={job.started_at ?? ''} />
95
- {#if job && 'duration_ms' in job && job.duration_ms != undefined}
96
- (Ran in {msToReadableTime(
97
- job.duration_ms
98
- )}{#if job.job_kind == 'flow' || isFlowPreview(job.job_kind)}&nbsp;total{/if})
99
- {/if}
133
+ {isJobRecent ? 'Started' : ''}
134
+ <TimeAgo bind:isRecent={isJobRecent} agoOnlyIfRecent date={job.started_at ?? ''} />
100
135
  {#if job && (job.self_wait_time_ms || job.aggregate_wait_time_ms)}
101
136
  <WaitTimeWarning
102
137
  self_wait_time_ms={job.self_wait_time_ms}
@@ -105,7 +140,7 @@ $: isExternal = job && job.id === '-';
105
140
  />
106
141
  {/if}
107
142
  {:else if `scheduled_for` in job && job.scheduled_for && forLater(job.scheduled_for)}
108
- Scheduled for {displayDate(job.scheduled_for)}
143
+ {displayDate(job.scheduled_for)}<Clock size={12} />
109
144
  {:else if job.canceled}
110
145
  {#if job.type == 'CompletedJob'}
111
146
  Cancelled <TimeAgo agoOnlyIfRecent date={job.created_at || ''} />
@@ -124,154 +159,207 @@ $: isExternal = job && job.id === '-';
124
159
  </div>
125
160
  </div>
126
161
 
127
- <div class="w-4/12 flex justify-start flex-col">
128
- <div class="flex flex-row text-sm">
129
- {#if job === undefined}
130
- No job found
131
- {:else}
132
- <div class="flex flex-row gap-1 min-w-0">
133
- <div class="whitespace-nowrap text-xs font-semibold truncate">
134
- {#if job.script_path}
135
- <div class="flex flex-row gap-1 items-center">
136
- {#if isExternal}
137
- <span class="w-30 justify-center">-</span>
138
- {:else}
139
- <a
140
- href="{base}/run/{job.id}?workspace={job.workspace_id}"
141
- class="truncate w-30 dark:text-blue-400"
142
- >
143
- {job.script_path}
144
- </a>
145
- <Button
146
- title="Filter by path"
147
- size="xs2"
148
- color="light"
149
- on:click={() => {
150
- dispatch('filterByPath', job.script_path)
151
- }}
152
- >
153
- <ListFilter size={10} />
154
- </Button>
155
- {/if}
156
- {#if job.script_path?.startsWith('f/')}
157
- <Button
158
- title="Filter by folder"
159
- size="xs2"
160
- color="light"
161
- on:click={() => {
162
- // split script_path by / and get the second element
163
- const folder = job.script_path?.split('/')[1]
162
+ <!-- Job duration-->
163
+ <div class="text-2xs font-normal text-secondary pr-2">
164
+ {#if job && 'duration_ms' in job && job.duration_ms != undefined}
165
+ {msToReadableTime(job.duration_ms, 2)}
166
+ {:else}
167
+ -
168
+ {/if}
169
+ </div>
164
170
 
165
- dispatch('filterByFolder', folder)
166
- }}
167
- >
168
- <Folder size={10} />
169
- </Button>
170
- {/if}
171
- </div>
172
- {:else if 'job_kind' in job && isScriptPreview(job.job_kind)}
173
- <a href="{base}/run/{job.id}?workspace={job.workspace_id}">Preview without path </a>
174
- {:else if 'job_kind' in job && job.job_kind == 'dependencies'}
175
- <a href="{base}/run/{job.id}?workspace={job.workspace_id}">
176
- lock deps of {truncateHash(job.script_hash ?? '')}
177
- </a>
178
- {:else if 'job_kind' in job && job.job_kind == 'identity'}
179
- <a href="{base}/run/{job.id}?workspace={job.workspace_id}">no op</a>
171
+ <!-- Job path-->
172
+ <div class="flex justify-start flex-col pr-4">
173
+ {#if job === undefined}
174
+ No job found
175
+ {:else}
176
+ {@const JobKindIcon = getJobKindIcon(job.job_kind)}
177
+ <div class="flex flex-row gap-3 min-w-0 items-center h-full">
178
+ <Tooltip class="h-full">
179
+ <div class="relative">
180
+ {#if job && job.parent_job}
181
+ <span class="absolute -top-1 -right-1 text-xs text-blue-500">*</span>
180
182
  {/if}
183
+ <JobKindIcon size={14} />
181
184
  </div>
182
- </div>
183
- {/if}
184
- </div>
185
+ {#snippet text()}
186
+ <span>
187
+ {#if job && job.job_kind}
188
+ {job.job_kind}
189
+ {/if}
190
+ {#if job && job.is_flow_step && job.parent_job}
191
+ <br /> Step of flow
192
+ <a href={`${base}/run/${job.parent_job}?workspace=${job.workspace_id}`}>
193
+ {truncateRev(job.parent_job, 10)}
194
+ </a>
195
+ {:else if job && job.parent_job}
196
+ <br /> Parent
197
+ <a href={`${base}/run/${job.parent_job}?workspace=${job.workspace_id}`}>
198
+ {truncateRev(job.parent_job, 10)}
199
+ </a>
200
+ {/if}
201
+ </span>
202
+ {/snippet}
203
+ </Tooltip>
185
204
 
186
- {#if job && job.parent_job}
187
- {#if job.is_flow_step}
188
- <div class="flex flex-row gap-1 items-center">
189
- <BarsStaggered class="text-secondary" size={14} />
190
- <span class="mx-1 text-xs">
191
- Step of flow <a href={`${base}/run/${job.parent_job}?workspace=${job.workspace_id}`}>
192
- {truncateRev(job.parent_job, 6)}
193
- </a>
194
- </span>
195
- </div>
196
- {:else}
197
- <div class="flex flex-row gap-1 items-center">
198
- <span class="text-2xs text-tertiary truncate">
199
- parent <a href={`${base}/run/${job.parent_job}?workspace=${job.workspace_id}`}>
200
- {truncateRev(job.parent_job, 10)}
201
- </a>
202
- </span>
205
+ <div class="whitespace-nowrap text-xs text-secondary truncate">
206
+ {#if job.script_path}
207
+ <div class="flex flex-row gap-1 items-center">
208
+ {#if isExternal}
209
+ <span class="w-30 justify-center">-</span>
210
+ {:else}
211
+ <span class="truncate w-30" title={job.script_path}>
212
+ {job.script_path}
213
+ </span>
214
+ {/if}
215
+ {#if !isExternal || job.script_path?.startsWith('f/')}
216
+ {@const isFolder = job.script_path?.startsWith('f/')}
217
+ <DropdownV2
218
+ items={() => {
219
+ const items = isExternal
220
+ ? []
221
+ : [
222
+ {
223
+ displayName: `Filter by path: ${job.script_path}`,
224
+ action: () => dispatch('filterByPath', job.script_path),
225
+ disabled: isExternal
226
+ }
227
+ ]
228
+ if (isFolder) {
229
+ const folder = job.script_path?.split('/')[1]
230
+ return [
231
+ {
232
+ displayName: `Filter by folder: ${folder}`,
233
+ action: () => dispatch('filterByFolder', folder)
234
+ },
235
+ ...items
236
+ ]
237
+ }
238
+ return items
239
+ }}
240
+ class="w-fit"
241
+ >
242
+ {#snippet buttonReplacement()}
243
+ <div
244
+ class="p-1 hover:bg-surface cursor-pointer rounded-md text-gray-300 hover:text-primary"
245
+ >
246
+ <ListFilterPlus size={14} />
247
+ </div>
248
+ {/snippet}
249
+ </DropdownV2>
250
+ {/if}
251
+ </div>
252
+ {:else if 'job_kind' in job && isScriptPreview(job.job_kind)}
253
+ Preview without path
254
+ {:else if 'job_kind' in job && job.job_kind == 'dependencies'}
255
+ lock deps of {truncateHash(job.script_hash ?? '')}
256
+ {:else if 'job_kind' in job && job.job_kind == 'identity'}
257
+ no op
258
+ {:else if 'job_kind' in job && isFlowPreview(job.job_kind)}
259
+ Preview without path
260
+ {/if}
203
261
  </div>
204
- {/if}
262
+ </div>
205
263
  {/if}
206
264
  </div>
265
+ <!-- Labels-->
207
266
  {#if containsLabel}
208
- <div class="w-3/12 flex justify-start px-0.5">
209
- {#if job && job?.['labels']}
210
- <div class="flex flex-row items-center gap-1 overflow-x-auto">
211
- {#if Array.isArray(job?.['labels'])}
212
- {#each job?.['labels'] as label}
213
- <Button
214
- variant="border"
215
- size="xs3"
216
- btnClasses={twMerge(
217
- activeLabel == label ? 'bg-blue-50 dark:bg-blue-900/50' : '',
218
- '!text-2xs !font-normal truncate max-w-28'
219
- )}
220
- color="light"
221
- on:click={() => {
222
- dispatch('filterByLabel', label)
223
- }}
224
- endIcon={{ icon: ListFilter }}
225
- >
226
- {label}
227
- </Button>
228
- {/each}
229
- {/if}
230
- </div>
231
- {/if}
267
+ <div class="flex justify-start overflow-hidden" bind:clientWidth={labelWidth}>
268
+ <RunLabels
269
+ {job}
270
+ {activeLabel}
271
+ onFilterByLabel={(label) => dispatch('filterByLabel', label)}
272
+ {labelWidth}
273
+ />
232
274
  </div>
233
275
  {/if}
234
- <div class="w-3/12 flex justify-start">
276
+ <!-- Author and schedule-->
277
+ <div class="flex justify-start pr-4 text-secondary">
235
278
  {#if job && job.schedule_path}
236
- <div class="flex flex-row items-center gap-1">
237
- <Calendar size={14} />
279
+ <div class="flex flex-row items-center gap-1 w-full -ml-2">
238
280
  <Button
239
281
  size="xs2"
240
282
  color="light"
241
- btnClasses="font-normal"
283
+ btnClasses="font-normal bg-transparent hover:bg-surface hover:text-primary"
242
284
  on:click={() => scheduleEditor?.openEdit(job.schedule_path ?? '', job.job_kind == 'flow')}
243
285
  >
244
- <div class="truncate text-ellipsis text-left" title={job.schedule_path}>
245
- {truncateRev(job.schedule_path, 20)}
246
- </div>
286
+ <Calendar size={14} />
247
287
  </Button>
248
- <Button
249
- size="xs2"
250
- color="light"
251
- on:click={() => {
252
- dispatch('filterBySchedule', job.schedule_path)
253
- }}
288
+ <div class="text-xs truncate text-ellipsis text-left" dir="rtl" title={job.schedule_path}>
289
+ {job.schedule_path}
290
+ </div>
291
+ <DropdownV2
292
+ items={[
293
+ {
294
+ displayName: `Filter by schedule: ${truncateRev(job.schedule_path, 20)}`,
295
+ action: () => dispatch('filterBySchedule', job.schedule_path)
296
+ }
297
+ ]}
298
+ class="w-fit"
254
299
  >
255
- <ListFilter size={10} />
256
- </Button>
300
+ {#snippet buttonReplacement()}
301
+ <div
302
+ class="p-1 hover:bg-surface cursor-pointer rounded-md text-gray-300 hover:text-primary"
303
+ >
304
+ <ListFilterPlus size={14} />
305
+ </div>
306
+ {/snippet}
307
+ </DropdownV2>
257
308
  </div>
258
309
  {:else}
259
- <div class="flex flex-row gap-1 items-center">
260
- <div class="text-xs truncate text-ellipsis text-left" title={job.created_by}>
261
- {truncateRev(job.created_by ?? '', 20)}
310
+ <div class="flex flex-row gap-1 items-center w-full">
311
+ <div class="text-xs truncate text-ellipsis text-left" dir="rtl" title={job.created_by}>
312
+ {job.created_by ?? ''}
262
313
  </div>
263
314
  {#if !isExternal}
264
- <Button
265
- size="xs2"
266
- color="light"
267
- on:click={() => {
268
- dispatch('filterByUser', job.created_by ?? '')
269
- }}
315
+ <DropdownV2
316
+ items={[
317
+ {
318
+ displayName: `Filter by triggered by: ${job.created_by}`,
319
+ action: () => dispatch('filterByUser', job.created_by ?? '')
320
+ }
321
+ ]}
322
+ customWidth={256}
323
+ class="w-fit"
270
324
  >
271
- <ListFilter size={10} />
272
- </Button>
325
+ {#snippet buttonReplacement()}
326
+ <div
327
+ class="p-1 hover:bg-surface cursor-pointer rounded-md text-gray-300 hover:text-primary"
328
+ >
329
+ <ListFilterPlus size={14} />
330
+ </div>
331
+ {/snippet}
332
+ </DropdownV2>
273
333
  {/if}
274
334
  </div>
275
335
  {/if}
276
336
  </div>
337
+
338
+ <!-- Job tag-->
339
+ {#if showTag}
340
+ <div class="flex justify-start gap-1">
341
+ {#if job.tag}
342
+ <span class="text-xs text-secondary truncate" title={job.tag}>{job.tag}</span>
343
+ {/if}
344
+ </div>
345
+ {/if}
346
+
347
+ <!-- Job link-->
348
+ {#if !isExternal}
349
+ <div class="flex justify-end pr-2">
350
+ <a
351
+ target="_blank"
352
+ href="{base}/run/{job.id}?workspace={job.workspace_id}"
353
+ class={twMerge(
354
+ 'text-right float-right px-2',
355
+ selected
356
+ ? 'text-blue-500 hover:text-primary'
357
+ : 'text-gray-300 dark:text-gray-500 hover:text-primary dark:hover:text-primary'
358
+ )}
359
+ title="See run detail in a new tab"
360
+ >
361
+ <ExternalLink size={14} />
362
+ </a>
363
+ </div>
364
+ {/if}
277
365
  </div>
@@ -1,5 +1,15 @@
1
1
  import type { Job } from '../../gen';
2
2
  import type { RunsSelectionMode } from './RunsBatchActionsDropdown.svelte';
3
+ import './runs-grid.css';
4
+ interface Props {
5
+ job: Job;
6
+ selected?: boolean;
7
+ containerWidth?: number;
8
+ containsLabel?: boolean;
9
+ showTag?: boolean;
10
+ activeLabel: string | null;
11
+ selectionMode?: RunsSelectionMode | false;
12
+ }
3
13
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
4
14
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
5
15
  $$bindings?: Bindings;
@@ -13,14 +23,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
13
23
  };
14
24
  z_$$bindings?: Bindings;
15
25
  }
16
- declare const RunRow: $$__sveltets_2_IsomorphicComponent<{
17
- job: Job;
18
- selected?: boolean;
19
- containerWidth?: number;
20
- containsLabel?: boolean;
21
- activeLabel: string | null;
22
- selectionMode?: RunsSelectionMode | false;
23
- }, {
26
+ declare const RunRow: $$__sveltets_2_IsomorphicComponent<Props, {
24
27
  select: CustomEvent<any>;
25
28
  filterByPath: CustomEvent<any>;
26
29
  filterByFolder: CustomEvent<any>;
@@ -29,6 +32,6 @@ declare const RunRow: $$__sveltets_2_IsomorphicComponent<{
29
32
  filterByUser: CustomEvent<any>;
30
33
  } & {
31
34
  [evt: string]: CustomEvent<any>;
32
- }, {}, {}, string>;
35
+ }, {}, {}, "">;
33
36
  type RunRow = InstanceType<typeof RunRow>;
34
37
  export default RunRow;