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

Feat: Adding html files for error-messages #63

Open
wants to merge 1 commit into
base: dev
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions public/components/error-messages/1.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<div
role="alert"
class="bg-red-50 border-l-4 border-red-500 p-4 rounded-r-lg shadow-sm my-4"
>
<div class="flex items-start">
<div class="flex-shrink-0">
<svg class="h-5 w-5 text-red-500" viewBox="0 0 20 20" fill="currentColor">
<path
fill-rule="evenodd"
d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z"
clip-rule="evenodd"
/>
</svg>
</div>
<div class="ml-3">
<div class="text-sm text-red-700">
Une erreur est survenue lors du traitement de votre demande.
</div>
</div>
</div>
</div>
22 changes: 22 additions & 0 deletions public/components/error-messages/2.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<div
role="alert"
class="bg-red-50 border-l-4 border-red-500 p-4 rounded-r-lg shadow-sm my-4"
>
<div class="flex items-start">
<div class="flex-shrink-0">
<svg class="h-5 w-5 text-red-500" viewBox="0 0 20 20" fill="currentColor">
<path
fill-rule="evenodd"
d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z"
clip-rule="evenodd"
/>
</svg>
</div>
<div class="ml-3">
<h3 class="text-sm font-medium text-red-800">Erreur de connexion</h3>
<div class="text-sm text-red-700 mt-1">
Impossible de se connecter au serveur. Veuillez réessayer plus tard.
</div>
</div>
</div>
</div>
41 changes: 41 additions & 0 deletions public/components/error-messages/3.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
<div
role="alert"
class="bg-red-50 border-l-4 border-red-500 p-4 rounded-r-lg shadow-sm my-4 relative"
>
<div class="flex items-start">
<div class="flex-shrink-0">
<svg class="h-5 w-5 text-red-500" viewBox="0 0 20 20" fill="currentColor">
<path
fill-rule="evenodd"
d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z"
clip-rule="evenodd"
/>
</svg>
</div>
<div class="ml-3">
<h3 class="text-sm font-medium text-red-800">Action requise</h3>
<div class="text-sm text-red-700 mt-1">
Veuillez compléter tous les champs obligatoires avant de continuer.
</div>
</div>
<button
onclick="this.parentElement.parentElement.remove()"
class="absolute top-4 right-4 text-red-500 hover:text-red-700 transition-colors"
aria-label="Fermer le message d'erreur"
>
<svg
class="h-4 w-4"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
d="M6 18L18 6M6 6l12 12"
/>
</svg>
</button>
</div>
</div>
20 changes: 20 additions & 0 deletions src/data/components/galsen-ui-error-message.mdx
Copy link
Member

Choose a reason for hiding this comment

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

Il y a un bug au niveau du chargement. Je suggère de renommer ce fichier => galsen-ui-error-messages.mdx (au pluriel) car tu as placé tes composants HTML au niveau du dossier public/components/error-messages. La nommenclature doit rester la même.

Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
---
title: Error Message
emoji: ⚠️
description: Un composant permettant d'afficher des messages d'erreur avec différents styles et options.
components:
1:
title: Message d'erreur basique
2:
title: Message d'erreur avec titre
3:
title: Message d'erreur fermable
---

# Error Message

<RenderHTMLFiles
components={components}
files={files}
componentSlug={componentSlug}
/>