@prefecthq/prefect-ui-library 3.9.0 → 3.9.1

package/dist/types/src/components/FlowRunMenu.vue.d.ts

@@ -1,7 +1,8 @@
+import { FlowRun } from '../models';
 declare function __VLS_template(): {
     slots: {
         default?(_: {
-            flowRun: import("../models").FlowRun | undefined;
+            flowRun: FlowRun;
         }): any;
     };
     refs: {};
@@ -9,15 +10,17 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import("vue").DefineComponent<__VLS_TypePropsToOption<{
-    flowRunId: string;
+    flowRun: FlowRun;
     showAll?: boolean;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     delete: (...args: any[]) => void;
+    update: (...args: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<{
-    flowRunId: string;
+    flowRun: FlowRun;
     showAll?: boolean;
 }>>> & {
     onDelete?: ((...args: any[]) => any) | undefined;
+    onUpdate?: ((...args: any[]) => any) | undefined;
 }, {}, {}>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/types/src/schemas/compositions/useSchemaPropertyInput.d.ts

@@ -203,9 +203,7 @@ export declare function useSchemaPropertyInput(schemaProperty: MaybeRefOrGetter<
             "onUpdate:value"?: ((args_0: import("../../schemas/types/schemaValues").PrefectKindWorkspaceVariable) => any) | undefined;
         }, never>, ""> & Record<string, unknown>;
     } | {
-        component: () => {
-            template: string;
-        };
+        component: () => string;
         props?: (Omit<unknown, ""> & Record<string, unknown>) | undefined;
     }>;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@prefecthq/prefect-ui-library",
-    "version": "3.9.0",
+    "version": "3.9.1",
     "private": false,
     "repository": {
         "type": "git",

package/src/components/FlowRunMenu.vue

@@ -7,7 +7,7 @@
       <p-overflow-menu-item v-if="canSuspend && showAll" label="Pause" @click="openSuspendModal" />
       <p-overflow-menu-item v-if="canCancel && showAll" label="Cancel" @click="openCancelModal" />
       <p-overflow-menu-item v-if="canChangeState" label="Change state" @click="openChangeStateModal" />
-      <copy-overflow-menu-item label="Copy ID" :item="flowRunId" />
+      <copy-overflow-menu-item label="Copy ID" :item="flowRun.id" />
       <p-overflow-menu-item v-if="can.delete.flow_run" label="Delete" @click="openDeleteModal" />
 
       <slot v-bind="{ flowRun }" />
@@ -21,16 +21,16 @@
     :flow-run="flowRun"
   />
 
-  <FlowRunResumeModal v-model:showModal="showResumeModal" :flow-run-id="flowRunId" />
+  <FlowRunResumeModal v-model:showModal="showResumeModal" :flow-run-id="flowRun.id" />
 
   <FlowRunCancelModal
     v-model:showModal="showCancelModal"
-    :flow-run-id="flowRunId"
+    :flow-run-id="flowRun.id"
     @change="showCancelModal"
   />
   <FlowRunSuspendModal
     v-model:showModal="showSuspendModal"
-    :flow-run-id="flowRunId"
+    :flow-run-id="flowRun.id"
     @change="showSuspendModal"
   />
   <ConfirmStateChangeModal
@@ -45,30 +45,29 @@
     v-model:showModal="showDeleteModal"
     label="Flow Run"
     :name="flowRun.name!"
-    @delete="deleteFlowRun(flowRunId)"
+    @delete="deleteFlowRun(flowRun.id)"
   />
 </template>
 
 <script lang="ts" setup>
   import { showToast } from '@prefecthq/prefect-design'
-  import { computed, ref, toRefs } from 'vue'
+  import { computed, ref } from 'vue'
   import { FlowRunRetryModal, FlowRunCancelModal, FlowRunSuspendModal, ConfirmStateChangeModal, ConfirmDeleteModal, CopyOverflowMenuItem } from '@/components'
   import FlowRunResumeModal from '@/components/FlowRunResumeModal.vue'
-  import { useCan, useWorkspaceApi, useShowModal, useWorkspaceRoutes, useFlowRuns, useFlowRun, useDeployment } from '@/compositions'
+  import { useCan, useWorkspaceApi, useShowModal, useWorkspaceRoutes, useFlowRuns, useDeployment } from '@/compositions'
   import { localization } from '@/localization'
-  import { FlowRunsFilter, isPausedStateType, isRunningStateType, isStuckStateType, isTerminalStateType, StateUpdateDetails } from '@/models'
+  import { FlowRun, FlowRunsFilter, isPausedStateType, isRunningStateType, isStuckStateType, isTerminalStateType, StateUpdateDetails } from '@/models'
   import { deleteItem } from '@/utilities'
   import { getApiErrorMessage } from '@/utilities/errors'
 
   const props = defineProps<{
-    flowRunId: string,
+    flowRun: FlowRun,
     showAll?: boolean,
   }>()
 
   const can = useCan()
   const api = useWorkspaceApi()
   const routes = useWorkspaceRoutes()
-  const { flowRunId } = toRefs(props)
 
   const { showModal: showRetryModal, open: openRetryModal } = useShowModal()
   const { showModal: showResumeModal, open: openResumeModal } = useShowModal()
@@ -79,32 +78,31 @@
 
   const retryingRun = ref(false)
 
-  const { flowRun, subscription: flowRunSubscription } = useFlowRun(flowRunId, { interval: 3000 })
-  const { deployment } = useDeployment(() => flowRun.value?.deploymentId)
+  const { deployment } = useDeployment(() => props.flowRun.deploymentId)
 
   const canRetry = computed(() => {
-    if (!can.update.flow_run || !flowRun.value?.stateType || !flowRun.value.deploymentId) {
+    if (!can.update.flow_run || !props.flowRun.stateType || !props.flowRun.deploymentId) {
       return false
     }
-    return isTerminalStateType(flowRun.value.stateType)
+    return isTerminalStateType(props.flowRun.stateType)
   })
 
   const canResume = computed(() => {
-    if (!can.update.flow_run || !flowRun.value?.stateType) {
+    if (!can.update.flow_run || !props.flowRun.stateType) {
       return false
     }
 
-    return isPausedStateType(flowRun.value.stateType)
+    return isPausedStateType(props.flowRun.stateType)
   })
 
   const flowRunFilter = (): FlowRunsFilter | null => {
-    if (!flowRun.value?.parentTaskRunId) {
+    if (!props.flowRun.parentTaskRunId) {
       return null
     }
 
     return {
       taskRuns: {
-        id: [flowRun.value.parentTaskRunId],
+        id: [props.flowRun.parentTaskRunId],
       },
     }
   }
@@ -117,31 +115,31 @@
     return value.id
   })
   const canCancel = computed(() => {
-    if (!can.update.flow_run || !flowRun.value?.stateType || parentFlowRunId.value) {
+    if (!can.update.flow_run || !props.flowRun.stateType || parentFlowRunId.value) {
       return false
     }
-    return isStuckStateType(flowRun.value.stateType)
+    return isStuckStateType(props.flowRun.stateType)
   })
 
   const canSuspend = computed(() => {
-    if (!can.update.flow_run || !flowRun.value?.stateType || !flowRun.value.deploymentId) {
+    if (!can.update.flow_run || !props.flowRun.stateType || !props.flowRun.deploymentId) {
       return false
     }
 
-    return isRunningStateType(flowRun.value.stateType)
+    return isRunningStateType(props.flowRun.stateType)
   })
 
   const canChangeState = computed(() => {
-    if (!can.update.flow_run || !flowRun.value?.stateType) {
+    if (!can.update.flow_run || !props.flowRun.stateType) {
       return false
     }
-    return isTerminalStateType(flowRun.value.stateType)
+    return isTerminalStateType(props.flowRun.stateType)
   })
 
   const changeFlowRunState = async (values: StateUpdateDetails): Promise<void> => {
     try {
-      await api.flowRuns.setFlowRunState(props.flowRunId, { state: values })
-      flowRunSubscription.refresh()
+      await api.flowRuns.setFlowRunState(props.flowRun.id, { state: values })
+      emit('update')
       showToast(localization.success.changeFlowRunState, 'success')
     } catch (error) {
       console.error(error)
@@ -150,7 +148,7 @@
     }
   }
 
-  const emit = defineEmits(['delete'])
+  const emit = defineEmits(['delete', 'update'])
 
   const deleteFlowRun = async (id: string): Promise<void> => {
     await deleteItem(id, api.flowRuns.deleteFlowRun, 'Flow run')

package/src/components/PageHeadingFlowRun.vue

@@ -33,12 +33,12 @@
     <template #actions>
       <template v-if="flowRun">
         <template v-if="media.sm">
-          <FlowRunSuspendButton :flow-run="flowRun" />
-          <FlowRunResumeButton :flow-run="flowRun" />
-          <FlowRunRetryButton :flow-run="flowRun" />
-          <FlowRunCancelButton :flow-run="flowRun" />
+          <FlowRunSuspendButton :flow-run />
+          <FlowRunResumeButton :flow-run />
+          <FlowRunRetryButton :flow-run />
+          <FlowRunCancelButton :flow-run />
         </template>
-        <FlowRunMenu :flow-run-id="flowRun.id" :show-all="!media.sm" @delete="emit('delete')" />
+        <FlowRunMenu :flow-run :show-all="!media.sm" @delete="emit('delete')" />
       </template>
     </template>
   </page-heading>
@@ -86,7 +86,7 @@
     { text: flowRun.value?.name ?? '' },
   ])
 
-  const { flowRun } = useFlowRun(() => props.flowRunId, { interval: 30000 })
+  const { flowRun } = useFlowRun(() => props.flowRunId, { interval: 30_000 })
 
   const isPending = computed(() => flowRun.value?.stateType ? isPendingStateType(flowRun.value.stateType) : true)
 

package/src/schemas/components/SchemaFormPropertyUnknown.vue

@@ -59,6 +59,6 @@
       })
     }
 
-    return withProps(() => ({ template: '' }))
+    return withProps(() => '')
   })
 </script>

package/src/schemas/compositions/useSchemaPropertyInput.ts

@@ -66,7 +66,7 @@ export function useSchemaPropertyInput(schemaProperty: MaybeRefOrGetter<SchemaPr
     const exhaustive: never = propertyValue.value
     console.error(new Error(`SchemaFormProperty input is not exhaustive: ${JSON.stringify(exhaustive)}`))
 
-    return withProps(() => ({ template: '' }))
+    return withProps(() => '')
   })
 
   return { input }