#13865 create a popup to advice about navigator blocked cookies

Author: raulvOnestic91

app/code/Magento/Theme/view/frontend/layout/default_head_blocks.xml

@@ -23,6 +23,7 @@
         </referenceBlock>
         <referenceContainer name="after.body.start">
             <block class="Magento\Framework\View\Element\Js\Components" name="head.components" as="components" template="Magento_Theme::js/components.phtml" before="-"/>
+            <block class="Magento\Framework\View\Element\Template" name="cookie-status-check" as="cookie-status" template="Magento_Theme::js/cookie_status.phtml" />
         </referenceContainer>
     </body>
 </page>

app/code/Magento/Theme/view/frontend/requirejs-config.js

@@ -30,7 +30,8 @@ var config = {
             'welcome':                'Magento_Theme/js/view/welcome',
             'breadcrumbs':            'Magento_Theme/js/view/breadcrumbs',
             'criticalCssLoader':      'Magento_Theme/js/view/critical-css-loader',
-            'jquery/ui':              'jquery/compat'
+            'jquery/ui':              'jquery/compat',
+            'cookieStatus':           'Magento_Theme/js/cookie-status'
         }
     },
     deps: [

app/code/Magento/Theme/view/frontend/templates/js/cookie_status.phtml

@@ -0,0 +1,20 @@
+<?php
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+?>
+
+<div id="cookie-status" style="display: none">
+    <?= __('The store will not work correctly in the case when cookies are disabled.') ?>
+</div>
+
+<script type="text/x-magento-init">
+    {
+        "*": {
+            "cookieStatus": {}
+        }
+    }
+</script>
+
+

app/code/Magento/Theme/view/frontend/web/js/cookie-status.js

@@ -0,0 +1,38 @@
+define([
+    'jquery',
+    'mage/translate',
+    'Magento_Ui/js/modal/modal'
+], function($, $tr, modal){
+    'use strict';
+
+    $.widget('mage.cookieStatus', {
+        /**
+         * Init object
+         * @private
+         */
+        _init: function () {
+
+            if(!navigator.cookieEnabled) {
+                console.log('popup');
+
+                const options = {
+                    type: 'popup',
+                    responsive: true,
+                    innerScroll: true,
+                    autoOpen: true,
+                    buttons: [{
+                        text: $.mage.__('Close'),
+                        class: 'cookie-status',
+                        click: function () {
+                            this.closeModal();
+                        }
+                    }]
+                };
+
+                modal(options, $('#cookie-status'));
+            }
+        }
+    });
+    
+    return $.mage.cookieStatus;
+});