From bb4afd399a1ca4c089d46a5c059dbac1712f2014 Mon Sep 17 00:00:00 2001
From: LionelB <lionel@lumographe.fr>
Date: Tue, 8 Oct 2024 16:11:03 +0200
Subject: [PATCH] feat(icons): add all icons in story

---
 app/stories/pix-icon.mdx        |  4 ++--
 app/stories/pix-icon.stories.js | 28 ++++++++++++++++++++++++++++
 2 files changed, 30 insertions(+), 2 deletions(-)

diff --git a/app/stories/pix-icon.mdx b/app/stories/pix-icon.mdx
index 904233ba5..700bbfb8c 100644
--- a/app/stories/pix-icon.mdx
+++ b/app/stories/pix-icon.mdx
@@ -7,12 +7,12 @@ import * as ComponentStories from './pix-icon.stories';
 
 > Permet d'utiliser les icônes disponible du Design System.
 
-<Story of={ComponentStories.icon} height={60} />
+<Story of={ComponentStories.allIcons} height={300} />
 
 ## Usage
 
 ```html
-  <PixIcon @name="powerSettings", @plainIcon={{true}} />
+<PixIcon @name="powerSettings" , @plainIcon="{{true}}" />
 ```
 
 ## Arguments
diff --git a/app/stories/pix-icon.stories.js b/app/stories/pix-icon.stories.js
index 535ef17cf..8ebefc517 100644
--- a/app/stories/pix-icon.stories.js
+++ b/app/stories/pix-icon.stories.js
@@ -49,3 +49,31 @@ export const icon = (args) => ({
 />`,
   context: args,
 });
+
+const icons = Object.entries(ICONS).flatMap(([name, icon]) =>
+  icon.plainIcon
+    ? [
+        { iconName: name, variant: false },
+        { iconName: name, variant: true },
+      ]
+    : { iconName: name, variant: false },
+);
+
+export const allIcons = (args) => {
+  return {
+    template: hbs`
+  <ul>
+  {{#each args.icons as |icon|  }}
+  <li>
+    <PixIcon @name={{icon.iconName}} @plainIcon={{icon.variant}} @alternativeText={{icon.iconName}} @ariaHidden={{true}} />
+    <span>{{icon.iconName}}</span>
+  </li>
+  {{/each}}
+  </ul>
+`,
+    context: args,
+  };
+};
+
+allIcons.bind({});
+allIcons.args = { icons };