chore: refacto fiche-produit (#189)

fiche produit:
 - use react-hook-form
 - add thématiques / user types / url budget / mon service sécurisé
 - upload image désactivé 😢

cosmetics fiches membre
cosmetics error page

fix #103 #57 #58
fix betagouv/animation-communaute#28
fix betagouv/beta.gouv.fr#4509

.talismanrc

@@ -37,6 +37,16 @@ fileignoreconfig:
   checksum: 2f825890548de8336fdec8a140bd55339de67c7bd428baf90e9621b094f08714
 - filename: src/components/SESelect.tsx
   checksum: c251dbce68caf5cb85ac395bb400dfedb142737539d3ca0e1779f2a56460c520
+- filename: src/components/SESponsorSelect.tsx
+  checksum: 0bf9460e4c98022fc27b175504a2b17019d29b3cac33beb1cbb7e372cbec2cdb
+- filename: src/components/StartupForm/PhasesEditor.tsx
+  checksum: c5fd9bbfffa9cde5c80cfccbff17f8dc5536b465c539534aa553c22179b31367
+- filename: src/components/StartupForm/StartupForm.tsx
+  checksum: 50d4ff8c6a5940f063e600f62afc8ed8a572ac9f96214b4773f62011b326d316
+- filename: src/components/StartupForm/ThematiquesEditor.tsx
+  checksum: dcaa8a0e4f7fac866160ef2422014f2ad118701d18ba177c162dc1bbd1b86be3
+- filename: src/components/StartupForm/UsertypesEditor.tsx
+  checksum: 776745d3054dbb7ca1a51f3f12a97905ab783c0226aee41c5d38bd42afd6a626
 - filename: src/frontConfig/index.ts
   checksum: dfa7fcba549f3059c547970b66d918c32d7ca97d9506c57ef982510c64562282
 - filename: src/lib/airtable.ts

__tests__/test-startups.ts

@@ -137,7 +137,7 @@ describe("Startup page", () => {
                 )
                 .send({
                     mission: "lamissiondelastartup",
-                    text: "la description de la startup",
+                    markdown: "la description de la startup",
                     title: "title de la se",
                     phases: [
                         {
@@ -176,7 +176,7 @@ describe("Startup page", () => {
                         },
                     ],
                     image: base64Image,
-                    text: "test",
+                    markdown: "test",
                 });
             updateStartupGithubFileStub.args[0][1][0].content.should.equals(
                 "test"
@@ -260,7 +260,7 @@ describe("Startup page", () => {
                     JSON.stringify({
                         startup: "nomdestartup",
                         mission: "lamissiondelastartup",
-                        text: "la description de la startup",
+                        markdown: "la description de la startup",
                         title: "title de la se",
                         contact: "lamissiondelastartup@beta.gouv.fr",
                         phases: [

package.json

@@ -23,10 +23,11 @@
     "@codegouvfr/react-dsfr": "^0.76.4",
     "@emotion/styled": "^11.11.0",
     "@hookform/resolvers": "^3.3.4",
-    "@mui/material": "^5.15.10",
+    "@mui/material": "^5.15.10", 
     "@octokit/rest": "^20.0.2",
     "@sentry/nextjs": "^7.101.1",
     "@sentry/node": "^7.101.1",
+    "@sindresorhus/slugify": "^1.1.0",
     "airtable": "^0.12.2",
     "axios": "^1.6.7",
     "compression": "^1.7.4",

src/app/(private)/(dashboard)/startups/[id]/info-form/page.tsx

@@ -1,11 +1,11 @@
-import { Metadata, ResolvingMetadata } from "next";
-import { cookies } from "next/headers";
+import { Metadata } from "next";
 import { redirect } from "next/navigation";
 import { getServerSession } from "next-auth";
 
 import { StartupInfoUpdate } from "@/components/StartupInfoUpdatePage";
 import { getPullRequestForBranch, fetchGithubMarkdown } from "@/lib/github";
 import { startupSchema } from "@/models/startup";
+import betagouv from "@/server/betagouv";
 import { authOptions } from "@/utils/authoptions";
 import { routeTitles } from "@/utils/routes/routeTitles";
 
@@ -28,7 +28,7 @@ async function fetchGithubPageData(startup: string, ref: string = "master") {
         path: `content/_startups/${startup}.md`,
         overrides: (values) => ({
             ...values,
-            // prevent exceptions with invalid markdown content
+            // prevent some exceptions with invalid content
             title: values.title || "",
             mission: values.mission || "",
             incubator: values.incubator || "",
@@ -54,14 +54,21 @@ export default async function Page(props) {
     if (!session) {
         redirect("/login");
     }
-    const startup = props.params.id;
-    const startupPR = await getPullRequestForBranch(`edit-startup-${startup}`);
+    const id = props.params.id;
+    const startupPR = await getPullRequestForBranch(`edit-startup-${id}`);
 
     const sha = startupPR && startupPR.head.sha;
-    const formData = await fetchGithubPageData(startup, sha || "master");
+    const formData = await fetchGithubPageData(id, sha || "master");
+    const incubators = await betagouv.incubators();
+    const sponsors = await betagouv.sponsors();
 
     const componentProps = {
-        formData,
+        formData: {
+            ...formData,
+            id,
+        },
+        incubators,
+        sponsors,
         updatePullRequest: startupPR,
     };
 

src/app/(private)/(dashboard)/startups/create-form/page.tsx

@@ -1,16 +1,25 @@
 import { Metadata } from "next";
-import StartupCreateFormClientPage from "./StartupCreateFormClientPage";
+
+import { StartupInfoCreate } from "@/components/StartupInfoCreatePage";
+import betagouv from "@/server/betagouv";
 import { routeTitles } from "@/utils/routes/routeTitles";
 
 export const metadata: Metadata = {
     title: `${routeTitles.startupCreate()} / Espace Membre`,
 };
 
-export default function Page(props) {
+export default async function Page(props) {
+    const incubators = await betagouv.incubators();
+    const sponsors = await betagouv.sponsors();
+
     return (
         <>
             <h1>{routeTitles.startupCreate()}</h1>
-            <StartupCreateFormClientPage {...props} />
+            <StartupInfoCreate
+                sponsors={sponsors}
+                incubators={incubators}
+                {...props}
+            />
         </>
     );
 }

src/app/(public)/keskispasse/page.tsx

@@ -1,7 +1,8 @@
 import type { Metadata } from "next";
-import { routeTitles } from "@/utils/routes/routeTitles";
-import betagouv from "@/server/betagouv";
+
 import { WhatIsGoingOnWithMember } from "@/components/WhatIsGoingOnWithMemberPage";
+import betagouv from "@/server/betagouv";
+import { routeTitles } from "@/utils/routes/routeTitles";
 
 export const metadata: Metadata = {
     title: `${routeTitles.keskispasse()} / Espace Membre`,

src/app/error.tsx

@@ -60,6 +60,8 @@ export default function Error({
                                 >
                                     Contactez-nous
                                 </Button>
+                                <br />
+                                <br />
                                 <Link
                                     href="#"
                                     onClick={() => window.history?.go(-1)}

src/app/global-error.tsx

@@ -1,8 +1,9 @@
 "use client";
 
+import { useEffect } from "react";
+
 import * as Sentry from "@sentry/nextjs";
 import NextError from "next/error";
-import { useEffect } from "react";
 
 export default function GlobalError({
     error,

src/app/layout.tsx

@@ -12,6 +12,7 @@ import ClientSessionProvider from "./context/ClientContextProvider";
 import { defaultColorScheme } from "./defaultColorScheme";
 import { MuiDsfrThemeProvider } from "./MuiDsfrThemeProvider";
 import { StartDsfr } from "./StartDsfr";
+
 import Header from "@/components/Header";
 import { LiveChatProvider } from "@/components/live-chat/LiveChatProvider";
 import { authOptions } from "@/utils/authoptions";

src/components/AccountPage/EmailContainer.tsx

@@ -15,6 +15,7 @@ import BlocEmailResponder from "./BlocEmailResponder";
 import BlocRedirection from "./BlocRedirection";
 import { EmailStatusCode } from "@/models/dbUser";
 import { EmailInfos } from "@/models/member";
+import Badge from "@codegouvfr/react-dsfr/Badge";
 
 function BlocEmailConfiguration({ emailInfos }: { emailInfos: EmailInfos }) {
     interface ServerConf {
@@ -140,9 +141,27 @@ export default function EmailContainer({
                             Email principal :{" "}
                         </span>
                         <span className="font-weight-bold text-color-blue">
-                            {emailInfos.email}
-                            {emailInfos.isPro && `(offre OVH Pro)`}
-                            {emailInfos.isExchange && `(offre OVH Exchange)`}
+                            <a href={`mailto:${emailInfos.email}`}>
+                                {emailInfos.email}
+                            </a>
+                            {emailInfos.isPro && (
+                                <Badge
+                                    small
+                                    className={fr.cx("fr-ml-1w")}
+                                    severity="success"
+                                >
+                                    OVH Pro
+                                </Badge>
+                            )}
+                            {emailInfos.isExchange && (
+                                <Badge
+                                    small
+                                    className={fr.cx("fr-ml-1w")}
+                                    severity="success"
+                                >
+                                    OVH Exchange
+                                </Badge>
+                            )}
                         </span>
                         <br />
                     </>

src/components/BaseInfoUpdatePage/BaseInfoUpdate.tsx

@@ -15,6 +15,7 @@ import { z } from "zod";
 import { CompetencesEditor } from "./CompetencesEditor";
 import { MissionsEditor } from "./MissionsEditor";
 import { PullRequestWarning } from "../PullRequestWarning";
+
 import { GithubAPIPullRequest } from "@/lib/github";
 import {
     DOMAINE_OPTIONS,

src/components/MemberPage/MemberPage.tsx

@@ -19,6 +19,8 @@ import MemberEventList from "./MemberEventList";
 import { EmailStatusCode } from "@/models/dbUser";
 import { EMAIL_STATUS_READABLE_FORMAT } from "@/models/misc";
 import routes, { computeRoute } from "@/routes/routes";
+import Badge from "@codegouvfr/react-dsfr/Badge";
+import { fr } from "@codegouvfr/react-dsfr";
 
 export interface MemberPageProps {
     isExpired: boolean;
@@ -323,7 +325,7 @@ MemberPageProps) {
                                             userInfos.start
                                         ).toLocaleDateString("fr-FR")}
                                         {userInfos.end &&
-                                            `au ${new Date(
+                                            ` au ${new Date(
                                                 userInfos.end
                                             ).toLocaleDateString("fr-FR")}`}
                                         <br />
@@ -356,7 +358,13 @@ MemberPageProps) {
                         </div>
                         <p>
                             <span>Email secondaire : </span>{" "}
-                            {secondaryEmail || "Non renseigné"}
+                            {secondaryEmail ? (
+                                <a href={`mailto:${secondaryEmail}`}>
+                                    {secondaryEmail}
+                                </a>
+                            ) : (
+                                "Non renseigné"
+                            )}
                         </p>
                     </div>
                 )}
@@ -378,9 +386,27 @@ MemberPageProps) {
                 {!!emailInfos && (
                     <>
                         <p className="text-color-blue font-weight-bold">
-                            {emailInfos.email}
-                            {emailInfos.isPro && `(offre OVH Pro)`}
-                            {emailInfos.isExchange && `(offre OVH Exchange)`}
+                            <a href={`mailto:${emailInfos.email}`}>
+                                {emailInfos.email}
+                            </a>
+                            {emailInfos.isPro && (
+                                <Badge
+                                    small
+                                    className={fr.cx("fr-ml-1w")}
+                                    severity="success"
+                                >
+                                    OVH Pro
+                                </Badge>
+                            )}
+                            {emailInfos.isExchange && (
+                                <Badge
+                                    small
+                                    className={fr.cx("fr-ml-1w")}
+                                    severity="success"
+                                >
+                                    OVH Exchange
+                                </Badge>
+                            )}
                         </p>
                         <ul>
                             <li>