@morscherlab/mint-sdk 1.1.0 → 1.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morscherlab/mint-sdk",
-  "version": "1.1.0",
+  "version": "1.1.2",
   "description": "MINT Platform SDK — Vue 3 components, composables, and types for plugin development. MINT = Mass-spec INtegrated Toolkit.",
   "type": "module",
   "main": "./dist/index.js",

package/src/__stories__/experiment-helpers.ts

@@ -5,6 +5,7 @@
 import { defineComponent, onUnmounted } from 'vue'
 import { useAppExperiment } from '../composables/useAppExperiment'
 import { useApi } from '../composables/useApi'
+import { useExperimentStore } from '../stores/experiment'
 import type { ExperimentSummary } from '../types'
 
 export const mockExperiments: ExperimentSummary[] = [
@@ -58,6 +59,9 @@ export function installMockInterceptor() {
  * Wrapper component that fakes integrated mode and provides useAppExperiment context.
  * Use in story files to demonstrate experiment selector integration.
  *
+ * The preselected experiment is committed to the shared store as a full
+ * platform record — the same path the selector modal uses at runtime.
+ *
  * Props:
  *   preselect (boolean, default true) - pre-select the first mock experiment
  */
@@ -66,18 +70,17 @@ export const ExperimentProvider = defineComponent({
   setup(props, { slots }) {
     ;(window as any).__MINT_PLATFORM__ = { isIntegrated: true, theme: 'system' }
     installMockInterceptor()
-    const { set } = useAppExperiment({
+    const experimentStore = useExperimentStore()
+    useAppExperiment({
       onSave: async () => 'Saved!',
     })
-    if (props.preselect) {
-      set({
-        id: 1,
-        name: 'Doxorubicin dose-response in HeLa cells',
-        experiment_code: 'DR-HeLa-DOX-001',
-        status: 'completed',
-      })
+    if (props.preselect && mockExperiments[0]) {
+      experimentStore.select(mockExperiments[0])
     }
-    onUnmounted(() => { delete (window as any).__MINT_PLATFORM__ })
+    onUnmounted(() => {
+      experimentStore.clear()
+      delete (window as any).__MINT_PLATFORM__
+    })
     return () => slots.default?.()
   },
 })

package/src/__tests__/components/AppTopBar.test.ts

@@ -576,10 +576,12 @@ describe('AppTopBar', () => {
         sendToPlatform: vi.fn(),
       })
       const appExperiment: AppExperimentState = {
-        experimentName: ref('Dose response'),
-        experimentCode: ref('EXP-012'),
-        experimentStatus: ref('ongoing'),
-        experimentId: ref(12),
+        experimentName: computed(() => 'Dose response'),
+        experimentCode: computed(() => 'EXP-012'),
+        experimentStatus: computed(() => 'ongoing' as const),
+        experimentId: computed(() => 12),
+        isResolving: computed(() => false),
+        error: computed(() => null),
         showModal: ref(false),
         saveLoading: ref(false),
         saveSuccessMessage: ref('Saved'),
@@ -590,7 +592,9 @@ describe('AppTopBar', () => {
         popover: computed(() => ({
           experimentName: 'Dose response',
           experimentCode: 'EXP-012',
-          experimentStatus: 'ongoing',
+          experimentStatus: 'ongoing' as const,
+          isResolving: false,
+          error: undefined,
           showSave: true,
           showDetach: true,
           saveDisabled: true,
@@ -604,7 +608,6 @@ describe('AppTopBar', () => {
         })),
         openModal: vi.fn(),
         closeModal: vi.fn(),
-        handleSelect: vi.fn(),
         handleSave: vi.fn(),
         handleDetach: vi.fn(),
       }
@@ -631,6 +634,7 @@ describe('AppTopBar', () => {
         experimentName: 'Dose response',
         experimentCode: 'EXP-012',
         experimentStatus: 'ongoing',
+        isResolving: false,
         showSave: true,
         showDetach: true,
         saveDisabled: true,

package/src/__tests__/components/ExperimentPopover.test.ts

@@ -62,6 +62,70 @@ describe('ExperimentPopover', () => {
     wrapper.unmount()
   })
 
+  it('shows a placeholder instead of "No experiment" while the record resolves', () => {
+    const wrapper = mountPopover({ isResolving: true, showDetach: true })
+
+    const trigger = wrapper.find('.mint-experiment-popover__trigger')
+    expect(trigger.find('.mint-experiment-popover__trigger-skeleton').exists()).toBe(true)
+    expect(trigger.text()).not.toContain('No experiment')
+    expect(trigger.attributes('aria-busy')).toBe('true')
+
+    wrapper.unmount()
+  })
+
+  it('never renders the bound id as a stand-in name while resolving', () => {
+    const wrapper = mountPopover({ isResolving: true, showDetach: true })
+
+    expect(wrapper.text()).not.toMatch(/\d/)
+
+    wrapper.unmount()
+  })
+
+  it('shows the resolution failure instead of "No experiment"', () => {
+    const wrapper = mountPopover({ error: 'Experiment not found', showDetach: true })
+
+    const trigger = wrapper.find('.mint-experiment-popover__trigger')
+    expect(trigger.text()).toContain('Experiment unavailable')
+    expect(trigger.text()).not.toContain('No experiment')
+    expect(trigger.classes()).toContain('mint-experiment-popover__trigger--error')
+
+    wrapper.unmount()
+  })
+
+  it('surfaces the platform error message and keeps detach reachable on failure', async () => {
+    const wrapper = mountPopover({ error: 'Experiment not found', showDetach: true })
+
+    await wrapper.find('.mint-experiment-popover__trigger').trigger('click')
+
+    const panel = wrapper.find('.mint-experiment-popover__panel')
+    expect(panel.text()).toContain('Experiment not found')
+
+    await wrapper.find('.mint-experiment-popover__detach-btn').trigger('click')
+    expect(wrapper.emitted('detach')).toHaveLength(1)
+
+    wrapper.unmount()
+  })
+
+  it('shows skeleton placeholders in the panel while the record resolves', async () => {
+    const wrapper = mountPopover({ isResolving: true, showDetach: true })
+
+    await wrapper.find('.mint-experiment-popover__trigger').trigger('click')
+
+    const panel = wrapper.find('.mint-experiment-popover__panel')
+    expect(panel.findAll('.mint-experiment-popover__skeleton-line').length).toBeGreaterThan(0)
+    expect(panel.find('.mint-experiment-popover__select-btn').exists()).toBe(false)
+
+    wrapper.unmount()
+  })
+
+  it('hides the inline save action while no resolved experiment exists', () => {
+    const wrapper = mountPopover({ isResolving: true, showSave: true })
+
+    expect(wrapper.find('.mint-experiment-popover__save-trigger').exists()).toBe(false)
+
+    wrapper.unmount()
+  })
+
   it('emits select and closes when changing experiment context', async () => {
     const wrapper = mountPopover({
       experimentName: 'Dose response run',

package/src/__tests__/components/ExperimentSelectorModal.test.ts

@@ -1,16 +1,20 @@
 import { describe, it, expect, vi, beforeEach } from 'vitest'
 import { mount } from '@vue/test-utils'
+import { createPinia, setActivePinia } from 'pinia'
 import { computed, reactive, ref } from 'vue'
 
 import ExperimentSelectorModal from '../../components/ExperimentSelectorModal.vue'
 import { useExperimentSelector } from '../../composables/useExperimentSelector'
+import { useExperimentStore } from '../../stores/experiment'
+import type { ExperimentSummary } from '../../types'
 
 const fetchExperiments = vi.fn(async () => undefined)
 const fetchFilterOptions = vi.fn(async () => undefined)
+const experiments = ref<ExperimentSummary[]>([])
 
 vi.mock('../../composables/useExperimentSelector', () => ({
   useExperimentSelector: vi.fn(() => ({
-    experiments: ref([]),
+    experiments,
     filters: reactive({
       search: undefined,
       status: undefined,
@@ -29,70 +33,111 @@ vi.mock('../../composables/useExperimentSelector', () => ({
   })),
 }))
 
+function experiment(overrides: Partial<ExperimentSummary> = {}): ExperimentSummary {
+  return {
+    id: 7,
+    name: 'Hexokinase knockout run',
+    experiment_code: 'EXP-007',
+    status: 'ongoing',
+    experiment_type: 'screen',
+    created_at: '2026-07-01T08:00:00Z',
+    updated_at: '2026-07-01T08:00:00Z',
+    has_design_data: false,
+    ...overrides,
+  }
+}
+
+interface ModalProps {
+  modelValue: boolean
+  allowedExperimentTypes?: string[] | null
+  currentExperimentId?: number | null
+}
+
+function mountModal(props: ModalProps) {
+  return mount(ExperimentSelectorModal, {
+    props,
+    global: {
+      stubs: {
+        BaseModal: {
+          props: ['modelValue', 'title', 'size'],
+          template: '<div><slot /></div>',
+        },
+      },
+    },
+  })
+}
+
 describe('ExperimentSelectorModal', () => {
   beforeEach(() => {
+    setActivePinia(createPinia())
+    experiments.value = []
     fetchExperiments.mockClear()
     fetchFilterOptions.mockClear()
     vi.mocked(useExperimentSelector).mockClear()
   })
 
   it('fetches experiments when mounted already open', () => {
-    mount(ExperimentSelectorModal, {
-      props: {
-        modelValue: true,
-      },
-      global: {
-        stubs: {
-          BaseModal: {
-            props: ['modelValue', 'title', 'size'],
-            template: '<div><slot /></div>',
-          },
-        },
-      },
-    })
+    mountModal({ modelValue: true })
 
     expect(fetchFilterOptions).toHaveBeenCalledTimes(1)
     expect(fetchExperiments).toHaveBeenCalledTimes(1)
   })
 
   it('does not fetch while mounted closed', () => {
-    mount(ExperimentSelectorModal, {
-      props: {
-        modelValue: false,
-      },
-      global: {
-        stubs: {
-          BaseModal: {
-            props: ['modelValue', 'title', 'size'],
-            template: '<div><slot /></div>',
-          },
-        },
-      },
-    })
+    mountModal({ modelValue: false })
 
     expect(fetchFilterOptions).not.toHaveBeenCalled()
     expect(fetchExperiments).not.toHaveBeenCalled()
   })
 
   it('passes allowed experiment types to the selector composable', () => {
-    mount(ExperimentSelectorModal, {
-      props: {
-        modelValue: false,
-        allowedExperimentTypes: ['mass_spectrometry'],
-      },
-      global: {
-        stubs: {
-          BaseModal: {
-            props: ['modelValue', 'title', 'size'],
-            template: '<div><slot /></div>',
-          },
-        },
-      },
-    })
+    mountModal({ modelValue: false, allowedExperimentTypes: ['mass_spectrometry'] })
 
     expect(useExperimentSelector).toHaveBeenCalledWith({
       experimentType: undefined,
       allowedExperimentTypes: ['mass_spectrometry'],
     })
   })
+
+  it('commits the clicked platform record to the shared store', async () => {
+    const record = experiment()
+    experiments.value = [record]
+    const wrapper = mountModal({ modelValue: true })
+
+    await wrapper.find('.mint-experiment-selector__row').trigger('click')
+
+    const store = useExperimentStore()
+    expect(store.current).toEqual(record)
+    expect(store.currentId).toBe(7)
+  })
+
+  it('does not emit a select event — the store is the single owner', async () => {
+    experiments.value = [experiment()]
+    const wrapper = mountModal({ modelValue: true })
+
+    await wrapper.find('.mint-experiment-selector__row').trigger('click')
+
+    expect(wrapper.emitted('select')).toBeUndefined()
+  })
+
+  it('closes itself after committing a selection', async () => {
+    experiments.value = [experiment()]
+    const wrapper = mountModal({ modelValue: true })
+
+    await wrapper.find('.mint-experiment-selector__row').trigger('click')
+
+    expect(wrapper.emitted('update:modelValue')).toEqual([[false]])
+  })
+
+  it('clears the shared store from the clear-selection footer', async () => {
+    const store = useExperimentStore()
+    store.select(experiment())
+    const wrapper = mountModal({ modelValue: true, currentExperimentId: 7 })
+
+    await wrapper.find('.mint-experiment-selector__clear-btn').trigger('click')
+
+    expect(store.current).toBeNull()
+    expect(store.currentId).toBeNull()
+    expect(wrapper.emitted('update:modelValue')).toEqual([[false]])
+  })
 })

package/src/__tests__/components/PluginWorkspaceView.test.ts

@@ -1,6 +1,6 @@
 import { flushPromises, mount } from '@vue/test-utils'
 import type { VueWrapper } from '@vue/test-utils'
-import { createPinia } from 'pinia'
+import { createPinia, setActivePinia } from 'pinia'
 import { computed, h, nextTick, ref } from 'vue'
 import { describe, expect, it, vi } from 'vitest'
 import AppLayout from '../../components/AppLayout.vue'
@@ -11,7 +11,13 @@ import ExperimentSelectorModal from '../../components/ExperimentSelectorModal.vu
 import PluginWorkspaceView from '../../components/PluginWorkspaceView.vue'
 import { defineDoseDesignControlModel } from '../../composables/useControlSchema'
 import { usePlatformContext } from '../../composables/usePlatformContext'
-import type { PageSelectorItemInput, PillNavItem, SidebarToolSection } from '../../types'
+import { useExperimentStore } from '../../stores/experiment'
+import type {
+  ExperimentSummary,
+  PageSelectorItemInput,
+  PillNavItem,
+  SidebarToolSection,
+} from '../../types'
 
 vi.mock('../../composables/usePlatformContext', () => ({
   usePlatformContext: vi.fn(() => ({
@@ -60,8 +66,23 @@ interface WorkspaceComponentSlotProps {
   componentPropsById: Record<string, Record<string, unknown>>
 }
 
+const workspacePinia = createPinia()
+
+function makeExperiment(overrides: Partial<ExperimentSummary> = {}): ExperimentSummary {
+  return {
+    id: 12,
+    name: 'Dose response',
+    status: 'ongoing',
+    experiment_type: 'screen',
+    created_at: '2026-07-01T08:00:00Z',
+    updated_at: '2026-07-01T08:00:00Z',
+    has_design_data: false,
+    ...overrides,
+  }
+}
+
 const globalOptions = {
-  plugins: [createPinia()],
+  plugins: [workspacePinia],
   stubs: {
     'router-link': {
       props: ['to', 'custom'],
@@ -357,7 +378,7 @@ describe('PluginWorkspaceView', () => {
     expect(wrapper.get('[data-test="sidebar-footer"]').text()).toBe('Run')
   })
 
-  it('can provide AppTopBar experiment selection and save wiring from shell props', async () => {
+  it('can provide AppTopBar experiment selection and save wiring from the shared store', async () => {
     vi.mocked(usePlatformContext).mockReturnValueOnce({
       isIntegrated: computed(() => true),
       context: ref({ isIntegrated: true, theme: 'system' }),
@@ -369,17 +390,20 @@ describe('PluginWorkspaceView', () => {
       notify: vi.fn(),
       sendToPlatform: vi.fn(),
     })
+    setActivePinia(workspacePinia)
+    const store = useExperimentStore()
+    store.clear()
+    store.select(makeExperiment({
+      id: 12,
+      name: 'Dose response',
+      status: 'ongoing',
+      experiment_code: 'EXP-012',
+    }))
     const experimentSave = vi.fn().mockResolvedValue('Saved shell')
     const wrapper = mount(PluginWorkspaceView, {
       props: {
         title: 'Experiment Shell',
         experimentShell: true,
-        experiment: {
-          id: 12,
-          name: 'Dose response',
-          status: 'ongoing',
-          experiment_code: 'EXP-012',
-        },
         experimentSave,
         experimentSaveDisabled: true,
         experimentSaveDisabledMessage: 'Upload data first',
@@ -395,6 +419,7 @@ describe('PluginWorkspaceView', () => {
       experimentName: 'Dose response',
       experimentCode: 'EXP-012',
       experimentStatus: 'ongoing',
+      isResolving: false,
       showSave: true,
       showDetach: true,
       saveDisabled: true,
@@ -406,22 +431,25 @@ describe('PluginWorkspaceView', () => {
     await flushPromises()
     await nextTick()
 
-    wrapper.findComponent(ExperimentSelectorModal).vm.$emit('select', {
+    expect(wrapper.findComponent(ExperimentSelectorModal).props()).toMatchObject({
+      modelValue: true,
+      currentExperimentId: 12,
+    })
+
+    // The selector modal commits to the store instead of emitting; the shell
+    // re-emits what the platform returned.
+    const selected = makeExperiment({
       id: 13,
       name: 'Selected experiment',
       status: 'planned',
       experiment_code: 'EXP-013',
     })
+    store.select(selected)
     await nextTick()
 
-    expect(wrapper.emitted('experiment-select')).toEqual([[
-      {
-        id: 13,
-        name: 'Selected experiment',
-        status: 'planned',
-        experiment_code: 'EXP-013',
-      },
-    ]])
+    expect(wrapper.emitted('experiment-select')).toEqual([[selected]])
+    expect(wrapper.findComponent(ExperimentPopover).props('experimentName'))
+      .toBe('Selected experiment')
 
     wrapper.findComponent(ExperimentPopover).vm.$emit('save')
     await nextTick()
@@ -432,6 +460,62 @@ describe('PluginWorkspaceView', () => {
     await nextTick()
 
     expect(wrapper.emitted('experiment-detach')).toEqual([[]])
+    expect(store.current).toBeNull()
+    expect(store.currentId).toBeNull()
+  })
+
+  it('shows the unresolved chip states rather than inventing a name from an id', async () => {
+    vi.mocked(usePlatformContext).mockReturnValueOnce({
+      isIntegrated: computed(() => true),
+      context: ref({ isIntegrated: true, theme: 'system' }),
+      plugin: computed(() => undefined),
+      user: computed(() => undefined),
+      theme: computed(() => 'system' as const),
+      features: computed(() => undefined),
+      navigate: vi.fn(),
+      notify: vi.fn(),
+      sendToPlatform: vi.fn(),
+    })
+    setActivePinia(workspacePinia)
+    const store = useExperimentStore()
+    store.clear()
+    const wrapper = mount(PluginWorkspaceView, {
+      props: {
+        title: 'Experiment Shell',
+        experimentShell: true,
+        showSidebar: false,
+      },
+      global: globalOptions,
+    })
+
+    await flushPromises()
+    await nextTick()
+
+    // Bound by id, record still in flight.
+    store.currentId = 12
+    store.isResolving = true
+    await nextTick()
+
+    expect(wrapper.findComponent(ExperimentPopover).props()).toMatchObject({
+      experimentName: undefined,
+      experimentCode: undefined,
+      isResolving: true,
+      showDetach: true,
+    })
+
+    // Resolution failed — the binding survives so the user can detach.
+    store.isResolving = false
+    store.error = 'Experiment not found'
+    await nextTick()
+
+    expect(wrapper.findComponent(ExperimentPopover).props()).toMatchObject({
+      experimentName: undefined,
+      isResolving: false,
+      error: 'Experiment not found',
+      showDetach: true,
+    })
+
+    store.clear()
   })
 
   it('exposes model-derived component bindings to workspace slots', async () => {

package/src/__tests__/components/SettingsModal.test.ts

@@ -130,6 +130,34 @@ describe('SettingsModal', () => {
     })
   })
 
+  it('preserves controlled values that are not represented in the form schema', async () => {
+    const schema: SettingsModalSchema = {
+      groups: [
+        {
+          id: 'general',
+          label: 'General',
+          fields: [
+            { name: 'threshold', label: 'Threshold', type: 'number' },
+          ],
+        },
+      ],
+    }
+    const wrapper = mountSettingsModal({
+      schema,
+      values: {
+        threshold: 0.25,
+        database_url: '**********',
+      },
+    })
+
+    await wrapper.find('input').setValue('0.5')
+
+    expect(wrapper.emitted('update:values')?.at(-1)?.[0]).toEqual({
+      threshold: 0.5,
+      database_url: '**********',
+    })
+  })
+
   it('renders compact controls as schema-driven settings', async () => {
     const controls: ControlSchema = {
       threshold: {
@@ -344,7 +372,7 @@ describe('SettingsModal', () => {
     const pinia = createPinia()
     const auth = useAuthStore(pinia)
     auth.setUserInfo({
-      id: '1',
+      id: 1,
       username: 'admin',
       shortname: null,
       email: null,

package/src/__tests__/composables/experiment-utils.test.ts

@@ -1,6 +1,7 @@
 import { describe, expect, it } from 'vitest'
 
 import {
+  experimentIdFromRoute,
   formatExperimentStatus,
   getExperimentStatusVariant,
   resolveExperimentCode,
@@ -28,3 +29,35 @@ describe('experiment-utils', () => {
     expect(resolveExperimentCode({ id: null })).toBeUndefined()
   })
 })
+
+describe('experimentIdFromRoute', () => {
+  it('should read the id from the snake_case query key', () => {
+    expect(experimentIdFromRoute({ experiment_id: '42' })).toBe(42)
+  })
+
+  it('should read the id from the camelCase query key', () => {
+    expect(experimentIdFromRoute({ experimentId: '42' })).toBe(42)
+  })
+
+  // vue-router types repeated query params as (string | null)[], so a helper
+  // declared over string[] rejects the very type every caller passes it.
+  it('should read the id from a repeated query param containing nulls', () => {
+    expect(experimentIdFromRoute({ experiment_id: [null, '42'] })).toBe(42)
+  })
+
+  it('should return null when the query carries no experiment id', () => {
+    expect(experimentIdFromRoute({ other: 'value' })).toBeNull()
+  })
+
+  it('should return null for a non-numeric id', () => {
+    expect(experimentIdFromRoute({ experiment_id: 'abc' })).toBeNull()
+  })
+
+  it('should return null for a non-positive id', () => {
+    expect(experimentIdFromRoute({ experiment_id: '0' })).toBeNull()
+  })
+
+  it('should return null for a fractional id', () => {
+    expect(experimentIdFromRoute({ experiment_id: '4.2' })).toBeNull()
+  })
+})