@morscherlab/mint-sdk 1.1.8 → 1.1.9

package/src/__tests__/composables/autoGroup/groupByOrder.test.ts

@@ -0,0 +1,249 @@
+import { describe, it, expect } from 'vitest'
+import { useAutoGroup, parseCSV } from '../../../composables/useAutoGroup'
+
+/**
+ * Layer-order behaviour of the auto-group engine: `groupBy` is an ORDERED list
+ * of hierarchy layers (first entry = the sample selector's major group), user
+ * toggles append at the end, and `moveGroupBy` reorders layers explicitly.
+ */
+
+function structuredEngine() {
+  const auto = useAutoGroup()
+  auto.inputMode.value = 'csv'
+  auto.csvData.value = parseCSV([
+    'Sample,Tissue,Timepoint,Dose',
+    'S1,Kidney,5min,High',
+    'S2,Kidney,10min,Low',
+    'S3,Liver,5min,High',
+  ].join('\n'))
+  auto.parseInput()
+  return auto
+}
+
+describe('useAutoGroup — groupBy layer order', () => {
+  it('should append a re-enabled column at the end of the layer order when toggled back on', () => {
+    const auto = structuredEngine()
+    const key = auto.activeClassKey.value
+    auto.toggleGroupBy(key, 0)
+    auto.toggleGroupBy(key, 0)
+    expect(auto.activeSchema.value?.groupBy).toEqual([1, 2, 0])
+  })
+
+  it('should compose group names following the toggle-defined layer order', () => {
+    const auto = structuredEngine()
+    const key = auto.activeClassKey.value
+    auto.toggleGroupBy(key, 0)
+    auto.toggleGroupBy(key, 0)
+    expect(auto.groups.value.map(g => g.name).sort()).toEqual([
+      '10min / Low / Kidney',
+      '5min / High / Kidney',
+      '5min / High / Liver',
+    ])
+  })
+
+  it('should move a layer toward the front when moveGroupBy direction is up', () => {
+    const auto = structuredEngine()
+    const key = auto.activeClassKey.value
+    auto.moveGroupBy(key, 1, 'up')
+    expect(auto.activeSchema.value?.groupBy).toEqual([1, 0, 2])
+  })
+
+  it('should compose group names following the moved layer order', () => {
+    const auto = structuredEngine()
+    const key = auto.activeClassKey.value
+    auto.moveGroupBy(key, 1, 'up')
+    expect(auto.groups.value.map(g => g.name).sort()).toEqual([
+      '10min / Kidney / Low',
+      '5min / Kidney / High',
+      '5min / Liver / High',
+    ])
+  })
+
+  it('should ignore moveGroupBy up when the layer is already first', () => {
+    const auto = structuredEngine()
+    const key = auto.activeClassKey.value
+    auto.moveGroupBy(key, 0, 'up')
+    expect(auto.activeSchema.value?.groupBy).toEqual([0, 1, 2])
+  })
+
+  it('should ignore moveGroupBy down when the layer is already last', () => {
+    const auto = structuredEngine()
+    const key = auto.activeClassKey.value
+    auto.moveGroupBy(key, 2, 'down')
+    expect(auto.activeSchema.value?.groupBy).toEqual([0, 1, 2])
+  })
+
+  it('should ignore moveGroupBy for a column that is not part of groupBy', () => {
+    const auto = structuredEngine()
+    const key = auto.activeClassKey.value
+    auto.toggleGroupBy(key, 1) // disable Timepoint
+    auto.moveGroupBy(key, 1, 'up')
+    expect(auto.activeSchema.value?.groupBy).toEqual([0, 2])
+  })
+})
+
+describe('useAutoGroup — field edits span every class exposing the field', () => {
+  /** Two tissue classes sharing a Timepoint × Dose schema. */
+  function twoClassEngine() {
+    const auto = useAutoGroup()
+    const names: string[] = []
+    for (const tissue of ['Liver', 'Kidney'])
+      for (const time of ['5min', '10min'])
+        for (const dose of ['High', 'Low'])
+          for (const rep of [1, 2, 3]) names.push(`${tissue}_${time}_${dose}_rep${rep}`)
+    auto.rawText.value = names.join('\n')
+    auto.parseInput()
+    return auto
+  }
+
+  function threeFactorClassEngine() {
+    const auto = useAutoGroup()
+    const names: string[] = []
+    for (const tissue of ['Liver', 'Kidney'])
+      for (const first of ['A', 'B'])
+        for (const second of ['C', 'D'])
+          for (const third of ['E', 'F'])
+            names.push(`${tissue}_${first}_${second}_${third}_rep1`)
+    auto.rawText.value = names.join('\n')
+    auto.parseInput()
+    return auto
+  }
+
+  it('should reorder the layer in every class when moving a field by name', () => {
+    const auto = twoClassEngine()
+    auto.moveGroupByField('Token 3', 'up')
+    expect(Object.values(auto.schemas.value).map(s => s.groupBy)).toEqual([[2, 1], [2, 1]])
+  })
+
+  it('should converge previously divergent class orders to the active schema order', () => {
+    const auto = threeFactorClassEngine()
+    const inactiveKey = Object.keys(auto.schemas.value).find(k => k !== auto.activeClassKey.value)!
+    auto.moveGroupBy(inactiveKey, 3, 'up')
+    auto.moveGroupBy(inactiveKey, 3, 'up')
+
+    auto.moveGroupByField('Token 4', 'up')
+
+    expect(Object.values(auto.schemas.value).map(schema => schema.groupBy)).toEqual([
+      [1, 3, 2],
+      [1, 3, 2],
+    ])
+  })
+
+  it('should keep class-only fields after shared fields in their existing order', () => {
+    const auto = threeFactorClassEngine()
+    const inactiveKey = Object.keys(auto.schemas.value).find(k => k !== auto.activeClassKey.value)!
+    const inactive = auto.schemas.value[inactiveKey]
+    auto.schemas.value = {
+      ...auto.schemas.value,
+      [inactiveKey]: {
+        ...inactive,
+        columns: [
+          ...inactive.columns,
+          {
+            index: 99,
+            name: 'Class-only',
+            sourceIndices: [],
+            uniqueValues: [],
+            cardinality: 0,
+            role: 'factor',
+          },
+        ],
+        groupBy: [3, 99, 1, 2],
+      },
+    }
+
+    auto.moveGroupByField('Token 4', 'up')
+
+    expect(auto.schemas.value[inactiveKey].groupBy).toEqual([1, 3, 2, 99])
+  })
+
+  it('should compose consistently ordered names across classes after a field move', () => {
+    const auto = twoClassEngine()
+    auto.moveGroupByField('Token 3', 'up')
+    expect(auto.groups.value.map(g => g.name).sort()).toEqual([
+      'Kidney / High / 10min',
+      'Kidney / High / 5min',
+      'Kidney / Low / 10min',
+      'Kidney / Low / 5min',
+      'Liver / High / 10min',
+      'Liver / High / 5min',
+      'Liver / Low / 10min',
+      'Liver / Low / 5min',
+    ])
+  })
+
+  it('should disable a field in every class when toggling it off by name', () => {
+    const auto = twoClassEngine()
+    auto.toggleGroupByField('Timepoint')
+    expect(Object.values(auto.schemas.value).map(s => s.groupBy)).toEqual([[2], [2]])
+  })
+
+  it('should drive every class to the active class state rather than flipping each independently', () => {
+    const auto = twoClassEngine()
+    // Diverge the classes: disable Timepoint in the non-active class only.
+    const inactiveKey = Object.keys(auto.schemas.value).find(k => k !== auto.activeClassKey.value)!
+    auto.toggleGroupBy(inactiveKey, 1)
+    // The card reads ON (from the active class), so toggling means OFF everywhere.
+    auto.toggleGroupByField('Timepoint')
+    expect(Object.values(auto.schemas.value).every(s => !s.groupBy.includes(1))).toBe(true)
+  })
+
+  it('should append a re-enabled field as the last layer in every class', () => {
+    const auto = twoClassEngine()
+    auto.toggleGroupByField('Timepoint')
+    auto.toggleGroupByField('Timepoint')
+    expect(Object.values(auto.schemas.value).map(s => s.groupBy)).toEqual([[2, 1], [2, 1]])
+  })
+
+  it('should ignore a field name that no class exposes', () => {
+    const auto = twoClassEngine()
+    auto.moveGroupByField('Nonexistent', 'up')
+    expect(Object.values(auto.schemas.value).map(s => s.groupBy)).toEqual([[1, 2], [1, 2]])
+  })
+})
+
+describe('useAutoGroup — class prefix only when disambiguation is needed', () => {
+  it('should not prefix group names when a single experimental class emits groups', () => {
+    const auto = useAutoGroup()
+    auto.rawText.value = [
+      'Liver_5min_High_rep1',
+      'Liver_5min_High_rep2',
+      'Liver_10min_Low_rep1',
+      'Liver_10min_Low_rep2',
+    ].join('\n')
+    auto.parseInput()
+    expect(auto.groups.value.map(g => g.name).sort()).toEqual([
+      '10min / Low',
+      '5min / High',
+    ])
+  })
+
+  it('should prefix each class with its short distinguishing label when several experimental classes emit groups', () => {
+    const auto = useAutoGroup()
+    auto.rawText.value = [
+      'Liver_5min_High_rep1',
+      'Liver_10min_Low_rep1',
+      'Kidney_5min_High_rep1',
+      'Kidney_10min_Low_rep1',
+    ].join('\n')
+    auto.parseInput()
+    expect(auto.groups.value.map(g => g.name).sort()).toEqual([
+      'Kidney / 10min / Low',
+      'Kidney / 5min / High',
+      'Liver / 10min / Low',
+      'Liver / 5min / High',
+    ])
+  })
+
+  it('should keep overlay QC groups unprefixed and unchanged', () => {
+    const auto = useAutoGroup()
+    auto.rawText.value = [
+      'Liver_5min_rep1',
+      'Liver_10min_rep1',
+      'IQC_001',
+      'IQC_002',
+    ].join('\n')
+    auto.parseInput()
+    expect(auto.qcGroups.value.map(g => g.name)).toEqual(['IQC'])
+  })
+})

package/src/__tests__/composables/autoGroup/integration.test.ts

@@ -68,12 +68,8 @@ describe('mixed LC-MS batch integration', () => {
     expect(result.experimentalGroups!.length).toBe(3)
     expect(result.experimentalGroups!.every(g => g.samples.length === 27)).toBe(true)
     const names = result.experimentalGroups!.map(g => g.name).sort()
-    // Class-prefixed: "Biological / Tissues / <organ>" disambiguates from
-    // other classes that might also produce a Kidney/Liver/Tumor factor.
-    expect(names).toEqual([
-      'Biological / Tissues / Kidney',
-      'Biological / Tissues / Liver',
-      'Biological / Tissues / Tumor',
-    ])
+    // Only the Tissues class is passed here, so no disambiguating class prefix
+    // is applied: the organ factor is the first (major) hierarchy layer.
+    expect(names).toEqual(['Kidney', 'Liver', 'Tumor'])
   })
 })

package/src/__tests__/composables/useSampleGroups.tree.test.ts

@@ -0,0 +1,145 @@
+import { describe, expect, it } from 'vitest'
+import { useSampleGroups } from '../../composables/useSampleGroups'
+import type { SampleGroup } from '../../types'
+
+/**
+ * `groupTree` is the full N-layer display model behind the sample selector:
+ * interior nodes are path prefixes, leaves carry the concrete `SampleGroup`
+ * (whose `name` stays the full path, since every mutation keys off it).
+ */
+
+function labelsAtDepth(nodes: ReturnType<typeof useSampleGroups>['groupTree']['value'], depth: number): string[] {
+  let level = nodes
+  for (let i = 0; i < depth; i++) level = level.flatMap(n => n.children)
+  return level.map(n => n.label)
+}
+
+describe('useSampleGroups groupTree', () => {
+  const threeLayer: SampleGroup[] = [
+    { name: 'Liver / High / 5min', color: '#3B82F6', samples: ['L1', 'L2'] },
+    { name: 'Liver / High / 10min', color: '#3B82F6', samples: ['L3'] },
+    { name: 'Liver / Low / 5min', color: '#3B82F6', samples: ['L4'] },
+    { name: 'Kidney / High / 5min', color: '#F43F5E', samples: ['K1'] },
+  ]
+
+  it('should build one level per name segment', () => {
+    const { groupTree } = useSampleGroups({ groups: threeLayer })
+    expect(labelsAtDepth(groupTree.value, 0)).toEqual(['Liver', 'Kidney'])
+    expect(labelsAtDepth(groupTree.value, 1)).toEqual(['High', 'Low', 'High'])
+    expect(labelsAtDepth(groupTree.value, 2)).toEqual(['5min', '10min', '5min', '5min'])
+  })
+
+  it('should label each node with its own segment rather than the full path', () => {
+    const { groupTree } = useSampleGroups({ groups: threeLayer })
+    expect(groupTree.value[0].children[0].label).toBe('High')
+  })
+
+  it('should keep the full path on the leaf group so mutations still resolve it', () => {
+    const { groupTree } = useSampleGroups({ groups: threeLayer })
+    expect(groupTree.value[0].children[0].children[0].group?.name).toBe('Liver / High / 5min')
+  })
+
+  it('should aggregate every descendant sample onto an interior node', () => {
+    const { groupTree } = useSampleGroups({ groups: threeLayer })
+    expect(groupTree.value[0].allSamples).toEqual(['L1', 'L2', 'L3', 'L4'])
+    expect(groupTree.value[0].children[0].allSamples).toEqual(['L1', 'L2', 'L3'])
+  })
+
+  it('should mark only childless nodes as leaves', () => {
+    const { groupTree } = useSampleGroups({ groups: threeLayer })
+    expect(groupTree.value[0].children).not.toHaveLength(0)
+    expect(groupTree.value[0].group).toBeUndefined()
+    expect(groupTree.value[0].children[0].children[0].children).toHaveLength(0)
+  })
+
+  it('should give every node a unique key so expansion state cannot collide', () => {
+    const { groupTree } = useSampleGroups({ groups: threeLayer })
+    const keys: string[] = []
+    const walk = (nodes: typeof groupTree.value) => {
+      for (const n of nodes) {
+        keys.push(n.key)
+        walk(n.children)
+      }
+    }
+    walk(groupTree.value)
+    expect(new Set(keys).size).toBe(keys.length)
+  })
+
+  it('should keep two-segment names at two levels', () => {
+    const { groupTree } = useSampleGroups({
+      groups: [{ name: 'Control/A', color: '#3B82F6', samples: ['S1'] }],
+    })
+    expect(labelsAtDepth(groupTree.value, 0)).toEqual(['Control'])
+    expect(labelsAtDepth(groupTree.value, 1)).toEqual(['A'])
+    expect(labelsAtDepth(groupTree.value, 2)).toEqual([])
+  })
+
+  it('should keep an unsegmented name as a single root leaf', () => {
+    const { groupTree } = useSampleGroups({
+      groups: [{ name: 'Control', color: '#3B82F6', samples: ['S1'] }],
+    })
+    expect(groupTree.value).toHaveLength(1)
+    expect(groupTree.value[0].children).toHaveLength(0)
+    expect(groupTree.value[0].group?.name).toBe('Control')
+  })
+
+  it('should nest mixed-depth siblings under the same parent', () => {
+    const { groupTree } = useSampleGroups({
+      groups: [
+        { name: 'Liver / High / 5min', color: '#3B82F6', samples: ['S1'] },
+        { name: 'Liver / Low', color: '#3B82F6', samples: ['S2'] },
+      ],
+    })
+    expect(labelsAtDepth(groupTree.value, 1)).toEqual(['High', 'Low'])
+    // "Low" is a leaf at depth 1; "High" is interior with a leaf beneath it.
+    expect(groupTree.value[0].children[1].group?.name).toBe('Liver / Low')
+    expect(groupTree.value[0].children[0].children[0].group?.name).toBe('Liver / High / 5min')
+  })
+
+  it('should expose a group whose path duplicates an interior node as its own leaf', () => {
+    // "Liver" is both a standalone group and the prefix of another: the
+    // standalone group must stay reachable as a leaf, or its samples vanish.
+    const { groupTree } = useSampleGroups({
+      groups: [
+        { name: 'Liver', color: '#3B82F6', samples: ['S1'] },
+        { name: 'Liver / High', color: '#3B82F6', samples: ['S2'] },
+      ],
+    })
+    const allLeafGroups: string[] = []
+    const walk = (nodes: typeof groupTree.value) => {
+      for (const n of nodes) {
+        if (n.group) allLeafGroups.push(n.group.name)
+        walk(n.children)
+      }
+    }
+    walk(groupTree.value)
+    expect(allLeafGroups.sort()).toEqual(['Liver', 'Liver / High'])
+  })
+
+  it('should tolerate whitespace around separators when segmenting', () => {
+    const { groupTree } = useSampleGroups({
+      groups: [{ name: 'Liver / High', color: '#3B82F6', samples: ['S1'] }],
+    })
+    expect(groupTree.value[0].label).toBe('Liver')
+    expect(groupTree.value[0].children[0].label).toBe('High')
+  })
+})
+
+describe('useSampleGroups hierarchy depth', () => {
+  it('should report the deepest layer count', () => {
+    const { maxDepth } = useSampleGroups({
+      groups: [
+        { name: 'Liver / High / 5min', color: '#3B82F6', samples: ['S1'] },
+        { name: 'Kidney / Low', color: '#F43F5E', samples: ['S2'] },
+      ],
+    })
+    expect(maxDepth.value).toBe(3)
+  })
+
+  it('should report depth 1 for flat groups', () => {
+    const { maxDepth } = useSampleGroups({
+      groups: [{ name: 'Control', color: '#3B82F6', samples: ['S1'] }],
+    })
+    expect(maxDepth.value).toBe(1)
+  })
+})

package/src/components/AppTopBar.story.vue

@@ -30,14 +30,13 @@ const samplePageSelector: PageSelectorItem[] = [
 const sampleAccountMenu: AccountMenuItem[] = [
   { id: 'profile', label: 'Profile' },
   { id: 'settings', label: 'Settings' },
-  { id: 'admin', label: 'Admin', to: '/admin' },
 ]
 
 </script>
 
 <template>
   <Story title="Layout/AppTopBar">
-    <!-- ─────────────── NEW DESIGN (v5) — Estrella-approved layout ─────────────── -->
+    <!-- ─────────────── UNIFIED PLATFORM LAYOUTS ─────────────── -->
 
     <Variant title="Refresh · Experiments-view layout">
       <!-- Exact layout used by the platform's Experiments and Projects pages:
@@ -51,6 +50,7 @@ const sampleAccountMenu: AccountMenuItem[] = [
           :pill-nav="samplePillNav.slice(1, 3)"
           current-pill-id="experiments"
           show-theme-toggle
+          show-admin
           :show-standalone-label="false"
           :account-menu="sampleAccountMenu"
           user-name="Estrella"
@@ -84,6 +84,7 @@ const sampleAccountMenu: AccountMenuItem[] = [
           :pill-nav="samplePillNav"
           current-pill-id="workspace"
           show-theme-toggle
+          show-admin
           :account-menu="sampleAccountMenu"
           user-name="Estrella"
           user-initial="ES"
@@ -104,6 +105,7 @@ const sampleAccountMenu: AccountMenuItem[] = [
             :pill-nav="samplePillNav"
             current-pill-id="experiments"
             show-theme-toggle
+            show-admin
             :account-menu="sampleAccountMenu"
             user-name="Estrella"
             user-initial="ES"
@@ -191,9 +193,9 @@ const sampleAccountMenu: AccountMenuItem[] = [
       </div>
     </Variant>
 
-    <!-- ─────────────── CLASSIC VARIANTS ─────────────── -->
+    <!-- ─────────────── BASE COMPOSITION EXAMPLES ─────────────── -->
 
-    <Variant title="Classic · Playground">
+    <Variant title="Base · Playground">
       <template #default="{ state }">
         <div style="padding: 2rem;">
           <AppTopBar
@@ -221,7 +223,7 @@ const sampleAccountMenu: AccountMenuItem[] = [
       </template>
     </Variant>
 
-    <Variant title="Classic · Title + Subtitle">
+    <Variant title="Base · Title + Subtitle">
       <div style="padding: 2rem;">
         <AppTopBar
           title="Dose-Response Analysis"
@@ -256,13 +258,13 @@ const sampleAccountMenu: AccountMenuItem[] = [
       </div>
     </Variant>
 
-    <Variant title="Classic · Minimal (logo only)">
+    <Variant title="Base · Minimal (logo only)">
       <div style="padding: 2rem;">
         <AppTopBar :show-logo="true" home-path="/" />
       </div>
     </Variant>
 
-    <Variant title="Classic · Experiment selector integration">
+    <Variant title="Base · Experiment selector integration">
       <div style="padding: 2rem;">
         <ExperimentProvider>
           <AppTopBar