If Stackable blocks are inside synced patterns and duplicated, blocks has the same id which makes settings apply to both original and duplicated block

[andeng1106]

Describe the bug

• If Stackable blocks are inside synced pattern and duplicated, blocks has the same id which makes settings apply to both original and duplicated block. (e.g. an icon list is inside the reusable block and when I duplicate the icon list and change settings (e.g. icon, color settings, layout settings, etc.)
• Issue only on editor
  • Remaining issue see comment below
• Applies to all blocks
• Reference: https://secure.helpscout.net/conversation/2323309108/21090?folderId=2526706

To Reproduce Steps to reproduce the behavior:

1. Add a new page
2. Add any Stackable block (e.g. Heading)
3. Set the Stackable block as a synced pattern (Options > Create pattern/reusable block > set as "Synced")
4. Inside the reusable block, duplicate the Stackable block
5. In the duplicated block, change any setting (color, layout, icon, etc.)
6. See that the settings are also applied on the original block

Optional steps to see same id for both blocks:

7. Save page and go to frontend
8. Right click block and inspect
9. See that both blocks has the same id

Expected behavior When duplicating Stackable block inside a reusable block and changed settings for the duplicated block, it should not:

• Apply setting for the original block
• Should not have same id with original block

Screenshots

https://github.com/gambitph/Stackable/assets/103395655/b1dccb5e-d5ae-4534-9c12-9342739ed779

https://github.com/gambitph/Stackable/assets/103395655/ec118260-30c5-4cb3-a774-0f0efeb74fd3

[andeng1106]

Update 10/27/23 - Fixed in frontend, remaining issue on editor

https://github.com/gambitph/Stackable/assets/103395655/349031b8-c348-436d-93d7-5d42471384d8