diff --git a/ayanova/src/views/home-notifications.vue b/ayanova/src/views/home-notifications.vue
index 4face1b2..d9df3d76 100644
--- a/ayanova/src/views/home-notifications.vue
+++ b/ayanova/src/views/home-notifications.vue
@@ -1,13 +1,44 @@
 <template>
   <div>
+    <v-row>
+      <gz-error :errorBoxMessage="formState.errorBoxMessage"></gz-error>
+      {{ obj }}
+      <v-col rows="12">
+        <v-timeline :dense="$vuetify.breakpoint.smAndDown">
+          <v-timeline-item v-for="i in obj" :key="i.id" fill-dot>
+            <v-card :outlined="$store.state.darkMode">
+              <v-card-title>{{ i.name }}</v-card-title>
+              <v-card-subtitle
+                >{{ i.uicreated }} - {{ i.uievent }}</v-card-subtitle
+              >
+              <v-card-text
+                ><v-icon large class="mr-2">{{ i.icon }}</v-icon
+                >{{ i.uiayatype }}
+                <div class="mt-4" v-if="i.message">{{ i.message }}</div>
+              </v-card-text>
+
+              <v-card-actions>
+                <v-btn text @click="deleteItem(i)">{{ $ay.t("Delete") }}</v-btn>
+                <v-btn text @click="openSubscription(i)">{{
+                  $ay.t("NotifySubscription")
+                }}</v-btn>
+                <v-btn text @click="openItem(i)">{{ $ay.t("Open") }}</v-btn>
+              </v-card-actions>
+            </v-card>
+          </v-timeline-item>
+        </v-timeline>
+      </v-col>
+    </v-row>
+
+    <!-- 
     <gz-error :errorBoxMessage="formState.errorBoxMessage"></gz-error>
-    {{ obj }}
+
 
     <v-list three-line>
       <template v-for="item in obj">
         <v-list-item :key="item.id">
           <v-list-item-avatar>
-            <v-icon>{{ item.icon }}</v-icon>
+            <v-icon @click="openItem(item)" large>{{ item.icon }}</v-icon>
           </v-list-item-avatar>
           <v-list-item-content>
             <v-list-item-title
@@ -16,10 +47,14 @@
             <v-list-item-subtitle
               v-html="subtitleHtml(item)"
             ></v-list-item-subtitle>
+            <div>
+              <v-icon>fa-trash-alt</v-icon>
+              <v-icon>fa-bell</v-icon>
+            </div>
           </v-list-item-content>
         </v-list-item>
       </template>
-    </v-list>
+    </v-list> -->
   </div>
 </template>
 
@@ -64,14 +99,20 @@ export default {
     };
   },
   methods: {
-    subtitleHtml(item) {
-      let msg = "";
-      if (item.message) {
-        msg = ` &mdash; ${item.message}`;
-      } else {
-      }
-      return `<span class='text--primary'>${item.uievent}</span>${msg}`;
+    openItem(item) {
+      window.$gz.eventBus.$emit("openobject", {
+        type: item.ayaType,
+        id: item.objectId
+      });
     },
+    openSubscription(item) {
+      window.$gz.eventBus.$emit("openobject", {
+        type: window.$gz.type.NotifySubscription,
+        id: item.notifySubscriptionId
+      });
+    },
+    deleteItem(item) {},
+
     async getDataFromApi() {
       let vm = this;
 
@@ -124,6 +165,11 @@ export default {
             ).name;
 
             temp[i].icon = window.$gz.util.iconForType(temp[i].ayaType);
+
+            if (!temp[i].message) {
+              temp[i].message =
+                "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla tristique aliquam luctus. Suspendisse molestie lacus ac varius cursus. Praesent facilisis sem quam, vitae tincidunt ligula porttitor maximus. Sed quis mi commodo, dictum nunc sed, elementum leo. In tincidunt porta risus, et tristique orci congue at.";
+            }
           }
 
           vm.obj = [...temp];
@@ -230,7 +276,6 @@ function generateMenu(vm) {
 //
 async function initForm(vm) {
   await fetchTranslatedText(vm);
-  // await populateAyaTypeList(vm);
   await populateSelectionLists(vm);
 }
 
@@ -239,44 +284,7 @@ async function initForm(vm) {
 // Ensures UI translated text is available
 //
 async function fetchTranslatedText(vm) {
-  await window.$gz.translation.cacheTranslations([
-    // "NotifyDeliveryMethod",
-    // "NotifyEventType",
-    // "NotifyDeliveryAddress",
-    // "InTags",
-    // "NotifyEventObjectDeleted",
-    // "NotifyEventObjectCreated",
-    // "NotifyEventObjectModified",
-    // "NotifyEventWorkorderStatusChange",
-    // "NotifyEventContractExpiring",
-    // "NotifyEventCSRAccepted",
-    // "NotifyEventCSRRejected",
-    // "NotifyEventWorkorderClosed",
-    // "NotifyEventQuoteStatusChange",
-    // "NotifyEventQuoteStatusAge",
-    // "NotifyEventServiceBankDepleted",
-    // "NotifyEventReminderImminent",
-    // "NotifyEventScheduledOnWorkorder",
-    // "NotifyEventScheduledOnWorkorderImminent",
-    // "NotifyEventWorkorderCloseByPassed",
-    // "NotifyEventOutsideServiceOverdue",
-    // "NotifyEventOutsideServiceReceived",
-    // "NotifyEventPartRequestReceived",
-    // "NotifyEventNotifyHealthCheck",
-    // "NotifyEventBackupStatus",
-    // "NotifyEventCustomerServiceImminent",
-    // "NotifyEventPartRequested",
-    // "NotifyEventWorkorderTotalExceedsThreshold",
-    // "NotifyEventWorkorderStatusAge",
-    // "NotifyEventUnitWarrantyExpiry",
-    // "NotifyEventUnitMeterReadingMultipleExceeded",
-    // "NotifyEventDefaultNotification",
-    // "NotifyDeliveryMethodApp",
-    // "NotifyDeliveryMethodSMTP",
-    // "NotifyEventObjectAge",
-    // "NotifyEventServerOperationsProblem",
-    // "Duration"
-  ]);
+  await window.$gz.translation.cacheTranslations(["NotifySubscription"]);
 }
 
 //////////////////////
diff --git a/ayanova/src/views/home-notify-subscriptions.vue b/ayanova/src/views/home-notify-subscriptions.vue
index d5f9deb1..bafe6764 100644
--- a/ayanova/src/views/home-notify-subscriptions.vue
+++ b/ayanova/src/views/home-notify-subscriptions.vue
@@ -7,7 +7,7 @@
     >
     </gz-extensions> -->
     <gz-data-table
-      formKey="widget-list"
+      formKey="notification-subscriptions"
       :dataListKey="dataListKey"
       :dataListFilter="dataListFilter"
       :dataListSort="dataListSort"