diff --git a/package.json b/package.json
index 89bd04f..7a24722 100644
--- a/package.json
+++ b/package.json
@@ -56,7 +56,7 @@
     "classnames": "^2.2.6",
     "copy-webpack-plugin": "^10.2.4",
     "craco-less": "^2.0.0",
-    "dcmjs": "^0.29.8",
+    "dcmjs": "^0.35.0",
     "detect-browser": "^5.2.1",
     "dicom-microscopy-viewer": "^0.47.0",
     "dicomweb-client": "^0.10.3",
diff --git a/src/DicomWebManager.ts b/src/DicomWebManager.ts
index c7bdb01..98a60e7 100644
--- a/src/DicomWebManager.ts
+++ b/src/DicomWebManager.ts
@@ -1,4 +1,6 @@
 import * as dwc from 'dicomweb-client'
+import * as dcmjs from 'dcmjs'
+import * as dmv from 'dicom-microscopy-viewer'
 
 import { ServerSettings, DicomWebManagerErrorHandler } from './AppConfig'
 import { joinUrl } from './utils/url'
@@ -7,6 +9,9 @@ import { CustomError, errorTypes } from './utils/CustomError'
 import NotificationMiddleware, {
   NotificationMiddlewareContext
 } from './services/NotificationMiddleware'
+import DicomMetadataStore, { Instance } from './services/DICOMMetadataStore'
+
+const { naturalizeDataset } = dcmjs.data.DicomMetaDictionary
 
 interface Store {
   id: string
@@ -163,13 +168,21 @@ export default class DicomWebManager implements dwc.api.DICOMwebClient {
   retrieveStudyMetadata = async (
     options: dwc.api.RetrieveStudyMetadataOptions
   ): Promise<dwc.api.Metadata[]> => {
-    return await this.stores[0].client.retrieveStudyMetadata(options)
+    const studySummaryMetadata = await this.stores[0].client.retrieveStudyMetadata(options)
+    const naturalized = naturalizeDataset(studySummaryMetadata)
+    DicomMetadataStore.addStudy(naturalized)
+    return studySummaryMetadata
   }
 
   retrieveSeriesMetadata = async (
     options: dwc.api.RetrieveSeriesMetadataOptions
   ): Promise<dwc.api.Metadata[]> => {
-    return await this.stores[0].client.retrieveSeriesMetadata(options)
+    const seriesSummaryMetadata = await this.stores[0].client.retrieveSeriesMetadata(options)
+    console.debug('seriesSummaryMetadata:', seriesSummaryMetadata)
+    const naturalized = seriesSummaryMetadata.map(naturalizeDataset)
+    console.debug('naturalized:', naturalized)
+    DicomMetadataStore.addSeriesMetadata(naturalized, true)
+    return seriesSummaryMetadata
   }
 
   retrieveInstanceMetadata = async (
@@ -181,7 +194,11 @@ export default class DicomWebManager implements dwc.api.DICOMwebClient {
   retrieveInstance = async (
     options: dwc.api.RetrieveInstanceOptions
   ): Promise<dwc.api.Dataset> => {
-    return await this.stores[0].client.retrieveInstance(options)
+    const instance = await this.stores[0].client.retrieveInstance(options)
+    const data = dcmjs.data.DicomMessage.readFile(instance)
+    const { dataset } = dmv.metadata.formatMetadata(data.dict)
+    DicomMetadataStore.addInstances([dataset as Instance])
+    return instance
   }
 
   retrieveInstanceFrames = async (
diff --git a/src/components/DicomTagBrowser/DicomTagBrowser.tsx b/src/components/DicomTagBrowser/DicomTagBrowser.tsx
index a9f7389..ede592c 100644
--- a/src/components/DicomTagBrowser/DicomTagBrowser.tsx
+++ b/src/components/DicomTagBrowser/DicomTagBrowser.tsx
@@ -7,15 +7,17 @@ import './DicomTagBrowser.css'
 import { useSlides } from '../../hooks/useSlides'
 import { getSortedTags } from './dicomTagUtils'
 import { formatDicomDate } from '../../utils/formatDicomDate'
+import DicomMetadataStore, { Series, Study } from '../../services/DICOMMetadataStore'
+import { useDebounce } from '../../hooks/useDebounce'
 
 const { Option } = Select
 
 interface DisplaySet {
   displaySetInstanceUID: number
-  SeriesDate: string
-  SeriesTime: string
-  SeriesNumber: number
-  SeriesDescription: string
+  SeriesDate?: string
+  SeriesTime?: string
+  SeriesNumber: string
+  SeriesDescription?: string
   Modality: string
   images: any[]
 }
@@ -36,62 +38,116 @@ interface DicomTagBrowserProps {
 
 const DicomTagBrowser = ({ clients, studyInstanceUID }: DicomTagBrowserProps): JSX.Element => {
   const { slides, isLoading } = useSlides({ clients, studyInstanceUID })
+  const [study, setStudy] = useState<Study | undefined>(undefined)
 
   const [displaySets, setDisplaySets] = useState<DisplaySet[]>([])
   const [selectedDisplaySetInstanceUID, setSelectedDisplaySetInstanceUID] = useState(0)
   const [instanceNumber, setInstanceNumber] = useState(1)
   const [filterValue, setFilterValue] = useState('')
   const [expandedKeys, setExpandedKeys] = useState<string[]>([])
-  const [searchExpandedKeys, setSearchExpandedKeys] = useState<string[]>([])
+  const [searchInput, setSearchInput] = useState('')
+
+  const debouncedSearchValue = useDebounce(searchInput, 300)
 
   useEffect(() => {
-    if (slides.length === 0) return
-
-    const updatedDisplaySets = slides
-      .map((slide, index) => {
-        const { volumeImages } = slide
-        if (volumeImages?.[0] === undefined) return null
-
-        const {
-          SeriesDate,
-          SeriesTime,
-          SeriesNumber,
-          SeriesDescription,
-          Modality
-        } = volumeImages[0]
-
-        return {
-          displaySetInstanceUID: index,
-          SeriesDate,
-          SeriesTime,
-          SeriesNumber,
-          SeriesDescription,
-          Modality,
-          images: volumeImages
-        }
-      })
-      .filter((set): set is DisplaySet => set !== null)
+    setFilterValue(debouncedSearchValue)
+  }, [debouncedSearchValue])
+
+  useEffect(() => {
+    const handler = (event: any): void => {
+      const study: Study | undefined = Object.assign({}, DicomMetadataStore.getStudy(studyInstanceUID))
+      setStudy(study)
+    }
+    const seriesAddedSubscription = DicomMetadataStore.subscribe(DicomMetadataStore.EVENTS.SERIES_ADDED, handler)
+    const instancesAddedSubscription = DicomMetadataStore.subscribe(DicomMetadataStore.EVENTS.INSTANCES_ADDED, handler)
+
+    const study = Object.assign({}, DicomMetadataStore.getStudy(studyInstanceUID))
+    setStudy(study)
+
+    return () => {
+      seriesAddedSubscription.unsubscribe()
+      instancesAddedSubscription.unsubscribe()
+    }
+  }, [studyInstanceUID])
+
+  useEffect(() => {
+    let displaySets: DisplaySet[] = []
+    let derivedDisplaySets: DisplaySet[] = []
+    const processedSeries: string[] = []
+    let index = 0
+
+    if (slides.length > 0) {
+      displaySets = slides
+        .map((slide): DisplaySet | null => {
+          const { volumeImages } = slide
+          if (volumeImages?.[0] === undefined) return null
+
+          const {
+            SeriesDate,
+            SeriesTime,
+            SeriesNumber,
+            SeriesInstanceUID,
+            SeriesDescription,
+            Modality
+          } = volumeImages[0]
+
+          processedSeries.push(SeriesInstanceUID)
+
+          const ds: DisplaySet = {
+            displaySetInstanceUID: index,
+            SeriesDate,
+            SeriesTime,
+            SeriesInstanceUID,
+            // @ts-expect-error
+            SeriesNumber,
+            SeriesDescription,
+            Modality,
+            images: volumeImages
+          }
+          index++
+          return ds
+        })
+        .filter((set): set is DisplaySet => set !== null)
+    }
+
+    if (study !== undefined && study.series?.length > 0) {
+      derivedDisplaySets = study.series.filter(s => !processedSeries.includes(s.SeriesInstanceUID))
+        .map((series: Series): DisplaySet => {
+          const ds: DisplaySet = {
+            displaySetInstanceUID: index,
+            SeriesDate: series.SeriesDate,
+            SeriesTime: series.SeriesTime,
+            // @ts-expect-error
+            SeriesNumber: series.SeriesNumber,
+            SeriesDescription: series.SeriesDescription,
+            SeriesInstanceUID: series.SeriesInstanceUID,
+            Modality: series.Modality,
+            images: series?.instances?.length > 0 ? series.instances : [series]
+          }
+          index++
+          return ds
+        })
+    }
 
-    setDisplaySets(updatedDisplaySets)
-  }, [slides])
+    setDisplaySets([...displaySets, ...derivedDisplaySets])
+  }, [slides, study])
 
   const displaySetList = useMemo(() => {
-    displaySets.sort((a, b) => a.SeriesNumber - b.SeriesNumber)
-    return displaySets.map((displaySet) => {
+    displaySets.sort((a, b) => Number(a.SeriesNumber) - Number(b.SeriesNumber))
+    return displaySets.map((displaySet, index) => {
       const {
-        displaySetInstanceUID,
-        SeriesDate,
-        SeriesTime,
-        SeriesNumber,
-        SeriesDescription,
-        Modality
+        SeriesDate = '',
+        SeriesTime = '',
+        SeriesNumber = '',
+        SeriesDescription = '',
+        Modality = ''
       } = displaySet
 
       const dateStr = `${SeriesDate}:${SeriesTime}`.split('.')[0]
       const displayDate = formatDicomDate(dateStr)
 
       return {
-        value: displaySetInstanceUID,
+        value: index,
         label: `${SeriesNumber} (${Modality}): ${SeriesDescription}`,
         description: displayDate
       }
@@ -101,6 +157,8 @@ const DicomTagBrowser = ({ clients, studyInstanceUID }: DicomTagBrowserProps): J
   const showInstanceList =
     displaySets[selectedDisplaySetInstanceUID]?.images.length > 1
 
+  console.debug('displaySets:', displaySets)
+
   const instanceSliderMarks = useMemo(() => {
     if (displaySets[selectedDisplaySetInstanceUID] === undefined) return {}
     const totalInstances = displaySets[selectedDisplaySetInstanceUID].images.length
@@ -145,8 +203,9 @@ const DicomTagBrowser = ({ clients, studyInstanceUID }: DicomTagBrowserProps): J
   const tableData = useMemo(() => {
     const transformTagsToTableData = (tags: any[], parentKey = ''): TableDataItem[] => {
       return tags.map((tag, index) => {
-        // Create a unique key that includes the parent path
-        const currentKey = parentKey !== undefined ? `${parentKey}-${index}` : `${index}`
+        // Create a unique key using tag value if available, otherwise use index
+        const keyBase: string = tag.tag !== '' ? tag.tag.replace(/[(),]/g, '') : index.toString()
+        const currentKey: string = parentKey !== '' ? `${parentKey}-${keyBase}` : keyBase
 
         const item: TableDataItem = {
           key: currentKey,
@@ -157,7 +216,6 @@ const DicomTagBrowser = ({ clients, studyInstanceUID }: DicomTagBrowserProps): J
         }
 
         if (tag.children !== undefined && tag.children.length > 0) {
-          // Pass the current key as parent for nested items
           item.children = transformTagsToTableData(tag.children, currentKey)
         }
 
@@ -171,56 +229,62 @@ const DicomTagBrowser = ({ clients, studyInstanceUID }: DicomTagBrowserProps): J
     return transformTagsToTableData(tags)
   }, [instanceNumber, selectedDisplaySetInstanceUID, displaySets])
 
+  // Reset expanded keys when search value changes
+  useEffect(() => {
+    setExpandedKeys([])
+  }, [filterValue])
+
   const filteredData = useMemo(() => {
     if (filterValue === undefined || filterValue === '') return tableData
 
     const searchLower = filterValue.toLowerCase()
-    const newSearchExpandedKeys: string[] = []
-
-    const filterNodes = (nodes: TableDataItem[], parentKey = ''): TableDataItem[] => {
-      return nodes.map(node => {
-        const newNode = { ...node }
-
-        const matchesSearch =
-          (node.tag?.toLowerCase() ?? '').includes(searchLower) ||
-          (node.vr?.toLowerCase() ?? '').includes(searchLower) ||
-          (node.keyword?.toLowerCase() ?? '').includes(searchLower) ||
-          (node.value?.toString().toLowerCase() ?? '').includes(searchLower)
-
-        if (node.children != null) {
-          const filteredChildren = filterNodes(node.children, node.key)
-          newNode.children = filteredChildren
-
-          if (matchesSearch || filteredChildren.length > 0) {
-            // Add all parent keys to maintain the expansion chain
-            if (parentKey !== undefined) {
-              newSearchExpandedKeys.push(parentKey)
-            }
-            newSearchExpandedKeys.push(node.key)
-            return newNode
-          }
-        }
 
-        return matchesSearch ? newNode : null
-      }).filter((node): node is TableDataItem => node !== null)
+    const nodeMatches = (node: TableDataItem): boolean => {
+      return (
+        (node.tag?.toLowerCase() ?? '').includes(searchLower) ||
+        (node.vr?.toLowerCase() ?? '').includes(searchLower) ||
+        (node.keyword?.toLowerCase() ?? '').includes(searchLower) ||
+        (node.value?.toString().toLowerCase() ?? '').includes(searchLower)
+      )
     }
 
-    const filtered = filterNodes(tableData)
-    setSearchExpandedKeys(newSearchExpandedKeys)
-    return filtered
-  }, [tableData, filterValue])
+    const findMatchingNodes = (nodes: TableDataItem[]): TableDataItem[] => {
+      const results: TableDataItem[] = []
+
+      const searchNode = (node: TableDataItem): void => {
+        if (nodeMatches(node)) {
+          // Create a new matching node with its original structure
+          const matchingNode: TableDataItem = {
+            key: node.key,
+            tag: node.tag,
+            vr: node.vr,
+            keyword: node.keyword,
+            value: node.value
+          }
 
-  // Reset search expanded keys when search is cleared
-  useEffect(() => {
-    if (filterValue === undefined || filterValue === '') {
-      setSearchExpandedKeys([])
+          // If the node has children, preserve them for expansion
+          matchingNode.children = node?.children?.map((child): TableDataItem => ({
+            key: child.key,
+            tag: child.tag,
+            vr: child.vr,
+            keyword: child.keyword,
+            value: child.value,
+            children: child.children
+          }))
+
+          results.push(matchingNode)
+        }
+
+        // Continue searching through children
+        node?.children?.forEach(searchNode)
+      }
+
+      nodes.forEach(searchNode)
+      return results
     }
-  }, [filterValue])
 
-  // Combine manual expansion with search expansion
-  const allExpandedKeys = useMemo(() => {
-    return [...new Set([...expandedKeys, ...searchExpandedKeys])]
-  }, [expandedKeys, searchExpandedKeys])
+    return findMatchingNodes(tableData)
+  }, [tableData, filterValue])
 
   if (isLoading) {
     return <div>Loading...</div>
@@ -240,7 +304,6 @@ const DicomTagBrowser = ({ clients, studyInstanceUID }: DicomTagBrowserProps): J
             <Select
               style={{ width: '100%' }}
               value={selectedDisplaySetInstanceUID}
-              defaultValue={0}
               onChange={(value) => {
                 setSelectedDisplaySetInstanceUID(value)
                 setInstanceNumber(1)
@@ -286,8 +349,8 @@ const DicomTagBrowser = ({ clients, studyInstanceUID }: DicomTagBrowserProps): J
           style={{ marginBottom: '20px' }}
           placeholder='Search DICOM tags...'
           prefix={<SearchOutlined />}
-          onChange={(e) => setFilterValue(e.target.value)}
-          value={filterValue}
+          onChange={(e) => setSearchInput(e.target.value)}
+          value={searchInput}
         />
 
         <Table
@@ -295,7 +358,7 @@ const DicomTagBrowser = ({ clients, studyInstanceUID }: DicomTagBrowserProps): J
           dataSource={filteredData}
           pagination={false}
           expandable={{
-            expandedRowKeys: allExpandedKeys,
+            expandedRowKeys: expandedKeys,
             onExpandedRowsChange: (keys) => setExpandedKeys(keys as string[])
           }}
           size='small'
diff --git a/src/components/DicomTagBrowser/dicomTagUtils.ts b/src/components/DicomTagBrowser/dicomTagUtils.ts
index 8b9290f..e4f0678 100644
--- a/src/components/DicomTagBrowser/dicomTagUtils.ts
+++ b/src/components/DicomTagBrowser/dicomTagUtils.ts
@@ -1,8 +1,6 @@
 import dcmjs from 'dcmjs'
 
 const { DicomMetaDictionary } = dcmjs.data
-// @ts-expect-error
-const { nameMap } = DicomMetaDictionary
 
 interface TagInfo {
   tag: string
@@ -44,10 +42,12 @@ export const formatTagValue = (tag: DicomTag): string => {
  * @returns Array of processed tag information
  */
 export function getRows (metadata: Record<string, any>, depth = 0): TagInfo[] {
+  if (metadata === undefined || metadata === null) return []
   const keywords = Object.keys(metadata).filter(key => key !== '_vrMap')
 
   return keywords.flatMap(keyword => {
-    const tagInfo = nameMap[keyword] as TagInfo | undefined
+    // @ts-expect-error
+    const tagInfo = DicomMetaDictionary.nameMap[keyword] as TagInfo | undefined
     let value = metadata[keyword]
 
     // Handle private or unknown tags
diff --git a/src/hooks/useDebounce.ts b/src/hooks/useDebounce.ts
new file mode 100644
index 0000000..3dce5e0
--- /dev/null
+++ b/src/hooks/useDebounce.ts
@@ -0,0 +1,25 @@
+import { useState, useEffect } from 'react'
+
+/**
+ * A hook that delays updating a value for the specified time
+ * @param value The value to debounce
+ * @param delay The delay time in milliseconds
+ * @returns The debounced value
+ * @example
+ * const debouncedSearchTerm = useDebounce(searchTerm, 300)
+ */
+export const useDebounce = <T,>(value: T, delay: number): T => {
+  const [debouncedValue, setDebouncedValue] = useState<T>(value)
+
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      setDebouncedValue(value)
+    }, delay)
+
+    return () => {
+      clearTimeout(timer)
+    }
+  }, [value, delay])
+
+  return debouncedValue
+}
diff --git a/src/services/DICOMMetadataStore.ts b/src/services/DICOMMetadataStore.ts
new file mode 100644
index 0000000..fbcdba0
--- /dev/null
+++ b/src/services/DICOMMetadataStore.ts
@@ -0,0 +1,319 @@
+import dcmjs from 'dcmjs'
+
+import pubSubServiceInterface from '../utils/pubSubServiceInterface'
+import createStudyMetadata from '../utils/createStudyMetadata'
+
+export const EVENTS = {
+  STUDY_ADDED: 'event::dicomMetadataStore:studyAdded',
+  INSTANCES_ADDED: 'event::dicomMetadataStore:instancesAdded',
+  SERIES_ADDED: 'event::dicomMetadataStore:seriesAdded',
+  SERIES_UPDATED: 'event::dicomMetadataStore:seriesUpdated'
+}
+
+export interface Instance {
+  SOPInstanceUID: string
+  SOPClassUID: string
+  Rows: number
+  Columns: number
+  PatientSex: string
+  Modality: string
+  InstanceNumber: string
+  imageId?: string
+  [key: string]: any // For dynamic metadata properties
+}
+
+export interface Series {
+  Modality: string
+  SeriesInstanceUID: string
+  SeriesNumber: number
+  SeriesDate: string
+  SeriesTime: string
+  SeriesDescription: string
+  instances: Instance[]
+  addInstance: (newInstance: Instance) => void
+  addInstances: (newInstances: Instance[]) => void
+  getInstance: (SOPInstanceUID: string) => Instance | undefined
+}
+
+export interface Study {
+  StudyInstanceUID: string
+  StudyDescription: string
+  PatientID: string
+  PatientName: string
+  StudyDate: string
+  AccessionNumber: string
+  NumInstances: number
+  ModalitiesInStudy: any[]
+  NumberOfStudyRelatedSeries?: number
+  isLoaded: boolean
+  series: Series[]
+  addInstanceToSeries: (instance: Instance) => void
+  addInstancesToSeries: (instances: Instance[]) => void
+  setSeriesMetadata: (SeriesInstanceUID: string, metadata: any) => void
+}
+
+interface Model {
+  studies: Study[]
+}
+
+const _model: Model = {
+  studies: []
+}
+
+function _getStudyInstanceUIDs (): string[] {
+  return _model.studies.map((aStudy) => aStudy.StudyInstanceUID)
+}
+
+function _getStudy (StudyInstanceUID: string): Study | undefined {
+  return _model.studies.find(
+    (aStudy) => aStudy.StudyInstanceUID === StudyInstanceUID
+  )
+}
+
+function _getSeries (StudyInstanceUID: string, SeriesInstanceUID: string): Series | undefined {
+  const study = _getStudy(StudyInstanceUID)
+
+  if (study == null) {
+    return
+  }
+
+  return study.series.find(
+    (aSeries) => aSeries.SeriesInstanceUID === SeriesInstanceUID
+  )
+}
+
+function _getInstance (
+  StudyInstanceUID: string,
+  SeriesInstanceUID: string,
+  SOPInstanceUID: string
+): Instance | undefined {
+  const series = _getSeries(StudyInstanceUID, SeriesInstanceUID)
+
+  if (series == null) {
+    return
+  }
+
+  return series.getInstance(SOPInstanceUID)
+}
+
+function _getInstanceByImageId (imageId: string): Instance | undefined {
+  for (const study of _model.studies) {
+    for (const series of study.series) {
+      for (const instance of series.instances) {
+        if (instance.imageId === imageId) {
+          return instance
+        }
+      }
+    }
+  }
+}
+
+/**
+ * Update the metadata of a specific series
+ * @param {*} StudyInstanceUID
+ * @param {*} SeriesInstanceUID
+ * @param {*} metadata metadata inform of key value pairs
+ * @returns
+ */
+function _updateMetadataForSeries (
+  StudyInstanceUID: string,
+  SeriesInstanceUID: string,
+  metadata: Record<string, any>
+): void {
+  const study = _getStudy(StudyInstanceUID)
+
+  if (study == null) {
+    return
+  }
+
+  const series = study.series.find(
+    (aSeries) => aSeries.SeriesInstanceUID === SeriesInstanceUID
+  )
+
+  if (series == null) {
+    return
+  }
+
+  const { instances } = series
+  instances.forEach((instance) => {
+    Object.keys(metadata).forEach((key) => {
+      if (typeof metadata[key] === 'object') {
+        instance[key] = { ...instance[key], ...metadata[key] }
+      } else {
+        instance[key] = metadata[key]
+      }
+    })
+  })
+}
+
+interface BaseImplementationType {
+  EVENTS: typeof EVENTS
+  listeners: Record<string, any>
+  addInstance: (dicomJSONDatasetOrP10ArrayBuffer: ArrayBuffer | Record<string, any>) => void
+  addInstances: (instances: Instance[], madeInClient?: boolean) => void
+  updateSeriesMetadata: (seriesMetadata: Record<string, any>) => void
+  addSeriesMetadata: (seriesSummaryMetadata: Array<Record<string, any>>, madeInClient?: boolean) => void
+  addStudy: (study: Record<string, any>) => void
+  getStudyInstanceUIDs: typeof _getStudyInstanceUIDs
+  getStudy: typeof _getStudy
+  getSeries: typeof _getSeries
+  getInstance: typeof _getInstance
+  getInstanceByImageId: typeof _getInstanceByImageId
+  updateMetadataForSeries: typeof _updateMetadataForSeries
+  _broadcastEvent: (eventName: string, data: any) => void
+}
+
+const BaseImplementation: BaseImplementationType = {
+  EVENTS,
+  listeners: {},
+  addInstance (dicomJSONDatasetOrP10ArrayBuffer) {
+    let dicomJSONDataset
+
+    // If Arraybuffer, parse to DICOMJSON before naturalizing.
+    if (dicomJSONDatasetOrP10ArrayBuffer instanceof ArrayBuffer) {
+      const dicomData = dcmjs.data.DicomMessage.readFile(
+        dicomJSONDatasetOrP10ArrayBuffer
+      )
+
+      dicomJSONDataset = dicomData.dict
+    } else {
+      dicomJSONDataset = dicomJSONDatasetOrP10ArrayBuffer
+    }
+
+    let naturalizedDataset: Instance
+
+    if (!('SeriesInstanceUID' in dicomJSONDataset)) {
+      naturalizedDataset =
+        dcmjs.data.DicomMetaDictionary.naturalizeDataset(dicomJSONDataset) as Instance
+    } else {
+      naturalizedDataset = dicomJSONDataset as unknown as Instance
+    }
+
+    const { StudyInstanceUID } = naturalizedDataset
+
+    let study = _model.studies.find(
+      (study) => study.StudyInstanceUID === StudyInstanceUID
+    )
+
+    if (study == null) {
+      _model.studies.push(createStudyMetadata(StudyInstanceUID))
+      study = _model.studies[_model.studies.length - 1]
+    }
+
+    study.addInstanceToSeries(naturalizedDataset)
+  },
+  addInstances (instances, madeInClient = false) {
+    const { StudyInstanceUID, SeriesInstanceUID } = instances[0]
+
+    let study = _model.studies.find(
+      (study) => study.StudyInstanceUID === StudyInstanceUID
+    )
+
+    if (study == null) {
+      _model.studies.push(createStudyMetadata(StudyInstanceUID))
+      study = _model.studies[_model.studies.length - 1]
+    }
+
+    study.addInstancesToSeries(instances)
+
+    // Broadcast an event even if we used cached data.
+    // This is because the mode needs to listen to instances that are added to build up its active displaySets.
+    // It will see there are cached displaySets and end early if this Series has already been fired in this
+    // Mode session for some reason.
+    this._broadcastEvent(EVENTS.INSTANCES_ADDED, {
+      StudyInstanceUID,
+      SeriesInstanceUID,
+      madeInClient
+    })
+  },
+  updateSeriesMetadata (seriesMetadata) {
+    const { StudyInstanceUID, SeriesInstanceUID } = seriesMetadata
+    const series = _getSeries(StudyInstanceUID, SeriesInstanceUID)
+    if (series == null) {
+      return
+    }
+
+    const study = _getStudy(StudyInstanceUID)
+    if (study != null) {
+      study.setSeriesMetadata(SeriesInstanceUID, seriesMetadata)
+    }
+  },
+  addSeriesMetadata (seriesSummaryMetadata, madeInClient = false) {
+    if (
+      seriesSummaryMetadata === undefined ||
+      seriesSummaryMetadata.length === 0 ||
+      seriesSummaryMetadata[0] === undefined
+    ) {
+      return
+    }
+
+    const { StudyInstanceUID } = seriesSummaryMetadata[0]
+    let study = _getStudy(StudyInstanceUID)
+    if (study == null) {
+      study = createStudyMetadata(StudyInstanceUID)
+      // Will typically be undefined with a compliant DICOMweb server, reset later
+      study.StudyDescription = seriesSummaryMetadata[0].StudyDescription
+      seriesSummaryMetadata?.forEach((item) => {
+        if (study !== undefined && !study.ModalitiesInStudy?.includes(item.Modality)) {
+          study.ModalitiesInStudy?.push(item.Modality)
+        }
+      })
+      study.NumberOfStudyRelatedSeries = seriesSummaryMetadata.length
+      _model.studies.push(study)
+    }
+
+    seriesSummaryMetadata.forEach((series) => {
+      const { SeriesInstanceUID } = series
+      study?.setSeriesMetadata(SeriesInstanceUID, series)
+    })
+
+    this._broadcastEvent(EVENTS.SERIES_ADDED, {
+      StudyInstanceUID,
+      seriesSummaryMetadata,
+      madeInClient
+    })
+  },
+  addStudy (study) {
+    const { StudyInstanceUID } = study
+
+    const existingStudy = _model.studies.find(
+      (study) => study.StudyInstanceUID === StudyInstanceUID
+    )
+
+    if (existingStudy == null) {
+      const newStudy = createStudyMetadata(StudyInstanceUID)
+
+      newStudy.PatientID = study.PatientID
+      newStudy.PatientName = study.PatientName
+      newStudy.StudyDate = study.StudyDate
+      newStudy.ModalitiesInStudy = study.ModalitiesInStudy
+      newStudy.StudyDescription = study.StudyDescription
+      newStudy.AccessionNumber = study.AccessionNumber
+      newStudy.NumInstances = study.NumInstances // todo: Correct naming?
+
+      _model.studies.push(newStudy)
+    }
+  },
+  getStudyInstanceUIDs: _getStudyInstanceUIDs,
+  getStudy: _getStudy,
+  getSeries: _getSeries,
+  getInstance: _getInstance,
+  getInstanceByImageId: _getInstanceByImageId,
+  updateMetadataForSeries: _updateMetadataForSeries,
+  _broadcastEvent (eventName: string, data: any): void {
+  }
+}
+
+interface DicomMetadataStoreType extends BaseImplementationType {
+  subscribe: (event: string, callback: (data: any) => void) => { unsubscribe: () => any }
+  unsubscribe: (event: string, callback: (data: any) => void) => void
+}
+
+const DicomMetadataStore = Object.assign(
+  {},
+  BaseImplementation,
+  pubSubServiceInterface
+) as unknown as DicomMetadataStoreType
+
+export { DicomMetadataStore }
+export default DicomMetadataStore
diff --git a/src/utils/createSeriesMetadata.ts b/src/utils/createSeriesMetadata.ts
new file mode 100644
index 0000000..4a922ea
--- /dev/null
+++ b/src/utils/createSeriesMetadata.ts
@@ -0,0 +1,35 @@
+import { Instance, Series } from '../services/DICOMMetadataStore'
+
+function createSeriesMetadata (SeriesInstanceUID: string, defaultInstances?: Instance[]): Series {
+  const instances: Instance[] = []
+  const instancesMap = new Map<string, Instance>()
+
+  return {
+    SeriesInstanceUID,
+    Modality: '',
+    SeriesNumber: 0,
+    SeriesDescription: '',
+    SeriesDate: '',
+    SeriesTime: '',
+    ...defaultInstances?.[0],
+    instances,
+    addInstance: function (newInstance: Instance) {
+      this.addInstances([newInstance])
+    },
+    addInstances: function (newInstances: Instance[]) {
+      for (let i = 0, len = newInstances.length; i < len; i++) {
+        const instance = newInstances[i]
+
+        if (!instancesMap.has(instance.SOPInstanceUID)) {
+          instancesMap.set(instance.SOPInstanceUID, instance)
+          instances.push(instance)
+        }
+      }
+    },
+    getInstance: function (SOPInstanceUID: string) {
+      return instancesMap.get(SOPInstanceUID)
+    }
+  }
+}
+
+export default createSeriesMetadata
diff --git a/src/utils/createStudyMetadata.ts b/src/utils/createStudyMetadata.ts
new file mode 100644
index 0000000..0bbd48c
--- /dev/null
+++ b/src/utils/createStudyMetadata.ts
@@ -0,0 +1,65 @@
+import createSeriesMetadata from './createSeriesMetadata'
+
+import { Study, Series, Instance } from '../services/DICOMMetadataStore'
+
+function createStudyMetadata (StudyInstanceUID: string): Study {
+  return {
+    StudyInstanceUID,
+    StudyDescription: '',
+    PatientID: '',
+    PatientName: '',
+    StudyDate: '',
+    AccessionNumber: '',
+    NumInstances: 0,
+    ModalitiesInStudy: [],
+    isLoaded: false,
+    series: [] as Series[],
+    /**
+     * @param {object} instance
+     */
+    addInstanceToSeries: function (instance: Instance) {
+      this.addInstancesToSeries([instance])
+    },
+    /**
+     * @param {object[]} instances
+     * @param {string} instances[].SeriesInstanceUID
+     * @param {string} instances[].StudyDescription
+     */
+    addInstancesToSeries: function (instances: Instance[]) {
+      const { SeriesInstanceUID } = instances[0]
+
+      if (this.StudyDescription !== '' && this.StudyDescription !== undefined) {
+        this.StudyDescription = instances[0].StudyDescription
+      }
+
+      let series = this.series.find(
+        (s) => s.SeriesInstanceUID === SeriesInstanceUID
+      )
+
+      if (series == null) {
+        series = createSeriesMetadata(SeriesInstanceUID, instances)
+        this.series.push(series)
+      }
+
+      series.addInstances(instances)
+    },
+
+    setSeriesMetadata: function (
+      SeriesInstanceUID: string,
+      seriesMetadata: any
+    ) {
+      let existingSeries = this.series.find(
+        (s) => s.SeriesInstanceUID === SeriesInstanceUID
+      )
+
+      if (existingSeries != null) {
+        existingSeries = Object.assign(existingSeries, seriesMetadata)
+      } else {
+        const series = createSeriesMetadata(SeriesInstanceUID)
+        this.series.push(Object.assign(series, seriesMetadata))
+      }
+    }
+  }
+}
+
+export default createStudyMetadata
diff --git a/src/utils/pubSubServiceInterface.ts b/src/utils/pubSubServiceInterface.ts
new file mode 100644
index 0000000..e2a9c42
--- /dev/null
+++ b/src/utils/pubSubServiceInterface.ts
@@ -0,0 +1,135 @@
+import { v4 as generateUUID } from 'uuid'
+
+/**
+ * Consumer must implement:
+ * this.listeners = {}
+ * this.EVENTS = { "EVENT_KEY": "EVENT_VALUE" }
+ */
+const pubSubInterface = {
+  subscribe,
+  _broadcastEvent,
+  _unsubscribe,
+  _isValidEvent
+}
+
+export default pubSubInterface
+
+/**
+ * Subscribe to updates.
+ *
+ * @param {string} eventName The name of the event
+ * @param {Function} callback Events callback
+ * @return {Object} Observable object with actions
+ */
+function subscribe (this: PubSubService, eventName: string, callback: Function): { unsubscribe: () => any } {
+  if (this._isValidEvent(eventName)) {
+    const listenerId = generateUUID()
+    const subscription = { id: listenerId, callback }
+
+    // console.info(`Subscribing to '${eventName}'.`);
+    if (Array.isArray(this.listeners[eventName])) {
+      this.listeners[eventName].push(subscription)
+    } else {
+      this.listeners[eventName] = [subscription]
+    }
+
+    return {
+      unsubscribe: () => this._unsubscribe(eventName, listenerId)
+    }
+  } else {
+    throw new Error(`Event ${eventName} not supported.`)
+  }
+}
+
+/**
+ * Unsubscribe to measurement updates.
+ *
+ * @param {string} eventName The name of the event
+ * @param {string} listenerId The listeners id
+ * @return void
+ */
+function _unsubscribe (this: PubSubService, eventName: string, listenerId: string): void {
+  if (this.listeners[eventName] === undefined) {
+    return
+  }
+
+  const listeners = this.listeners[eventName]
+  if (Array.isArray(listeners)) {
+    this.listeners[eventName] = listeners.filter(({ id }) => id !== listenerId)
+  } else {
+    this.listeners[eventName] = []
+  }
+}
+
+/**
+ * Check if a given event is valid.
+ *
+ * @param {string} eventName The name of the event
+ * @return {boolean} Event name validation
+ */
+function _isValidEvent (this: PubSubService, eventName: string): boolean {
+  return Object.values(this.EVENTS).includes(eventName)
+}
+
+/**
+ * Broadcasts changes.
+ *
+ * @param {string} eventName - The event name
+ * @param {func} callbackProps - Properties to pass callback
+ * @return void
+ */
+function _broadcastEvent (this: PubSubService, eventName: string, callbackProps: any): void {
+  const hasListeners = Object.keys(this.listeners).length > 0
+  const hasCallbacks = Array.isArray(this.listeners[eventName])
+
+  if (hasListeners && hasCallbacks) {
+    this.listeners[eventName].forEach((listener: { id: string, callback: Function }) => {
+      listener.callback(callbackProps)
+    })
+  }
+}
+
+/** Export a PubSubService class to be used instead of the individual items */
+export class PubSubService {
+  EVENTS: any
+  subscribe: (
+    eventName: string,
+    callback: Function
+  ) => { unsubscribe: () => any }
+
+  _broadcastEvent: (eventName: string, callbackProps: any) => void
+  _unsubscribe: (eventName: string, listenerId: string) => void
+  _isValidEvent: (eventName: string) => boolean
+  listeners: { [key: string]: Array<{ id: string, callback: Function }> }
+  unsubscriptions: any[]
+  constructor (EVENTS: Record<string, string>) {
+    this.EVENTS = EVENTS
+    this.subscribe = subscribe
+    this._broadcastEvent = _broadcastEvent
+    this._unsubscribe = _unsubscribe
+    this._isValidEvent = _isValidEvent
+    this.listeners = {}
+    this.unsubscriptions = []
+  }
+
+  reset (): void {
+    this.unsubscriptions.forEach((unsub) => unsub())
+    this.unsubscriptions = []
+  }
+
+  /**
+   * Creates an event that records whether or not someone
+   * has consumed it.  Call eventData.consume() to consume the event.
+   * Check eventData.isConsumed to see if it is consumed or not.
+   * @param props - to include in the event
+   */
+  protected createConsumableEvent (props: Record<string, any>): Record<string, any> {
+    return {
+      ...props,
+      isConsumed: false,
+      consume: function Consume () {
+        this.isConsumed = true
+      }
+    }
+  }
+}
diff --git a/yarn.lock b/yarn.lock
index 66c64e1..f404f89 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4804,9 +4804,9 @@ dayjs@1.x:
   integrity sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ==
 
 dcmjs@^0.29.8:
-  version "0.29.8"
-  resolved "https://registry.yarnpkg.com/dcmjs/-/dcmjs-0.29.8.tgz#3daa5224f8e75b2e5b069590bef26a272741fa44"
-  integrity sha512-Y0/KZAmT1siVo7eH3KK4ZflEbNi61soUpD0N7lsXMVVJQ6IZkHlaSzb9DtqnEpMs7RJDfvZGr1uXpv1vBBIypQ==
+  version "0.29.13"
+  resolved "https://registry.yarnpkg.com/dcmjs/-/dcmjs-0.29.13.tgz#a74df541bf3948366b25630dbe1e8376f108ea3b"
+  integrity sha512-Bf9tKzJNWqk4kbV210N5TLEHDqaZvO3S+MH9vezFAU8WKcG4cR6z4/II3TQVqhLI185eNUL+lhfPCVH1Uu2yTA==
   dependencies:
     "@babel/runtime-corejs3" "^7.22.5"
     adm-zip "^0.5.10"
@@ -4816,6 +4816,19 @@ dcmjs@^0.29.8:
     ndarray "^1.0.19"
     pako "^2.0.4"
 
+dcmjs@^0.35.0:
+  version "0.35.0"
+  resolved "https://registry.yarnpkg.com/dcmjs/-/dcmjs-0.35.0.tgz#5169fe27a8473b6e8459dbef922333a314fed2b9"
+  integrity sha512-kKOX4y0XoSQsDx7xYh9HJLfAWizrvYNJPU/d+DGOehdGz1frvimBZDEL0iaCK46Lhy7amAmtv4g5hkjcxVF+kg==
+  dependencies:
+    "@babel/runtime-corejs3" "^7.22.5"
+    adm-zip "^0.5.10"
+    gl-matrix "^3.1.0"
+    lodash.clonedeep "^4.5.0"
+    loglevel "^1.8.1"
+    ndarray "^1.0.19"
+    pako "^2.0.4"
+
 debug@2.6.9, debug@^2.6.0, debug@^2.6.9:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
@@ -8406,6 +8419,11 @@ lodash@^4.17.15, lodash@^4.17.20, lodash@^4.17.21, lodash@^4.17.4, lodash@^4.7.0
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
 
+loglevel@^1.8.1:
+  version "1.9.2"
+  resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.9.2.tgz#c2e028d6c757720107df4e64508530db6621ba08"
+  integrity sha512-HgMmCqIJSAKqo68l0rS2AanEWfkxaZ5wNiEFb5ggm08lDs9Xl2KxBlX3PTcaD2chBM1gXAYf491/M2Rv8Jwayg==
+
 loglevelnext@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/loglevelnext/-/loglevelnext-3.0.1.tgz#e3e4659c4061c09264f6812c33586dc55a009a04"