From b552539cba321cbd7765e723319f8d5b825f3ea2 Mon Sep 17 00:00:00 2001
From: tblivet <thibault.blivet@prestashop.com>
Date: Wed, 18 Dec 2024 09:31:20 +0100
Subject: [PATCH] feat: storybook

---
 .../src/scss/components/_scrollable-list.scss |  4 +-
 .../components/DialogTemperedFiles.stories.js | 64 +++++++++++++++++++
 .../components/scrollable-list.html.twig      |  4 +-
 3 files changed, 69 insertions(+), 3 deletions(-)
 create mode 100644 storybook/stories/components/DialogTemperedFiles.stories.js

diff --git a/_dev/src/scss/components/_scrollable-list.scss b/_dev/src/scss/components/_scrollable-list.scss
index f628805851..a7803be36a 100644
--- a/_dev/src/scss/components/_scrollable-list.scss
+++ b/_dev/src/scss/components/_scrollable-list.scss
@@ -21,8 +21,10 @@ $e: ".scrollable-list";
     &__count {
       flex-shrink: 0;
       min-width: 1.25rem;
+      padding: 0.0625rem 0.3125rem;
       font-size: 0.875rem;
       line-height: 1.125rem;
+      text-align: center;
     }
 
     &__scroll {
@@ -35,7 +37,7 @@ $e: ".scrollable-list";
       overflow-y: auto;
       border-radius: var(--#{$ua-prefix}border-radius);
       font-size: 0.875rem;
-      line-height: 1.25;
+      line-height: 1.25rem;
     }
 
     &__item {
diff --git a/storybook/stories/components/DialogTemperedFiles.stories.js b/storybook/stories/components/DialogTemperedFiles.stories.js
new file mode 100644
index 0000000000..14d79ce389
--- /dev/null
+++ b/storybook/stories/components/DialogTemperedFiles.stories.js
@@ -0,0 +1,64 @@
+/**
+ * Copyright since 2007 PrestaShop SA and Contributors
+ * PrestaShop is an International Registered Trademark & Property of PrestaShop SA
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.md.
+ * It is also available through the world-wide-web at this URL:
+ * https://opensource.org/licenses/AFL-3.0
+ * If you did not receive a copy of the license and are unable to
+ * obtain it through the world-wide-web, please send an email
+ * to license@prestashop.com so we can send you a copy immediately.
+ *
+ * DISCLAIMER
+ *
+ * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
+ * versions in the future. If you wish to customize PrestaShop for your
+ * needs please refer to https://devdocs.prestashop.com/ for more information.
+ *
+ * @author    PrestaShop SA and Contributors <contact@prestashop.com>
+ * @copyright Since 2007 PrestaShop SA and Contributors
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ */
+
+import DialogTemperedFiles from "../../../views/templates/dialogs/dialog-tempered-files.html.twig";
+import { Default as Dialog } from "./Dialog.stories";
+
+export default {
+  title: "Components/Dialog",
+  component: DialogTemperedFiles,
+};
+
+export const TemperedFiles = {
+  args: {
+    ...Dialog.args,
+    title: "List of core alterations",
+    message: "Some core files have been altered, customization made on these files will be lost during the update.",
+    missing_files: [
+      "adminProjetX/autoupgrade/index.php",
+      "adminProjetX/backups/index.php",
+      "config/xml/.htaccess",
+      "config/xml/themes/index.php",
+    ],
+    altered_files: [
+      "adminProjetX/themes/new-theme/public/tax.bundle.js",
+      "adminProjetX/themes/new-theme/public/order_return_states_form.bundle.js",
+      "adminProjetX/themes/new-theme/public/carrier.bundle.js",
+      "adminProjetX/themes/new-theme/public/create_product_default_theme.css",
+      "adminProjetX/themes/new-theme/public/meta.bundle.js",
+      "adminProjetX/themes/new-theme/public/module.bundle.js",
+      "adminProjetX/themes/new-theme/public/tax.bundle.js",
+      "adminProjetX/themes/new-theme/public/order_return_states_form.bundle.js",
+      "adminProjetX/themes/new-theme/public/carrier.bundle.js",
+      "adminProjetX/themes/new-theme/public/create_product_default_theme.css",
+      "adminProjetX/themes/new-theme/public/meta.bundle.js",
+      "adminProjetX/themes/new-theme/public/module.bundle.js",
+    ],
+  },
+  play: async () => {
+    const dialog = document.querySelector(".dialog");
+    dialog.showModal();
+  },
+};
diff --git a/views/templates/components/scrollable-list.html.twig b/views/templates/components/scrollable-list.html.twig
index 54cf14fdef..9a1a362522 100644
--- a/views/templates/components/scrollable-list.html.twig
+++ b/views/templates/components/scrollable-list.html.twig
@@ -1,8 +1,8 @@
 <div class="scrollable-list">
-  {% if title is defined and title and not empty %}
+  {% if title is defined and title is not empty %}
     <div class="scrollable-list__header">
       <p class="h3">{{ title }}</p>
-      {% if status is defined and status and not empty %}
+      {% if status is defined and status is not empty %}
         <span class="scrollable-list__count badge badge-{{ status }}">{{ items|length }}</span>
       {% endif %}
     </div>