diff --git a/app/app.js b/app/app.js
index 29bd744..21374a4 100644
--- a/app/app.js
+++ b/app/app.js
@@ -189,8 +189,8 @@ bpmnModeler.on('spiff.dmn_files.requested', (event) => {
 bpmnModeler.on('spiff.data_stores.requested', (event) => {
   event.eventBus.fire('spiff.data_stores.returned', {
     options: [
-      { type: 'typeahead', name: 'countries' },
-      { type: 'kkv', name: 'foods' }
+      { id: 'countriesID', type: 'json', name: 'countries', clz: 'JSONDataStore' },
+      { id: 'foodsID', type: 'kkv', name: 'foods', clz: 'JSONDataStore' }
     ],
   });
 });
diff --git a/app/spiffworkflow/DataStoreReference/propertiesPanel/DataStoreSelect.js b/app/spiffworkflow/DataStoreReference/propertiesPanel/DataStoreSelect.js
index 607b45c..5d1a333 100644
--- a/app/spiffworkflow/DataStoreReference/propertiesPanel/DataStoreSelect.js
+++ b/app/spiffworkflow/DataStoreReference/propertiesPanel/DataStoreSelect.js
@@ -21,13 +21,19 @@ export function DataStoreSelect(props) {
   const bpmnFactory = useService('bpmnFactory');
 
   const getValue = () => {
-    return element.businessObject.dataStoreRef
-      ? element.businessObject.dataStoreRef.id
+    const dtRef = element.businessObject.dataStoreRef;
+    return dtRef
+      ? `${dtRef.id}___${dtRef.name}`
       : '';
   };
 
   const setValue = (value) => {
-    if (!value || value == '') {
+
+    const splitValue = value.split('___');
+    const valId = splitValue[0]
+    const valClz = splitValue[1]
+
+    if (!valId || valId == '') {
       modeling.updateProperties(element, {
         dataStoreRef: null,
       });
@@ -46,19 +52,20 @@ export function DataStoreSelect(props) {
 
     // Create DataStore
     let dataStore = definitions.get('rootElements').find(element =>
-      element.$type === 'bpmn:DataStore' && element.id === value
+      element.$type === 'bpmn:DataStore' && element.id === valId
     );
 
     // If the DataStore doesn't exist, create new one
     if (!dataStore) {
       dataStore = bpmnFactory.create('bpmn:DataStore', {
-        id: value,
-        name: 'DataStore_' + value
+        id: valId,
+        name: valClz
       });
       definitions.get('rootElements').push(dataStore);
     }
 
     modeling.updateProperties(element, {
+      name: `Data Store (${valId})`,
       dataStoreRef: dataStore,
     });
 
@@ -89,7 +96,7 @@ export function DataStoreSelect(props) {
       spiffExtensionOptions[optionType].forEach((opt) => {
         optionList.push({
           label: opt.name,
-          value: opt.name,
+          value: `${opt.id}___${opt.clz}`,
         });
       });
     }
diff --git a/test/spec/DataStoreReferenceSpec.js b/test/spec/DataStoreReferenceSpec.js
index 12834ca..6d883f7 100644
--- a/test/spec/DataStoreReferenceSpec.js
+++ b/test/spec/DataStoreReferenceSpec.js
@@ -23,8 +23,8 @@ import DataStoreInterceptor from '../../app/spiffworkflow/DataStoreReference/Dat
 const return_datastores = (event) => {
     event.eventBus.fire('spiff.data_stores.returned', {
         options: [
-            { type: 'typeahead', name: 'countries' },
-            { type: 'kkv', name: 'foods' }
+            { id: 'countriesID', type: 'json', name: 'countries', clz: 'JSONDataStore' },
+            { id: 'foodsID', type: 'kkv', name: 'foods', clz: 'JSONDataStore' }
         ],
     });
 }
@@ -83,11 +83,11 @@ describe('Data Source Reference Test cases', function () {
         // Verification if the dataStoreRef attribute is updated
         let selector = findSelect(entry);
         expect(selector.length).to.equal(3);
-        expect(selector[1].value === 'countries');
-        expect(selector[2].value === 'foods');
+        expect(selector[1].value === 'foodsID___JSONDataStore');
+        expect(selector[2].value === 'countriesID___JSONDataStore');
     });
 
-    it('should update dataStoreRef after a select event && should add new DataState in the level of process definition - DataStoreReference element', async function () {
+    it('should update dataStoreRef after a select event && should add new DataStore in the level of process definition - DataStoreReference element', async function () {
         const modeler = getBpmnJS();
         modeler.get('eventBus').once('spiff.data_stores.requested', return_datastores);
 
@@ -104,17 +104,16 @@ describe('Data Source Reference Test cases', function () {
 
         // Verification if the dataStoreRef attribute is updated
         let selector = findSelect(entry);
-        changeInput(selector, 'foods');
+        changeInput(selector, 'foodsID___JSONDataStore');
         const nwbusinessObject = getBusinessObject(shapeElement);
-        expect(nwbusinessObject.get('dataStoreRef').id).to.equal('foods');
+        expect(nwbusinessObject.get('dataStoreRef').id).to.equal('foodsID');
 
         // Check if the DataStore is added at the root level
         const definitions = modeler.getDefinitions();
         const dataStoreExists = definitions.get('rootElements').some(element =>
-            element.$type === 'bpmn:DataStore' && element.id === 'foods'
+            element.$type === 'bpmn:DataStore' && element.id === 'foodsID'
         );
-        expect(dataStoreExists, "DataStore 'foods' should be added at the root level").to.be.true;
-
+        expect(dataStoreExists, "DataStore 'foodsID' should be added at the root level").to.be.true;
     });
 
     it('should delete dataStore if dataStorRef is updated - DataStoreReference element', async function () {
@@ -134,22 +133,22 @@ describe('Data Source Reference Test cases', function () {
 
         // Verification if the dataStoreRef attribute is updated
         let selector = findSelect(entry);
-        changeInput(selector, 'foods');
+        changeInput(selector, 'foodsID___JSONDataStore');
         let nwbusinessObject = getBusinessObject(shapeElement);
-        expect(nwbusinessObject.get('dataStoreRef').id).to.equal('foods');
+        expect(nwbusinessObject.get('dataStoreRef').id).to.equal('foodsID');
         // Then choose new dataStore
-        changeInput(selector, 'countries');
+        changeInput(selector, 'countriesID___JSONDataStore');
         nwbusinessObject = getBusinessObject(shapeElement);
-        expect(nwbusinessObject.get('dataStoreRef').id).to.equal('countries');
+        expect(nwbusinessObject.get('dataStoreRef').id).to.equal('countriesID');
 
         // Check if the DataStore is added at the root level with the updated dataStore
         const definitions = modeler.getDefinitions();
         const countriesDataStoreExists = definitions.get('rootElements').some(element =>
-            element.$type === 'bpmn:DataStore' && element.id === 'countries'
+            element.$type === 'bpmn:DataStore' && element.id === 'countriesID'
         );
         expect(countriesDataStoreExists, "DataStore 'countries' should be added at the root level").to.be.true;
         const foodsDataStoreExists = definitions.get('rootElements').some(element =>
-            element.$type === 'bpmn:DataStore' && element.id === 'foods'
+            element.$type === 'bpmn:DataStore' && element.id === 'foodsID'
         );
         expect(foodsDataStoreExists, "DataStore 'countries' should be removed from the root level").not.to.be.true;