​

4.0.0-beta.3

​

Overview

• Introducing our next major release (4.0.0) in beta
• Key improvements in this series will focus on:
  • Advanced data querying capabilities
  • Enhanced security features
  • Powerful customization capabilities that will require significantly less code than before
• In today’s release we are adding support for multiple document operations:
  • Subscribe to multiple documents simultaneously
  • Perform real-time CRUD operations across multiple documents at once

​

Steps to upgrade

1. Ensure you are ready to deploy.
2. Enable ‘Advanced Queries and Filters’ in the Velt Console here. It will take 15 mins for this to be enabled.
3. Once, the feature is enabled, deploy 4.0.0-beta.3 to your product.

​

New APIs

​

1. setDocuments

• Set multiple documents at the same time. You can specify 30 documents at a time.
• The first document in the list will be considered as the root document.
• For features like comments, notifications, recorder, reactions etc. you will be able to read and write to multiple documents at the same time.
• For features like cursors, presence, huddle, live state sync etc. it will default to the root document.
• Sidebar will automatically show data from all the documents.

• React / Next.js
• Other Frameworks

const { setDocuments } = useSetDocuments();
setDocuments(documents: Document[], options?: RequestOptions);

client.setDocuments(documents: Document[], options?: RequestOptions);

Document: {
  id: string,
  metadata: DocumentMetadata
}

RequestOptions: {
  organizationId: string
}

​

2. getCommentAnnotations

• Get all the comment annotations for all the specified documents.
• You can specify 30 documents at a time.
• If you don’t specify any query, it will return data from the documents specified in the setDocuments method.

• React / Next.js
• Other Frameworks

const { data } = useGetCommentAnnotations(query);
// initial data value will be null while the request is in progress

const commentElement = client.getCommentElement();
commentElement.getCommentAnnotations(query).subscribe((response) => {
  console.log(response.data);
  // initial data value will be null while the request is in progress
});

RequestQuery {
  documentIds!: string[],
  locationIds!: string[],
  statusIds!: string[]
};

GetCommentAnnotationsResponse {
  data: Record<string, CommentAnnotation[]>; // Key: documentId, Value: CommentAnnotation[]
};

​

3. getCommentAnnotationsCount

• Get the total and unread comment annotations count of all the comment annotations for all the specified documents.
• You can specify 30 documents at a time.
• If you don’t specify any query, it will return data from the documents specified in the setDocuments method.

• React / Next.js
• Other Frameworks

const { data } = useCommentAnnotationsCount(query);
// initial data value will be null while the request is in progress

const commentElement = client.getCommentElement();
commentElement.getCommentAnnotationsCount(query).subscribe((response) => {
  console.log(response.data);
  // initial data value will be null while the request is in progress
});

RequestQuery {
  documentIds!: string[],
  locationIds!: string[],
  statusIds!: string[]
};

GetCommentAnnotationsCountResponse {
  data: Record<string, CommentAnnotationsCount>; // Key: documentId, Value: CommentAnnotationsCount
};

CommentAnnotationsCount {
  unread: number,
  total: number
}

​

4. Display comments from multiple documents on the same page

• If you want to display comments from multiple documents on the same page, you can add data-velt-document-id attribute to the container that contains the document.
• It will be used to identify which part of the DOM belongs to which document.

​

Other updates

​

New Features

• [Comments]: Added support for Status Filter in Comments Sidebar’s main filter menu:
  • By default, the status filter is disabled in the main filter menu.
  • Currently, it doesn’t support grouping.
  • Added Wireframe support for this. Learn more.
  • If you were using wireframes before, you will add this to your wireframes.

• React / Next.js
• Other Frameworks

const filterConfig = {
  status: {
    enable: true,
    name: "Status",
    multiSelection: true,
  }
};

<VeltCommentsSidebar filterConfig={filterConfig} />

​

Bug Fixes

• [Comments]: Fixed an issue where empty state visibility was not visible when filter is applied and grouping was disabled.
• [Comments]: Fixed an issue where users could click on the comment in the sidebar and navigate to comments when they shouldn’t.