examples/annotations: update functionality of channelName and namespace

Author: GregHolmes

examples/pub-sub-message-annotations/javascript/src/ably.ts

@@ -18,7 +18,7 @@ function getClient(): Ably.Realtime {
 
 // Returns the configured channel with all annotation modes enabled
 export function getChannel() {
-  return getClient().channels.get(channelName, {
+  return getClient().channels.get(`annotation:${channelName}`, {
     modes: ['PUBLISH', 'SUBSCRIBE', 'ANNOTATION_PUBLISH', 'ANNOTATION_SUBSCRIBE'],
   });
 }

examples/pub-sub-message-annotations/javascript/src/components/summary.ts

@@ -242,15 +242,15 @@ export function updateAnnotationSummary(message: MessageSummary) {
   }
 
   sectionsContainer.innerHTML = '';
-  const hasAnnotations = annotationTypes.some((type) => message.summary && message.summary[`${annotationNamespace}:${type.key}`]);
+  const hasAnnotations = annotationTypes.some((type) => message.annotations.summary && message.annotations.summary[`${annotationNamespace}:${type.key}`]);
 
   if (!hasAnnotations) {
     sectionsContainer.appendChild(createEmptyAnnotationSummaryContentElement());
     return;
   }
 
   for (const { key } of annotationTypes) {
-    const entry = message.summary[`${annotationNamespace}:${key}`];
+    const entry = message.annotations.summary[`${annotationNamespace}:${key}`];
     if (!entry) {
       continue;
     }

examples/pub-sub-message-annotations/javascript/src/config.ts

@@ -1,7 +1,7 @@
 export const urlParams = new URLSearchParams(window.location.search);
 export const clientId = urlParams.get('clientId') || 'user2';
-export const channelName = urlParams.get('name') || 'mutable:pub-sub-message-annotations';
-export const annotationNamespace = 'my-annotations';
+export const annotationNamespace = 'annotation';
+export const channelName = urlParams.get('name') || `${annotationNamespace}:pub-sub-message-annotations`;
 
 export const annotationTypes = [
   { key: 'total.v1', color: 'blue', label: 'Total' },