init import projet

2026-05-03 21:58:59 +02:00
parent f3756fdf8d
commit 8d3df9bbbb
179 changed files with 37694 additions and 132 deletions
@@ -0,0 +1,71 @@
+import Image from "next/image";
+import styles from "@/features/predictions/styles/predictions.module.css";
+
+type PredictionTileBaseProps = {
+  title: string;
+  description?: string | null;
+  badge?: string;
+  favorite?: boolean;
+  dirty: boolean;
+  saving: boolean;
+  disabled?: boolean;
+  showSubmitButton?: boolean;
+  successMessage?: string;
+  errorMessage?: string;
+  basePoints?: number;
+  iconSrc?: string;
+  onSubmit: () => void;
+  children: React.ReactNode;
+};
+
+export function PredictionTileBase({
+  title,
+  description,
+  badge,
+  favorite,
+  dirty,
+  saving,
+  disabled,
+  showSubmitButton = true,
+  successMessage,
+  errorMessage,
+  basePoints,
+  iconSrc,
+  onSubmit,
+  children,
+}: PredictionTileBaseProps) {
+  return (
+    <article className={`${styles.tile} ${favorite ? styles.tileFavorite : ""}`}>
+      <header className={styles.tileHeader}>
+        {iconSrc ? (
+          <Image src={iconSrc} alt="" width={48} height={48} className={styles.tileIcon} />
+        ) : null}
+        <div>
+          <h3>{title}</h3>
+          {description ? <p>{description}</p> : null}
+        </div>
+        {badge ? <span className={styles.badge}>{badge}</span> : null}
+      </header>
+
+      <div className={styles.tileBody}>{children}</div>
+
+      <footer className={styles.tileFooter}>
+        {basePoints && basePoints > 0 ? (
+          <span className={styles.pointsLabel}>
+            <Image src="/images/pictos/bebe-fille.png" alt="" width={22} height={22} className={styles.pointsLabelIcon} />
+            Gagnez {basePoints} Points!
+            <Image src="/images/pictos/bebe-garcon.png" alt="" width={22} height={22} className={styles.pointsLabelIcon} />
+          </span>
+        ) : null}
+        {showSubmitButton ? (
+          <button className="btn btn-primary" onClick={onSubmit} disabled={saving || disabled}>
+            {saving ? "Validation..." : "Valider mon pronostic"}
+          </button>
+        ) : null}
+        {dirty ? <span className={styles.dirty}>Modifications non enregistrées</span> : null}
+        {successMessage ? <p className={styles.success}>{successMessage}</p> : null}
+        {errorMessage ? <p className={styles.error}>{errorMessage}</p> : null}
+      </footer>
+    </article>
+  );
+}