Préselectionner "j'ai eu un refus" si éligible au RC et cherche un contact sur un autre mode de chauffage

Author: Morgan Merzouk

src/modules/chaleur-renouvelable/client/ChoixChauffageResults.tsx

@@ -1,11 +1,13 @@
+import { useState } from 'react';
+
 import { EligibilityFormContact } from '@/components/EligibilityForm';
 import CallOut from '@/components/ui/CallOut';
 import Dialog from '@/components/ui/Dialog';
 import Link from '@/components/ui/Link';
 import useIsMobile from '@/hooks/useIsMobile';
 import { trackPostHogEvent } from '@/modules/analytics/client';
 import { BatEnrBatimentSelection } from '@/modules/chaleur-renouvelable/client/BatEnrBatimentSelection';
-import DemandeFCRForm from '@/modules/chaleur-renouvelable/client/DemandFCRForm';
+import DemandeFCRForm, { type ContactRecipientId } from '@/modules/chaleur-renouvelable/client/DemandFCRForm';
 import { useChoixChauffageResults } from '@/modules/chaleur-renouvelable/client/hooks/useChoixChauffageResults';
 import { IncompatibleSolutionsSection } from '@/modules/chaleur-renouvelable/client/results/ui/IncompatibleSolutionsSection';
 import { NoResultSection } from '@/modules/chaleur-renouvelable/client/results/ui/NoResultSection';
@@ -17,6 +19,7 @@ import { ParamsForm } from './ParamsForm';
 
 export default function ChoixChauffageResults() {
   const isMobile = useIsMobile();
+  const [selectedContactRecipientId, setSelectedContactRecipientId] = useState<ContactRecipientId>('network-manager');
   const {
     batEnrBatiments,
     contactForm,
@@ -42,6 +45,7 @@ export default function ChoixChauffageResults() {
     urlParams,
   } = useChoixChauffageResults();
   const params = urlParams.params;
+  const shouldPreselectPublicAdvisor = Boolean(situation.eligibiliteReseauChaleur);
 
   if (isMobile === null) {
     return null;
@@ -96,9 +100,18 @@ export default function ChoixChauffageResults() {
             typeLogement={effectiveTypeLogement}
             onEditParamsClick={handleEditHotWaterParamsClick}
             onOpenChange={handleAccordionOpenChange}
+            onCtaClick={() => {
+              if (shouldPreselectPublicAdvisor) {
+                setSelectedContactRecipientId('public-advisor');
+              }
+            }}
           />
           <IncompatibleSolutionsSection rows={incompatibleSolutionRows} />
-          <DemandeFCRForm topSolution={recommended.label} />
+          <DemandeFCRForm
+            selectedRecipientId={selectedContactRecipientId}
+            setSelectedRecipientId={setSelectedContactRecipientId}
+            topSolution={recommended.label}
+          />
           <CallOut
             title={
               <>

src/modules/chaleur-renouvelable/client/DemandFCRForm.tsx

@@ -34,7 +34,7 @@ const contactRecipients = [
   },
 ] as const;
 
-type ContactRecipientId = (typeof contactRecipients)[number]['id'];
+export type ContactRecipientId = (typeof contactRecipients)[number]['id'];
 
 function ContactRecipientSelector({
   selectedRecipientId,
@@ -134,10 +134,15 @@ function ProjectStatusSelect({ label, onChange, options, isPublicAdvisorSelected
   );
 }
 
-export default function DemandFCRForm({ topSolution }: { topSolution?: string }) {
+type DemandFCRFormProps = {
+  selectedRecipientId: ContactRecipientId;
+  setSelectedRecipientId: (recipientId: ContactRecipientId) => void;
+  topSolution?: string;
+};
+
+export default function DemandFCRForm({ selectedRecipientId, setSelectedRecipientId, topSolution }: DemandFCRFormProps) {
   const [isLoading, setIsLoading] = useState(false);
   const [isSent, setIsSent] = useState(false);
-  const [selectedRecipientId, setSelectedRecipientId] = useState<ContactRecipientId>('network-manager');
   const [isProjectStatusSelectOpen, setIsProjectStatusSelectOpen] = useState(false);
   const [refusalPeriod, setRefusalPeriod] = useState('');
   const [refusalReason, setRefusalReason] = useState('');

src/modules/chaleur-renouvelable/client/results/ui/ResultsSection.tsx

@@ -33,6 +33,7 @@ type ResultsSectionProps = {
   typeLogement: TypeLogement;
   onEditParamsClick: () => void;
   onOpenChange: (id: string, expanded: boolean) => void;
+  onCtaClick?: () => void;
 };
 
 export function ResultsSection({
@@ -45,6 +46,7 @@ export function ResultsSection({
   typeLogement,
   onEditParamsClick,
   onOpenChange,
+  onCtaClick,
 }: ResultsSectionProps) {
   const [activeTab, setActiveTab] = useState<ModeDeChauffageUsage>('heatingAndHotWater');
   const itemsByUsage = useMemo(
@@ -161,6 +163,7 @@ export function ResultsSection({
               isOpen={openAccordionId === id}
               position={index + 1}
               onOpenChange={(expanded) => onOpenChange(id, expanded)}
+              onCtaClick={onCtaClick}
             />
           );
         })}
@@ -182,6 +185,7 @@ type OtherSolutionRowProps = {
   position: number;
   situation: Situation;
   onOpenChange: (expanded: boolean) => void;
+  onCtaClick?: () => void;
 };
 
 function OtherSolutionRow({
@@ -193,6 +197,7 @@ function OtherSolutionRow({
   position,
   situation,
   onOpenChange,
+  onCtaClick,
 }: OtherSolutionRowProps) {
   const dpeTo = improveDpe(dpeFrom, item.gainClasse);
   const { lowerBoundString, upperBoundString } = getCostPrecisionRange(item.coutParAn);
@@ -265,6 +270,7 @@ function OtherSolutionRow({
               className="my-3"
               postHogEventKey="fcr_results:alternative_solution_cta_clicked"
               postHogEventProps={{ solution_type: item.label }}
+              onClick={onCtaClick}
             >
               Passer à l’étape suivante
             </Button>