vaersaagod / matrixmate

Welding Matrix into shape, mate!
MIT License
44 stars 9 forks source link

MaxLimit blocks are selectable on smaller screens #74

Closed mightyfineyall closed 5 months ago

mightyfineyall commented 6 months ago

If I set a maxLimit on a matrix block like so: image It will be disabled correctly when the matrix block selections are in button mode: image As well as on each individual block (add x block above): image However, if I shrink the screen width or add enough block types that the selector turns into a dropdown/select menu: image I can suddenly add block types which have surpassed their limit.

On Craft Pro 4.9.2 with MatrixMate 2.1.4

mmikkel commented 5 months ago

I'm unable to reproduce this. Are you using a different plugin to add those colors? If so, it could be a conflict between MatrixMate and that plugin – try disabling the other plugin, if you're still seeing the issue, what browser/OS are you using?

mightyfineyall commented 5 months ago

Seeing it on both Chrome and Firefox. I disabled the Matrix Colors plugin and it's still occurring. Currently using Ubuntu 24.04 but saw it on a Windows 11 machine as well.

mmikkel commented 5 months ago

@mightyfineyall Are you seeing any JS errors in your browser's dev tools console?

mightyfineyall commented 5 months ago

No, none. @mmikkel I Just tried in an incognito window:

image

image

image

That dropdown just doesn't accept the maxLimit.

mmikkel commented 5 months ago

I'm still not able to reproduce, so there's got to be something else at play here.

Is the "Crosshead" button in the dropdown actually clickable (i.e. you're able to create a new "Crosshead" block, or does it simply appear to be clickable)?

Is the Matrix field inside of a Neo or SuperTable field?

Do you have any custom CSS or JS added to the control panel (for example, via the CPCSS/CPJS plugins)?

Can you share your entire matrixmate.php config file, as well as a list of all other installed plugins and their versions?

mightyfineyall commented 5 months ago

@mmikkel

Agent 5.0.0 Architect 4.0.1 Blitz Recommendations 2.2.1 Button Box 4.2.4 Colour Swatches 4.4.0 Contact Form 3.1.0 Contact Form Extensions 4.2.2 Elements Panel 2.0.0 Expanded Singles 2.0.5 Hyper 1.1.31 Matrix Colors 3.0.0 MatrixMate 2.2.0 Navigation 2.0.27 Read-only Field 2.0.1 Redactor 3.0.4 SEOmatic 4.0.49 SuperSort 4.0.0 Super Table 3.0.14 Typed link field 2.1.5

<?php

return [
    'fields' => [
        'salesFunnel' => [
            'types' => [
                'crosshead' => [
                    'maxLimit' => 1,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['preheading', 'heading'],
                    ], [
                        'label' => 'Image',
                        'fields' => ['image', 'alt'],
                    ], [
                        'label' => 'Links',
                        'fields' => ['cta'],
                    ]]
                ],
                'salesImage' => [
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['heading', 'text'],
                    ], [
                        'label' => 'Image',
                        'fields' => ['image', 'alt'],
                    ], [
                        'label' => 'Links',
                        'fields' => ['cta'],
                    ]]
                ],
                'logos' => [
                    'maxLimit' => 1,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['heading', 'text'],
                    ], [
                        'label' => 'Image',
                        'fields' => ['image', 'alt'],
                    ], [
                        'label' => 'Links',
                        'fields' => ['hyperlink'],
                    ]]
                ],
                'stakes' => [
                    'maxLimit' => 1,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['heading', 'text'],
                    ], [
                        'label' => 'Image',
                        'fields' => ['image', 'alt'],
                    ], [
                        'label' => 'Links',
                        'fields' => ['hyperlink'],
                    ]]
                ],
                'valueProps' => [
                    'maxLimit' => 1,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['heading', 'text'],
                    ], [
                        'label' => 'Value Props',
                        'fields' => ['valueProps'],
                    ], [
                        'label' => 'Links',
                        'fields' => ['cta'],
                    ]]
                ],
                'guide' => [
                    'maxLimit' => 1,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['text'],
                    ], [
                        'label' => 'Links',
                        'fields' => ['cta'],
                    ]]
                ],
                'products' => [
                    'maxLimit' => 1,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['heading', 'text'],
                    ], [
                        'label' => 'Products',
                        'fields' => ['products'],
                    ],  [
                        'label' => 'Links',
                        'fields' => ['hyperlink'],
                    ]]
                ],
                'steps' => [
                    'maxLimit' => 1,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['heading'],
                    ], [
                        'label' => 'Steps',
                        'fields' => ['steps'],
                    ], [
                        'label' => 'Links',
                        'fields' => ['cta'],
                    ]]
                ],
                'explanatory' => [
                    'maxLimit' => 2,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['heading', 'text'],
                    ], [
                        'label' => 'Media',
                        'fields' => ['video', 'platform', 'image', 'alt'],
                    ], [
                        'label' => 'Links',
                        'fields' => ['cta'],
                    ]]
                ],
                'leadGenerator' => [
                    'maxLimit' => 1,
                    'tabs' => [[
                        'label' => 'Info',
                        'fields' => ['leadGenerator'],
                    ]]
                ],
                'testimonials' => [
                    'maxLimit' => 1,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => [ 'heading', 'text'],
                    ], [
                        'label' => 'Testimonials',
                        'fields' => ['testimonials'],
                    ]]
                 ]
            ],
            'hiddenTypes' => ['stakes', 'products', 'testimonial', 'industries']
        ],
        'composition' => [
            'types' => [
                'textImage' => [
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => [ 'heading', 'text'],
                    ], [
                        'label' => 'Image',
                        'fields' => ['image', 'orientation'],
                    ], [
                        'label' => 'Link',
                        'fields' => ['hyperlink'],
                    ]]
                ],
                'people' => [
                    'maxLimit' => 1,
                ],
            ],
            'hiddenTypes' => ['slider', 'accordion'],
        ],
        'leadGenerator' => [
            'types' => [
                'leadGenerator' => [
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['heading', 'subheading', 'text'],
                    ], [
                        'label' => 'Image',
                        'fields' => ['image', 'alt'],
                    ], [
                        'label' => 'Form',
                        'fields' => ['formEmbed'],
                    ]]
                ],
            ],
        ],
        'titleBar' => [
            'types' => [
                'titleBar' => [
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['subheading', 'heading'],
                    ], [
                        'label' => 'Settings',
                        'fields' => ['barColor'],
                    ]],
                ],
            ],
        ],
        'caseStudy' => [
            'types' => [
                'caseStudyTitle' => [
                    'maxLimit' => 1,
                ],
                'image' => [
                    'maxLimit' => 1,
                ],
                'text' => [
                    'maxLimit' => 2,
                    'tabs' => [[
                        'label' => 'Text',
                        'fields' => ['text'],
                    ], [
                        'label' => 'Settings',
                        'fields' => ['width', 'textOrder', 'preview'],
                    ]],
                ],
                'quote' => [
                    'maxLimit' => 1,
                ],
            ],
        ],
    ],
];
mmikkel commented 5 months ago

Thanks for sticking with me @mightyfineyall, and the extra info.

I was finally able to reproduce using your config; this turned out to be an issue related to the hiddenTypes setting.

Should be fixed in MatrixMate v. 2.2.1.

mightyfineyall commented 5 months ago

All good man, much appreciated! Glad we pinpointed the issue, I use this plugin all the time.