Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[FEATURE] Création du composant Table (PIX-14514) #771

Open
wants to merge 6 commits into
base: dev
Choose a base branch
from

Conversation

fael-b
Copy link
Contributor

@fael-b fael-b commented Nov 26, 2024

🎄 Problème

Nous avons besoin d'un composant réutilisable table.

🎁 Proposition

Création du composant PixTable et de son sous-composant PixTableColumn pour gérer le rendu des colonnes.

🌟 Remarques

On utilise maintenant les block params d'Ember pour laisser l'utilisateur du composant gérer le rendu des colonnes.

🎅 Pour tester

Consulter sa documentation et nous faire des retours sur son apparence et son API si besoin.

@pix-bot-github
Copy link

Une fois l'application déployée, elle sera accessible à cette adresse https://ui-pr771.review.pix.fr
Les variables d'environnement seront accessibles sur scalingo https://dashboard.scalingo.com/apps/osc-fr1/pix-ui-review-pr771/environment

@AndreiaPena
Copy link
Member

https://www.figma.com/design/8RJ3aCSfdeQ8AZZVBBYKS8/Design-System-Nebulix?node-id=9666-32540&node-type=canvas&t=rR5fOy0VusimOWZ2-0

Le composant se met à priori dans la catégorie Data display :)

Jeremiejade and others added 4 commits November 27, 2024 14:10
Co-authored-by: Iris Benoit <[email protected]>
Co-authored-by: Fael Bassetti <[email protected]>
Co-authored-by: Jérémie Jadé <[email protected]>
Co-authored-by: Fael Bassetti <[email protected]>
Co-authored-by: Jérémie Jadé <[email protected]>
Co-authored-by: Fael Bassetti <[email protected]>
Co-authored-by: Jérémie Jadé <[email protected]>
Co-authored-by: Fael Bassetti <[email protected]>
<table ...attributes>
<caption class="screen-reader-only">{{@caption}}</caption>
<thead>
<tr>
Copy link
Contributor

@xav-car xav-car Nov 27, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

todo

Utiliser un named yield pour pousser les headers. Qui seront des futur <PixTableHeader>

Il pourront contenir autre chose que du texte.

</thead>
<tbody>
{{#each this.computedData as |row|}}
<tr>
Copy link
Contributor

@xav-car xav-car Nov 27, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Idem pour le td. Ce sera des <PixTableCell> a ajouter dans un named yield

@@ -1,12 +1,14 @@
.pix-table {
width: 100%;
padding: var(--pix-spacing-4x);
overflow: auto;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

❤️

Co-authored-by: Jérémie Jadé <[email protected]>
Co-authored-by: Fael Bassetti <[email protected]>
@Jeremiejade Jeremiejade force-pushed the pix-14514-create-pix-table-component branch from 883491c to 43186c1 Compare November 27, 2024 15:13
@Eithliu Eithliu force-pushed the pix-14514-create-pix-table-component branch from 75c5abd to 00d275f Compare November 27, 2024 16:55
@fael-b fael-b force-pushed the pix-14514-create-pix-table-component branch from 00d275f to e151644 Compare November 27, 2024 17:35
@fael-b fael-b force-pushed the pix-14514-create-pix-table-component branch from e151644 to 43d6cd1 Compare November 27, 2024 17:37
Copy link
Contributor

@mcampourcy mcampourcy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Super bon boulot ✨

(j'approve pas à cause des todos, cf mon commentaire 😁)


# PixTableColumn

TODO: insert component description
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pourquoi ne pas gérer les Todo maintenant ?

(oui, je veux vous faire bosser 😂)

@mcampourcy
Copy link
Contributor

mcampourcy commented Nov 28, 2024

Les tests func m'ont l'air OK jusqu'ici !

Et j'ai pouffé comme une gamine
Capture d’écran 2024-11-28 à 09 28 36

@Eithliu Eithliu force-pushed the pix-14514-create-pix-table-component branch from 43d6cd1 to 37ba441 Compare November 28, 2024 09:57
Co-authored-by: Iris Benoit-Martin <[email protected]>
Co-authored-by: Jérémie Jadé <[email protected]>
Co-authored-by: Fael Bassetti <[email protected]>
@Eithliu Eithliu force-pushed the pix-14514-create-pix-table-component branch from 37ba441 to 49c3f10 Compare November 28, 2024 10:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

9 participants