added maxNumChildBlocks property and callbacks to disable adding/removing child blocks to sequence. Also made streamfield add-buttons dissapear when capacity is reached (#6070)

CHANGELOG.txt

@@ -46,6 +46,7 @@ Changelog
  * Upgrade jQuery to version 3.5.1 to reduce penetration testing false positives (Matt Westcott)
  * Add ability to extend `EditHandler` without a children attribute (Seb Brown)
  * `Page.objects.specific` now gracefully handles pages with missing specific records (Andy Babic)
+ * StreamField 'add' buttons are now disabled when maximum count is reached (Max Gabrielsson)
  * Fix: Support IPv6 domain (Alex Gleason, Coen van der Kamp)
  * Fix: Ensure link to add a new user works when no users are visible in the users list (LB (Ben Johnston))
  * Fix: `AbstractEmailForm` saved submission fields are now aligned with the email content fields, `form.cleaned_data` will be used instead of `form.fields` (Haydn Greatnews)

CONTRIBUTORS.rst

@@ -469,6 +469,7 @@ Contributors
 * Nikolay Lukyanov (mozgsml)
 * Jean Zombie
 * Pascal Widdershoven
+* Max Gabrielsson
 
 Translators
 ===========

docs/releases/2.10.rst

@@ -64,6 +64,7 @@ Other features
  * Upgrade jQuery to version 3.5.1 to reduce penetration testing false positives (Matt Westcott)
  * Add ability to extend ``EditHandler`` without a children attribute (Seb Brown)
  * ``Page.objects.specific`` now gracefully handles pages with missing specific records (Andy Babic)
+ * StreamField 'add' buttons are now disabled when maximum count is reached (Max Gabrielsson)
 
 
 Bug fixes

wagtail/admin/static_src/wagtailadmin/js/blocks/list.js

@@ -9,6 +9,7 @@
         return function(elementPrefix) {
             var sequence = Sequence({
                 prefix: elementPrefix,
+                maxNumChildBlocks: Infinity,
                 onInitializeMember: function(sequenceMember) {
                     /* initialize child block's JS behaviour */
                     if (opts.childInitializer) {

wagtail/admin/static_src/wagtailadmin/js/blocks/sequence.js

@@ -115,6 +115,11 @@ CODE FOR SETTING UP SPECIFIC UI WIDGETS, SUCH AS DELETE BUTTONS OR MENUS, DOES N
             }
 
             newMember._markAdded();
+
+            if (members.length >= opts.maxNumChildBlocks && opts.onDisableAdd) {
+                /* maximum block capacity has been reached */
+                opts.onDisableAdd(members)
+            }
         }
 
         function elementFromTemplate(template, newPrefix) {
@@ -247,6 +252,11 @@ CODE FOR SETTING UP SPECIFIC UI WIDGETS, SUCH AS DELETE BUTTONS OR MENUS, DOES N
                 /* deleting the last member; the new last member cannot move down now */
                 opts.onDisableMoveDown(members[members.length - 1]);
             }
+
+            if (members.length + 1 >= opts.maxNumChildBlocks && members.length < opts.maxNumChildBlocks && opts.onEnableAdd) {
+                /* there is now capacity left for another block */
+                opts.onEnableAdd(members)
+            }
         };
 
         self.moveMemberUp = function(member) {
@@ -342,6 +352,11 @@ CODE FOR SETTING UP SPECIFIC UI WIDGETS, SUCH AS DELETE BUTTONS OR MENUS, DOES N
             }
         }
 
+        if (members.length >= opts.maxNumChildBlocks && opts.onDisableAdd) {
+            /* block capacity is already reached on initialization */
+            opts.onDisableAdd(members)
+        }
+      
         return self;
     };
 })(jQuery);

wagtail/admin/static_src/wagtailadmin/js/blocks/stream.js

@@ -81,6 +81,7 @@
         return function(elementPrefix) {
             var sequence = Sequence({
                 prefix: elementPrefix,
+                maxNumChildBlocks: opts.maxNumChildBlocks,
                 onInitializeMember: function(sequenceMember) {
                     /* initialize child block's JS behaviour */
                     var blockTypeName = $('#' + sequenceMember.prefix + '-type').val();
@@ -129,6 +130,25 @@
 
                 onDisableMoveDown: function(sequenceMember) {
                     $('#' + sequenceMember.prefix + '-movedown').addClass('disabled');
+                },
+                
+                onDisableAdd: function(members) {
+                    for (var i = 0; i < members.length; i++){
+                        $('#' + members[i].prefix + '-appendmenu-openclose')
+                            .removeClass('c-sf-add-button--visible').delay(300).slideUp()
+                    }
+                    $('#' + elementPrefix + '-prependmenu-openclose')
+                        .removeClass('c-sf-add-button--visible').delay(300).slideUp()
+                },
+
+                onEnableAdd: function(members) {
+                    for (var i = 0; i < members.length; i++){
+                        
+                        $('#' + members[i].prefix + '-appendmenu-openclose')
+                            .addClass('c-sf-add-button--visible').delay(300).slideDown()
+                    }
+                    $('#' + elementPrefix + '-prependmenu-openclose')
+                        .addClass('c-sf-add-button--visible').delay(300).slideDown()
                 }
             });
 

wagtail/core/blocks/stream_block.py

@@ -118,6 +118,7 @@ class BaseStreamBlock(Block):
         opts = {
             'definitionPrefix': "'%s'" % self.definition_prefix,
             'childBlocks': '[\n%s\n]' % ',\n'.join(child_blocks),
+            'maxNumChildBlocks': 'Infinity' if self.meta.max_num is None else ('%s' % self.meta.max_num),
         }
 
         return "StreamBlock(%s)" % js_dict(opts)