Add banner to warn about the Composer 1 EOL

composer · Nov 27, 2024 · 5185461 · 5185461
1 parent 1c4918f
commit 5185461
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 1 deletion.
diff --git a/css/app.scss b/css/app.scss
@@ -150,6 +150,28 @@ strong {
     background: #2d2d32;
 }
 
+.banner {
+    position: absolute;
+    text-align: center;
+    left: 50%;
+    top: 9px;
+    width: 340px;
+    height: 40px;
+    margin-left: -170px;
+    background: red;
+    padding: 10px;
+    border-radius: 5px;
+    &.alert-error::before {
+        content: '';
+    }
+    z-index: 500;
+    .banner-close {
+        float: right;
+        padding-top: 2px;
+        cursor: pointer;
+    }
+}
+
 .navbar {
     margin: 0;
     border: 0;

diff --git a/js/app.js b/js/app.js
@@ -62,6 +62,21 @@ import 'bootstrap';
             scrollTo(0, $($(e.target).attr('href')).offset().top - 65);
         }, 0);
     });
+
+    let currentBannerId = $('.banner .banner-close').data('banner-id');
+    $('.banner .banner-close').click(function () {
+        $('.banner').addClass('hidden');
+        try {
+            window.localStorage.setItem('banner-read', currentBannerId);
+        } catch (e) {}
+    });
+    if (currentBannerId !== undefined) {
+        try {
+            if (window.localStorage.getItem('banner-read') !== currentBannerId) {
+                $('.banner').removeClass('hidden');
+            }
+        } catch (e) {}
+    }
 })(jQuery);
 
 if (window.trackPageload !== false && location.host === 'packagist.org') {

diff --git a/templates/layout.html.twig b/templates/layout.html.twig
@@ -42,10 +42,15 @@
 
         {% block head_additions %}{% endblock %}
     </head>
-
     <body>
     <section class="wrap">
         <header class="navbar-wrapper navbar-fixed-top">
+            {% if 'now'|date('Ymd') < '20251001' %}
+            <section class="banner alert-error hidden">
+                Composer v1 support is <a href="https://blog.packagist.com/shutting-down-packagist-org-support-for-composer-1-x/">coming to an end</a>
+                <i class="glyphicon glyphicon-remove banner-close" data-banner-id="composer1eol"></i>
+            </section>
+            {% endif %}
             <nav class="container">
                 <div class="navbar" role="navigation">
                     <div class="navbar-header">