Unique id for each block

[floatas]

Hey, It would be great if editor assigned unique id for each block. This would help to keep references, add links to other blocks.
This probably would introduce breaking changes, discussion would be needed before implementing.

I have fork where I plan to do more changes, one of them is uids https://github.com/floatas/editor.js/commit/36c1f61ed66689bf9237ae3f37cc7e76e0658cb9

[jamiemchale]

This is also mentioned in #727

[christoph-kluge]

@floatas did you discovered any issues so far with your own implementation?

I'm also looking into this right now because it makes it more easy to post-process removed/updated blocks on the server-side.

Can you elaborate more on the breaking changes?

[vincent-herlemont]

@floatas I have the same issue and I have added fasiha/mudderjs for generate unique ordered key. Also mentioned in (#819 (comment))

[floatas]

@christoph-kluge I haven't found any issues. When loading document without id's, they are generated. Seems to work with all cases, if you found any issues, let me know (also my modifications are available as npm). As for breaking changes, structure changed (added new property), I guess it should work fine with original documents, haven't tested that much.

@vincent-herlemont I'm thinking of adding ordered key to blocks, but for now I just take order of appearance and assign numbered key in backed to each block. Will definitely take a look at your implementation

[christoph-kluge]

@floatas thank you sharing the the code. It helped me a lot.

I discovered one issue: It always generates new uuids even if you pass an existing dataset through data while initilizing a new editor. I have extended your code with a small fix. You can find it here: christoph-kluge@be048d7 + christoph-kluge@6088f73

[alibail]

Appreciate this is an old thread but it comes up when looking for this feature - I implemented this through introducing a "metadata" object on each block as I required to be able to assign a unique ID to every block to work with it in my backend system as well as pass additional metadata for each block through my backend system. Anyone looking for similar I have the sample code here, which can be easily customised to meet your own needs; https://github.com/alibail/editor.js

[pie6k]

This is quite an important feature in my case.

My use case:

I want to be able to mention parts of documents from different documents. In case to do that, I need blocks to have unique, but constant id's during 'lifecycle' of any block (eg, the same id after the content of the block is changed).

[mqtik]

I need this too.

[mqtik]

Any updates on this?

[christoph-kluge]

I've added a working copy here on the current master: christoph-kluge@2ef5c91
and I've added a pull request for the next release: #1333

This works fine for me and my use case. Feel free to use.

Tested Features:

• Existing data: If your previous block does not have an "id" property, it will create a new unique id
• Existing data: If your previous block does have an "id" property, it will keep the existing unique id
• Existing data: If a block gets changed the "id" property stays the same
• Insert New Block: It will create a new unique id
• Move Blocks (Up/Down): It will keep the existing unique id

Important Note:

• If you "transform/transition" an existing block to another block it will receive a NEW unique id

[mqtik]

I'll try it out.

Although, If not currently implemented, I'd have to make my own custom version with NanoID() (which is really fast), to keep consistent with other platforms.

[christoph-kluge]

@mqtik to be honest I'm fine with both. As of now I will stick to UUID because this solves my personal situation and maybe the situation of some others. As mentioned in the PR I would love to receive some feedback from the maintainers.

I'm fine to make the id-generation customizable through a callback as config parameter but I would prefer to have some feedback from the maintainers in the first place instead of hanging around here with this issue.

const editor = new EditorJS({
  customUniqueId: () => generateYourCustomId()
});

[hata6502]

ID is useful for React key, and so on.

[evanjmg]

^ that PR works for me locally - we can get some more comments on whatever there's left to do? Otherwise, I'll continue using this fork

[mqtik]

Yeah, I went with the fork too.

2 years for this is just too long.

[laygir]

Shouldn't this issue be closed?
v2.21.0 release says: New - Blocks now have unique ids #873
or am I missing something?

[neSpecc]

Thanks, @laygir, you're right.

This feature is implemented by #1667 and released in 2.21

[fedorin-git]

Hey, It would be great if editor assigned unique id for each block. This would help to keep references, add links to other blocks.

Hi @floatas! I want to implement links to other blocks in the current document. So looks like I need such element with unique id
<h2 id={blockId} class="ce-header" contenteditable="false" data-placeholder="">Audit Policy</h2>

How can I set blockId for each div inside 'editorjs'?

[ThemeMetro]

I've added a working copy here on the current master: christoph-kluge@2ef5c91 and I've added a pull request for the next release: #1333

This works fine for me and my use case. Feel free to use.

Tested Features:

• Existing data: If your previous block does not have an "id" property, it will create a new unique id
• Existing data: If your previous block does have an "id" property, it will keep the existing unique id
• Existing data: If a block gets changed the "id" property stays the same
• Insert New Block: It will create a new unique id
• Move Blocks (Up/Down): It will keep the existing unique id

Important Note:

• If you "transform/transition" an existing block to another block it will receive a NEW unique id

How to get id in Custom block render?

[alpharaoh]

I've added a working copy here on the current master: christoph-kluge@2ef5c91 and I've added a pull request for the next release: #1333
This works fine for me and my use case. Feel free to use.
Tested Features:

• Existing data: If your previous block does not have an "id" property, it will create a new unique id
• Existing data: If your previous block does have an "id" property, it will keep the existing unique id
• Existing data: If a block gets changed the "id" property stays the same
• Insert New Block: It will create a new unique id
• Move Blocks (Up/Down): It will keep the existing unique id

Important Note:

• If you "transform/transition" an existing block to another block it will receive a NEW unique id

How to get id in Custom block render?

yes, how do we get the ID?

[neSpecc]

You can find them in DOM or retrieve via API, or get from Block API passed to the tool's constructor