Set Document

A Document represents a shared collaborative space where users can interact. Documents live inside the Organization.

Documents contain:

• All feature data (e.g., Comments, Presence, Cursors, etc.).
• Locations
• Users: These are different from Organization Users. (more details in Access Control section)

Users logged into the same Document ID can see each other’s Presence, Cursors, Comments etc.

For example, in a slide presentation application, the entire slide deck is a document.

​

1. Setting a Document

• Use this to initialize a Document.
• It takes two parameters:
  • documentId: The unique identifier for the document.
  • metadata: (optional) This is a key/value pair object where you can set metadata about the document such as documentName. documentName is a special field that we use to display the document name in some Velt Components.

• React / Next.js with Hooks
• React / Next.js
• HTML
• Angular
• Vue.js

useSetDocument('unique-document-id', {documentName: 'Document Name'});

​

2. Unset a Document

• Use this to unset a Document.
• For some parts of your app, you may not need Velt. In such cases, you can unset the document.

• React / Next.js with Hooks
• React / Next.js
• HTML
• Angular
• Vue.js

useUnsetDocumentId();

​

3. Get Document Metadata

• Use this to get the metadata of a Document.
• This is useful when you want to display the document name in your app or any custom metadata that you have set.
• This returns a subscription with DocumentMetadata object.

• React / Next.js
• HTML
• Angular
• Vue.js

const { client } = useVeltClient();

useEffect(() => {
    if (client) {
        client.getDocumentMetadata().subscribe((documentMetadata) => {
            console.log("Current document metadata: ", documentMetadata);
        });
    }
}, [client]);

​

4. Access Documents from Other Organizations

• By default, users can only access documents within their own organization.
• Enable cross-organization access by specifying the organizationId of the target document in the document metadata.
• Ensure that the user has access to the target document in the target organization.

• React / Next.js
• Other Frameworks

useSetDocument(DOCUMENT_ID, {
  organizationId: 'ANOTHER_ORGANIZATION_ID'
});

client.setDocument(DOCUMENT_ID, {
  organizationId: 'ANOTHER_ORGANIZATION_ID'
});